Module: Plushie::Widget

Defined in:: lib/plushie/widget.rb,
lib/plushie/widget/pin.rb,
lib/plushie/widget/row.rb,
lib/plushie/widget/svg.rb,
lib/plushie/widget/grid.rb,
lib/plushie/widget/rule.rb,
lib/plushie/widget/text.rb,
lib/plushie/widget/build.rb,
lib/plushie/widget/image.rb,
lib/plushie/widget/radio.rb,
lib/plushie/widget/space.rb,
lib/plushie/widget/stack.rb,
lib/plushie/widget/table.rb,
lib/plushie/widget/button.rb,
lib/plushie/widget/canvas.rb,
lib/plushie/widget/column.rb,
lib/plushie/widget/sensor.rb,
lib/plushie/widget/slider.rb,
lib/plushie/widget/themer.rb,
lib/plushie/widget/window.rb,
lib/plushie/widget/overlay.rb,
lib/plushie/widget/qr_code.rb,
lib/plushie/widget/toggler.rb,
lib/plushie/widget/tooltip.rb,
lib/plushie/widget/checkbox.rb,
lib/plushie/widget/floating.rb,
lib/plushie/widget/markdown.rb,
lib/plushie/widget/combo_box.rb,
lib/plushie/widget/container.rb,
lib/plushie/widget/pane_grid.rb,
lib/plushie/widget/pick_list.rb,
lib/plushie/widget/rich_text.rb,
lib/plushie/widget/responsive.rb,
lib/plushie/widget/scrollable.rb,
lib/plushie/widget/text_input.rb,
lib/plushie/widget/text_editor.rb,
lib/plushie/widget/keyed_column.rb,
lib/plushie/widget/native_build.rb,
lib/plushie/widget/pointer_area.rb,
lib/plushie/widget/progress_bar.rb,
lib/plushie/widget/vertical_slider.rb

Overview

Typed widget builder modules (Layer 2 API).

Defined Under Namespace

Modules: Build, CustomDSL, NativeBuild Classes: Canvas, Checkbox, Container, Table

Constant Summary collapse

KNOWN_PROP_TYPES =

This constant is part of a private API. You should avoid using this constant if possible, as it may be removed or be changed in the future.

Recognized property type names for typed props. Untyped props (bare name declarations) bypass this check.

%i[
  number string boolean color length padding
  alignment style font atom map any
].freeze

REQUIRED =

This constant is part of a private API. You should avoid using this constant if possible, as it may be removed or be changed in the future.

Private sentinel for "no default provided, this arg is required." Using a frozen Object prevents collision with any user-supplied value.

Object.new.freeze

STRUCTURAL_PROP_NAMES = Property names reserved by the framework that the DSL rejects when declared via prop. :id, :type, and :children are structural fields, not props. :a11y and :event_rate are auto-wired on every widget but callers may also list them in prop :... for discoverability; the DSL accepts those declarations as no-ops.

%i[id type children].freeze

AUTO_WIRED_PROP_NAMES =

%i[a11y event_rate].freeze

RESERVED_PROP_NAMES =

(STRUCTURAL_PROP_NAMES + AUTO_WIRED_PROP_NAMES).freeze

Pin = Pin layout: positions child at absolute coordinates. Props: x (number): x position in pixels. y (number): y position in pixels. width (length): pin container width. height (length): pin container height. Examples: p = Plushie::Widget::Pin.new("badge", x: 100, y: 50) .push(Plushie::Widget::Text.new("label", "!")) node = p.build

Plushie::Widget.define(:pin) do
  children :single
  prop :x, :y, :width, :height
  prop :a11y, :event_rate
end

Row = Typed builder for the row widget (Layer 2 API). Construct a Row, set properties via fluent +set_*+ methods, then call #build to produce a Node for the view tree.

Plushie::Widget.define(:row) do
  children :many
  prop :spacing, :padding, :width, :height, :align_y,
    :max_width, :clip, :wrap
  prop :a11y, :event_rate
end

Svg = SVG display: renders a vector image from a file path. Props: source (string): path to the SVG file. width (length): SVG width. height (length): SVG height. content_fit (symbol): how the SVG fits its bounds. rotation (number): rotation angle in degrees. opacity (number): opacity 0.0-1.0. color (string): color tint applied to the SVG. alt (string): accessible label. description (string): extended accessible description. decorative (boolean): hide from assistive technology. Examples: svg = Plushie::Widget::Svg.new("logo", "logo.svg", width: 64, height: 64) node = svg.build

