RubyGems - stimulus_plumbers_tailwind - Versions diffs - 0.4.0 → 0.4.3 - Mend

stimulus_plumbers_tailwind 0.4.0 → 0.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

checksums.yaml +4 -4
data/CHANGELOG.md +40 -0
data/README.md +27 -9
data/lib/generators/stimulus_plumbers_tailwind/install/install_generator.rb +78 -0
data/lib/stimulus_plumbers/themes/tailwind/avatar.rb +12 -12
data/lib/stimulus_plumbers/themes/tailwind/button.rb +26 -22
data/lib/stimulus_plumbers/themes/tailwind/calendar.rb +23 -20
data/lib/stimulus_plumbers/themes/tailwind/card.rb +4 -5
data/lib/stimulus_plumbers/themes/tailwind/combobox.rb +27 -17
data/lib/stimulus_plumbers/themes/tailwind/form/field.rb +44 -57
data/lib/stimulus_plumbers/themes/tailwind/form/input.rb +140 -54
data/lib/stimulus_plumbers/themes/tailwind/form.rb +1 -10
data/lib/stimulus_plumbers/themes/tailwind/icon.rb +7 -2
data/lib/stimulus_plumbers/themes/tailwind/layout.rb +6 -3
data/lib/stimulus_plumbers/themes/tailwind/link.rb +31 -29
data/lib/stimulus_plumbers/themes/tailwind/list.rb +15 -13
data/lib/stimulus_plumbers/themes/tailwind/timeline/group.rb +28 -0
data/lib/stimulus_plumbers/themes/tailwind/timeline.rb +104 -0
data/lib/stimulus_plumbers/themes/tailwind_theme.rb +3 -0
data/lib/stimulus_plumbers_tailwind/engine.rb +4 -0
data/lib/stimulus_plumbers_tailwind/version.rb +1 -1
data/lib/tasks/stimulus_plumbers_tailwind.rake +15 -0
metadata +5 -1

data/lib/stimulus_plumbers/themes/tailwind/form/field.rb CHANGED Viewed

@@ -10,27 +10,6 @@ module StimulusPlumbers
           HINT          = %w[text-(length:--sp-text-xs) text-(--sp-color-muted-fg)].freeze
           ERROR_TEXT    = %w[text-(length:--sp-text-xs) text-(--sp-color-error)].freeze
-          FLOATING_INPUT_BASE = %w[
-            peer w-full text-(length:--sp-text-sm) text-(--sp-color-fg) appearance-none
-            focus:outline-none focus:ring-0
-          ].freeze
-          FLOATING_INPUT_TYPES = {
-            filled:   %w[
-              rounded-t-(--sp-radius-md) px-(--sp-space-2-5) pb-(--sp-space-2-5) pt-(--sp-space-5)
-              bg-(--sp-color-bg-muted) border-0 border-b-2
-            ].freeze,
-            outlined: %w[
-              px-(--sp-space-2-5) pb-(--sp-space-2-5) pt-(--sp-space-4)
-              bg-transparent rounded-(--sp-radius-md) border
-            ].freeze,
-            standard: %w[
-              py-(--sp-space-2-5) px-0
-              bg-transparent border-0 border-b-2
-            ].freeze
-          }.freeze
-          FLOATING_INPUT_ERROR   = %w[border-(--sp-color-error)].freeze
-          FLOATING_INPUT_DEFAULT = %w[border-(--sp-color-muted-fg) focus:border-(--sp-color-primary)].freeze
           FLOATING_GROUP_TYPES = {
             filled:   %w[relative].freeze,
             outlined: %w[relative].freeze,
@@ -41,28 +20,42 @@ module StimulusPlumbers
             absolute text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
             duration-300 transform origin-[0]
           ].freeze
