stimulus_plumbers_tailwind 0.3.2 → 0.3.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7dbbcc00f687b1debd6e91743b721865707390999b971ed533a22d9c35c148ce
-  data.tar.gz: a2dedb3c6b6761b520711f3bec5839e7155cf192bf8d99869cba51fbe6a2d45b
+  metadata.gz: d9538346c119b8c1b5ad69324b708e083393e2ff6c46bd777ff3b4f22833426f
+  data.tar.gz: ba2636473fbf2f74b3286a09efb10a4f68d5d431236ff70a8f1bd12654feac37
 SHA512:
-  metadata.gz: 2b0751ffd3e56d03d3ba7e7936d24a5c749d40cd7e7096fa1734ea9444d2f63183dc76ec92a6ce6bad08809533e9d3e307c379ef52abe8e641aa0b7e866e40d9
-  data.tar.gz: 6b53af446420512019b993a089e47cee25c7cddc8ee60a2794c1a6bd01157c6e7609b88f392dd83101d31e918e70a56cac1af760f237b703e79065363ea4b2eb
+  metadata.gz: 70224de388f2e9236cdb877212d5aa81d2a386efc98060bfc0bad2c78be686768a6d54eb5647c9a2cb06cc5218bcaa700161dd43b53356e85b99f1d76c3b30d8
+  data.tar.gz: 72d13eb1f2f751a7240a8af5d4faa47757f75157ab6806a0dd12245fe53f0f5f907d51d8b10508db0a592d7bb84772214c6483655c1e68a2529ead3b4b135f20

