poetry-ui 0.0.2

data/app/components/poetry/ui/clipboard_text/component.rb

@@ -0,0 +1,154 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    # ClipboardText family: a read-only value with one copy affordance.
+    module ClipboardText
+      # A read-only value with one copy affordance - API keys, install
+      # commands, resource IDs. The value renders in a readonly monospace
+      # input (selectable, never editable) with a trailing copy button.
+      # A successful copy stamps data-copied on the root for a moment, so
+      # the stacked copy/check glyphs swap in CSS, and announces itself
+      # to screen readers; the fallback copy path restores the user's own
+      # selection and focus.
+      #
+      # @example An install command with a copy button
+      #   render Poetry::Ui::ClipboardText::Component.new(value: "gem install poetry-ui",
+      #                                                   label: "Install command")
+      class Component < Poetry::Core::Component
+        # Projected into the registry, llms.txt, and the agent surface.
+        AGENT_RULES = [
+          "A read-only value with one copy affordance (poetry_clipboard_text) - API keys, install " \
+          "commands, IDs. Editable text is an Input; a secret that needs masking is a SensitiveInput.",
+          "value: is what SHOWS; text_to_copy: overrides what lands on the clipboard when the " \
+          "display truncates - never truncate the copied text itself.",
+          "Give it label: (or compose under a Field/Label) - the readonly input still needs its " \
+          "accessible name."
+        ].freeze
+
+        use_stimulus do
+          on :root do
+            controller :clipboard_text do
+              register
+              value :message, from: :copied_message_text
+              value :text, from: :text_to_copy, if: -> { text_to_copy.present? }
+            end
+          end
+          on :input do
+            controller(:clipboard_text) { target :input }
+          end
+          on :copy_button do
+            controller(:clipboard_text) { action :copy, on: :click }
+          end
+        end
+
+        option :value, :string, required: true,
+                                doc: "The displayed text - also what copies, unless text_to_copy: overrides it."
+        option :text_to_copy, :string,
+               doc: "Overrides what lands on the clipboard when the displayed value truncates: display short, copy " \
+                    "full."
+        option :id, :string,
+               doc: "The readonly input's DOM id (auto-generated when omitted) - the Field/Label for= target."
+        option :label, :string, doc: "The readonly input's accessible name when no Label/Field association exists."
+        option :described_by, :string, doc: "Ids for the input's aria-describedby (hint or error text)."
+        option :disabled, :boolean, default: false, doc: "Disables the input and the copy button together."
+
+        part "clipboard-text", "Root - the controller rides here",
+             states: {
+               "data-copied" => "stamped for a beat after a successful copy (the stacked " \
+                                "copy/check glyphs swap off it)"
+             }
+        part "clipboard-text-group", "The bordered field surface - InputGroup's chrome"
+        part "input-group-control", "The readonly mono <input> showing the value - selectable, " \
+                                    "never editable; InputGroup's control slot"
+        part "input-group-addon", "The trailing cell holding the copy affordance - InputGroup's " \
+                                  "addon vocabulary",
+             states: {
+               "data-align" => { condition: "always - inline-end holds the copy button",
+                                 values: %w[inline-end] }
+             }
+        # The copy affordance renders as a composed ghost Button carrying
+        # data-slot=clipboard-text-copy on Button's root - ownership
+        # attributes it to Button (the NumberField stepper precedent), so it
+        # is documented here in prose only: a REAL tab stop (copying is the
+        # component's primary action), aria-controls to the input, stacked
+        # copy/check glyphs inside.
+
+        # The readonly input's id (given or auto-generated).
+        # @api private
+        def control_id
+          @control_id ||= id.presence || poetry_instance_id("poetry-clipboard-text")
+        end
+
+        # Attributes for the root wrapper.
+        # @api private
+        def root_attributes
+          attrs = {
+            "data-slot" => "clipboard-text",
+            "class" => css
+          }.merge(component_data_attributes)
+          html_attributes.merge_if_not_set(attrs.merge(stimulus_attributes_for(:root)))
+        end
+
+        # Attributes for the bordered field surface.
+        # @api private
+        def group_attributes
+          {
+            "role" => "group",
+            "data-slot" => "clipboard-text-group",
+            "class" => InputGroup::Style.css
+          }
+        end
+
+        # Attributes for the trailing addon cell.
+        # @api private
+        def addon_attributes
+          {
+            "data-slot" => "input-group-addon",
+            "data-align" => "inline-end",
+            "class" => InputGroup::Style.css(:addon, class: InputGroup::Style.css(:addon_inline_end))
+          }
+        end
+
+        # Attributes for the readonly value input.
+        # @api private
+        def input_attributes
+          attrs = Poetry::Core::HTML::Attributes.new(
+            "type" => "text",
+            "readonly" => "",
+            "id" => control_id,
+            "value" => value,
+            "data-slot" => "input-group-control",
+            "class" => "#{Input::Style.css(class: InputGroup::Style.css(:control_input))} #{css(:input)}",
+            "autocomplete" => "off",
+            "spellcheck" => "false"
+          )
+          attrs["aria-label"] = label if label.present?
+          attrs["aria-describedby"] = described_by if described_by.present?
+          attrs["disabled"] = "" if disabled
+          attrs.merge!(stimulus_attributes_for(:input))
+          attrs
+        end
+
+        # The copy affordance: a ghost icon Button, a real tab stop (it IS
+        # the component's action).
+        # @api private
+        def copy_button
+          Button::Component.new({
+            variant: :ghost, size: :"icon-xs", disabled: disabled,
+            label: t("poetry.clipboard_text.copy"),
+            class: InputGroup::Style.css(:button, class: InputGroup::Style.css(:button_icon_xs)),
+            "data-slot" => "clipboard-text-copy",
+            "aria-controls" => control_id
+          }.compact.merge(stimulus_attributes_for(:copy_button)))
+        end
+
+        private
+
+        def copied_message_text = t("poetry.clipboard_text.copied")
+
+        private :control_id, :root_attributes, :group_attributes, :addon_attributes, :input_attributes, :copy_button
+      end
+    end
+  end
+end