-          FLOATING_LABEL_FOCUS   = %w[peer-focus:text-(--sp-color-primary)].freeze
+          FLOATING_LABEL_FOCUS   = %w[peer-focus-within:text-(--sp-color-primary)].freeze
           FLOATING_LABEL_ERROR   = %w[text-(--sp-color-error)].freeze
           FLOATING_LABEL_TYPES = {
             filled:   %w[
               -translate-y-(--sp-space-4) scale-75 top-(--sp-space-4) z-10 start-(--sp-space-2-5)
-              peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0
-              peer-focus:scale-75 peer-focus:-translate-y-(--sp-space-4)
-              rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto
+              peer-placeholder-shown:scale-100
+              peer-placeholder-shown:translate-y-0
+              peer-has-[input:not(:focus):placeholder-shown]:scale-100
+              peer-has-[input:not(:focus):placeholder-shown]:translate-y-0
+              peer-focus-within:scale-75
+              peer-focus-within:-translate-y-(--sp-space-4)
+              rtl:peer-focus-within:translate-x-1/4 rtl:peer-focus-within:left-auto
             ].freeze,
             outlined: %w[
               -translate-y-(--sp-space-4) scale-75 top-(--sp-space-2) z-10 start-1
-              bg-(--sp-color-bg) px-(--sp-space-2) peer-focus:px-(--sp-space-2)
-              peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2
-              peer-focus:top-(--sp-space-2) peer-focus:scale-75 peer-focus:-translate-y-(--sp-space-4)
-              rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto
+              bg-(--sp-color-bg) px-(--sp-space-2) peer-focus-within:px-(--sp-space-2)
+              peer-placeholder-shown:scale-100
+              peer-placeholder-shown:-translate-y-1/2
+              peer-placeholder-shown:top-1/2
+              peer-has-[input:not(:focus):placeholder-shown]:scale-100
+              peer-has-[input:not(:focus):placeholder-shown]:-translate-y-1/2
+              peer-has-[input:not(:focus):placeholder-shown]:top-1/2
+              peer-focus-within:top-(--sp-space-2) peer-focus-within:scale-75
+              peer-focus-within:-translate-y-(--sp-space-4)
+              rtl:peer-focus-within:translate-x-1/4 rtl:peer-focus-within:left-auto
             ].freeze,
             standard: %w[
               -translate-y-(--sp-space-6) scale-75 top-(--sp-space-3) -z-10 start-0
-              peer-focus:start-0
-              peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0
-              peer-focus:scale-75 peer-focus:-translate-y-(--sp-space-6)
-              rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto
+              peer-focus-within:start-0
+              peer-placeholder-shown:scale-100
+              peer-placeholder-shown:translate-y-0
+              peer-has-[input:not(:focus):placeholder-shown]:scale-100
+              peer-has-[input:not(:focus):placeholder-shown]:translate-y-0
+              peer-focus-within:scale-75
+              peer-focus-within:-translate-y-(--sp-space-6)
+              rtl:peer-focus-within:translate-x-1/4 rtl:peer-focus-within:left-auto
             ].freeze
           }.freeze
@@ -78,7 +71,7 @@ module StimulusPlumbers
               hover:bg-(--sp-color-muted)
             ].freeze,
             card:    %w[
-              flex justify-between items-start flex-1 p-(--sp-space-4) cursor-pointer select-none
+              flex justify-between items-center gap-(--sp-space-3) flex-1 p-(--sp-space-4) cursor-pointer select-none
               text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
               bg-(--sp-color-bg) border border-(--sp-color-border) rounded-(--sp-radius-md) shadow-(--sp-shadow-xs)
               hover:bg-(--sp-color-muted) hover:border-(--sp-color-border-strong) hover:text-(--sp-color-fg)
@@ -97,16 +90,16 @@ module StimulusPlumbers
               text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
               bg-(--sp-color-bg) border border-(--sp-color-border) rounded-(--sp-radius-md)
               hover:bg-(--sp-color-muted)
-              peer-checked:border-(--card-ring) peer-checked:bg-(--card-ring)/10
-              peer-checked:text-(--sp-color-fg) peer-checked:hover:bg-(--card-ring)/15
+              group-has-[:checked]:border-(--card-ring) group-has-[:checked]:bg-(--card-ring)/10
+              group-has-[:checked]:text-(--sp-color-fg) group-has-[:checked]:hover:bg-(--card-ring)/15
             ].freeze,
             card:    %w[
               flex items-start flex-1 p-(--sp-space-4) cursor-pointer select-none
               text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
               bg-(--sp-color-bg) border border-(--sp-color-border) rounded-(--sp-radius-md) shadow-(--sp-shadow-xs)
               hover:bg-(--sp-color-muted) hover:border-(--sp-color-border-strong) hover:text-(--sp-color-fg)
-              peer-checked:border-(--card-ring) peer-checked:bg-(--card-ring)/10
-              peer-checked:text-(--sp-color-fg) peer-checked:hover:bg-(--card-ring)/15
+              group-has-[:checked]:border-(--card-ring) group-has-[:checked]:bg-(--card-ring)/10
+              group-has-[:checked]:text-(--sp-color-fg) group-has-[:checked]:hover:bg-(--card-ring)/15
             ].freeze
           }.freeze