data/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 All notable changes to this project will be documented in this file. See [conventional commits](https://www.conventionalcommits.org/) for commit guidelines.
 
+---
+## [0.3.3](https://github.com/ryancyq/stimulus-plumbers/compare/stimulus-plumbers-tailwind/v0.3.2..stimulus-plumbers-tailwind/v0.3.3) - 2026-05-26
+
+### Bug Fixes
+
+- both stimulus/turbo calendar will render aria-current=date on today date. tailwind theme will apply today css style via aria attribute ([#77](https://github.com/ryancyq/stimulus-plumbers/issues/77)) - ([29da3cd](https://github.com/ryancyq/stimulus-plumbers/commit/29da3cdf81a069fb4fdfbee3a6d4ac57c9ed9a16)) - Ryan Chang
+- rename conflicts with stimulus value/target/class result in ambiguous definitions ([#81](https://github.com/ryancyq/stimulus-plumbers/issues/81)) - ([60d47a7](https://github.com/ryancyq/stimulus-plumbers/commit/60d47a7a907878b45a10f07e82bf647b815b47f0)) - Ryan Chang
+- rename autocomplete to typeahead for accurate naming ([#83](https://github.com/ryancyq/stimulus-plumbers/issues/83)) - ([ff5ff26](https://github.com/ryancyq/stimulus-plumbers/commit/ff5ff26143aba80c85b3e638e060c294c92dcc31)) - Ryan Chang
+- update version bump script to ruby - ([854935c](https://github.com/ryancyq/stimulus-plumbers/commit/854935c16b840ef9a7fdeac245c25016cdc66053)) - Ryan Chang
+
+### Features
+
+- button with icons ([#82](https://github.com/ryancyq/stimulus-plumbers/issues/82)) - ([7ae5267](https://github.com/ryancyq/stimulus-plumbers/commit/7ae52675a6983b42f574f9919495686b6802a121)) - Ryan Chang
+- button variant ([#84](https://github.com/ryancyq/stimulus-plumbers/issues/84)) - ([07b7f9c](https://github.com/ryancyq/stimulus-plumbers/commit/07b7f9c8beebe0be31817809476ab9715926e1ee)) - Ryan Chang
+- allow theme schema validation to support other validator like method/boolean instead of just array ([#86](https://github.com/ryancyq/stimulus-plumbers/issues/86)) - ([0eeb485](https://github.com/ryancyq/stimulus-plumbers/commit/0eeb48533e0a7ce20d9031fd782f854ae52d6a64)) - Ryan Chang
+- svg icon rendering ([#85](https://github.com/ryancyq/stimulus-plumbers/issues/85)) - ([7405c67](https://github.com/ryancyq/stimulus-plumbers/commit/7405c670b618f6f7e723c852ac633ca2655eda68)) - Ryan Chang
+- combobox theme ([#87](https://github.com/ryancyq/stimulus-plumbers/issues/87)) - ([5220185](https://github.com/ryancyq/stimulus-plumbers/commit/522018500956d271da0a6dde44d6c335e2a0c649)) - Ryan Chang
+
 ---
 ## [0.3.2](https://github.com/ryancyq/stimulus-plumbers/compare/stimulus-plumbers-tailwind/v0.3.1..stimulus-plumbers-tailwind/v0.3.2) - 2026-05-20
 

data/LICENSE-DEPENDENCIES

@@ -0,0 +1,57 @@
+stimulus_plumbers_tailwind may redistribute assets from the following projects:
+
+---
+
+https://github.com/tailwindlabs/tailwindcss
+
+The license for that software can be found at https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE which is reproduced here for your convenience:
+
+  MIT License
+
+  Copyright (c) Tailwind Labs, Inc.
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  SOFTWARE.
+
+---
+
+https://github.com/tailwindlabs/heroicons
+
+The license for that software can be found at https://github.com/tailwindlabs/heroicons/blob/master/LICENSE which is reproduced here for your convenience:
+
+  MIT License
+
+  Copyright (c) Tailwind Labs, Inc.
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  SOFTWARE.

data/README.md

@@ -51,12 +51,33 @@ Use `bundle show stimulus_plumbers_tailwind` to get the exact installed path.
 | `Tailwind::Button` | Button |
 | `Tailwind::Calendar` | Calendar grid, date picker |
 | `Tailwind::Card` | Card |
-| `Tailwind::Combobox` | Combobox (date, time, dropdown, autocomplete) |
+| `Tailwind::Combobox` | Combobox (date, time, dropdown, typeahead) |
 | `Tailwind::Form` | Form fields, labels, errors |
+| `Tailwind::Icon` | Icon (SVG rendering, icon registry) |
 | `Tailwind::Layout` | Layout primitives |
 
 Custom themes can subclass `TailwindTheme` to override individual methods, or subclass `StimulusPlumbers::Themes::Base` directly.
 
+## Icons
+
+The theme bundles the [Heroicons](https://heroicons.com/) 2.x set. Pass a kebab-case icon name to `sp_icon` or any component accepting `icon_leading:` / `icon_trailing:`. Append `/solid` for the filled variant:
+
+```erb
+<%= sp_icon "arrow-left" %>
+<%= sp_icon "arrow-left/solid" %>
+<%= sp_button "Next", icon_trailing: "arrow-right" %>
+```
+
+Icons render as inline `<svg>` with `size-6` by default. Override with `class:`:
+
+```erb
+<%= sp_icon "arrow-left", class: "size-4 text-gray-500" %>
+```
+
+**Built-in aliases:** `"close"` → `"x-mark"`, `"calendar"` → `"calendar-days"`.
+
+**Optional `heroicons` gem:** add `gem "heroicons"` to your `Gemfile` to load icons from the gem instead of the bundled files. The theme detects it automatically.
+
 ## Development
 
 ```bash

data/lib/stimulus_plumbers/themes/tailwind/action_list.rb

@@ -8,7 +8,7 @@ module StimulusPlumbers
         LIST_ITEM_BASE   = %w[
           flex items-center gap-(--sp-space-2) w-full
           px-(--sp-space-2) py-(--sp-space-1)
-          rounded-(--sp-radius-sm) text-(--sp-text-sm)
+          rounded-(--sp-radius-sm) text-(length:--sp-text-sm)
           cursor-pointer select-none outline-none
           hover:bg-(--sp-color-muted) focus:bg-(--sp-color-muted) focus:text-(--sp-color-fg)
         ].freeze

data/lib/stimulus_plumbers/themes/tailwind/avatar.rb

@@ -22,7 +22,7 @@ module StimulusPlumbers
         SIZES = {
           sm: "size-(--sp-icon-size)",
           md: "size-(--sp-avatar-size)",
-          lg: "size-12"
+          lg: "size-(--sp-avatar-size-lg)"
         }.freeze
 
         BASE = %w[rounded-(--sp-radius-full) overflow-hidden inline-flex items-center justify-center].freeze

data/lib/stimulus_plumbers/themes/tailwind/button.rb

@@ -28,13 +28,25 @@ module StimulusPlumbers
             hover:bg-(--sp-color-destructive)/90
           ].freeze,
           ghost:       %w[hover:bg-(--sp-color-muted) text-(--sp-color-fg)].freeze,
-          link:        %w[text-(--sp-color-primary) underline-offset-4 hover:underline].freeze
+          link:        %w[text-(--sp-color-primary) underline-offset-4 hover:underline].freeze,
+          fab:         %w[
+            rounded-full shadow-lg
+            bg-(--sp-color-primary) text-(--sp-color-primary-fg)
+            hover:bg-(--sp-color-primary)/90 hover:shadow-xl
+          ].freeze,
+          dashed:      %w[
+            border border-dashed border-(--sp-color-border)
+            bg-transparent text-(--sp-color-fg)
+            hover:bg-(--sp-color-muted)
+          ].freeze
         }.freeze
 
         SIZES = {
-          sm: %w[h-8 px-(--sp-space-3) text-(--sp-text-sm)].freeze,
-          md: %w[h-9 px-(--sp-space-4) text-(--sp-text-base)].freeze,
-          lg: %w[h-11 px-(--sp-space-6) text-(--sp-text-lg)].freeze
+          xs: %w[h-7 px-(--sp-space-2) text-(length:--sp-text-xs)].freeze,
+          sm: %w[h-8 px-(--sp-space-3) text-(length:--sp-text-sm)].freeze,
+          md: %w[h-9 px-(--sp-space-4) text-(length:--sp-text-base)].freeze,
+          lg: %w[h-11 px-(--sp-space-6) text-(length:--sp-text-lg)].freeze,
+          xl: %w[h-14 px-(--sp-space-6) text-(length:--sp-text-lg)].freeze
         }.freeze
 
         FLEX_ALIGN = {
@@ -55,7 +67,7 @@ module StimulusPlumbers
         }.freeze
 
         BASE = %w[
-          inline-flex items-center justify-center gap-2 font-medium
+          inline-flex items-center justify-center gap-(--sp-space-2) font-medium
           rounded-(--sp-radius-md) transition-colors
           focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2
           disabled:pointer-events-none disabled:opacity-50
@@ -83,6 +95,10 @@ module StimulusPlumbers
             )
           }
         end
+
+        def button_icon_classes
+          { classes: klasses("size-(--sp-control-size)", "stroke-current") }
+        end
       end
     end
   end

data/lib/stimulus_plumbers/themes/tailwind/calendar.rb

@@ -7,25 +7,23 @@ module StimulusPlumbers
         GRID = %w[w-full].freeze
 
         DAYS_OF_WEEK = %w[
-          grid grid-cols-7 text-center text-(--sp-text-xs)
-          font-medium text-(--sp-color-muted-fg) mb-1
+          grid grid-cols-7 text-center text-(length:--sp-text-xs)
+          font-medium text-(--sp-color-muted-fg) mb-(--sp-space-1)
         ].freeze
 
         DAYS_OF_MONTH = %w[grid grid-cols-7 justify-items-center].freeze
 
         DAY = %w[
           size-(--sp-calendar-day-size) rounded-(--sp-radius-md)
-          flex items-center justify-center text-(--sp-text-sm)
+          flex items-center justify-center text-(length:--sp-text-sm)
           hover:bg-(--sp-color-muted) cursor-pointer
+          aria-[current=date]:font-bold
+          aria-selected:bg-(--sp-color-primary)
+          aria-selected:text-(--sp-color-primary-fg)
+          aria-selected:hover:bg-(--sp-color-primary)/90
         ].freeze
 
-        DAY_SELECTED = %w[
-          bg-(--sp-color-primary)
-          text-(--sp-color-primary-fg)
-          hover:bg-(--sp-color-primary)/90
-        ].freeze
-
-        NAV = %w[flex items-center justify-between gap-1 mb-2].freeze
+        NAV = %w[flex items-center justify-between gap-(--sp-space-1) mb-(--sp-space-2)].freeze
 
         NAV_BTN = %w[
           inline-flex items-center justify-center
@@ -36,8 +34,6 @@ module StimulusPlumbers
           disabled:pointer-events-none disabled:opacity-50
         ].freeze
 
-        NAV_ICON = %w[size-4 stroke-current].freeze
-
         private
 
         def calendar_classes
@@ -56,13 +52,11 @@ module StimulusPlumbers
           { classes: klasses(*DAYS_OF_MONTH) }
         end
 
-        def calendar_day_classes(today: false, selected: false, outside: false)
+        def calendar_day_classes(outside: false)
           {
             classes: klasses(
               *DAY,
-              *(today    ? ["font-bold"] : []),
-              *(selected ? DAY_SELECTED : []),
-              *(outside  ? %w[text-(--sp-color-muted-fg) opacity-50] : [])
+              *(outside ? %w[text-(--sp-color-muted-fg) opacity-50] : [])
             )
           }
         end
@@ -74,10 +68,6 @@ module StimulusPlumbers
         def calendar_navigation_navigator_classes
           { classes: klasses(*NAV_BTN) }
         end
-
-        def calendar_navigation_navigator_icon_classes
-          { classes: klasses(*NAV_ICON) }
-        end
       end
     end
   end

data/lib/stimulus_plumbers/themes/tailwind/combobox.rb

@@ -7,8 +7,26 @@ module StimulusPlumbers
         TRIGGER = %w[
           w-full rounded-(--sp-radius-md) border border-(--sp-color-muted-fg)
           px-(--sp-space-3) py-(--sp-space-2)
-          text-(--sp-text-sm) text-(--sp-color-fg) bg-(--sp-color-bg)
+          text-(length:--sp-text-sm) text-(--sp-color-fg) bg-(--sp-color-bg)
           focus:outline-none focus:ring-2 focus:ring-(--sp-focus-ring-color)
+          [.sp-form-combobox_&]:border-0 [.sp-form-combobox_&]:rounded-none
+          [.sp-form-combobox_&]:px-0 [.sp-form-combobox_&]:py-0
+          [.sp-form-combobox_&]:bg-transparent [.sp-form-combobox_&]:shadow-none
+          [.sp-form-combobox_&]:focus:ring-0
+          [.sp-combobox-group_&]:border-0 [.sp-combobox-group_&]:rounded-none
+          [.sp-combobox-group_&]:px-0 [.sp-combobox-group_&]:py-0
+          [.sp-combobox-group_&]:bg-transparent [.sp-combobox-group_&]:shadow-none
+          [.sp-combobox-group_&]:focus:ring-0
+        ].freeze
+
+        TRIGGER_GROUP = %w[
+          flex items-center gap-(--sp-space-2) overflow-hidden
+          rounded-(--sp-radius-md) border border-(--sp-color-muted-fg) bg-(--sp-color-bg)
+          px-(--sp-space-3) py-(--sp-space-2)
+          focus-within:outline-none focus-within:ring-2 focus-within:ring-(--sp-focus-ring-color)
+          sp-combobox-group
+          [.sp-form-combobox_&]:border-0 [.sp-form-combobox_&]:rounded-none
+          [.sp-form-combobox_&]:focus-within:ring-0
         ].freeze
 
         LISTBOX = %w[
@@ -18,7 +36,7 @@ module StimulusPlumbers
         OPTION_BASE = %w[
           flex items-center gap-(--sp-space-2) w-full
           px-(--sp-space-2) py-(--sp-space-1)
-          rounded-(--sp-radius-sm) text-(--sp-text-sm)
+          rounded-(--sp-radius-sm) text-(length:--sp-text-sm)
           cursor-pointer select-none outline-none
           hover:bg-(--sp-color-muted) focus:bg-(--sp-color-muted)
         ].freeze
@@ -33,14 +51,14 @@ module StimulusPlumbers
 
         OPTION_GROUP = %w[py-(--sp-space-1)].freeze
 
-        AUTOCOMPLETE_LOADING = %w[
+        TYPEAHEAD_LOADING = %w[
           flex items-center justify-center
-          py-(--sp-space-2) text-(--sp-text-sm) text-(--sp-color-muted-fg)
+          py-(--sp-space-2) text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
         ].freeze
 
-        AUTOCOMPLETE_EMPTY = %w[
+        TYPEAHEAD_EMPTY = %w[
           flex items-center justify-center
-          py-(--sp-space-2) text-(--sp-text-sm) text-(--sp-color-muted-fg)
+          py-(--sp-space-2) text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
         ].freeze
 
         TIME = %w[flex gap-(--sp-space-2) overflow-hidden].freeze
@@ -51,6 +69,10 @@ module StimulusPlumbers
           { classes: klasses(*TRIGGER) }
         end
 
+        def combobox_trigger_group_classes
+          { classes: klasses(*TRIGGER_GROUP) }
+        end
+
         def combobox_listbox_classes
           { classes: klasses(*LISTBOX) }
         end
@@ -69,12 +91,12 @@ module StimulusPlumbers
           { classes: klasses(*OPTION_GROUP) }
         end
 
-        def combobox_autocomplete_loading_classes
-          { classes: klasses(*AUTOCOMPLETE_LOADING) }
+        def combobox_typeahead_loading_classes
+          { classes: klasses(*TYPEAHEAD_LOADING) }
         end
 
-        def combobox_autocomplete_empty_classes
-          { classes: klasses(*AUTOCOMPLETE_EMPTY) }
+        def combobox_typeahead_empty_classes
+          { classes: klasses(*TYPEAHEAD_EMPTY) }
         end
 
         def combobox_time_classes

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

@@ -5,32 +5,37 @@ module StimulusPlumbers
     module Tailwind
       module Form
         INPUT_BASE = %w[
-          w-full rounded-md border px-3 py-2 text-sm text-gray-900
-          bg-white 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-2 focus:ring-offset-0
+          [.sp-form-input-group_&]:border-0 [.sp-form-input-group_&]:rounded-none
+          [.sp-form-input-group_&]:bg-transparent [.sp-form-input-group_&]:shadow-none
+          [.sp-form-input-group_&]:focus:ring-0
         ].freeze
-        INPUT_ERROR   = %w[border-red-700 focus:ring-red-700].freeze
-        INPUT_DEFAULT = %w[border-gray-500 focus:ring-blue-700].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
 
-        GROUP_BASE    = %w[flex gap-1 mb-3].freeze
+        GROUP_BASE    = %w[flex gap-(--sp-space-1) mb-(--sp-space-3)].freeze
         GROUP_INLINE  = %w[flex-row items-center].freeze
 
-        LABEL         = %w[text-sm font-medium text-gray-900].freeze
-        REQUIRED_MARK = %w[text-red-700 ml-0.5].freeze
-        DETAILS       = %w[text-xs text-gray-600].freeze
-        ERROR_TEXT    = %w[text-xs text-red-700].freeze
-        CHECKBOX      = %w[size-4 rounded border-gray-500 text-blue-700].freeze
-        RADIO         = %w[size-4 border-gray-500 text-blue-700].freeze
+        LABEL         = %w[text-(length:--sp-text-sm) font-medium text-(--sp-color-fg)].freeze
+        REQUIRED_MARK = %w[text-(--sp-color-error) ml-(--sp-space-0-5)].freeze
+        DETAILS       = %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
+        CHECKBOX      = %w[size-(--sp-control-size) rounded border-(--sp-color-muted-fg) text-(--sp-color-primary)].freeze
+        RADIO         = %w[size-(--sp-control-size) border-(--sp-color-muted-fg) text-(--sp-color-primary)].freeze
 
-        INPUT_GROUP_BASE   = %w[flex items-center overflow-hidden rounded-md border].freeze
-        INPUT_GROUP_BORDER = { error: "border-red-700", default: "border-gray-500" }.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
 
         BUTTON_REVEAL = %w[
-          self-stretch border-0 bg-transparent px-3 cursor-pointer text-gray-600 hover:text-gray-900 text-sm
+          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)
         ].freeze
         BUTTON_CLEAR = %w[
-          self-stretch border-0 bg-transparent px-2 cursor-pointer text-gray-500 hover:text-gray-900 text-sm
+          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)
         ].freeze
-        SUBMIT_LINK = %w[cursor-pointer text-sm font-medium text-gray-900 hover:underline].freeze
+        SUBMIT_LINK = %w[cursor-pointer text-(length:--sp-text-sm) font-medium text-(--sp-color-fg) hover:underline].freeze
 
         private
 
@@ -78,20 +83,20 @@ module StimulusPlumbers
           { classes: klasses(*RADIO) }
         end
 
-        def form_input_group_classes(error: false)
+        def input_group_classes(error: false)
           { classes: klasses(*INPUT_GROUP_BASE, INPUT_GROUP_BORDER[error ? :error : :default]) }
         end
 
         def form_combobox_classes(error: false)
-          form_input_classes(error: error)
+          { classes: klasses(*INPUT_BASE, *(error ? INPUT_ERROR : INPUT_DEFAULT), "sp-form-combobox") }
         end
 
         def form_input_reveal_classes(**)
-          { classes: "" }
+          { classes: "sp-form-input-group" }
         end
 
-        def form_input_search_classes
-          { classes: "" }
+        def form_input_clearable_classes
+          { classes: "sp-form-input-group" }
         end
 
         def form_button_reveal_classes

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

@@ -1,14 +1,23 @@
 # frozen_string_literal: true
 
+require_relative "icons/heroicon"
+require_relative "icons/custom"
+require "stimulus_plumbers/themes/icons/registry"
+
 module StimulusPlumbers
   module Themes
     module Tailwind
       module Icon
-        ICONS = {
-          "arrow-left"  => { d: "M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" },
-          "arrow-right" => { d: "M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3" }
+        ALIASES = {
+          "close"    => "x-mark",
+          "calendar" => "calendar-days"
         }.freeze
 
+        ICONS = StimulusPlumbers::Themes::Icons::Registry.new(
+          sources: [Icons::Custom, Icons::Heroicon],
+          aliases: ALIASES
+        )
+
         def icons
           ICONS
         end
@@ -16,7 +25,7 @@ module StimulusPlumbers
         private
 
         def icon_classes
-          { classes: "" }
+          { classes: "size-(--sp-icon-default)" }
         end
       end
     end

data/lib/stimulus_plumbers/themes/tailwind/icons/custom.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+require "stimulus_plumbers/themes/icons/external"
+
+module StimulusPlumbers
+  module Themes
+    module Tailwind
+      module Icons
+        module Custom
+          include StimulusPlumbers::Themes::Icons::External
+          extend self
+
+          private
+
+          def svg_dir
+            @svg_dir ||= File.expand_path("customs", __dir__)
+          end
+
+          def svg_path(key)
+            File.join(svg_dir, "#{key}.svg")
+          end
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/themes/tailwind/icons/customs/spinner.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 101" fill="none" stroke="none">
+  <path fill="currentColor" opacity="0.25" d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"/>
+  <path fill="currentColor" d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicon.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+require "stimulus_plumbers/themes/icons/external"
+
+module StimulusPlumbers
+  module Themes
+    module Tailwind
+      module Icons
+        module Heroicon
+          include StimulusPlumbers::Themes::Icons::External
+          extend self
+
+          private
+
+          def svg_dir
+            @svg_dir ||= begin
+              require "heroicons"
+              File.join(Heroicons.root, "app/assets/images/heroicons")
+            rescue LoadError
+              File.expand_path("heroicons", __dir__)
+            end
+          end
+
+          def svg_defaults(key)
+            key.end_with?("/solid") ? { fill: "currentColor", stroke: "none" } : {}
+          end
+
+          def svg_path(key)
+            variant = key.end_with?("/solid") ? "solid" : "outline"
+            File.join(svg_dir, variant, "#{key.delete_suffix("/solid")}.svg")
+          end
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/academic-cap.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/adjustments-horizontal.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/adjustments-vertical.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M6 13.5V3.75m0 9.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 3.75V16.5m12-3V3.75m0 9.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 3.75V16.5m-6-9V3.75m0 3.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 9.75V10.5"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/archive-box-arrow-down.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5m8.25 3v6.75m0 0-3-3m3 3 3-3M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/archive-box-x-mark.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5m6 4.125 2.25 2.25m0 0 2.25 2.25M12 13.875l2.25-2.25M12 13.875l-2.25 2.25M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/archive-box.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-circle.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m9 12.75 3 3m0 0 3-3m-3 3v-7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-left.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m19.5 4.5-15 15m0 0h11.25m-11.25 0V8.25"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-on-square-stack.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 7.5h-.75A2.25 2.25 0 0 0 4.5 9.75v7.5a2.25 2.25 0 0 0 2.25 2.25h7.5a2.25 2.25 0 0 0 2.25-2.25v-7.5a2.25 2.25 0 0 0-2.25-2.25h-.75m-6 3.75 3 3m0 0 3-3m-3 3V1.5m6 9h.75a2.25 2.25 0 0 1 2.25 2.25v7.5a2.25 2.25 0 0 1-2.25 2.25h-7.5a2.25 2.25 0 0 1-2.25-2.25v-.75"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-on-square.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-right.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 4.5 15 15m0 0V8.25m0 11.25H8.25"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down-tray.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-down.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5 12 21m0 0-7.5-7.5M12 21V3"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-left-circle.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m11.25 9-3 3m0 0 3 3m-3-3h7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-left-end-on-rectangle.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75"/>
+</svg>

data/lib/stimulus_plumbers/themes/tailwind/icons/heroicons/outline/arrow-left-on-rectangle.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75"/>
+</svg>