velvetkit 0.1.0.beta

data/registry/test/components/ui/checkbox_test.rb

@@ -0,0 +1,236 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class UI::CheckboxTest < ViewComponent::TestCase
+  def setup_fixtures(*); end
+  def teardown_fixtures(*); end
+
+  def test_renders_input_type_checkbox_with_appearance_none
+    render_inline(UI::Checkbox.new(name: "test"))
+    input = page.find("input[type='checkbox']")
+    classes = input[:class].split
+    assert_includes classes, "appearance-none"
+    assert_includes classes, "peer"
+  end
+
+  def test_checked_adds_checked_attribute
+    render_inline(UI::Checkbox.new(name: "test", checked: true))
+    input = page.find("input[type='checkbox']")
+    assert input["checked"].present?, "expected checked attribute"
+  end
+
+  def test_value_defaults_to_one
+    render_inline(UI::Checkbox.new(name: "test"))
+    input = page.find("input[type='checkbox']")
+    assert_equal "1", input[:value]
+  end
+
+  def test_value_can_be_customized
+    render_inline(UI::Checkbox.new(name: "test", value: "yes"))
+    input = page.find("input[type='checkbox']")
+    assert_equal "yes", input[:value]
+  end
+
+  def test_disabled_sets_disabled_attribute
+    render_inline(UI::Checkbox.new(name: "test", disabled: true))
+    input = page.find("input[disabled]")
+    assert input.disabled?
+  end
+
+  def test_disabled_wrapper_has_cursor_and_opacity_classes
+    render_inline(UI::Checkbox.new(name: "test", disabled: true, label: "Disabled"))
+    label_el = page.find("label")
+    classes = label_el[:class].split
+    assert_includes classes, "cursor-not-allowed"
+    assert_includes classes, "opacity-60"
+  end
+
+  def test_error_sets_aria_invalid_and_border_destructive
+    render_inline(UI::Checkbox.new(name: "test", error: true))
+    input = page.find("input[type='checkbox']")
+    assert_equal "true", input["aria-invalid"]
+    classes = input[:class].split
+    assert_includes classes, "border-destructive"
+  end
+
+  def test_required_sets_required_attribute
+    render_inline(UI::Checkbox.new(name: "test", required: true))
+    input = page.find("input[required]")
+    assert input["required"].present?
+  end
+
+  def test_label_renders_label_element_with_for_id
+    render_inline(UI::Checkbox.new(name: "terms", label: "Accept terms"))
+    label_el = page.find("label")
+    input_el = page.find("input[type='checkbox']")
+    assert label_el["for"].present?, "label should have for attribute"
+    assert_equal label_el["for"], input_el[:id]
+    assert_match(/Accept terms/, label_el.text)
+  end
+
+  def test_without_label_no_label_element_renders
+    render_inline(UI::Checkbox.new(name: "test"))
+    refute_selector "label"
+  end
+
+  def test_check_overlay_span_present_with_peer_checked_class
+    render_inline(UI::Checkbox.new(name: "test"))
+    wrapper = page.find(".relative.inline-flex")
+    overlay = wrapper.find("span.pointer-events-none")
+    classes = overlay[:class].split
+    assert_includes classes, "peer-checked:opacity-100"
+    assert_includes classes, "opacity-0"
+  end
+
+  def test_check_icon_inside_overlay
+    render_inline(UI::Checkbox.new(name: "test"))
+    overlay = page.find("span.pointer-events-none")
+    icon = overlay.find("i", visible: :all)
+    assert_equal "check", icon["data-lucide"]
+  end
+
+  def test_user_class_override_via_tailwind_merge
+    render_inline(UI::Checkbox.new(name: "test", class: "border-red-500"))
+    input = page.find("input[type='checkbox']")
+    classes = input[:class].split
+    refute_includes classes, "border-input"
+    assert_includes classes, "border-red-500"
+  end
+
+  def test_name_and_id_passthrough
+    render_inline(UI::Checkbox.new(name: "user[agree]", id: "agree-cb"))
+    input = page.find("input#agree-cb[name='user[agree]']")
+    assert input.present?
+  end
+
+  def test_data_attributes_passthrough
+    render_inline(UI::Checkbox.new(name: "test", data: { test_id: "my-cb" }))
+    assert_selector "input[data-test-id='my-cb']"
+  end
+
+  def test_size_sm_renders_smaller_box
+    render_inline(UI::Checkbox.new(name: "test", size: :sm))
+    classes = page.find("input[type='checkbox']")[:class].split
+    assert_includes classes, "w-3.5"
+    assert_includes classes, "h-3.5"
+  end
+
+  def test_size_lg_renders_larger_box
+    render_inline(UI::Checkbox.new(name: "test", size: :lg))
+    classes = page.find("input[type='checkbox']")[:class].split
+    assert_includes classes, "w-5"
+    assert_includes classes, "h-5"
+  end
+
+  def test_auto_generated_id_when_label_present
+    render_inline(UI::Checkbox.new(name: "test", label: "Label"))
+    input = page.find("input[type='checkbox']")
+    assert input[:id].present?, "id should be auto-generated when label is provided"
+    assert input[:id].start_with?("ui-cb-"), "id should start with ui-cb-"
+  end
+
+  def test_disabled_and_checked_combined
+    render_inline(UI::Checkbox.new(name: "test", disabled: true, checked: true))
+    input = page.find("input[disabled]")
+    assert input["checked"].present?
+  end
+
+  def test_label_text_span_uses_correct_classes
+    render_inline(UI::Checkbox.new(name: "test", label: "Terms"))
+    label_el = page.find("label")
+    span = label_el.all("span").find { |s| s.text.strip == "Terms" }
+    assert span, "label text span should exist"
+    classes = span[:class].split
+    assert_includes classes, "text-sm"
+    assert_includes classes, "leading-none"
+  end
+
+  def test_required_label_shows_styled_asterisk_span
+    render_inline(UI::Checkbox.new(name: "test", label: "Agree", required: true))
+    label_el = page.find("label")
+    assert_match(/Agree/, label_el.text)
+    asterisk = label_el.find("span.text-destructive")
+    assert_match(/\*/, asterisk.text)
+    classes = asterisk[:class].split
+    assert_includes classes, "text-destructive"
+    assert_includes classes, "ml-0.5"
+  end
+
+  def test_non_required_label_has_no_destructive_span
+    render_inline(UI::Checkbox.new(name: "test", label: "Agree", required: false))
+    refute_selector "label span.text-destructive"
+  end
+
+  def test_disabled_box_has_no_redundant_opacity_class
+    render_inline(UI::Checkbox.new(name: "test", disabled: true, label: "x"))
+    classes = page.find("input[type='checkbox']")[:class].split
+    # Wrapper owns the dimming via opacity-60; box should not double-dim.
+    refute_includes classes, "disabled:opacity-50"
+    refute_includes classes, "disabled:opacity-50!"
+    refute_includes classes, "disabled:cursor-not-allowed"
+    refute_includes classes, "disabled:cursor-not-allowed!"
+  end
+
+  # Radii scale with the box so the corners stay visually consistent.
+  def test_size_sm_radius
+    render_inline(UI::Checkbox.new(name: "test", size: :sm))
+    assert_includes page.find("input[type='checkbox']")[:class].split, "rounded-[3px]"
+  end
+
+  def test_size_default_radius
+    render_inline(UI::Checkbox.new(name: "test", size: :default))
+    assert_includes page.find("input[type='checkbox']")[:class].split, "rounded-[4px]"
+  end
+
+  def test_size_lg_radius
+    render_inline(UI::Checkbox.new(name: "test", size: :lg))
+    assert_includes page.find("input[type='checkbox']")[:class].split, "rounded-[5px]"
+  end
+
+  # --- form-builder binding + automatic labels (Rails convention) ---
+
+  # Stands in for an app model: the builder needs only a name and attributes.
+  class User
+    include ActiveModel::Model
+    attr_accessor :email, :password, :remember_me
+  end
+
+  def form_builder_for(record)
+    ActionView::Helpers::FormBuilder.new(:user, record, vc_test_controller.view_context, {})
+  end
+
+  def test_form_binding_scopes_the_field_name
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me))
+    assert_selector "input[type='checkbox'][name='user[remember_me]']", visible: :all
+  end
+
+  def test_label_is_derived_from_the_attribute_name
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me))
+    assert_text "Remember me"
+  end
+
+  def test_derived_label_is_associated_with_the_input
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me))
+    assert_equal page.find("label")[:for],
+                 page.find("input[type='checkbox']", visible: :all)[:id]
+  end
+
+  # Rails' check_box emits the companion hidden field so an unchecked box still
+  # submits a value; the plain `name:` path has no such helper.
+  def test_form_binding_emits_the_unchecked_companion_field
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me))
+    hidden = page.find("input[type='hidden'][name='user[remember_me]']", visible: :all)
+    assert_equal "0", hidden[:value]
+  end
+
+  def test_explicit_label_overrides_the_derived_one
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me, label: "Keep me signed in"))
+    assert_text "Keep me signed in"
+  end
+
+  def test_label_false_opts_out
+    render_inline(UI::Checkbox.new(form: form_builder_for(User.new), field: :remember_me, label: false))
+    assert_no_selector "label"
+  end
+end

