baldur 0.1.1

data/app/helpers/baldur/ui_helper_forms.rb

@@ -0,0 +1,230 @@
+module Baldur
+  module UiHelperForms
+    def ui_text_field_tag(name, value = nil, label: nil, supporting_text: nil, placeholder: nil, type: :text, required: false, disabled: false, wrapper_class: nil, input_class: nil, input_options: {}, multiline: false, prefix: nil, suffix: nil, &block)
+      options = (input_options || {}).deep_dup
+      input_id = options[:id].presence || "ui-text-field-#{SecureRandom.hex(3)}"
+      field_classes = [ "field", "text-field", ("is-disabled" if disabled), wrapper_class ].compact.join(" ")
+      control_classes = [ "text-field__control", input_class, options[:class] ].compact.join(" ")
+      support_id = "#{input_id}-support"
+
+      options[:id] = input_id
+      options[:class] = control_classes
+      options[:placeholder] = placeholder if placeholder.present?
+      options[:required] = true if required
+      options[:disabled] = true if disabled
+      options[:type] = type unless multiline
+      options[:name] = name
+      options[:value] = value unless value.nil? || multiline
+      aria = options[:aria].presence || {}
+      aria[:describedby] = [ aria[:describedby], support_id ].compact.join(" ").presence
+      options[:aria] = aria if aria.present?
+
+      baldur_render "baldur/components/text_field",
+             wrapper_classes: field_classes,
+             label: label,
+             supporting_text: supporting_text,
+             input_options: options,
+             input_value: multiline ? value.to_s : nil,
+             multiline: multiline,
+             prefix: prefix,
+             suffix: suffix,
+             support_id: support_id,
+             supporting_slot: block_given? ? capture(&block) : nil
+    end
+
+    def ui_date_field_tag(name, value = nil, label: nil, supporting_text: nil, placeholder: "YYYY-MM-DD", required: false, disabled: false, wrapper_class: nil, input_class: nil, input_options: {}, native_input_options: {}, toggle_label: "Open date picker", icon_name: "calendar", min_date: nil, max_date: nil)
+      display_options = (input_options || {}).deep_dup
+      native_options = (native_input_options || {}).deep_dup
+      input_id = display_options[:id].presence || "ui-date-field-#{SecureRandom.hex(3)}"
+      support_id = "#{input_id}-support"
+      wrapper_classes = [ "field", "date-field", wrapper_class ].compact.join(" ")
+
+      parsed_date = case value
+      when Date
+                      value
+      when Time, DateTime, ActiveSupport::TimeWithZone
+                      value.to_date
+      when String
+                      begin
+                        Date.iso8601(value)
+                      rescue ArgumentError
+                        begin
+                          Date.parse(value)
+                        rescue ArgumentError
+                          nil
+                        end
+                      end
+      else
+                      value.respond_to?(:to_date) ? value.to_date : nil
+      end
+      iso_value = parsed_date&.strftime("%Y-%m-%d")
+      native_id = native_options[:id].presence || "#{input_id}-native"
+
+      display_value = if display_options.key?(:value)
+                        display_options[:value]
+      else
+                        iso_value.presence || value.to_s.presence
+      end
+
+      display_options[:id] = input_id
+      display_options[:class] = [ "text-field__control", "date-field__display", input_class, display_options[:class] ].compact.join(" ")
+      display_options[:type] ||= "text"
+      display_options[:name] ||= name
+      display_options[:placeholder] ||= placeholder if placeholder.present?
+      display_options[:required] = true if required
+      display_options[:disabled] = true if disabled
+      display_options[:autocomplete] ||= "off"
+      display_options[:value] = display_value if display_value.present? && !display_options.key?(:value)
+
+      display_data = (display_options[:data] || {}).dup
+      display_data[:date_field_display] = true
+      display_data[:date_field_target] ||= "display"
+      display_data[:date_field_native_target] ||= native_id
+      display_data[:field_label] ||= label if label.present?
+      display_options[:data] = display_data
+
+      aria = display_options[:aria].presence || {}
+      describedby = [ aria[:describedby], support_id ].compact.join(" ").presence
+      aria[:describedby] = describedby if describedby.present?
+      display_options[:aria] = aria if aria.present?
+
+      native_options[:id] = native_id
+      native_options[:class] = [ "date-field__native", native_options[:class] ].compact.join(" ")
+      native_options[:type] ||= "date"
+      native_options.delete(:name) if native_options[:name].blank?
+      native_options[:value] = iso_value if iso_value.present? && !native_options.key?(:value)
+      native_options[:required] = true if required
+      native_options[:disabled] = true if disabled
+      native_options[:tabindex] ||= "-1"
+      native_options[:autocomplete] ||= "off"
+      native_options[:style] ||= "position:absolute; inset:auto; width:1px; height:1px; opacity:0; pointer-events:none;"
+
+      if min_date.present?
+        min_date_value = case min_date
+        when Date, Time, DateTime, ActiveSupport::TimeWithZone
+                           min_date.strftime("%Y-%m-%d")
+        when String
+                           min_date
+        end
+        native_options[:min] = min_date_value if min_date_value.present?
+      end
+
+      if max_date.present?
+        max_date_value = case max_date
+        when Date, Time, DateTime, ActiveSupport::TimeWithZone
+                           max_date.strftime("%Y-%m-%d")
+        when String
+                           max_date
+        end
+        native_options[:max] = max_date_value if max_date_value.present?
+      end
+
+      native_data = (native_options[:data] || {}).dup
+      native_data[:date_field_native] = true
+      native_data[:date_field_target] ||= "native"
+      native_data[:date_field_name] ||= name
+      native_data[:date_field_display_target] ||= input_id
+      native_options[:data] = native_data
+
+      native_aria = native_options[:aria].presence || {}
+      native_aria[:hidden] = "true"
+      native_aria[:label] ||= label if label.present?
+      native_options[:aria] = native_aria if native_aria.present?
+
+      baldur_render "baldur/components/date_field",
+             wrapper_classes: wrapper_classes,
+             label: label,
+             supporting_text: supporting_text,
+             display_input_options: display_options,
+             native_input_options: native_options,
+             toggle_label: toggle_label,
+             icon_name: icon_name,
+             support_id: support_id
+    end
+
+    def ui_mobile_field_tag(name, value = nil, label: "Mobile", placeholder: "10-digit mobile number", country_code: "+91", required: false, disabled: false, wrapper_class: nil, input_class: nil, input_options: {})
+      normalized_value = value.to_s.gsub(/\D+/, "").slice(0, 10)
+      merged_input_options = (input_options || {}).deep_dup
+      merged_input_options[:data] = (merged_input_options[:data] || {}).merge(
+        mobile_input: true,
+        mobile_country_code: country_code
+      )
+      merged_input_options[:inputmode] ||= "numeric"
+      merged_input_options[:pattern] ||= "\\d*"
+      merged_input_options[:autocomplete] ||= "tel"
+      merged_wrapper_class = [ wrapper_class, "field--mobile" ].compact.join(" ")
+
+      ui_text_field_tag(
+        name,
+        normalized_value,
+        label: label,
+        placeholder: placeholder,
+        type: :tel,
+        required: required,
+        disabled: disabled,
+        wrapper_class: merged_wrapper_class,
+        input_class: input_class,
+        input_options: merged_input_options,
+        prefix: country_code
+      )
+    end
+
+    def ui_menu_select_tag(name, options:, selected: nil, placeholder: "Select an option", label: nil, supporting_text: nil, wrapper_class: nil, data: nil, input_data: nil, disabled: false)
+      normalized = options.map do |option|
+        case option
+        when Hash
+          option.symbolize_keys
+        when Array
+          value, label_text, meta = option
+          details = meta.is_a?(Hash) ? meta.symbolize_keys : {}
+          { value: value, label: label_text }.merge(details)
+        else
+          { value: option, label: option }
+        end
+      end
+
+      normalized.each do |option|
+        option[:value] = option[:value].to_s
+        option[:label] = option[:label].to_s
+        option[:disabled] = !!option[:disabled] if option.key?(:disabled)
+        option[:disabled] ||= option[:available] == false if option.key?(:available)
+        option[:badge] = option[:badge].to_s if option[:badge]
+        option[:badge_variant] = option[:badge_variant].to_sym if option[:badge_variant]
+        option[:badge_size] = option[:badge_size].to_sym if option[:badge_size]
+        option[:support] = option[:support].to_s if option[:support]
+        option[:description] = option[:description].to_s if option[:description]
+      end
+
+      selected_value = selected.present? ? selected.to_s : nil
+      selected_option = normalized.find { |opt| opt[:value] == selected_value } if selected_value
+      unless selected_option || placeholder.present?
+        selected_option = normalized.find { |opt| !opt[:disabled] }
+        selected_value = selected_option&.dig(:value)
+      end
+      button_label = selected_option&.dig(:label) || placeholder
+
+      field_id = "ui-menu-select-#{SecureRandom.hex(4)}"
+      auto_width_class = menu_select_explicit_width?(wrapper_class) ? nil : "field--select-auto"
+      wrapper_classes = [ "field", "field--select", auto_width_class, wrapper_class ].compact.join(" ")
+
+      baldur_render "baldur/components/menu_select",
+             name: name,
+             field_id: field_id,
+             wrapper_classes: wrapper_classes,
+             wrapper_data: data,
+             label: label,
+             supporting_text: supporting_text,
+             selected_value: selected_value,
+             button_label: button_label,
+             options: normalized,
+             input_data: input_data,
+             disabled: disabled
+    end
+
+    private
+
+    def menu_select_explicit_width?(wrapper_class)
+      wrapper_class.to_s.match?(/(^|\s)(?:[a-z0-9_-]+:)*(?:w|min-w|max-w)-\S+/)
+    end
+  end
+end