@@ -117,27 +110,17 @@ module StimulusPlumbers
           private
-          def form_field_floating_classes(type: nil, error: false)
-            {
-              classes: klasses(
-                *FLOATING_INPUT_BASE,
-                *FLOATING_INPUT_TYPES.fetch(type, []),
-                *(error ? FLOATING_INPUT_ERROR : FLOATING_INPUT_DEFAULT)
-              )
-            }
-          end
-          def form_field_floating_group_classes(type: nil)
-            { classes: klasses(*FLOATING_GROUP_TYPES.fetch(type, [])) }
+          def form_field_input_group_classes(floating: nil)
+            { classes: klasses(*FLOATING_GROUP_TYPES.fetch(floating, [])) }
           end
-          def form_field_floating_label_classes(type: nil, error: false)
-            color = error ? FLOATING_LABEL_ERROR : FLOATING_LABEL_FOCUS
-            { classes: klasses(*FLOATING_LABEL_BASE, *FLOATING_LABEL_TYPES.fetch(type, []), *color) }
-          end
-          def form_field_label_classes(hidden: false, **)
-            { classes: klasses(*LABEL, hidden ? "sr-only" : nil) }
+          def form_field_label_classes(floating: nil, hidden: false, error: false, **)
+            if floating
+              color = error ? FLOATING_LABEL_ERROR : FLOATING_LABEL_FOCUS
+              { classes: klasses(*FLOATING_LABEL_BASE, *FLOATING_LABEL_TYPES.fetch(floating, []), *color) }
+            else
+              { classes: klasses(*LABEL, hidden ? "sr-only" : nil) }
+            end
           end
           def form_field_required_mark_classes
@@ -165,6 +148,10 @@ module StimulusPlumbers
             card_color = %i[button card].include?(type) ? Card::VARIANTS.fetch(variant, Card::VARIANTS[:tertiary]) : []
             { classes: klasses(*RADIO_LABEL_TYPES.fetch(type), *card_color) }
           end
+          def form_field_radio_item_group_classes
+            { classes: "contents group" }
+          end
         end
       end
     end

data/lib/stimulus_plumbers/themes/tailwind/form/input.rb CHANGED Viewed

@@ -5,31 +5,98 @@ module StimulusPlumbers
     module Tailwind
       module Form
         module Input