data/registry/test/components/ui/data_grid_test.rb

@@ -0,0 +1,88 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class UI::DataGridTest < ViewComponent::TestCase
+  def setup_fixtures(*); end
+  def teardown_fixtures(*); end
+
+  URL = "/customers.json"
+
+  def render_grid(**options)
+    render_inline(UI::DataGrid.new(url: URL, **options)) do |grid|
+      grid.column(:id, "ID", width: 90, type: :number)
+      grid.column(:name, "Name")
+      grid.column(:owner, "Owner")
+      grid.column(:notes, "Notes", sortable: false, filterable: false)
+    end
+  end
+
+  def grid = page.find("div[data-controller='ui--data-grid']")
+  def columns = JSON.parse(grid["data-ui--data-grid-columns-value"])
+
+  def test_declares_the_stimulus_controller
+    render_grid
+    assert_selector "div[data-controller='ui--data-grid']"
+  end
+
+  # Rows are never embedded: the grid fetches each page from this URL, sending
+  # the sort and filter it wants applied.
+  def test_points_at_the_url_it_fetches_pages_from
+    render_grid
+    assert_equal URL, grid["data-ui--data-grid-url-value"]
+    assert_nil grid["data-ui--data-grid-rows-value"]
+  end
+
+  def test_columns_carry_the_field_header_type_and_width
+    render_grid
+    assert_equal %w[id name owner notes], columns.map { |c| c["field"] }
+    assert_equal [ "ID", "Name", "Owner", "Notes" ], columns.map { |c| c["headerName"] }
+    assert_equal 90, columns.first["width"]
+    assert_equal "number", columns.first["type"]
+  end
+
+  # Only the declared width is sent, so AG Grid keeps sizing the rest itself.
+  def test_omits_width_when_not_given
+    render_grid
+    refute columns.last.key?("width")
+  end
+
+  # A column the server has no SQL expression for must not offer the control:
+  # a sort arrow that does nothing is worse than no sort arrow.
+  def test_columns_declare_whether_the_server_can_sort_or_filter_them
+    render_grid
+    assert columns.first["sortable"]
+    assert columns.first["filterable"]
+    refute columns.last["sortable"]
+    refute columns.last["filterable"]
+  end
+
+  def test_empty_message_reaches_the_grid
+    render_grid(empty_message: "No customers yet")
+    assert_equal "No customers yet", grid["data-ui--data-grid-empty-message-value"]
+  end
+
+  def test_page_size_defaults_to_a_screenful_and_can_be_set
+    render_grid
+    assert_equal "15", grid["data-ui--data-grid-page-size-value"]
+    render_grid(page_size: 50)
+    assert_equal "50", grid["data-ui--data-grid-page-size-value"]
+  end
+
+  # The height is reserved before the grid paints, so the page does not jump
+  # when its chunk arrives.
+  def test_reserves_height_for_a_full_page_of_rows
+    render_grid(page_size: 10)
+    assert_equal "height: 448px", grid[:style]
+  end
+
+  def test_user_class_merges
+    render_grid(class: "mt-8")
+    assert_includes grid[:class].split, "mt-8"
+  end
+
+  def test_html_attrs_pass_through
+    render_grid(id: "customers")
+    assert_selector "div#customers"
+  end
+end