data/app/helpers/baldur/ui_helper_unavailable.rb

@@ -0,0 +1,98 @@
+module Baldur
+  module UiHelperUnavailable
+    def ui_unavailable_metric(reason: nil, dependencies: nil, warning_keys: nil, text: "Not available", text_class: "text-xs text-muted")
+      content_tag(:span, class: "inline-flex items-center gap-1 whitespace-nowrap align-middle") do
+        safe_join(
+          [
+            content_tag(:span, text, class: text_class),
+            ui_tooltip(
+              text: "Why unavailable",
+              content: ui_unavailable_explanation_content(reason: reason, dependencies: dependencies, warning_keys: warning_keys),
+              icon: "info",
+              variant: :icon,
+              inline: true
+            )
+          ]
+        )
+      end
+    end
+
+    def ui_unavailable_explanation_content(reason:, dependencies:, warning_keys: nil)
+      resolved_dependencies = ui_unavailable_dependencies(dependencies: dependencies, warning_keys: warning_keys)
+      groups = ui_unavailable_dependency_groups(resolved_dependencies)
+      return ui_unavailable_explanation_sections(reason: reason, groups: groups) if reason.present? || groups.present?
+
+      Baldur.config.unavailable_fallback_message
+    end
+
+    def ui_unavailable_dependencies(dependencies:, warning_keys: nil)
+      explicit_dependencies = Array(dependencies).compact
+      return explicit_dependencies if explicit_dependencies.present?
+
+      Array(Baldur.config.warning_dependency_resolver.call(warning_keys))
+    end
+
+    def ui_unavailable_dependency_groups(dependencies)
+      grouped = {}
+      order = []
+
+      Array(dependencies).each do |dependency|
+        dep = dependency.respond_to?(:with_indifferent_access) ? dependency.with_indifferent_access : dependency
+        dataset_key = dep[:dataset_key]
+        field_key = dep[:field_key]
+        snapshot_metric = dep[:snapshot_metric]
+        next if dataset_key.blank? && field_key.blank? && snapshot_metric.blank?
+
+        group_key = dataset_key.presence || "__no_dataset__"
+        unless grouped.key?(group_key)
+          grouped[group_key] = {
+            dataset_key: dataset_key.presence,
+            fields: [],
+            metrics: []
+          }
+          order << group_key
+        end
+
+        group = grouped[group_key]
+        group[:fields] << field_key if field_key.present? && !group[:fields].include?(field_key)
+        group[:metrics] << snapshot_metric if snapshot_metric.present? && !group[:metrics].include?(snapshot_metric)
+      end
+
+      order.filter_map do |group_key|
+        group = grouped[group_key]
+        details = []
+        details << group[:fields].join(", ") if group[:fields].present?
+        details << "snapshot metric: #{group[:metrics].join(', ')}" if group[:metrics].present?
+        next if group[:dataset_key].blank? && details.blank?
+
+        {
+          dataset_label: (ui_dependency_dataset_name(group[:dataset_key]) if group[:dataset_key].present?),
+          details: details.join(" | ")
+        }
+      end
+    end
+
+    def ui_unavailable_dependency_group_content(groups)
+      lines = groups.map do |group|
+        line = if group[:dataset_label].present? && group[:details].present?
+          "• #{group[:dataset_label]} › #{group[:details]}"
+        else
+          "• #{group[:dataset_label].presence || group[:details]}"
+        end
+        content_tag(:span, line, class: "block text-left")
+      end
+      safe_join([ content_tag(:span, "Upload/refresh:", class: "block text-left"), *lines ])
+    end
+
+    def ui_unavailable_explanation_sections(reason:, groups:)
+      parts = []
+      parts << content_tag(:span, reason, class: "block text-left") if reason.present?
+      parts << ui_unavailable_dependency_group_content(groups) if groups.present?
+      safe_join(parts)
+    end
+
+    def ui_dependency_dataset_name(dataset_key)
+      Baldur.config.dependency_dataset_name_resolver.call(dataset_key)
+    end
+  end
+end