+          # ── Standalone input ──────────────────────────────────────────────────
           INPUT_BASE = %w[
-            w-full rounded-(--sp-radius-md) border px-(--sp-space-3) py-(--sp-space-2) text-(length:--sp-text-sm)
-            text-(--sp-color-fg) bg-(--sp-color-bg) focus:outline-none focus:ring-2 focus:ring-offset-0
+            w-full rounded-(--sp-radius-md) border px-(--sp-space-3) py-(--sp-space-2)
+            text-(length:--sp-text-sm) text-(--sp-color-fg) bg-(--sp-color-bg)
+            focus:outline-none focus:ring-(length:--sp-focus-ring-width) focus:ring-offset-0
+          ].freeze
+          INPUT_DEFAULT = %w[
+            border-(--sp-color-muted-fg) hover:border-(--sp-color-fg)
+            focus:ring-(--sp-focus-ring-color)
+          ].freeze
+          INPUT_ERROR = %w[border-(--sp-color-error) focus:ring-(--sp-color-error)].freeze
+          # ── Floating input ────────────────────────────────────────────────────
+          FLOATING_INPUT_BASE = %w[
+            peer w-full text-(length:--sp-text-sm) text-(--sp-color-fg) appearance-none
+            focus:outline-none focus:ring-0
+            focus-visible:outline-none focus-visible:ring-0
+          ].freeze
+          FLOATING_INPUT_TYPES = {
+            filled:   %w[
+              rounded-t-(--sp-radius-md) px-(--sp-space-2-5) pb-(--sp-space-2-5) pt-(--sp-space-5)
+              bg-(--sp-color-bg-muted) border-0 border-b-2
+            ].freeze,
+            outlined: %w[
+              px-(--sp-space-2-5) pb-(--sp-space-2-5) pt-(--sp-space-4)
+              bg-transparent rounded-(--sp-radius-md) border
+            ].freeze,
+            standard: %w[
+              py-(--sp-space-2-5) px-0
+              bg-transparent border-0 border-b-2
+            ].freeze
+          }.freeze
+          FLOATING_INPUT_DEFAULT = %w[
+            border-(--sp-color-muted-fg) hover:border-(--sp-color-fg)
+            focus:border-(--sp-color-primary)
+          ].freeze
+          FLOATING_INPUT_ERROR = %w[border-(--sp-color-error)].freeze
+          # ── Input group ───────────────────────────────────────────────────────
+          INPUT_GROUP_BASE   = %w[flex items-center overflow-hidden rounded-(--sp-radius-md) border].freeze
+          INPUT_GROUP_BORDER = { error: "border-(--sp-color-error)", default: "border-(--sp-color-muted-fg)" }.freeze
+          # ── Floating input group ──────────────────────────────────────────────
+          FLOATING_INPUT_GROUP_BASE = %w[flex items-center overflow-hidden peer].freeze
+          FLOATING_INPUT_GROUP_TYPES = {
+            filled:   %w[rounded-t-(--sp-radius-md) bg-(--sp-color-bg-muted) border-0 border-b-2].freeze,
+            outlined: %w[rounded-(--sp-radius-md) border].freeze,
+            standard: %w[rounded-none bg-transparent border-0 border-b-2].freeze
+          }.freeze
+          FLOATING_INPUT_GROUP_DEFAULT = %w[
+            border-(--sp-color-muted-fg) hover:border-(--sp-color-fg)
+            focus-within:border-(--sp-color-primary)
+          ].freeze
+          FLOATING_INPUT_GROUP_ERROR = %w[border-(--sp-color-error)].freeze
+          # ── Combobox wrappers ─────────────────────────────────────────────────
+          COMBOBOX_INPUT = %w[
+            [&>input:not([type=hidden])]:border-0
+            [&>input:not([type=hidden])]:rounded-none
+            [&>input:not([type=hidden])]:px-0
+            [&>input:not([type=hidden])]:py-0
+            [&>input:not([type=hidden])]:bg-transparent
+            [&>input:not([type=hidden])]:shadow-none
+            [&>input:not([type=hidden])]:focus:ring-0
+          ].freeze
+          COMBOBOX_TRIGGER_GROUP = %w[
+            [&>div:first-child]:border-0
+            [&>div:first-child]:rounded-none
+            [&>div:first-child]:px-0
+            [&>div:first-child]:py-0
+            [&>div:first-child]:focus-within:ring-0
           ].freeze
-          INPUT_ERROR   = %w[border-(--sp-color-error) focus:ring-(--sp-color-error)].freeze
-          INPUT_DEFAULT = %w[border-(--sp-color-muted-fg) focus:ring-(--sp-focus-ring-color)].freeze
+          # ── Choice inputs ─────────────────────────────────────────────────────
           CHECKBOX_TYPES = {
             default: %w[
               size-(--sp-control-size) rounded-(--sp-radius-sm) shrink-0
               border border-(--sp-color-border) bg-(--sp-color-muted)
-              focus:ring-2 focus:ring-(--sp-focus-ring-color) focus:outline-none
+              focus:ring-(length:--sp-focus-ring-width) focus:ring-(--sp-focus-ring-color) focus:outline-none
               disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer
             ].freeze,
             button:  %w[
               size-(--sp-control-size) rounded-(--sp-radius-sm) shrink-0
               border border-(--sp-color-border) bg-(--sp-color-muted)
-              focus:ring-2 focus:ring-(--sp-focus-ring-color) focus:outline-none
+              focus:ring-(length:--sp-focus-ring-width) focus:ring-(--sp-focus-ring-color) focus:outline-none
               disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer
             ].freeze,
             card:    %w[
               size-(--sp-control-size) rounded-(--sp-radius-sm) shrink-0
               border border-(--sp-color-border) bg-(--sp-color-muted)
               checked:border-(--card-ring)
-              focus:ring-2 focus:ring-(--card-ring) focus:outline-none
+              focus:ring-(length:--sp-focus-ring-width) focus:ring-(--card-ring) focus:outline-none
               disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer
             ].freeze
           }.freeze