data/registry/test/components/ui/date_picker_test.rb

@@ -0,0 +1,168 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class UI::DatePickerTest < ViewComponent::TestCase
+  def setup_fixtures(*); end
+  def teardown_fixtures(*); end
+
+  def render_picker(**options)
+    render_inline(UI::DatePicker.new(**{ name: "holiday[date]" }.merge(options)))
+  end
+
+  def typed = page.find("input[type='text']")
+  def hidden = page.find("input[type='hidden']", visible: :all)
+  def root = page.find("div[data-controller='ui--date-picker']")
+
+  # --- the two fields ------------------------------------------------------
+
+  # The typed field carries no name, so a half-typed date can never reach the
+  # server: only the hidden ISO field is submitted.
+  def test_only_the_hidden_field_is_submitted
+    render_picker
+    assert_nil typed[:name]
+    assert_equal "holiday[date]", hidden[:name]
+  end
+
+  def test_the_typed_field_shows_the_locale_format_and_the_hidden_one_iso
+    render_picker(value: Date.new(2012, 5, 2))
+    assert_equal "02/05/2012", typed[:value]
+    assert_equal "2012-05-02", hidden[:value]
+  end
+
+  def test_both_fields_are_empty_without_a_value
+    render_picker
+    assert_equal "", typed[:value].to_s
+    assert_equal "", hidden[:value].to_s
+  end
+
+  # --- the format is not hardcoded ----------------------------------------
+  #
+  # date.formats.typed is the authority: the placeholder, the parse order and
+  # the separator are all derived from it, so they cannot drift apart.
+
+  def test_the_placeholder_is_derived_from_the_locale_format
+    render_picker
+    assert_equal "DD/MM/YYYY", typed[:placeholder]
+  end
+
+  def test_the_parse_order_and_separator_are_derived_from_the_locale_format
+    render_picker
+    assert_equal "DMY", root["data-ui--date-picker-order-value"]
+    assert_equal "/", root["data-ui--date-picker-separator-value"]
+  end
+
+  # A locale that writes dates the other way round changes all three together
+  # and needs no change here.
+  def test_a_different_locale_format_changes_the_placeholder_and_the_parser
+    with_format("%m-%d-%Y") do
+      render_picker(value: Date.new(2012, 5, 2))
+      assert_equal "MM-DD-YYYY", typed[:placeholder]
+      assert_equal "MDY", root["data-ui--date-picker-order-value"]
+      assert_equal "-", root["data-ui--date-picker-separator-value"]
+      assert_equal "05-02-2012", typed[:value]
+    end
+  end
+
+  def with_format(format)
+    original = I18n.backend.translate(:en, "date.formats.typed")
+    I18n.backend.store_translations(:en, date: { formats: { typed: format } })
+    yield
+  ensure
+    I18n.backend.store_translations(:en, date: { formats: { typed: original } })
+  end
+
+  # --- form binding --------------------------------------------------------
+
+  Holiday = Struct.new(:date) do
+    def self.human_attribute_name(name, *) = name.to_s.humanize
+    def to_model = self
+    def model_name = ActiveModel::Name.new(self.class, nil, "Holiday")
+    def persisted? = false
+  end
+
+  def form_for(record = Holiday.new(Date.new(2026, 8, 15)))
+    ActionView::Helpers::FormBuilder.new(:holiday, record, vc_test_controller.view_context, {})
+  end
+
+  def test_form_binding_names_the_hidden_field_and_reads_the_value
+    render_inline(UI::DatePicker.new(form: form_for, field: :date))
+    assert_equal "holiday[date]", hidden[:name]
+    assert_equal "2026-08-15", hidden[:value]
+    assert_equal "15/08/2026", typed[:value]
+  end
+
+  def test_form_binding_derives_the_label
+    render_inline(UI::DatePicker.new(form: form_for, field: :date))
+    assert_selector "label", text: "Date"
+    assert_equal page.find("label")[:for], typed[:id]
+  end
+
+  # --- state ---------------------------------------------------------------
+
+  def test_required_marks_the_typed_field
+    render_picker(required: true)
+    assert_selector "input[type='text'][required]"
+  end
+
+  def test_required_marks_the_label_with_an_asterisk
+    render_picker(required: true, label: "Date of birth")
+    assert_selector "label span.text-destructive", text: "*"
+  end
+
+  def test_min_and_max_reach_the_calendar
+    render_picker(min: "2026-04-01", max: "2027-03-31")
+    calendar = page.find("calendar-date", visible: :all)
+    assert_equal "2026-04-01", calendar[:min]
+    assert_equal "2027-03-31", calendar[:max]
+  end
+
+  # The calendar chunk is only fetched when the button is pressed, so a form
+  # nobody opens a calendar on downloads nothing.
+  def test_the_calendar_panel_starts_hidden_and_carries_the_module_url
+    render_picker
+    assert_selector "div[role='dialog'][hidden]", visible: :all
+    assert_match(/cally/, root["data-ui--date-picker-module-url-value"])
+  end
+
+  # The hint teaches the format on a data-entry form; in a filter toolbar the
+  # value is already on screen and three wrapped lines of hint per field push
+  # the page heading down.
+  def test_the_hint_can_be_turned_off
+    render_picker
+    assert_selector "p", text: "DD/MM/YYYY"
+    assert_equal "#{typed[:id]}-hint", typed["aria-describedby"]
+
+    render_picker(hint: false)
+    assert_no_selector "p"
+    assert_nil typed["aria-describedby"]
+  end
+
+  def test_the_toggle_is_labelled_and_marked_closed
+    render_picker
+    button = page.find("button[aria-haspopup='dialog']")
+    assert_equal "false", button["aria-expanded"]
+    assert_equal I18n.t("ui.date_picker.open"), button["aria-label"]
+  end
+
+  # --- the calendar header ---------------------------------------------------
+
+  # Month and year sit in Cally's heading slot, between the arrows, rather
+  # than under a second, duplicate heading.
+  def test_month_and_year_selects_fill_the_calendar_heading
+    render_picker
+    heading = page.find("calendar-date [slot='heading']", visible: :all)
+    assert heading.has_css?("calendar-select-month", visible: :all)
+    assert heading.has_css?("calendar-select-year", visible: :all)
+  end
+
+  # Cally wraps the arrows in its own buttons, so ours must not be buttons.
+  def test_arrows_are_labelled_icons_not_nested_buttons
+    render_picker
+    [ [ "previous", "ui.date_picker.previous" ], [ "next", "ui.date_picker.next" ] ].each do |slot, key|
+      arrow = page.find("calendar-date [slot='#{slot}']", visible: :all)
+      refute_equal "button", arrow.tag_name
+      assert_includes arrow.text(:all), I18n.t(key)
+    end
+  end
+end