data/app/views/baldur/components/_accordion.html.erb

@@ -0,0 +1,30 @@
+<%
+  open = !!local_assigns[:open]
+  accordion_id = local_assigns[:id] || "accordion-#{SecureRandom.hex(4)}"
+  summary_class = local_assigns[:summary_class] || "cursor-pointer text-base font-semibold text-on-surface flex items-center gap-2"
+  body_class = ["pt-4 pb-4 space-y-4", local_assigns[:body_class]].compact.join(" ")
+  wrapper_class = [local_assigns[:class]].compact.join(" ")
+%>
+<div class="<%= wrapper_class %>" data-controller="accordion">
+  <div data-accordion-target="item" data-open="<%= open %>">
+    <button
+      type="button"
+      class="<%= [summary_class, "w-full text-left"].compact.join(" ") %>"
+      data-action="click->accordion#toggle"
+      aria-expanded="<%= open ? "true" : "false" %>"
+      aria-controls="<%= accordion_id %>"
+    >
+      <span aria-hidden="true" data-accordion-target="icon"><%= ui_icon("chevron-right", class_name: "h-[18px] w-[18px]") %></span>
+      <span><%= local_assigns[:title] %></span>
+    </button>
+    <div
+      id="<%= accordion_id %>"
+      data-accordion-target="content"
+      aria-hidden="<%= open ? "false" : "true" %>"
+    >
+      <div class="<%= body_class %>">
+        <%= local_assigns[:body].presence || yield %>
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/baldur/components/_action_row.html.erb

