LivePanels.Toolkit.Drawing (livepanels v0.1.0)

Copy Markdown View Source

Drawing-extension DOM attr and JS helpers for Phoenix LiveViews.

use LivePanels.Toolkit.Drawing imports LivePanels.Toolkit.Canvas plus committed vector item controls. Drawing mutations stay on LivePanels.Drawing.

These helpers emit drawing command attrs, point handle attrs, and browser drawing-style updates. They do not render palettes, toolbars, or editor chrome.

Summary

Functions

Returns attrs for an application control that adds one committed polyline point.

Returns attrs for an application control that removes a committed vector item.

Returns browser eraser-target attrs for an app-rendered vector item hit area.

Returns attrs for an application control that flattens committed vector items into one item.

Returns attrs for an application control that removes one committed polyline point.

Returns a JS command that updates the browser-owned drawing style without changing the current cursor mode.

Returns attrs for an application control that restores a preserved flattened vector item into its component vector items.

Returns attrs for an application control that updates a committed vector item style.

Returns protocol attrs for an app-rendered polyline midpoint add handle.

Returns protocol attrs for an app-rendered drawing point handle.

Functions

add_point_attrs(item_or_id, index, point, overrides \\ %{})

@spec add_point_attrs(
  LivePanels.Item.t() | map() | String.t(),
  non_neg_integer(),
  map(),
  keyword() | map()
) :: map()

Returns attrs for an application control that adds one committed polyline point.

index is the position in the committed vector item's point list.

erase_attrs(item_or_id, overrides \\ %{})

@spec erase_attrs(LivePanels.Item.t() | map() | String.t(), keyword() | map()) ::
  map()

Returns attrs for an application control that removes a committed vector item.

This helper emits the vector-owned removal command rather than the generic remove command, so the server verifies that the target is a vector item before removing it through the normal item lifecycle.

erase_vector_item_target_attrs(item_or_id, overrides \\ %{})

@spec erase_vector_item_target_attrs(
  LivePanels.Item.t() | map() | String.t(),
  keyword() | map()
) ::
  map()

Returns browser eraser-target attrs for an app-rendered vector item hit area.

The attrs do not choose hit-testing geometry. Applications place them on the SVG path, transparent button, or other rendered vector item target they want erase mode to recognize. The browser pushes remove_vector_item; the server still verifies that the target is a committed vector item before removal.

flatten_attrs(items_or_ids, overrides \\ %{})

@spec flatten_attrs(
  LivePanels.Item.t()
  | map()
  | String.t()
  | [LivePanels.Item.t() | map() | String.t()],
  keyword() | map()
) :: map()

Returns attrs for an application control that flattens committed vector items into one item.

items_or_ids may be one vector item, a vector item id, or a list of vector items/ids. The browser sends a compact comma-separated id list; the server verifies that all targets are committed vector items before replacing them.

remove_point_attrs(item_or_id, index, overrides \\ %{})

@spec remove_point_attrs(
  LivePanels.Item.t() | map() | String.t(),
  non_neg_integer(),
  keyword() | map()
) :: map()

Returns attrs for an application control that removes one committed polyline point.

set_draw_style_js(canvas_id, style, opts \\ [])

@spec set_draw_style_js(String.t(), map(), keyword()) :: Phoenix.LiveView.JS.t()

Returns a JS command that updates the browser-owned drawing style without changing the current cursor mode.

If an application mirrors the selected style in LiveView assigns, pass push: "event_name" to append an application JS.push/2 with the normalized style payload.

unflatten_attrs(item_or_id, overrides \\ %{})

@spec unflatten_attrs(LivePanels.Item.t() | map() | String.t(), keyword() | map()) ::
  map()

Returns attrs for an application control that restores a preserved flattened vector item into its component vector items.

update_style_attrs(item_or_id, style, overrides \\ %{})

@spec update_style_attrs(
  LivePanels.Item.t() | map() | String.t(),
  map(),
  keyword() | map()
) :: map()

Returns attrs for an application control that updates a committed vector item style.

style must include all style fields: :color, :width, :fill_color, :stroke_style ("solid" | "dashed" | "dotted"), :opacity (0-100), and :roundness (non-negative integer).

vector_point_add_handle_attrs(item_or_id, index, overrides \\ %{})

@spec vector_point_add_handle_attrs(
  LivePanels.Item.t() | map() | String.t(),
  non_neg_integer(),
  keyword() | map()
) :: map()

Returns protocol attrs for an app-rendered polyline midpoint add handle.

The element must live inside an SVG that shares the committed vector item's coordinate system. The browser runtime drags the handle locally and pushes add_vector_point with the resulting point coordinate on release.

vector_point_handle_attrs(item_or_id, index, overrides \\ %{})

@spec vector_point_handle_attrs(
  LivePanels.Item.t() | map() | String.t(),
  non_neg_integer(),
  keyword() | map()
) :: map()

Returns protocol attrs for an app-rendered drawing point handle.

The element must live inside an SVG that shares the committed vector item's coordinate system. The browser runtime drags the handle locally and pushes update_vector_point with the resulting point coordinate on release.