data/registry/test/components/ui/dialog/content_test.rb

@@ -0,0 +1,156 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class UI::Dialog::ContentTest < ViewComponent::TestCase
+  def setup_fixtures(*); end
+  def teardown_fixtures(*); end
+
+  def render_dialog(content_opts = {}, &block)
+    render_inline(UI::Dialog.new(id: "profile-dialog")) do |dlg|
+      dlg.with_trigger { "Open" }
+      dlg.with_content(**content_opts) { |c| block.call(c) }
+    end
+  end
+
+  # ── Native dialog wrapper ────────────────────────────────────────────────
+
+  def test_renders_native_dialog_element
+    render_dialog { |c| c.with_title("Hi") }
+    assert_selector "dialog[data-ui--dialog-target='content']", visible: :all
+  end
+
+  def test_dialog_has_data_state_closed_by_default
+    render_dialog { |c| c.with_title("Hi") }
+    assert_equal "closed", page.find("dialog", visible: :all)["data-state"]
+    assert_nil page.find("dialog", visible: :all)[:open]
+  end
+
+  def test_dialog_id_matches_root
+    render_dialog { |c| c.with_title("Hi") }
+    assert_equal "profile-dialog", page.find("dialog", visible: :all)[:id]
+  end
+
+  def test_panel_present_inside_dialog
+    render_dialog { |c| c.with_title("Hi") }
+    assert_selector "[data-ui--dialog-part='panel']", visible: :all
+  end
+
+  # ── Title / description ──────────────────────────────────────────────────
+
+  def test_title_text_arg_renders_h2
+    render_dialog { |c| c.with_title("Are you sure?") }
+    title = page.find("dialog h2", visible: :all)
+    assert_equal "Are you sure?", title.text.strip
+    classes = title[:class].split
+    assert_includes classes, "text-lg"
+    assert_includes classes, "font-semibold"
+  end
+
+  def test_title_block_renders_h2_with_block_content
+    render_dialog do |c|
+      c.with_title { "Block title" }
+    end
+    title = page.find("dialog h2", visible: :all)
+    assert_equal "Block title", title.text.strip
+  end
+
+  def test_title_links_via_aria_labelledby
+    render_dialog { |c| c.with_title("Hi") }
+    dialog = page.find("dialog", visible: :all)
+    title  = page.find("dialog h2", visible: :all)
+    assert_equal "profile-dialog-title", title[:id]
+    assert_equal title[:id], dialog["aria-labelledby"]
+  end
+
+  def test_description_text_arg_renders_p
+    render_dialog do |c|
+      c.with_title("Hi")
+      c.with_description("This action cannot be undone.")
+    end
+    desc = page.find("dialog p", visible: :all)
+    assert_equal "This action cannot be undone.", desc.text.strip
+    assert_includes desc[:class].split, "text-muted-foreground"
+  end
+
+  def test_description_links_via_aria_describedby
+    render_dialog do |c|
+      c.with_title("Hi")
+      c.with_description("Body")
+    end
+    dialog = page.find("dialog", visible: :all)
+    desc   = page.find("dialog p", visible: :all)
+    assert_equal "profile-dialog-description", desc[:id]
+    assert_equal desc[:id], dialog["aria-describedby"]
+  end
+
+  def test_no_title_means_no_aria_labelledby
+    render_dialog { |c| c.with_description("Body") }
+    refute page.find("dialog", visible: :all)["aria-labelledby"]
+  end
+
+  # ── Body ─────────────────────────────────────────────────────────────────
+
+  def test_body_content_renders_inside_dialog
+    render_dialog do |c|
+      c.with_title("Hi")
+      "raw body text"
+    end
+    assert_selector "dialog", text: "raw body text", visible: :all
+  end
+
+  # ── Footer ───────────────────────────────────────────────────────────────
+
+  def test_footer_block_renders_in_footer_element
+    render_dialog do |c|
+      c.with_title("Hi")
+      c.with_footer do
+        '<button type="button">Confirm</button>'.html_safe
+      end
+    end
+    assert_selector "dialog footer", visible: :all
+    assert_selector "dialog footer button", text: "Confirm", visible: :all
+  end
+
+  def test_no_footer_means_no_footer_element
+    render_dialog { |c| c.with_title("Hi") }
+    assert_no_selector "dialog footer", visible: :all
+  end
+
+  # ── Close button ─────────────────────────────────────────────────────────
+
+  def test_close_button_default_present
+    render_dialog { |c| c.with_title("Hi") }
+    btn = page.find("dialog button[aria-label='Close']", visible: :all)
+    assert_match(/click->ui--dialog#close/, btn["data-action"])
+  end
+
+  def test_close_button_can_be_disabled
+    render_dialog(show_close: false) { |c| c.with_title("Hi") }
+    assert_no_selector "dialog button[aria-label='Close']", visible: :all
+  end
+
+  # ── Sizes ────────────────────────────────────────────────────────────────
+
+  def test_size_default
+    render_dialog { |c| c.with_title("Hi") }
+    panel = page.find("[data-ui--dialog-part='panel']", visible: :all)
+    assert_includes panel[:class].split, "max-w-lg"
+  end
+
+  def test_other_sizes_apply_max_width_token
+    { sm: "max-w-md", lg: "max-w-2xl", xl: "max-w-4xl" }.each do |size, expected|
+      render_dialog(size: size) { |c| c.with_title("Hi") }
+      panel = page.find("[data-ui--dialog-part='panel']", visible: :all)
+      assert_includes panel[:class].split, expected, "size #{size}"
+    end
+  end
+
+  # ── User class merge on panel ────────────────────────────────────────────
+
+  def test_user_class_merges_into_panel
+    render_dialog(class: "border-red-500") { |c| c.with_title("Hi") }
+    panel = page.find("[data-ui--dialog-part='panel']", visible: :all)
+    assert_includes panel[:class].split, "border-red-500"
+  end
+end