data/app/components/poetry/ui/clipboard_text/preview.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    module ClipboardText
+      class Preview < Poetry::Core::Preview::Base
+        def default
+          render_component(value: "gem install poetry-ui", label: "Install command")
+        end
+
+        # Display truncates, the clipboard gets the FULL value via
+        # text_to_copy (the ported source's textToCopy contract).
+        def truncated_copy
+          render_component(value: "pk_live_51Nx…9fQ2", label: "API key",
+                           text_to_copy: "pk_live_51NxAbCdEfGhIjKlMnOpQrStUvWxYz0123456789fQ2")
+        end
+
+        def disabled
+          render_component(value: "rotated-out-key", label: "API key", disabled: true)
+        end
+      end
+    end
+  end
+end

data/app/components/poetry/ui/clipboard_text/style.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    module ClipboardText
+      # Utility-only: InputGroup + Input + Button wear the chrome (the
+      # SearchField composition - zero new theme CSS). The input goes mono
+      # for value legibility; the stacked copy/check glyphs swap on the
+      # root's data-copied stamp (structural visibility, not design).
+      class Style < Poetry::Core::Style
+        base "flex w-full flex-col"
+
+        element :input, "font-mono"
+
+        element :icon_stack, "relative flex size-4 items-center justify-center"
+        element :icon_copy, "absolute inset-0 m-auto transition-all duration-200 " \
+                            "[[data-copied]_&]:scale-0 [[data-copied]_&]:opacity-0"
+        element :icon_check, "absolute inset-0 m-auto scale-0 opacity-0 transition-all duration-200 " \
+                             "[[data-copied]_&]:scale-100 [[data-copied]_&]:opacity-100"
+      end
+    end
+  end
+end

data/app/components/poetry/ui/code_block/component.html.erb

@@ -0,0 +1,13 @@
+<%# The pre/code nesting stays on one line - literal template whitespace
+    inside <pre> would render. %>
+<%= content_tag(:div, **root_attributes.to_attributes) do %>
+  <%= content_tag(:pre, content_tag(:code, highlighted || code, **code_attributes.to_attributes), **Poetry::Core::HTML::Attributes.new(pre_attributes).to_attributes) %>
+  <% if copy %>
+    <%= render copy_button do %>
+      <span class="<%= css(:icon_stack) %>">
+        <%= render Poetry::Ui::Icon::Component.new(name: :copy, class: css(:icon_copy)) %>
+        <%= render Poetry::Ui::Icon::Component.new(name: :check, class: css(:icon_check)) %>
+      </span>
+    <% end %>
+  <% end %>
+<% end %>

data/app/components/poetry/ui/code_block/component.rb