@@ -0,0 +1,6 @@
+<%
+  row_classes = ["flex flex-col gap-2 sm:flex-row sm:justify-end", local_assigns[:class]].compact.join(" ")
+%>
+<div class="<%= row_classes %>">
+  <%= safe_join(Array(buttons).map { |button_options| ui_button(**button_options.symbolize_keys) }) %>
+</div>

data/app/views/baldur/components/_alert.html.erb

@@ -0,0 +1,61 @@
+<%
+  variant = (variant || :notice).to_sym
+  collapsible = !!local_assigns[:collapsible]
+  collapsed = !!local_assigns[:collapsed]
+  icon_map = {
+    notice: "info",
+    success: "check-circle",
+    warning: "triangle-alert",
+    error: "circle-alert"
+  }
+  icon_content = icon.presence || icon_map[variant] || "info"
+  classes = ["alert", "alert--#{variant}", ("alert--collapsed" if collapsed), class_name].compact.join(" ")
+  data_attributes = {}
+  if collapsible
+    data_attributes[:controller] = "alert"
+    data_attributes[:alert_collapsed_value] = collapsed
+    data_attributes[:alert_storage_key_value] = local_assigns[:collapse_storage_key] if local_assigns[:collapse_storage_key].present?
+  end
+%>
+<%= content_tag :div, class: classes, data: data_attributes do %>
+  <div class="alert__icon">
+    <%= ui_icon(icon_content, class_name: "h-6 w-6") %>
+  </div>
+  <div class="alert__body">
+    <% if title.present? %>
+      <p class="alert__title"><%= title %></p>
+    <% end %>
+    <% if body.present? %>
+      <div
+        class="<%= ["alert__details", ("alert__details--collapsed" if collapsed)].compact.join(" ") %>"
+        data-alert-target="details"
+        aria-hidden="<%= collapsed %>">
+        <div class="alert__content">
+          <%= body %>
+        </div>
+      </div>
+    <% end %>
+  </div>
+  <% if actions.present? || collapsible %>
+    <div class="alert__rail">
+      <% if actions.present? %>
+        <div class="alert__actions" data-alert-target="actions" <%= "hidden" if collapsed %>>
+          <%= actions %>
+        </div>
+      <% end %>
+      <% if collapsible %>
+        <div class="alert__summary-action" data-alert-target="expandButton" <%= "hidden" unless collapsed %>>
+          <%= ui_button(
+                label: local_assigns[:collapsed_summary_action_label].presence || "More",
+                variant: :text,
+                size: :sm,
+                type: :button,
+                class: "alert__toggle",
+                data: { action: "alert#expand" },
+                aria: { expanded: (!collapsed).to_s }
+              ) %>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
+<% end %>