Plushie::Widget.define(:svg) do
  children :none
  positional :source, default: nil
  prop :source, :width, :height, :content_fit, :rotation, :opacity,
    :color, :alt, :description, :decorative
  prop :a11y, :event_rate
  default_a11y role: :image
end

Grid = Grid layout: arranges children in a fixed-column grid. Props: num_columns (integer): number of columns. spacing (number): spacing between cells in pixels. width (number): grid width in pixels. height (number): grid height in pixels. column_width (length): width of each column. row_height (length): height of each row. fluid (number): fluid mode max cell width in pixels. Examples: g = Plushie::Widget::Grid.new("items", num_columns: 3, spacing: 8) .push(Plushie::Widget::Text.new("a", "A")) .push(Plushie::Widget::Text.new("b", "B")) node = g.build

Plushie::Widget.define(:grid) do
  children :many
  prop :num_columns, :spacing, :width, :height, :column_width,
    :row_height, :fluid
  prop :a11y, :event_rate
end

Rule = Horizontal or vertical rule (divider line). Props: height (number): line thickness for horizontal rules. width (number): line thickness for vertical rules. thickness (number): direction-agnostic line thickness (fallback when the direction-specific width/height isn't set). direction (symbol): :horizontal or :vertical. style (symbol|hash): :default, :weak, or style map. Examples: r = Plushie::Widget::Rule.new("divider", direction: :horizontal, height: 2) node = r.build

Plushie::Widget.define(:rule) do
  children :none
  prop :height, :width, :thickness, :direction, :style
  prop :a11y, :event_rate
end

Text = Typed builder for the text widget (Layer 2 API). Construct a Text, set properties via fluent +set_*+ methods, then call #build to produce a Node for the view tree.

Plushie::Widget.define(:text) do
  children :none
  positional :content, default: nil
  prop :content, :size, :color, :font, :width, :height, :line_height,
    :align_x, :align_y, :wrapping, :ellipsis, :shaping, :style
  prop :a11y, :event_rate
  default_a11y role: :label, label_from: :content
end

Image = Image: display an image from a file path or URL. Props: source (string): image file path or URL. width (length): display width. height (length): display height. content_fit (symbol): how the image fits: :contain, :cover, :fill, etc. rotation (number): rotation angle in degrees. opacity (number): opacity from 0.0 to 1.0. border_radius (number): corner radius in pixels. filter_method (symbol): resampling filter: :nearest, :linear. expand (boolean): expand to fill available space. scale (number): image scale factor. crop (hash): crop region { x, y, width, height }. alt (string): alt text for accessibility. description (string): longer description for accessibility. decorative (boolean): mark as decorative (hidden from a11y tree). Examples: img = Plushie::Widget::Image.new("avatar", "/path/to/photo.png", width: 64, height: 64, content_fit: :cover, border_radius: 32) node = img.build

Plushie::Widget.define(:image) do
  children :none
  positional :source, default: nil
  prop :source, :width, :height, :content_fit, :rotation, :opacity,
    :border_radius, :filter_method, :expand, :scale, :crop,
    :alt, :description, :decorative
  prop :a11y, :event_rate
  default_a11y role: :image
end

Radio = Radio button: one-of-many selection. Props: value (string): the value this radio represents. selected (string|nil): currently selected value in the group. label (string): label text (defaults to value). group (string): group identifier. spacing (number): space between radio and label in pixels. width (length): widget width. size (number): radio button size in pixels. text_size (number): label text size in pixels. font (string|hash): label font. line_height (number|hash): label line height. shaping (symbol): text shaping strategy. wrapping (symbol): text wrapping mode. style (symbol|hash): named style or style map. Examples: r = Plushie::Widget::Radio.new("opt_a", "a", "a", label: "Option A", group: "choices") node = r.build

Plushie::Widget.define(:radio) do
  children :none
  positional :value
  positional :selected
  prop :value, :selected, :label, :group, :spacing, :width, :size,
    :text_size, :font, :line_height, :shaping, :wrapping, :style
  prop :a11y, :event_rate
  default_a11y role: :radio_button, label_from: :label
end

Space = Empty space: invisible spacer widget. Props: width (length): space width. height (length): space height. Examples: sp = Plushie::Widget::Space.new("gap", width: 20, height: 10) node = sp.build

Plushie::Widget.define(:space) do
  children :none
  prop :width, :height
  prop :a11y, :event_rate
end

Stack = Stack layout: layers children on top of each other. Props: width (length): stack width. height (length): stack height. clip (boolean): clip overflowing children. Examples: s = Plushie::Widget::Stack.new("layers", width: :fill, clip: true) .push(Plushie::Widget::Text.new("bg", "Background")) .push(Plushie::Widget::Text.new("fg", "Foreground")) node = s.build

Plushie::Widget.define(:stack) do
  children :many
  prop :width, :height, :clip
  prop :a11y, :event_rate
end

TableRow =

Plushie::Widget.define(:table_row) do
  children :many
end

TableCell =

Plushie::Widget.define(:table_cell) do
  children :many
  prop :column
  prop :a11y, :event_rate
end

Button = Button widget. Examples: Button.new("save", "Save").set_style(:primary).build

Plushie::Widget.define(:button) do
  children :none
  positional :label, default: nil
  prop :label, :width, :height, :padding,
    :clip, :style, :disabled
  prop :a11y, :event_rate
  default_a11y role: :button, label_from: :label
end

Column = Typed builder for the column widget (Layer 2 API). Construct a Column, set properties via fluent +set_*+ methods, then call #build to produce a Node for the view tree.

Plushie::Widget.define(:column) do
  children :many
  prop :spacing, :padding, :width, :height, :max_width,
    :align_x, :clip, :wrap
  prop :a11y, :event_rate
end

Sensor = Sensor: detects visibility and size changes on child content. Props: delay (integer): delay in ms before emitting events. anticipate (number): anticipation distance in pixels. on_resize (string): event tag for resize events. Examples: s = Plushie::Widget::Sensor.new("detect", delay: 100, anticipate: 50) .push(Plushie::Widget::Text.new("content", "Watched")) node = s.build

Plushie::Widget.define(:sensor) do
  children :single
  prop :delay, :anticipate, :on_resize
  prop :a11y, :event_rate
end

Slider = Slider: horizontal range input. Props: range (array): two-element [min, max] range. value (numeric): current slider value. step (numeric): value increment per step. shift_step (numeric): value increment when shift is held. default (numeric): default value on double-click. width (length): widget width. height (number): rail height in pixels. circular_handle (boolean): use a circular handle. rail_color (string): rail background colour. rail_width (number): rail thickness in pixels. style (symbol|hash): named style or style map. label (string): accessible label. Examples: slider = Plushie::Widget::Slider.new("volume", [0, 100], 75, step: 5) node = slider.build

Plushie::Widget.define(:slider) do
  children :none
  positional :range
  positional :value
  prop :range, :value, :step, :shift_step, :default, :width, :height,
    :circular_handle, :handle_radius, :rail_color, :rail_width, :style,
    :label
  prop :a11y, :event_rate
  default_a11y role: :slider, label_from: :label
end

Themer = Themer: per-subtree theme override. Props: theme (symbol|hash): built-in theme atom or custom palette map. Examples: t = Plushie::Widget::Themer.new("dark", :dark) .push(Plushie::Widget::Text.new("msg", "Dark themed")) node = t.build

Plushie::Widget.define(:themer) do
  children :single
  positional :theme, default: nil
  prop :theme
  prop :a11y, :event_rate
end

Window = Typed builder for the window widget (Layer 2 API). Construct a Window, set properties via fluent +set_*+ methods, then call #build to produce a Node for the view tree. Props: width (length): content width layout ("fill", "shrink", number, or n). height (length): content height layout ("fill", "shrink", number, or n). theme (symbol|hash): built-in theme name, :system, or Theme.custom result.

Plushie::Widget.define(:window) do
  children :single
  prop :title, :size, :width, :height, :position, :min_size, :max_size,
    :maximized, :fullscreen, :visible, :resizable, :closeable,
    :minimizable, :decorations, :transparent, :blur, :level,
    :exit_on_close_request, :scale_factor, :theme
  prop :a11y, :event_rate
  default_a11y role: :window
end

Overlay = Overlay container: positions second child as a floating overlay relative to the first child (anchor). Props: position (symbol): :below, :above, :left, :right. gap (number): space between anchor and overlay in pixels. offset_x (number): horizontal offset in pixels. offset_y (number): vertical offset in pixels. flip (boolean): auto-flip on viewport overflow. align (symbol): cross-axis alignment: :start, :center, :end. width (length): overlay node width. Examples: o = Plushie::Widget::Overlay.new("menu", position: :below, gap: 4) .push(Plushie::Widget::Button.new("trigger", "Open")) .push(Plushie::Widget::Text.new("content", "Menu items")) node = o.build

Plushie::Widget.define(:overlay) do
  children 2
  prop :position, :gap, :offset_x, :offset_y, :flip, :align, :width
  prop :a11y, :event_rate
end

QrCode = QR Code: renders a QR code from a data string. Props: data (string): the data to encode. cell_size (number): size of each QR module in pixels. cell_color (string): color of dark modules. background (string): color of light modules. error_correction (symbol): :low, :medium, :quartile, :high. alt (string): accessible label. description (string): extended accessible description. Examples: qr = Plushie::Widget::QrCode.new("link", "https://example.com", cell_size: 6, error_correction: :high) node = qr.build

Plushie::Widget.define(:qr_code) do
  children :none
  positional :data, default: nil
  prop :data, :cell_size, :total_size, :cell_color, :background,
    :error_correction, :alt, :description
  prop :a11y, :event_rate
  default_a11y role: :image
end

Toggler = Toggler: on/off switch. Props: is_toggled (boolean): whether the toggler is on. label (string): text label next to the toggler. spacing (number): space between toggler and label in pixels. width (length): widget width. size (number): toggler size in pixels. text_size (number): label text size in pixels. font (string|map): label font. line_height (number|map): label line height. shaping (symbol): text shaping: :basic, :advanced, :auto. wrapping (symbol): text wrapping: :none, :word, :glyph, :word_or_glyph. text_alignment (symbol): horizontal label alignment: :left, :center, :right. style (symbol): named style. disabled (boolean): whether the toggler is disabled. Examples: toggler = Plushie::Widget::Toggler.new("dark_mode", true, label: "Dark mode") node = toggler.build

Plushie::Widget.define(:toggler) do
  children :none
  positional :is_toggled, default: false
  prop :is_toggled, :label, :spacing, :width, :size, :text_size, :font,
    :line_height, :shaping, :wrapping, :text_alignment, :style,
    :disabled
  prop :a11y, :event_rate
  default_a11y role: :switch, label_from: :label
end

Tooltip = Tooltip: shows a popup tip over child content on hover. Props: tip (string): tooltip text. position (symbol): :top, :bottom, :left, :right, :follow_cursor. gap (number): gap between tooltip and content in pixels. padding (number): tooltip padding in pixels. snap_within_viewport (boolean): keep tooltip in viewport. delay (integer): delay in ms before showing. style (symbol|hash): named style or style map. Examples: tt = Plushie::Widget::Tooltip.new("help", "Click for help", position: :top) .push(Plushie::Widget::Button.new("btn", "?")) node = tt.build

Plushie::Widget.define(:tooltip) do
  children :single
  positional :tip, default: nil
  prop :tip, :position, :gap, :padding, :snap_within_viewport, :delay,
    :style
  prop :a11y, :event_rate
  default_a11y role: :tooltip
end

Floating = Floating overlay: positions child with translation and scaling. Props: translate_x (number): horizontal translation in pixels. translate_y (number): vertical translation in pixels. scale (number): scale factor. width (length): float width. height (length): float height. Examples: f = Plushie::Widget::Floating.new("popup", translate_x: 10, translate_y: 20) .push(Plushie::Widget::Text.new("msg", "Hello")) node = f.build

Plushie::Widget.define(:float) do
  children :single
  prop :translate_x, :translate_y, :scale, :width, :height
  prop :a11y, :event_rate
end

Markdown = Markdown display: renders parsed markdown content. Props: content (string): raw markdown text. width (length): container width. text_size (number): base text size in pixels. h1_size (number): heading 1 size in pixels. h2_size (number): heading 2 size in pixels. h3_size (number): heading 3 size in pixels. code_size (number): code block text size in pixels. spacing (number): spacing between elements in pixels. link_color (string): link color override. code_theme (string): syntax highlighting theme for code blocks. Examples: md = Plushie::Widget::Markdown.new("docs", "# Hello\nWorld", text_size: 16) node = md.build

Plushie::Widget.define(:markdown) do
  children :none
  positional :content, default: nil
  prop :content, :width, :text_size, :h1_size, :h2_size, :h3_size,
    :code_size, :spacing, :link_color, :code_theme
  prop :a11y, :event_rate
  default_a11y role: :document
end

ComboBox = Combo box: searchable dropdown with free-form text input. Props: options (array of strings): available choices. selected (string|nil): currently selected value. placeholder (string): placeholder text. width (length): widget width. padding (number|hash): internal padding. size (number): text size in pixels. font (string|hash): font specification. line_height (number|hash): text line height. menu_height (number): max dropdown menu height in pixels. icon (hash): icon inside the text input. on_option_hovered (boolean): emit option hover events. on_open (boolean): emit open event. on_close (boolean): emit close event. shaping (symbol): text shaping strategy. ellipsis (string): text ellipsis strategy. menu_style (hash): dropdown menu style overrides. style (symbol|hash): named style or style map. Examples: cb = Plushie::Widget::ComboBox.new("fruit", ["Apple", "Banana"], selected: "Apple", placeholder: "Search...") node = cb.build

Plushie::Widget.define(:combo_box) do
  children :none
  positional :options, default: []
  prop :options, :selected, :placeholder, :width, :padding, :size, :font,
    :line_height, :menu_height, :icon, :on_option_hovered, :on_open,
    :on_close, :shaping, :ellipsis, :menu_style, :style,
    :required, :validation
  prop :a11y, :event_rate
  default_a11y role: :combo_box, label_from: :placeholder
end

PaneGrid = Pane grid: resizable tiled panes. Props: panes (array of strings): pane identifiers. spacing (number): space between panes in pixels. width (length): grid width. height (length): grid height. min_size (number): minimum pane size in pixels. divider_color (string): divider color. divider_width (number): divider thickness in pixels. leeway (number): grabbable area around dividers. Examples: pg = Plushie::Widget::PaneGrid.new("editor", spacing: 4) .push(Plushie::Widget::Text.new("left", "Left pane")) .push(Plushie::Widget::Text.new("right", "Right pane")) node = pg.build

Plushie::Widget.define(:pane_grid) do
  children :many
  prop :panes, :spacing, :width, :height, :min_size, :divider_color,
    :divider_width, :leeway, :split_axis
  prop :a11y, :event_rate
  default_a11y role: :group
end

PickList = Pick list: dropdown selection. Props: options (array of strings): available choices. selected (string|nil): currently selected value. placeholder (string): placeholder text. width (length): widget width. padding (number|hash): internal padding. text_size (number): text size in pixels. font (string|hash): font specification. line_height (number|hash): text line height. menu_height (number): max dropdown menu height in pixels. shaping (symbol): text shaping strategy. handle (hash): dropdown handle indicator config. ellipsis (string): text ellipsis strategy. menu_style (hash): dropdown menu style overrides. style (symbol|hash): named style or style map. on_open (boolean): emit open event. on_close (boolean): emit close event. Examples: pl = Plushie::Widget::PickList.new("color", ["Red", "Green", "Blue"], selected: "Red", placeholder: "Choose...") node = pl.build

Plushie::Widget.define(:pick_list) do
  children :none
  positional :options, default: []
  prop :options, :selected, :placeholder, :width, :padding, :text_size,
    :font, :line_height, :menu_height, :shaping, :handle, :ellipsis,
    :menu_style, :style, :on_open, :on_close,
    :required, :validation
  prop :a11y, :event_rate
  default_a11y role: :combo_box, label_from: :placeholder
end

RichText = Rich text display with individually styled spans. Props: spans (array): list of Span instances or plain hashes. width (length): widget width. height (length): widget height. size (number): default font size. font (string|hash): default font. color (string): default text color. line_height (number|hash): line height. wrapping (symbol): text wrapping mode. ellipsis (string): text ellipsis mode. Examples: rt = Plushie::Widget::RichText.new("msg", spans: [ Plushie::Widget::RichText::Span.new(text: "Hello "), Plushie::Widget::RichText::Span.new(text: "World", color: "#f00", underline: true) ]) node = rt.build

Plushie::Widget.define(:rich_text) do
  children :none
  prop :spans, :width, :height, :size, :font, :color, :line_height,
    :wrapping, :ellipsis
  prop :a11y, :event_rate
  default_a11y role: :label
end

Responsive = Responsive layout: adapts to available size via resize events. Props: width (length): container width. height (length): container height. Examples: r = Plushie::Widget::Responsive.new("layout", width: :fill, height: :fill) .push(Plushie::Widget::Text.new("content", "Responsive content")) node = r.build

Plushie::Widget.define(:responsive) do
  children :single
  prop :width, :height
  prop :a11y, :event_rate
end

Scrollable = Scrollable: scrollable container for overflow content. Props: width (length): viewport width. height (length): viewport height. direction (symbol): :vertical, :horizontal, or :both. spacing (number): spacing between children in pixels. scrollbar_width (number): scrollbar track width. scrollbar_margin (number): margin around scrollbar. scroller_width (number): scroller thumb width. anchor (symbol): scroll anchor: :start or :end. on_scroll (boolean): emit scroll events. auto_scroll (boolean): auto-scroll to end on content change. scrollbar_color (string): scrollbar track colour. scroller_color (string): scroller thumb colour. Examples: scrollable = Plushie::Widget::Scrollable.new("log", width: { fill: true }, height: 300, direction: :vertical) node = scrollable.push(some_child).build

Plushie::Widget.define(:scrollable) do
  children :single
  prop :width, :height, :direction, :spacing, :scrollbar_width,
    :scrollbar_margin, :scroller_width, :anchor, :on_scroll,
    :auto_scroll, :scrollbar_color, :scroller_color
  prop :a11y, :event_rate
  default_a11y role: :scroll_view
end

TextInput = Typed builder for the single-line text input widget (Layer 2 API). Construct a TextInput, configure via fluent +set_*+ methods, then call #build to produce a Node. Examples: TextInput.new("email", "", placeholder: "you@example.com") .set_size(16) .build

Plushie::Widget.define(:text_input) do
  children :none
  positional :value, default: ""
  prop :value, :placeholder, :padding, :width, :size, :font, :line_height,
    :align_x, :icon, :on_submit, :on_paste, :secure, :input_purpose,
    :style, :placeholder_color, :selection_color,
    :required, :validation
  prop :a11y, :event_rate
  default_a11y role: :text_input, label_from: :placeholder
end

TextEditor = Text editor: multi-line editable text area. Props: content (string): initial text content. placeholder (string): placeholder text. width (length): editor width. height (length): editor height. min_height (number): minimum height in pixels. max_height (number): maximum height in pixels. font (string|hash): font specification. size (number): font size in pixels. line_height (number|hash): line height. padding (number): uniform padding in pixels. wrapping (symbol): text wrapping mode. input_purpose (string): input purpose hint: "normal", "secure", "terminal", "number", "decimal", "phone", "email", "url", "search". highlight_syntax (string): language for syntax highlighting. highlight_theme (string): highlighter theme. style (symbol|hash): named style or style map. key_bindings (array of hashes): declarative key binding rules. placeholder_color (string): placeholder text color. selection_color (string): selection highlight color. Examples: ed = Plushie::Widget::TextEditor.new("editor", content: "Hello", placeholder: "Type here...") node = ed.build

Plushie::Widget.define(:text_editor) do
  children :none
  prop :content, :placeholder, :width, :height, :min_height, :max_height,
    :font, :size, :line_height, :padding, :wrapping, :input_purpose,
    :highlight_syntax, :highlight_theme, :style, :key_bindings,
    :placeholder_color, :selection_color,
    :required, :validation
  prop :a11y, :event_rate
  default_a11y role: :multiline_text_input, label_from: :placeholder
end

KeyedColumn = Keyed column layout: vertical layout with stable identity keys. Props: spacing (number): vertical space between children in pixels. padding (number|hash): padding inside the column. width (length): column width. height (length): column height. max_width (number): maximum width in pixels. Examples: kc = Plushie::Widget::KeyedColumn.new("list", spacing: 4) .push(Plushie::Widget::Text.new("item1", "First")) node = kc.build

Plushie::Widget.define(:keyed_column) do
  children :many
  prop :spacing, :padding, :width, :height, :align_x, :max_width
  prop :a11y, :event_rate
end

PointerArea = Pointer area: captures pointer events (mouse, touch, pen) on child content. The widget responds to all pointer input types, not just mouse. The iced renderer uses "mouse_area" as the internal widget name; only the SDK-facing name is "pointer_area". Props: cursor (symbol): pointer cursor on hover. on_press (string): event tag for left press. on_release (string): event tag for left release. on_right_press (boolean): enable right press events. on_right_release (boolean): enable right release events. on_middle_press (boolean): enable middle press events. on_middle_release (boolean): enable middle release events. on_double_click (boolean): enable double-click events. on_enter (boolean): enable cursor enter events. on_exit (boolean): enable cursor exit events. on_move (boolean): enable cursor move events. on_scroll (boolean): enable scroll events. Examples: pa = Plushie::Widget::PointerArea.new("clickable", cursor: :pointer, on_right_press: true) .push(Plushie::Widget::Text.new("label", "Right-click me")) node = pa.build

Plushie::Widget.define(:mouse_area) do
  children :single
  prop :cursor, :on_press, :on_release, :on_right_press, :on_right_release,
    :on_middle_press, :on_middle_release, :on_double_click, :on_enter,
    :on_exit, :on_move, :on_scroll
  prop :a11y, :event_rate
end

ProgressBar = Progress bar: displays progress within a range. Props: range (array): [min, max] range. value (number): current progress value. width (length): bar width. height (length): bar height. style (symbol|hash): :primary, :secondary, :success, :danger, :warning, or style map. vertical (boolean): render vertically. label (string): accessible label. Examples: pb = Plushie::Widget::ProgressBar.new("upload", [0, 100], 42, style: :primary) node = pb.build

Plushie::Widget.define(:progress_bar) do
  children :none
  positional :range
  positional :value
  prop :range, :value, :width, :height, :style, :vertical, :label
  prop :a11y, :event_rate
  default_a11y role: :progress_indicator, label_from: :label
end

VerticalSlider = Vertical slider: vertical range input. Props: range (array): [min, max] range. value (number): current slider value. step (number): step increment. shift_step (number): step when Shift is held. default (number): double-click reset value. width (length): slider width. height (length): slider height. rail_color (string): rail color. rail_width (number): rail thickness in pixels. style (symbol|hash): named style or style map. label (string): accessible label. Examples: vs = Plushie::Widget::VerticalSlider.new("vol", [0, 100], 50, step: 5) node = vs.build

Plushie::Widget.define(:vertical_slider) do
  children :none
  positional :range
  positional :value
  prop :range, :value, :step, :shift_step, :default, :width, :height,
    :rail_color, :rail_width, :style, :label
  prop :a11y, :event_rate
  default_a11y role: :slider, label_from: :label
end

Class Method Summary collapse

.define(type_name, **opts) { ... } ⇒ Class
Create a widget class from declarative block.
.finalize_on_new(base) ⇒ Object private
Auto-finalize when first instantiated.

Class Method Details

.define(type_name, **opts) { ... } ⇒ `Class`

Create a widget class from declarative block.

Returns a fully-formed class with all generated methods. The block is class_eval'd, so +def+ defines instance methods and DSL methods (+prop+, +children+, etc.) are available.

Examples:

Leaf widget

Button = Widget.define(:button) do
  positional :label
  prop :label, :style, :disabled
end

Container with custom methods

Container = Widget.define(:container) do
  children :single
  prop :padding, :width, :height, :align_x, :align_y

  def center_x(width = :fill)
    dup.tap { |c| c.instance_variable_set(:@width, width)
                   c.instance_variable_set(:@align_x, :center) }
  end
end

Parameters:

type_name (Symbol) —
wire protocol type name
opts (Hash) —
options (passed to Plushie::Widget::CustomDSL#widget)

Yields:

declarations block (class_eval context)

Returns:

(Class) —
the finalized widget class

# File 'lib/plushie/widget.rb', line 93

def self.define(type_name, **opts, &block)
  klass = Class.new
  klass.include(Plushie::Widget)
  klass.widget(type_name, **opts)
  klass.class_eval(&block) if block
  klass.finalize!
  klass
end

.finalize_on_new(base) ⇒ `Object`

This method is part of a private API. You should avoid using this method if possible, as it may be removed or be changed in the future.

Auto-finalize when first instantiated.

# File 'lib/plushie/widget.rb', line 726

def self.finalize_on_new(base)
  base.class_eval do
    class << self
      alias_method :_orig_new, :new

      def new(...)
        finalize! unless @_finalized
        _orig_new(...)
      end
    end
  end
end

Module: Plushie::Widget

Overview

Defined Under Namespace

Constant Summary collapse

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Examples:

Class Method Summary collapse

Class Method Details

.define(type_name, **opts) { ... } ⇒ Class

Examples:

Leaf widget

Container with custom methods

.finalize_on_new(base) ⇒ Object

.define(type_name, **opts) { ... } ⇒ `Class`

.finalize_on_new(base) ⇒ `Object`