@@ -0,0 +1,141 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    # CodeBlock family: the server-highlighted code panel.
+    module CodeBlock
+      # A highlighted code panel rendered entirely at request time via
+      # the rouge gem. Rouge is a SOFT dependency - without it the same
+      # markup ships with plain escaped code. Line numbers are CSS
+      # counters, so they are excluded from selection and from copied
+      # text by construction; highlight_lines: tints rows via the
+      # theme's highlight hook; the syntax palette is seven --syntax-*
+      # vars each theme owns. copy: adds a copy button reading the
+      # rendered code itself.
+      #
+      # @example
+      #   render Poetry::Ui::CodeBlock::Component.new(
+      #     code: "puts \"hello\"", language: "ruby"
+      #   )
+      class Component < Poetry::Core::Component
+        # Projected into the registry, llms.txt, and the agent surface.
+        AGENT_RULES = [
+          "Blocks of code are a CodeBlock (poetry_code_block) - never a hand-rolled pre/code " \
+          "with utility classes; the syntax palette, line counters, and copy affordance ride it.",
+          "Highlighting needs `gem \"rouge\"` in the host Gemfile - without it the block renders " \
+          "plain (same markup, no colors). Inline code stays plain <code> typography.",
+          "highlight_lines: takes 1-based line numbers; line numbers are CSS counters and never " \
+          "pollute copied text."
+        ].freeze
+
+        # The whole copy surface is copy:-gated - element conditions keep
+        # the wiring out of copy: false renders entirely.
+        use_stimulus do
+          on :root, if: :copy do
+            controller :clipboard_text do
+              register
+              value :message, from: :copied_message_text
+            end
+          end
+          on :source, if: :copy do
+            controller(:clipboard_text) { target :source }
+          end
+          on :copy_button do
+            controller(:clipboard_text) { action :copy, on: :click }
+          end
+        end
+
+        option :code, :string, required: true, doc: "The source text to highlight - required."
+        option :language, :string, default: "text",
+                                   doc: "The lexer name (\"ruby\", \"js\", ...); unknown languages fall back to " \
+                                        "plain text."
+        option :label, :string,
+               doc: "The scroll region's accessible name; defaults to the localized \"Code\" (a focusable scrollable " \
+                    "region must be named - axe)."
+        option :line_numbers, :boolean, default: false,
+                                        doc: "Renders CSS-counter line numbers - never part of selection or copied " \
+                                             "text."
+        option :highlight_lines, ActiveModel::Type::Value.new,
+               doc: "1-based line numbers to tint via the theme's highlight hook."
+        option :copy, :boolean, default: true, doc: "Renders the copy button in the panel's corner."
+
+        part "code-block", "Root - the syntax-palette surface (cn-code-block)",
+             states: {
+               "data-language" => "always - the lexer name, a styling/tooling hook",
+               "data-line-numbers" => "line_numbers: - turns on the ::before CSS counters",
+               "data-copied" => "copy: only - stamped for a beat after a successful copy " \
+                                "(the clipboard-text engine)"
+             }
+        part "code-block-pre", "The scroll container - tabindex 0 + role region + label " \
+                               "(a scrollable region must be keyboard-reachable and named)"
+        part "code-block-code", "The code element - rouge's .line/.hll spans and the seven " \
+                                "--syntax-* token maps live under it; the copy affordance " \
+                                "reads ITS textContent"
+        # The copy affordance renders as a composed ghost Button carrying
+        # data-slot=clipboard-text-copy on Button's root (the ClipboardText
+        # anatomy, prose not part): top-right of the panel, a real tab stop,
+        # stacked copy/check glyphs swapping on data-copied.
+
+        # The rouge-rendered (or plain-escaped) markup.
+        # @api private
+        def highlighted
+          @highlighted ||= CodeBlockHighlighter.highlight(
+            code, language: language, highlight_lines: highlight_lines || []
+          )
+        end
+
+        # Attributes for the panel root.
+        # @api private
+        def root_attributes
+          attrs = {
+            "data-slot" => "code-block",
+            "data-language" => language,
+            "class" => css
+          }.merge(component_data_attributes)
+          attrs["data-line-numbers"] = "" if line_numbers
+          html_attributes.merge_if_not_set(attrs.merge(stimulus_attributes_for(:root)))
+        end
+
+        # Attributes for the scrollable <pre> region.
+        # @api private
+        def pre_attributes
+          {
+            "data-slot" => "code-block-pre",
+            "tabindex" => "0",
+            "role" => "region",
+            "aria-label" => label.presence || t("poetry.code_block.label"),
+            "class" => css(:pre)
+          }
+        end
+
+        # Attributes for the <code> element.
+        # @api private
+        def code_attributes
+          attrs = Poetry::Core::HTML::Attributes.new(
+            "data-slot" => "code-block-code",
+            "class" => css(:code)
+          )
+          attrs.merge!(stimulus_attributes_for(:source))
+          attrs
+        end
+
+        # The corner copy affordance: a ghost icon Button.
+        # @api private
+        def copy_button
+          Button::Component.new({
+            variant: :ghost, size: :"icon-xs",
+            label: t("poetry.clipboard_text.copy"),
+            class: css(:copy),
+            "data-slot" => "clipboard-text-copy"
+          }.merge(stimulus_attributes_for(:copy_button)))
+        end
+
+        private
+
+        def copied_message_text = t("poetry.clipboard_text.copied")
+
+        private :highlighted, :root_attributes, :pre_attributes, :code_attributes, :copy_button
+      end
+    end
+  end
+end

