fernandes-ui 0.1.4 → 0.1.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a5e204a6fcf76008dccc34ec8487f8b2bd80ba924a43aeecd59a44802d744ade
-  data.tar.gz: f470c5ab397812019513fdbb08d6c77166613f06be3e5f22ec801905b32860c7
+  metadata.gz: 0ab5b35505a4982cf54fe428f57b804589eb6ff88617cb32db0479457eba0372
+  data.tar.gz: 69136c3a3fbdace951ebdef92be717c6ba71548fdf4bc0ce354ff4333881248b
 SHA512:
-  metadata.gz: dfce0d35ccdb4fcc6a09108aef9eb7e197046a9c2bed89545cc5a979f7d7e870f593ba545f632cdf3021557a726f4c1d7d726a0cf08a31f51a9896c376a35fa8
-  data.tar.gz: 22dee7451abe1a42880c98ec161c33e5baf43b264ded6399e8d3c5a24c6f55d9a0bf7355ff684e5c90a4121924babcc6f39dac98a5c48788e00624c413125ca8
+  metadata.gz: 3ae95aa7368c39e640f7b079b1500f76a2088d8306914d33c0b32ae540225b1b1ca8015b3902f58c5019ec1ec5ca281d9ebe79de4a308149a67ea2576a7664ba
+  data.tar.gz: d0853a4b120da156420eb3edcac3e9e26e0a09b31299074342df5c3ca00cc451993c7a0d661bf9f74bcd0add7922f7eed60126328f6490f32d5e47c23eecc841

data/app/behaviors/ui/button_behavior.rb

@@ -66,7 +66,7 @@ module UI::ButtonBehavior
 
   # Base classes applied to all buttons
   def button_base_classes
-    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive has-[>svg]:px-3"
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-[var(--radius,0.5rem)] text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive has-[>svg]:px-3"
   end
 
   # Variant-specific classes based on @variant
@@ -77,7 +77,7 @@ module UI::ButtonBehavior
     when "destructive"
       "bg-destructive text-destructive-foreground hover:bg-destructive/90 text-white"
     when "outline"
-      "!border !border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:hover:bg-input/50"
+      "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:hover:bg-input/50"
     when "secondary"
       "bg-secondary text-secondary-foreground hover:bg-secondary/80"
     when "ghost"
@@ -90,8 +90,10 @@ module UI::ButtonBehavior
   end
 
   # Size-specific classes based on @size
+  # Normalizes size to handle both :icon_sm (underscore) and "icon-sm" (hyphen) formats
   def button_size_classes
-    case @size.to_s
+    normalized_size = @size.to_s.tr("-", "_")
+    case normalized_size
     when "default"
       "h-9 px-4 py-2"
     when "sm"
@@ -100,9 +102,9 @@ module UI::ButtonBehavior
       "h-10 px-8"
     when "icon"
       "h-9 w-9"
-    when "icon-sm"
+    when "icon_sm"
       "h-8 w-8"
-    when "icon-lg"
+    when "icon_lg"
       "h-10 w-10"
     else
       "h-9 px-4 py-2"

data/app/behaviors/ui/button_group_behavior.rb

@@ -42,14 +42,16 @@ module UI::ButtonGroupBehavior
 
   # Orientation-specific classes based on @orientation
   # Matches shadcn/ui v4 exactly
-  # Note: We exclude [role=menu] elements from border-radius rules (dropdown content)
+  # Note: We exclude [role=menu], nested [data-slot=button-group], and [data-state] (popover/tooltip content) elements from border-radius rules
+  # Note: We use !important on border-radius rules to override button's shorthand `rounded-[var(--radius)]`
+  # Note: We use :has(+[data-state]) to exclude elements followed by popover/tooltip content from rounded-r-none
   def button_group_orientation_classes
     case @orientation.to_s
     when "vertical"
-      "flex-col [&>*:not(:first-child):not([role=menu])]:rounded-t-none [&>*:not(:first-child):not([role=menu])]:border-t-0 [&>*:not(:last-child):not([role=menu])]:rounded-b-none"
+      "flex-col [&>*:not(:first-child):not([role=menu]):not([data-slot=button-group]):not([data-state])]:!rounded-t-none [&>*:not(:first-child):not([role=menu]):not([data-slot=button-group]):not([data-state])]:border-t-0 [&>*:not(:last-child):not(:has(+[data-state])):not([role=menu]):not([data-slot=button-group]):not([data-state])]:!rounded-b-none"
     else # horizontal (default)