@@ -38,58 +105,54 @@ module StimulusPlumbers
             default: %w[
               size-(--sp-control-size) rounded-full shrink-0
               [accent-color:var(--sp-color-primary)] cursor-pointer
-              focus:ring-2 focus:ring-(--sp-focus-ring-color) focus:outline-none
+              focus:ring-(length:--sp-focus-ring-width) focus:ring-(--sp-focus-ring-color) focus:outline-none
               disabled:opacity-50 disabled:cursor-not-allowed
             ].freeze,
-            button:  %w[hidden peer].freeze,
-            card:    %w[hidden peer].freeze
+            button:  %w[hidden].freeze,
+            card:    %w[hidden].freeze
           }.freeze
-          INPUT_GROUP_BASE   = %w[flex items-center overflow-hidden rounded-(--sp-radius-md) border].freeze
-          INPUT_GROUP_BORDER = { error: "border-(--sp-color-error)", default: "border-(--sp-color-muted-fg)" }.freeze
-          COMBOBOX_INPUT = %w[
-            [&>input:not([type=hidden])]:border-0
-            [&>input:not([type=hidden])]:rounded-none
-            [&>input:not([type=hidden])]:px-0
-            [&>input:not([type=hidden])]:py-0
-            [&>input:not([type=hidden])]:bg-transparent
-            [&>input:not([type=hidden])]:shadow-none
-            [&>input:not([type=hidden])]:focus:ring-0
-          ].freeze
-          COMBOBOX_TRIGGER_GROUP = %w[
-            [&>div:first-child]:border-0
-            [&>div:first-child]:rounded-none
-            [&>div:first-child]:px-0
-            [&>div:first-child]:py-0
-            [&>div:first-child]:focus-within:ring-0
-          ].freeze
-          BUTTON_REVEAL = %w[
-            self-stretch border-0 bg-transparent px-(--sp-space-3) cursor-pointer text-(--sp-color-muted-fg)
-            hover:text-(--sp-color-fg) text-(length:--sp-text-sm)
+          # ── Utility buttons ───────────────────────────────────────────────────
+          BUTTON_REVEAL = [
+            *Control::BASE,
+            "inline-flex items-center justify-center",
+            "focus-visible:ring-(--sp-focus-ring-color)",
+            "self-stretch px-(--sp-space-2) border-0 bg-transparent cursor-pointer text-(--sp-color-muted-fg)",
+            "rounded-(--sp-radius-sm) hover:bg-(--sp-color-muted) hover:text-(--sp-color-fg)"
           ].freeze
-          BUTTON_CLEAR = %w[
-            self-stretch border-0 bg-transparent px-(--sp-space-2) cursor-pointer text-(--sp-color-muted-fg)
-            hover:text-(--sp-color-fg) text-(length:--sp-text-sm)
+          BUTTON_CLEAR = [
+            *Control::BASE,
+            "inline-flex items-center justify-center",
+            "focus-visible:ring-(--sp-focus-ring-color)",
+            "self-stretch px-(--sp-space-2) border-0 bg-transparent cursor-pointer text-(--sp-color-muted-fg)",
+            "rounded-(--sp-radius-sm) hover:bg-(--sp-color-muted) hover:text-(--sp-color-fg)"
           ].freeze
           private
-          def form_field_input_classes(error: false)
-            { classes: klasses(*INPUT_BASE, *(error ? INPUT_ERROR : INPUT_DEFAULT)) }
+          def form_field_input_classes(floating: nil, error: false)
+            if floating
+              { classes: klasses(
+                *FLOATING_INPUT_BASE,
+                *FLOATING_INPUT_TYPES.fetch(floating, []),
+                *(error ? FLOATING_INPUT_ERROR : FLOATING_INPUT_DEFAULT)
+              )
+}
+            else
+              { classes: klasses(*INPUT_BASE, *(error ? INPUT_ERROR : INPUT_DEFAULT)) }
+            end
           end
-          def form_field_input_textarea_classes(error: false)
-            form_field_input_classes(error: error)
+          def form_field_input_textarea_classes(floating: nil, error: false)
+            form_field_input_classes(floating: floating, error: error)
           end
-          def form_field_input_file_classes(error: false)
-            form_field_input_classes(error: error)
+          def form_field_input_file_classes(floating: nil, error: false)
+            form_field_input_classes(floating: floating, error: error)
           end
-          def form_field_input_select_classes(error: false)
-            form_field_input_classes(error: error)
+          def form_field_input_select_classes(floating: nil, error: false)
+            form_field_input_classes(floating: floating, error: error)
           end
           def form_field_input_checkbox_classes(type: :default, variant: :default, **)
@@ -102,23 +165,46 @@ module StimulusPlumbers
             { classes: klasses(*RADIO_TYPES.fetch(type), *card_color) }
           end
-          def input_group_classes(error: false)
-            { classes: klasses(*INPUT_GROUP_BASE, INPUT_GROUP_BORDER[error ? :error : :default]) }
+          def input_group_classes(error: false, floating: nil)
+            if floating
+              color = error ? FLOATING_INPUT_GROUP_ERROR : FLOATING_INPUT_GROUP_DEFAULT
+              { classes: klasses(*FLOATING_INPUT_GROUP_BASE, *FLOATING_INPUT_GROUP_TYPES.fetch(floating, []), *color) }
+            else
+              { classes: klasses(*INPUT_GROUP_BASE, INPUT_GROUP_BORDER[error ? :error : :default]) }
+            end
           end
-          def form_field_input_combobox_classes(error: false)
-            { classes: klasses(
-              *INPUT_BASE,
-              *(error ? INPUT_ERROR : INPUT_DEFAULT),
-              *COMBOBOX_INPUT,
-              *COMBOBOX_TRIGGER_GROUP
-            )
-}
+          def form_field_input_combobox_classes(floating: nil, error: false)
+            if floating
+              form_field_input_combobox_floating_classes(floating: floating, error: error)
+            else
+              {
+                classes: klasses(
+                  *INPUT_BASE,
+                  *(error ? INPUT_ERROR : INPUT_DEFAULT),
+                  *COMBOBOX_INPUT,
+                  *COMBOBOX_TRIGGER_GROUP
+                )
+              }
+            end
+          end
+          def form_field_input_combobox_floating_classes(floating: :standard, error: false)
+            {
+              classes: klasses(
+                *FLOATING_INPUT_BASE,
+                *FLOATING_INPUT_TYPES.fetch(floating, []),
+                *(error ? FLOATING_INPUT_ERROR : FLOATING_INPUT_DEFAULT),
+                *COMBOBOX_INPUT,
+                *COMBOBOX_TRIGGER_GROUP
+              )
+            }
           end
           def form_field_input_reveal_classes(**)
             {
               classes: klasses(
+                "peer",
                 "[&>input]:border-0",
                 "[&>input]:rounded-none",
                 "[&>input]:bg-transparent",

data/lib/stimulus_plumbers/themes/tailwind/form.rb CHANGED Viewed

@@ -13,16 +13,7 @@ module StimulusPlumbers
           { classes: klasses(*GROUP_BASE, layout == :inline ? GROUP_INLINE : "flex-col") }
         end
-        def form_submit_classes(type: :default, variant: :primary)
-          { classes: klasses(
-            *Button::BASE,
-            *Button::LAYOUT,
-            *Button::VARIANTS.fetch(variant, Button::VARIANTS[:primary]),
-            *Button::TYPES.fetch(type, Button::TYPES[:default]),
-            *(type == :card ? [] : Button::SIZES[:md])
-          )
-}
-        end
+        def form_submit_classes(**) = {}
       end
     end
   end

data/lib/stimulus_plumbers/themes/tailwind/icon.rb CHANGED Viewed

@@ -10,8 +10,13 @@ module StimulusPlumbers
       module Icon
         ALIASES = {
           "close"         => "x-mark",
+          "download"      => "arrow-down-tray",
+          "book"          => "book-open",
+          "edit"          => "pencil",
+          "email"         => "envelope",
           "calendar"      => "calendar-days",
-          "external-link" => "arrow-top-right-on-square"
+          "external-link" => "arrow-top-right-on-square",
+          "reveal"        => "eye"
         }.freeze
         ICONS = StimulusPlumbers::Themes::Icons::Registry.new(
@@ -26,7 +31,7 @@ module StimulusPlumbers
         private
         def icon_classes
-          { classes: "size-(--sp-icon-default)" }
+          { classes: "size-(--sp-icon-size-lg)" }
         end
       end
     end

data/lib/stimulus_plumbers/themes/tailwind/layout.rb CHANGED Viewed

@@ -4,9 +4,12 @@ module StimulusPlumbers
   module Themes
     module Tailwind
       module Layout
-        DIVIDER_SEPARATOR = %w[border-t border-(--sp-color-border) my-(--sp-space-1)].freeze
-        DIVIDER           = %w[flex items-center gap-(--sp-space-3)].freeze
-        DIVIDER_LABEL     = %w[text-(length:--sp-text-sm) text-(--sp-color-fg-muted) whitespace-nowrap font-medium].freeze
+        # ── Divider ───────────────────────────────────────────────────────────
+        DIVIDER           = %w[w-full flex items-center gap-(--sp-space-3)].freeze
+        DIVIDER_SEPARATOR = %w[flex-1 h-px bg-(--sp-color-border) border-0].freeze
+        DIVIDER_LABEL     = %w[text-(length:--sp-text-sm) text-(--sp-color-muted-fg) whitespace-nowrap font-medium].freeze
+        # ── Popover ───────────────────────────────────────────────────────────
         POPOVER_WRAPPER = %w[relative inline-block].freeze
         POPOVER_TRIGGER = [
           *Control::BASE,

data/lib/stimulus_plumbers/themes/tailwind/link.rb CHANGED Viewed

@@ -4,34 +4,7 @@ module StimulusPlumbers
   module Themes
     module Tailwind
       module Link
-        VARIANTS = {
-          default:     %w[
-            [--link-color:var(--sp-color-primary)]
-            [--link-ring:var(--sp-color-primary)]
-            [--link-bg:var(--sp-color-primary)]
-          ].freeze,
-          success:     %w[
-            [--link-color:var(--sp-color-success)]
-            [--link-ring:var(--sp-color-success-ring)]
-            [--link-bg:var(--sp-color-success)]
-          ].freeze,
-          destructive: %w[
-            [--link-color:var(--sp-color-destructive)]
-            [--link-ring:var(--sp-color-destructive)]
-            [--link-bg:var(--sp-color-destructive)]
-          ].freeze,
-          warning:     %w[
-            [--link-color:var(--sp-color-warning)]
-            [--link-ring:var(--sp-color-warning-ring)]
-            [--link-bg:var(--sp-color-warning)]
-          ].freeze,
-          info:        %w[
-            [--link-color:var(--sp-color-info)]
-            [--link-ring:var(--sp-color-info-ring)]
-            [--link-bg:var(--sp-color-info)]
-          ].freeze
-        }.freeze
+        # ── Type styles ───────────────────────────────────────────────────────
         BASE = [
           *Control::BASE,
           "inline-flex items-center gap-(--sp-space-1)",
@@ -65,6 +38,35 @@ module StimulusPlumbers
           "focus-visible:ring-(--link-ring)"
         ].freeze
+        # ── Color tokens ──────────────────────────────────────────────────────
+        VARIANTS = {
+          default:     %w[
+            [--link-color:var(--sp-color-primary)]
+            [--link-ring:var(--sp-color-primary)]
+            [--link-bg:var(--sp-color-primary)]
+          ].freeze,
+          success:     %w[
+            [--link-color:var(--sp-color-success)]
+            [--link-ring:var(--sp-color-success-ring)]
+            [--link-bg:var(--sp-color-success)]
+          ].freeze,
+          destructive: %w[
+            [--link-color:var(--sp-color-destructive)]
+            [--link-ring:var(--sp-color-destructive)]
+            [--link-bg:var(--sp-color-destructive)]
+          ].freeze,
+          warning:     %w[
+            [--link-color:var(--sp-color-warning)]
+            [--link-ring:var(--sp-color-warning-ring)]
+            [--link-bg:var(--sp-color-warning)]
+          ].freeze,
+          info:        %w[
+            [--link-color:var(--sp-color-info)]
+            [--link-ring:var(--sp-color-info-ring)]
+            [--link-bg:var(--sp-color-info)]
+          ].freeze
+        }.freeze
         private
         def link_classes(type: :default, variant: :default)
@@ -77,7 +79,7 @@ module StimulusPlumbers
         end
         def link_icon_classes
-          { classes: klasses("size-(--sp-control-size)", "stroke-current") }
+          { classes: klasses("size-(--sp-icon-size-sm)", "stroke-current") }
         end
       end
     end

data/lib/stimulus_plumbers/themes/tailwind/list.rb CHANGED Viewed

@@ -4,6 +4,19 @@ module StimulusPlumbers
   module Themes
     module Tailwind
       module List
+        # ── Section ───────────────────────────────────────────────────────────
+        SECTION_TITLE_BASE = %w[
+          block px-(--sp-space-2) pb-(--sp-space-1)
+          text-(length:--sp-text-xs) font-semibold uppercase tracking-wider
+          text-(--sp-color-muted-fg)
+        ].freeze
+        SECTION_DESCRIPTION_BASE = %w[
+          block px-(--sp-space-2) pb-(--sp-space-1)
+          text-(length:--sp-text-xs) text-(--sp-color-muted-fg)
+        ].freeze
+        # ── Item ──────────────────────────────────────────────────────────────
         ITEM_BASE = [
           *Control::BASE,
           "flex items-center gap-(--sp-space-2) w-full",
@@ -28,21 +41,10 @@ module StimulusPlumbers
           text-(length:--sp-text-xs) text-(--sp-color-muted-fg)
         ].freeze
-        SECTION_TITLE_BASE = %w[
-          block px-(--sp-space-2) pb-(--sp-space-1)
-          text-(length:--sp-text-xs) font-semibold uppercase tracking-wider
-          text-(--sp-color-muted-fg)
-        ].freeze
-        SECTION_DESCRIPTION_BASE = %w[
-          block px-(--sp-space-2) pb-(--sp-space-1)
-          text-(length:--sp-text-xs) text-(--sp-color-muted-fg)
-        ].freeze
         private
         def list_classes
-          { classes: klasses("py-(--sp-space-1) divide-y divide-(--sp-color-border)") }
+          { classes: klasses("py-(--sp-space-1)") }
         end
         def list_section_classes
@@ -62,7 +64,7 @@ module StimulusPlumbers
         end
         def list_item_icon_classes
-          { classes: klasses("size-(--sp-control-size)", "stroke-current") }
+          { classes: klasses("size-(--sp-icon-size-sm)", "stroke-current") }
         end
         def list_item_content_classes

data/lib/stimulus_plumbers/themes/tailwind/timeline/group.rb ADDED Viewed

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Themes
+    module Tailwind
+      module Timeline
+        module Group
+          WRAPPER  = %w[space-y-4].freeze
+          SECTION  = %w[
+            p-4
+            bg-(--sp-color-bg-muted)
+            border border-(--sp-color-border)
+            rounded-lg
+          ].freeze
+          DATE     = %w[text-base font-semibold text-(--sp-color-fg)].freeze
+          LIST     = %w[mt-3 divide-y divide-(--sp-color-border)].freeze
+          private
+          def timeline_group_classes              = { classes: klasses(WRAPPER) }
+          def timeline_group_section_classes      = { classes: klasses(SECTION) }
+          def timeline_group_section_date_classes = { classes: klasses(DATE) }
+          def timeline_group_section_list_classes = { classes: klasses(LIST) }
+        end
+      end
+    end
+  end
+end