data/app/components/poetry/ui/code_block/preview.rb

@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    module CodeBlock
+      # The CodeBlock preview: highlighted Ruby, line numbers with .hll
+      # tints, and the copy-less variant.
+      class Preview < Poetry::Core::Preview::Base
+        RUBY_SAMPLE = <<~RUBY
+          class Invoice < ApplicationRecord
+            belongs_to :customer
+
+            # Only settled invoices count toward revenue.
+            scope :settled, -> { where(status: "settled") }
+
+            def total
+              line_items.sum(&:amount)
+            end
+          end
+        RUBY
+
+        def default
+          render_component(code: RUBY_SAMPLE, language: "ruby", label: "Invoice model")
+        end
+
+        # CSS-counter line numbers (never in copied text) + .hll tints on
+        # the named lines.
+        def numbered_and_highlighted
+          render_component(code: RUBY_SAMPLE, language: "ruby", label: "Invoice model",
+                           line_numbers: true, highlight_lines: [5, 7, 8, 9])
+        end
+
+        def without_copy
+          render_component(code: %(export POETRY_THEME=vega\nbin/rake test:visual), language: "shell",
+                           label: "Gate commands", copy: false)
+        end
+      end
+    end
+  end
+end

data/app/components/poetry/ui/code_block/style.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    module CodeBlock
+      # The panel look, syntax palette values, .hll tint, and line-number
+      # chrome are theme-owned (cn-code-block + descendant rules, all nine
+      # themes); the dictionary carries the STRUCTURE - scroll container,
+      # counters, and the token map wiring rouge's classes to the seven
+      # --syntax-* vars the theme defines.
+      class Style < Poetry::Core::Style
+        base "cn-code-block group/code relative"
+
+        element :pre, "overflow-x-auto p-4 [counter-reset:line]"
+
+        # The token map: rouge's short classes -> the theme's syntax vars.
+        # .line blocks make .hll tints span the full row.
+        element :code, "block min-w-max font-mono text-sm [&_.line]:block " \
+                       "[&_:is(.k,.kd,.kn,.kp,.kr,.kt,.kv)]:text-(--syntax-keyword) " \
+                       "[&_:is(.kc,.l,.ld,.m,.mb,.mf,.mh,.mi,.il,.mo,.mx)]:text-(--syntax-constant) " \
+                       "[&_:is(.sb,.bp,.ne,.nl,.py,.nv,.vc,.vg,.vi,.vm,.o,.ow)]:text-(--syntax-constant) " \
+                       "[&_:is(.s,.sa,.sc,.dl,.sd,.s2,.se,.sh,.sx,.s1,.ss)]:text-(--syntax-string) " \
+                       "[&_:is(.nb,.nc,.no,.nn)]:text-(--syntax-entity) " \
+                       "[&_:is(.na,.nt,.sr)]:text-(--syntax-markup) " \
+                       "[&_:is(.nd,.nf,.fm)]:text-(--syntax-function) " \
+                       "[&_:is(.c,.ch,.cd,.cm,.cp,.cpf,.c1,.cs)]:text-(--syntax-comment)"
+
+        element :copy, "absolute top-2 end-2"
+
+        element :icon_stack, "relative flex size-4 items-center justify-center"
+        element :icon_copy, "absolute inset-0 m-auto transition-all duration-200 " \
+                            "[[data-copied]_&]:scale-0 [[data-copied]_&]:opacity-0"
+        element :icon_check, "absolute inset-0 m-auto scale-0 opacity-0 transition-all duration-200 " \
+                             "[[data-copied]_&]:scale-100 [[data-copied]_&]:opacity-100"
+      end
+    end
+  end
+end