-      "[&>*:not(:first-child):not([role=menu])]:rounded-l-none [&>*:not(:first-child):not([role=menu])]:border-l-0 " \
-      "[&>*:not(:last-child):not(:has(+[role=menu])):not([role=menu])]:rounded-r-none"
+      "[&>*:not(:first-child):not([role=menu]):not([data-slot=button-group]):not([data-state])]:!rounded-l-none [&>*:not(:first-child):not([role=menu]):not([data-slot=button-group]):not([data-state])]:border-l-0 " \
+      "[&>*:not(:last-child):not(:has(+[role=menu])):not(:has(+[data-state])):not([role=menu]):not([data-slot=button-group]):not([data-state])]:!rounded-r-none"
     end
   end
 end

data/app/behaviors/ui/input_group_button_behavior.rb

@@ -73,15 +73,17 @@ module UI::InputGroupButtonBehavior
 
   # Size-specific classes
   # Uses calc(var(--radius, 0.375rem) - 5px) to create slightly smaller rounded corners for nested buttons
+  # Normalizes size to handle both :icon_xs (underscore) and "icon-xs" (hyphen) formats
   def input_group_button_size_classes
-    case @size.to_s
+    normalized_size = @size.to_s.tr("-", "_")
+    case normalized_size
     when "xs"
       "h-6 gap-1 px-2 rounded-[calc(var(--radius,0.375rem)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2"
     when "sm"
       "h-8 px-2.5 gap-1.5 rounded-[calc(var(--radius,0.375rem)-5px)] has-[>svg]:px-2.5"
-    when "icon-xs"
+    when "icon_xs"
       "size-6 rounded-[calc(var(--radius,0.375rem)-5px)] p-0 has-[>svg]:p-0"
-    when "icon-sm"
+    when "icon_sm"
       "size-8 rounded-[calc(var(--radius,0.375rem)-5px)] p-0 has-[>svg]:p-0"
     else
       "h-6 gap-1 px-2 rounded-[calc(var(--radius,0.375rem)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2"

data/app/views/ui/_item.html.erb

@@ -1,9 +1,14 @@
 <% extend UI::ItemBehavior -%>
 <% @variant = local_assigns.fetch(:variant, "default") -%>
 <% @size = local_assigns.fetch(:size, "default") -%>
+<% @as_child = local_assigns.fetch(:as_child, false) -%>
 <% @classes = local_assigns.fetch(:classes, "") -%>
-<% @attributes = local_assigns.except(:variant, :size, :classes) -%>
+<% @attributes = local_assigns.except(:variant, :size, :as_child, :classes) -%>
 <% attrs = item_html_attributes.merge(@attributes) -%>
+<% if @as_child -%>
+<%= yield(attrs) %>
+<% else -%>
 <div class="<%= attrs[:class] %>" data-slot="<%= attrs[:"data-slot"] %>" data-variant="<%= attrs[:"data-variant"] %>" data-size="<%= attrs[:"data-size"] %>">
   <%= yield %>
 </div>
+<% end -%>

data/app/views/ui/field/_label.html.erb

@@ -1,6 +1,7 @@
 <%# FieldLabel Component - Label styled for form fields %>
 <%
   content ||= local_assigns.fetch(:content, nil)
+  @for_id = local_assigns.fetch(:for_id, nil)
   @classes = local_assigns.fetch(:classes, "")
   @attributes = local_assigns.fetch(:attributes, {})
 
@@ -10,6 +11,6 @@
   # Get HTML attributes from behavior
   all_attributes = field_label_html_attributes.deep_merge(@attributes)
 -%>
-<%= content_tag :div, all_attributes do %>
+<%= content_tag :label, all_attributes do %>
   <%= content || yield %>
 <% end %>

data/app/views/ui/field/_separator.html.erb

@@ -9,7 +9,13 @@
 
   # Get HTML attributes from behavior
   all_attributes = field_separator_html_attributes.deep_merge(@attributes)
+  has_children = content.present? || block_given?
 -%>
 <%= content_tag :div, all_attributes do %>
-  <%= content || yield %>
+  <%= render "ui/separator", classes: "absolute inset-0 top-1/2" %>
+  <% if has_children %>
+    <span data-slot="field-separator-content" class="bg-background text-muted-foreground relative mx-auto block w-fit px-2">
+      <%= content || yield %>
+    </span>
+  <% end %>
 <% end %>

data/lib/ui/version.rb

@@ -1,3 +1,3 @@
 module UI
-  VERSION = "0.1.4"
+  VERSION = "0.1.5"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: fernandes-ui
 version: !ruby/object:Gem::Version
-  version: 0.1.4
+  version: 0.1.5
 platform: ruby
 authors:
 - Celso Fernandes