data/app/views/baldur/components/_badge.html.erb

@@ -0,0 +1,25 @@
+<%
+  sizes = {
+    xs: "chip--xs",
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  }
+  variants = {
+    default: nil,
+    success: "chip--success",
+    warn: "chip--warn",
+    danger: "chip--danger",
+    disabled: "chip--disabled",
+    outline: nil,
+    accent: "chip--primary"
+  }
+  badge_classes = [
+    "chip",
+    sizes[size || :sm],
+    variants[variant || :default]
+  ].compact.join(" ")
+  html_options = local_assigns[:html_options] ? local_assigns[:html_options].dup : {}
+  html_options[:class] = [ badge_classes, html_options[:class] ].compact.join(" ")
+%>
+<%= content_tag(:span, text, html_options) %>

data/app/views/baldur/components/_button.html.erb

@@ -0,0 +1,81 @@
+<%
+  label = local_assigns[:label]
+  variant = (local_assigns[:variant] || :primary).to_sym
+  size = (local_assigns[:size] || :md).to_sym
+  href = local_assigns[:href]
+  method = local_assigns[:method].presence&.to_s&.downcase
+  non_get_method = method.present? && method != "get"
+  icon = local_assigns[:icon]
+  variant_classes = {
+    primary: "button button--filled",
+    filled: "button button--filled",
+    tonal: "button button--tonal",
+    secondary: "button button--tonal",
+    danger_tonal: "button button--tonal-error",
+    accent: "button button--tertiary",
+    outline: "button button--outlined",
+    text: "button button--text",
+    ghost: "button button--text",
+    danger: "button button--error",
+    elevated: "button button--elevated"
+  }
+  size_classes = {
+    xs: "button--sm",
+    sm: "button--sm",
+    md: nil,
+    lg: "button--lg"
+  }
+  width_class = local_assigns[:block] ? "button--block" : nil
+  classes = [
+    variant_classes[variant] || variant_classes[:primary],
+    size_classes[size],
+    width_class,
+    local_assigns[:class]
+  ].compact.join(" ")
+  content = capture do
+    if icon.present?
+      icon_markup = icon.to_s.include?("<") ? icon : ui_icon(icon, class_name: "h-4 w-4")
+      concat content_tag(:span, icon_markup, class: "inline-flex items-center", aria: { hidden: true })
+    end
+    concat content_tag(:span, label || "Action")
+  end
+%>
+<% disabled = !!local_assigns[:disabled] %>
+
+<% if href.present? %>
+  <% if non_get_method %>
+    <%= button_to href,
+                  method: method.to_sym,
+                  class: classes,
+                  data: local_assigns[:data],
+                  disabled: disabled,
+                  params: local_assigns[:params],
+                  form_class: ["inline-block", local_assigns[:form_class]].compact.join(" ") do %>
+      <%= content %>
+    <% end %>
+  <% else %>
+    <%
+      safe_rel = local_assigns[:rel]
+      if local_assigns[:target] == "_blank"
+        safe_rel = [safe_rel, "noopener noreferrer"].compact.join(" ").strip
+      end
+    %>
+    <%= link_to href,
+                class: classes,
+                data: local_assigns[:data],
+                aria: local_assigns[:aria],
+                target: local_assigns[:target],
+                rel: safe_rel.presence do %>
+      <%= content %>
+    <% end %>
+  <% end %>
+<% else %>
+  <%= button_tag type: local_assigns[:type] || "button",
+                 class: classes,
+                 data: local_assigns[:data],
+                 aria: local_assigns[:aria],
+                 form: local_assigns[:form],
+                 disabled: disabled do %>
+    <%= content %>
+  <% end %>
+<% end %>