data/app/components/poetry/ui/collapsible/component.html.erb

@@ -0,0 +1,4 @@
+<%= content_tag(:div, **root_attributes.to_attributes) do %>
+  <%= trigger %>
+  <%= content_tag(:div, content, **Poetry::Core::HTML::Attributes.new(content_attributes).to_attributes) %>
+<% end %>

data/app/components/poetry/ui/collapsible/component.rb

@@ -0,0 +1,134 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    # Collapsible family: the plain show/hide disclosure.
+    module Collapsible
+      # A disclosure: a trigger button that shows and hides one content
+      # panel. The server renders the initial open/closed state, the
+      # trigger mirrors aria-expanded, and closed content stays in the
+      # DOM (hidden) so it survives re-renders and stays findable -
+      # exit animations are awaited before hiding.
+      #
+      # @example
+      #   render Poetry::Ui::Collapsible::Component.new do |collapsible|
+      #     collapsible.with_trigger { "Show details" }
+      #     tag.div("Hidden until disclosed.")
+      #   end
+      class Component < Poetry::Core::Component
+        include Poetry::Ui::ComposableTrigger
+
+        # Projected into the registry, llms.txt, and the agent surface.
+        AGENT_RULES = [
+          ComposableTrigger::AGENT_RULE,
+          "The trigger is with_trigger { \"label\" } - a real button, wired for you (aria-expanded/controls).",
+          "Server-render the initial state via open: - never toggle data-open/data-closed by hand.",
+          "Content stays in the DOM when closed (hidden) - do not conditionally render it.",
+          "For URL-controlled disclosure without JS, render open: from params - the same markup serves both."
+        ].freeze
+
+        # The required slots, stated statically so static checks can flag
+        # a missing trigger without rendering.
+        REQUIRED_SLOTS = { trigger: "the disclosure control" }.freeze
+
+        renders_one :trigger,
+                    doc: "The disclosure control - a real button, wired for you (aria-expanded, aria-controls); " \
+                         "options merge onto it.",
+                    renders: lambda { |**options, &block|
+                      attrs = {
+                        type: "button", "data-slot" => "collapsible-trigger",
+                        "aria-expanded" => open.to_s, "aria-controls" => content_id
+                      }.merge(stimulus_attributes_for(:trigger))
+                      composed_trigger(attrs, options, &block) ||
+                        content_tag(:button, Poetry::Core::HTML::Attributes.merged(attrs, options), &block)
+                    }
+
+        use_stimulus do
+          on :root do
+            controller(:state) { register }
+          end
+          on :trigger do
+            controller :state do
+              target :trigger
+              action :toggle, on: :click
+            end
+          end
+          on :content do
+            controller(:state) { target :content }
+          end
+        end
+
+        option :open, :boolean, default: false,
+                                doc: "The server-rendered initial state; the trigger toggles it client-side."
+
+        part "collapsible", "The disclosure root - the state controller flips the pair here",
+             states: {
+               "data-open" => "expanded (server-rendered from open:; the controller flips the pair at runtime)",
+               "data-closed" => "collapsed (the server-rendered default)"
+             }
+        part "collapsible-trigger", "The disclosure button - mirrors aria-expanded",
+             states: {
+               "data-panel-open" => "its content is open (controller-written; " \
+                                    "absent while closed)"
+             }
+        part "collapsible-content", "The disclosure panel - stays in the DOM when closed (hidden) " \
+                                    "and rides the presence helper on exit",
+             states: {
+               "data-open" => "content is open or entering",
+               "data-closed" => "content is closed or animating out (hidden lands after the exit finishes)"
+             }
+
+        # A missing body yields a trigger disclosing an empty panel.
+        requires_content "the disclosed panel body"
+
+        # Enforces the required trigger and panel body.
+        # @api private
+        def before_render
+          raise ArgumentError, "Collapsible requires with_trigger (the disclosure control)" unless trigger?
+
+          ensure_content!
+        end
+
+        # The state word behind the data-* stamps.
+        # @api private
+        def state
+          open ? "open" : "closed"
+        end
+
+        # The panel's id - the trigger's aria-controls target.
+        # @api private
+        def content_id
+          @content_id ||= "#{instance_id}-content"
+        end
+
+        # Attributes for the disclosure root.
+        # @api private
+        def root_attributes
+          html_attributes.merge_if_not_set(
+            { "data-slot" => "collapsible", "data-#{state}" => "" }
+              .merge(stimulus_attributes_for(:root))
+              .merge(component_data_attributes)
+          )
+        end
+
+        # Attributes for the content panel.
+        # @api private
+        def content_attributes
+          attrs = {
+            "id" => content_id, "data-slot" => "collapsible-content", "data-#{state}" => ""
+          }.merge(stimulus_attributes_for(:content))
+          attrs["hidden"] = true unless open
+          attrs
+        end
+
+        private
+
+        def instance_id
+          @instance_id ||= poetry_instance_id("poetry-collapsible")
+        end
+
+        private :state, :content_id, :root_attributes, :content_attributes
+      end
+    end
+  end
+end

data/app/components/poetry/ui/collapsible/preview.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+module Poetry
+  module Ui
+    module Collapsible
+      # The Collapsible preview matrix.
+      class Preview < Poetry::Core::Preview::Base
+        def default
+          render_component do |collapsible|
+            collapsible.with_trigger(class: "text-sm font-medium underline-offset-4 hover:underline") { "Show details" }
+            tag.div("Hidden until disclosed.", class: "pt-2 text-sm text-muted-foreground")
+          end
+        end
+
+        def initially_open
+          render_component(open: true) do |collapsible|
+            collapsible.with_trigger(class: "text-sm font-medium") { "Hide details" }
+            tag.div("Server-rendered open.", class: "pt-2 text-sm text-muted-foreground")
+          end
+        end
+      end
+    end
+  end
+end

data/app/components/poetry/ui/combobox/component.html.erb

@@ -0,0 +1,49 @@
+<%# The option union renders FIRST (into a capture) so the shared
+    OptionSet is populated - server-stable option ids assigned, the
+    initial highlight decided - before the native <select>, the trigger's
+    value display, and the input's aria-activedescendant derive from it:
+    one server-side truth, four surfaces (the Select + Command capture
+    patterns fused). %>
+<% list_body = capture do %>
+  <% items.each do |item| %><%= item %><% end %>
+<% end %>
+<%= content_tag(:div, **root_attributes.to_attributes) do %>
+  <%= native_select %>
+  <% if show_clear %>
+    <%# The clear anchor shrink-wraps the trigger (the root is full-width
+        block); the X rides as the trigger's IMMEDIATE next sibling - the
+        chevron-swap CSS keys on that adjacency. %>
+    <span class="<%= css(:clear_anchor) %>"><%= trigger_button %><%= clear_button %></span>
+  <% else %>
+    <%= multiple ? chips_frame : trigger_button %>
+  <% end %>
+  <%= content_tag(:div, **Poetry::Core::HTML::Attributes.new(content_attributes).to_attributes) do %>
+    <% if multiple %>
+      <%# MULTIPLE: the popup holds ONLY the listbox (the input lives
+          inline in the chips frame; the command engine rides the ROOT so
+          it scopes over both - no command part in here). %>
+      <%= content_tag(:div, **Poetry::Core::HTML::Attributes.new(list_attributes).to_attributes) do %>
+        <%= empty_part %>
+        <%= loading_part %>
+        <%= list_body %>
+      <% end %>
+      <%= status_part %>
+    <% else %>
+    <%# The EMBEDDED Command anatomy (Command::Style + the engine
+        controller reused verbatim; chrome flattened - rounded/border ride
+        the content). %>
+    <%= content_tag(:div, **Poetry::Core::HTML::Attributes.new(command_attributes).to_attributes) do %>
+      <div data-slot="combobox-input-wrapper" class="<%= Poetry::Ui::Command::Style.css(:input_wrapper) %>">
+        <span data-slot="combobox-search-icon"><%= render(Poetry::Ui::Icon::Component.new(name: :search, class: Poetry::Ui::Command::Style.css(:search_icon))) %></span>
+        <%= tag.input(**Poetry::Core::HTML::Attributes.new(input_attributes).to_attributes) %>
+      </div>
+      <%= content_tag(:div, **Poetry::Core::HTML::Attributes.new(list_attributes).to_attributes) do %>
+        <%= empty_part %>
+        <%= loading_part %>
+        <%= list_body %>
+      <% end %>
+      <%= status_part %>
+    <% end %>
+    <% end %>
+  <% end %>
+<% end %>