data/app/views/baldur/components/_card.html.erb

@@ -0,0 +1,40 @@
+<%
+  variant_name = (variant || :default).to_sym
+  base_classes = "card"
+  variant_classes = {
+    default: nil,
+    accent: "card--primary",
+    surface: "card--surface",
+    danger: "card--attention"
+  }
+  card_classes = [base_classes, variant_classes[variant_name] || variant_classes[:default], local_assigns[:class]].compact.join(" ")
+  actions_content = if actions.respond_to?(:call)
+                      capture(&actions)
+                    else
+                      actions
+                    end
+  body_classes = ["mt-4", body_class].compact.join(" ")
+%>
+<article class="<%= card_classes %>">
+  <div class="flex flex-col gap-3">
+    <div class="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
+      <div>
+        <% if badge.present? %>
+          <p class="text-xs font-semibold uppercase tracking-wide text-[color:var(--color-primary)]"><%= badge %></p>
+        <% end %>
+        <% if title.present? %>
+          <h2 class="text-lg font-semibold text-[color:var(--color-on-surface)]"><%= title %></h2>
+        <% end %>
+        <% if description.present? %>
+          <p class="text-sm text-[color:color-mix(in srgb,var(--color-on-surface) 75%,transparent)]"><%= description %></p>
+        <% end %>
+      </div>
+      <% if actions_content.present? %>
+        <div class="flex flex-wrap gap-2"><%= actions_content %></div>
+      <% end %>
+    </div>
+    <% if body.present? %>
+      <div class="<%= body_classes %>"><%= body %></div>
+    <% end %>
+  </div>
+</article>

data/app/views/baldur/components/_chart_card.html.erb

@@ -0,0 +1,42 @@
+<%
+  actions_content = if actions.respond_to?(:call)
+                      capture(&actions)
+                    else
+                      actions
+                    end
+  footer_content = if footer.respond_to?(:call)
+                     capture(&footer)
+                   else
+                     footer
+                   end
+  card_classes = ["chart-card", local_assigns[:class]].compact.join(" ")
+%>
+<section class="<%= card_classes %>">
+  <% if title.present? || description.present? || actions_content.present? %>
+    <div class="chart-card__header">
+      <div>
+        <% if title.present? %>
+          <h3 class="text-lg font-semibold text-[color:var(--color-on-surface)]"><%= title %></h3>
+        <% end %>
+        <% if description.present? %>
+          <p class="text-sm text-muted"><%= description %></p>
+        <% end %>
+      </div>
+      <% if actions_content.present? %>
+        <div class="flex flex-wrap items-center gap-2">
+          <%= actions_content %>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
+
+  <div class="chart-card__body">
+    <%= body %>
+  </div>
+
+  <% if footer_content.present? %>
+    <div class="chart-card__footer">
+      <%= footer_content %>
+    </div>
+  <% end %>
+</section>

data/app/views/baldur/components/_checkbox.html.erb

@@ -0,0 +1,27 @@
+<%
+  input_id = id.presence || [name, value].compact.join("_").to_s.parameterize(separator: "_")
+  wrapper_classes = ["checkbox", ("is-disabled" if disabled), wrapper_class].compact.join(" ")
+  native_classes = ["checkbox__native", input_class].compact.join(" ")
+
+  body_fragments = []
+  if label.present?
+    body_fragments << content_tag(:span, label, class: "checkbox__label")
+  end
+  if description.present?
+    body_fragments << content_tag(:span, description, class: "checkbox__description")
+  end
+  body_fragments << body if body.present?
+  body_content = safe_join(body_fragments) if body_fragments.any?
+%>
+
+<label class="<%= wrapper_classes %>">
+  <span class="checkbox__control">
+    <%= check_box_tag name, value, checked, id: input_id, required: required, disabled: disabled, data: data, aria: aria, form: form, class: native_classes %>
+    <span class="checkbox__box" aria-hidden="true">
+      <span class="checkbox__check"><%= ui_icon("check", class_name: "h-4 w-4") %></span>
+    </span>
+  </span>
+  <% if body_content.present? %>
+    <span class="checkbox__body"><%= body_content %></span>
+  <% end %>
+</label>