fox_tail 0.1.0 → 0.1.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6fa160d3775e0297eee79f1c0378e6388ba468d90993e4c07f72ce6b2844088b
-  data.tar.gz: 497c59c7a8198c90231b5ca3dc37e651f57dd41d13fb89aa64dac9d5e6ffa4c3
+  metadata.gz: f20728d2c996fb0a45ee4b0a84077dceb7655cf55574b9c202a365c56458b21f
+  data.tar.gz: 5fa861761ba7666416ffcf68d285fdab1e8c6ca07df018464347aa9baff6540c
 SHA512:
-  metadata.gz: 20ca963b2ad4fbea94eac861ae42ff5e40705f11f804a6554db25d59f8d589e986299901aaafcabeed044d8c7a1db7b4330ea768e406f9fe231442bfcbed5794
-  data.tar.gz: f9383331cdc86d121d1edc3fc4ade66b040a84cae6a243d94d9f7b5a1ab4b88281b01aa3f8212306f2e02486f5ac915acde9733108bfee92dde9b956c1aef388
+  metadata.gz: 43ceccf17c6a3a9acb833c4862238c24bb3c1c517bee8865d272c4dff4fe22a6917aa75dcea0f55a559e402c0826a9ce63badc5593ff5cc146b474876d61e626
+  data.tar.gz: 469e328834ba309334daceae9640898cd8077909b7da314a3e62c9887f79dfe47113ed0a51bd47289bc8d444b8acbb61a91c3f4e54c3164386b6cae632651bba

data/app/components/fox_tail/alert_component.rb

@@ -6,9 +6,15 @@ class FoxTail::AlertComponent < FoxTail::DismissibleComponent
 
   attr_reader :id
 
-  renders_one :header, lambda { |options = {}, &block|
+  renders_one :header, lambda { |text_or_options = {}, options = {}, &block|
+    if block
+      options = text_or_options
+      text_or_options = nil
+    end
+
+    text_or_options ||= capture(&block)
     options[:class] = classnames theme.apply(:header, self), options[:class]
-    content_tag(:h3, options, &block)
+    content_tag :h3, text_or_options, options
   }
 
   renders_one :icon, lambda { |options = {}|
@@ -24,6 +30,7 @@ class FoxTail::AlertComponent < FoxTail::DismissibleComponent
     icon_options[:class] = theme.apply "dismiss.icon", self
     dismiss_actions! options
     options[:class] = classnames theme.apply("dismiss.button", self), options[:class]
+    options[:type] = :button
 
     content_tag :button, options do
       concat render(FoxTail::IconBaseComponent.new(icon_options[:icon], icon_options.except(:icon)))

data/app/components/fox_tail/button_base_component.rb

@@ -3,6 +3,28 @@
 class FoxTail::ButtonBaseComponent < FoxTail::ClickableComponent
   include FoxTail::Concerns::Formable
 
+  renders_one :indicator, types: {
+    dot: {
+      as: :dot_indicator,
+      renders: lambda { |options = {}|
+        styling_options = options.extract!(:position).reverse_merge(position: :top_right)
+        options[:size] ||= :sm
+        options[:class] = classnames theme.apply(:indicator, self, styling_options), options[:class]
+        FoxTail::DotIndicatorComponent.new options
+      }
+    },
+    badge: {
+      as: :badge_indicator,
+      renders: lambda { |options = {}|
+        styling_options = options.extract!(:position).reverse_merge(position: :top_right)
+        options[:size] ||= :sm
+        options[:pill] = true unless options.key?(:pill)
+        options[:class] = classnames theme.apply(:indicator, self, styling_options), options[:class]
+        FoxTail::BadgeComponent.new options
+      }
+    }
+  }
+
   has_option :variant, default: :solid
   has_option :size, default: :base
   has_option :color, default: :default

data/app/components/fox_tail/button_base_component.theme.yml

@@ -106,3 +106,14 @@ root:
         default: *default
 root/disabled:
   base: pointer-events-none cursor-not-allowed opacity-50
+indicator:
+  base: absolute
+  position:
+    top_left: top-0 left-0 -translate-x-1/2 -translate-y-1/2
+    top: top-0 left-1/2 -translate-x-1/2 -translate-y-1/2
+    top_right: top-0 right-0 translate-x-1/2 -translate-y-1/2
+    center_left: top-1/2 left-0 -translate-x-1/2 -translate-y-1/2
+    center_right: top-1/2 right-0 translate-x-1/2 -translate-y-1/2
+    bottom_left: bottom-0 left-0 -translate-x-1/2 translate-y-1/2
+    bottom: bottom-0 left-1/2 -translate-x-1/2 translate-y-1/2
+    bottom_right: bottom-0 right-0 translate-x-1/2 translate-y-1/2

data/app/components/fox_tail/button_component.rb

@@ -55,6 +55,7 @@ class FoxTail::ButtonComponent < FoxTail::ButtonBaseComponent
 
   def call
     super do
+      concat indicator if indicator?
       concat loading_icon if loading_icon?
       concat left_visual if left_visual?
 

data/app/components/fox_tail/concerns/placeholderable.rb

@@ -11,12 +11,6 @@ module FoxTail::Concerns::Placeholderable
     !!placeholder.presence
   end
 
-  def before_render
-    super
-
-    html_attributes[:placeholder] = retrieve_placeholder if placeholder?
-  end
-
   protected
 
   def retrieve_placeholder

data/app/components/fox_tail/dismissible_controller.ts

@@ -28,7 +28,7 @@ export default class extends Controller {
     declare readonly dismissedClasses: string[];
 
     private _dismissed: boolean = false;
-    private _autoCloseTimer: number | null = null;
+    private _autoCloseTimer: NodeJS.Timeout | null = null;
 
     connect() {
         super.connect();

data/app/components/fox_tail/drawer_component.rb

@@ -60,6 +60,7 @@ class FoxTail::DrawerComponent < FoxTail::BaseComponent
     content_tag tag_name, html_attributes do
       concat close_button if close_button?
       concat notch if notch?
+      yield if block_given?
       concat content
     end
   end

data/app/components/fox_tail/icon_button_component.rb

@@ -20,6 +20,7 @@ class FoxTail::IconButtonComponent < FoxTail::ButtonBaseComponent
   def call
     super do
       icons.each { |icon| concat icon }
+      concat indicator if indicator?
 
       if content? || i18n_content.present?
         concat content_tag(:span, retrieve_content, class: theme.apply(:content, self))

data/app/components/fox_tail/inline_svg_component.rb

@@ -7,18 +7,23 @@ class FoxTail::InlineSvgComponent < FoxTail::BaseComponent
 
   has_option :raise, as: :raise_error, type: :boolean
 
-  def initialize(path, html_attributes = {})
+  def initialize(path_or_html_attributes = {}, html_attributes = {})
+    if path_or_html_attributes.is_a?(Hash)
+      html_attributes = path_or_html_attributes
+      path_or_html_attributes = nil
+    end
+
     unless html_attributes.key? :raise
       html_attributes[:raise] = FoxTail::Base.fox_tail_config.raise_on_asset_not_found
     end
 
     super(html_attributes)
 
-    @path = path.to_s
+    @path = path_or_html_attributes&.to_s
   end
 
   def call
-    doc = Nokogiri::XML.parse asset_contents
+    doc = Nokogiri::XML.parse content? ? content : asset_contents
     sanitized_html_attributes.each { |k, v| doc.child[k.to_s] = v }
     doc.child[:class] = html_class
     yield doc if block_given?

data/app/components/fox_tail/input_base_component.rb

@@ -17,6 +17,7 @@ class FoxTail::InputBaseComponent < FoxTail::BaseComponent
     super
 
     add_default_name_and_id
+    html_attributes[:placeholder] = retrieve_placeholder if placeholder?
   end
 
   protected

data/app/components/fox_tail/link_component.rb

@@ -4,7 +4,6 @@ class FoxTail::LinkComponent < FoxTail::ClickableComponent
   has_option :color, default: :default
 
   def initialize(url, html_attributes = {})
-    super(html_attributes)
-    @url = url
+    super(html_attributes.merge(url: url))
   end
 end

data/app/components/fox_tail/modal_component.rb

@@ -4,7 +4,7 @@ class FoxTail::ModalComponent < FoxTail::BaseComponent
   include FoxTail::Concerns::HasStimulusController
 
   renders_one :trigger, lambda { |options = {}|
-    FoxTail::ModalTriggerComponent.new options.delete(:id), "##{tag_id}", options
+    self.class.trigger_component.new options.delete(:id), "##{tag_id}", options
   }
 
   has_option :placement, default: :center
@@ -115,6 +115,10 @@ class FoxTail::ModalComponent < FoxTail::BaseComponent
     def stimulus_controller_name
       :modal
     end
+
+    def trigger_component
+      FoxTail::ModalTriggerComponent
+    end
   end
 
   class StimulusController < FoxTail::StimulusController

data/app/components/fox_tail/select_component.rb

@@ -1,11 +1,14 @@
 # frozen_string_literal: true
 
 class FoxTail::SelectComponent < FoxTail::InputBaseComponent
+  include FoxTail::Concerns::Placeholderable
+
   has_option :disabled, type: :boolean, default: false
   has_option :value
   has_option :include_hidden, type: :boolean, default: true
+  has_option :include_blank, type: :boolean, default: false
 
-  renders_one :placeholder, lambda { |text, selected: false, disabled: true|
+  renders_one :prompt, lambda { |text, selected: false, disabled: true|
     FoxTail::Select::OptionComponent.new("", disabled: disabled, selected: selected).with_content(text)
   }
 
@@ -35,6 +38,12 @@ class FoxTail::SelectComponent < FoxTail::InputBaseComponent
 
     html_attributes[:class] = classnames theme.apply(:root, self), html_class
     html_attributes[:multiple] = :multiple if html_attributes[:multiple]
+
+    if placeholder?
+      with_prompt retrieve_placeholder, selected: value_from_object.nil?
+    elsif include_blank?
+      with_prompt "", disabled: false, selected: value_from_object.nil?
+    end
   end
 
   def call
@@ -62,7 +71,7 @@ class FoxTail::SelectComponent < FoxTail::InputBaseComponent
 
   def render_select
     content_tag :select, html_attributes do
-      concat placeholder if placeholder?
+      concat prompt if prompt?
       select_options.each { |select_option| concat select_option } if select_options?
       concat content if content?
     end

data/app/components/fox_tail/sidebar/menu_component.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+class FoxTail::Sidebar::MenuComponent < FoxTail::BaseComponent
+  renders_many :items, lambda { |options = {}|
+    options[:theme] = theme.theme :menu_item
+    FoxTail::Sidebar::MenuItemComponent.new options
+  }
+
+  renders_one :menu, lambda { |options = {}|
+    options[:theme] = theme.theme :menu
+    FoxTail::Sidebar::MenuItemComponent.new options
+  }
+
+  def render?
+    items?
+  end
+
+  def before_render
+    super
+
+    html_attributes[:class] = classnames theme.apply(:root, self), html_class
+  end
+
+  def call
+    content_tag :ul, html_attributes do
+      items.each { |item| concat item }
+    end
+  end
+end

data/app/components/fox_tail/sidebar/menu_item_component.rb

@@ -0,0 +1,133 @@
+# frozen_string_literal: true
+
+class FoxTail::Sidebar::MenuItemComponent < FoxTail::ClickableComponent
+  renders_one :left_visual, types: {
+    icon: {
+      as: :left_icon,
+      renders: lambda { |icon, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :left, type: :svg }),
+                                     options[:class]
+
+        FoxTail::IconBaseComponent.new icon, options
+      }
+    },
+    svg: {
+      as: :left_svg,
+      renders: lambda { |path, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :left, type: :svg }),
+                                     options[:class]
+
+        FoxTail::InlineSvgComponent.new path, options
+      }
+    },
+    image: {
+      as: :left_image,
+      renders: lambda { |source, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :left, type: :image }),
+                                     options[:class]
+
+        image_tag source, options
+      }
+    }
+  }
+
+  renders_one :right_visual, types: {
+    icon: {
+      as: :right_icon,
+      renders: lambda { |icon, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :right, type: :icon }),
+                                     options[:class]
+
+        FoxTail::IconBaseComponent.new icon, options
+      }
+    },
+    svg: {
+      as: :right_svg,
+      renders: lambda { |path, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :right, type: :svg }),
+                                     options[:class]
+
+        FoxTail::InlineSvgComponent.new path, options
+      }
+    },
+    image: {
+      as: :right_image,
+      renders: lambda { |source, options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :right, type: :image }),
+                                     options[:class]
+        image_tag source, options
+      }
+    },
+    badge: {
+      as: :badge,
+      renders: lambda { |options = {}|
+        options[:class] = classnames theme.apply(:visual, self, { position: :right, type: :badge }),
+                                     options[:class]
+
+        FoxTail::BadgeComponent.new options
+      }
+    }
+  }
+
+  renders_one :menu, lambda { |options = {}|
+    options[:theme] = theme.theme :menu
+    options[:id] = menu_id
+    FoxTail::Sidebar::MenuComponent.new options
+  }
+
+  has_option :id
+  has_option :menu_id
+  has_option :selected, type: :boolean, default: false
+
+  def initialize(html_attributes = {})
+    super(html_attributes)
+
+    options[:id] ||= "menu_item_#{SecureRandom.alphanumeric 16}"
+    options[:menu_id] ||= "#{options[:id]}_menu"
+  end
+
+  def link?
+    menu? ? false : super
+  end
+
+  def before_render
+    super
+
+    if menu?
+      with_right_icon "chevron-down" unless right_visual
+    end
+  end
+
+  def call
+     content_tag :li do
+       if menu?
+         concat render_collapsible_trigger
+         concat render_menu
+       else
+         render_item
+       end
+    end
+  end
+
+  private
+
+  def render_collapsible_trigger
+    render FoxTail::CollapsibleTriggerComponent.new id, "##{menu_id}", open: selected?, theme: theme do |trigger|
+      render_item trigger.html_attributes
+    end
+  end
+
+  def render_item(attributes = {})
+    attributes = stimulus_merger.merge_attributes html_attributes, attributes
+
+    content_tag root_tag_name, attributes do
+      concat left_visual if left_visual?
+      concat content_tag(:span, content, class: theme.apply(:content, self))
+      concat right_visual if right_visual?
+    end
+  end
+
+  def render_menu
+    render FoxTail::CollapsibleComponent.new(menu_id, open: selected?).with_content(menu)
+  end
+end

data/app/components/fox_tail/sidebar_component.rb

@@ -0,0 +1,49 @@
+# frozen_string_literal: true
+
+class FoxTail::SidebarComponent < FoxTail::DrawerComponent
+  renders_one :header
+
+  renders_many :menus, lambda { |options = {}|
+    options[:theme] = theme.theme :menu
+
+    FoxTail::Sidebar::MenuComponent.new options
+  }
+
+  renders_one :divider, lambda { |options = {}|
+    options[:class] = classnames theme.apply(:divider, self), options[:class]
+
+    FoxTail::HrComponent.new options
+  }
+
+  has_option :dividers, type: :boolean, default: true
+
+  def before_render
+    super
+
+    with_divider if !divider && dividers?
+  end
+
+  def call
+    super do
+      concat header if header?
+      concat render_menus if menus?
+    end
+  end
+
+  private
+
+  def render_menus
+    content_tag :div, class: theme.apply(:menu_container, self) do
+      menus.each_with_index do |menu, index|
+        concat divider if divider? && !index.zero?
+        concat menu
+      end
+    end
+  end
+
+  class << self
+    def stimulus_controller_name
+      :drawer
+    end
+  end
+end

data/app/components/fox_tail/sidebar_component.theme.yml

@@ -0,0 +1,25 @@
+menu_container:
+  dividers?: divider-y divider-gray-200 dark:divider-gray-700 space-y-4
+_menu_item: &menu_item
+  root:
+    base: &menu_item_root_base >-
+      flex items-center gap-3 w-full p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700 group
+  content:
+    base: truncate whitespace-nowrap flex-grow-1 flex-shrink-1
+  visual:
+    position:
+      left: >-
+        w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white
+      right: ml-auto
+menu:
+  root:
+    base: space-y-2 font-medium
+  menu_item:
+    <<: *menu_item
+    menu:
+      root:
+        base: py-2 space-y-2
+      menu_item:
+        <<: *menu_item
+        root:
+          base: !concat [*menu_item_root_base, "pl-11"]

data/app/components/fox_tail/table/row_component.rb

@@ -12,10 +12,6 @@ class FoxTail::Table::RowComponent < FoxTail::BaseComponent
   has_option :hover, type: :boolean, default: false
   has_option :border, type: :boolean, default: true
 
-  def even?
-    position.is_a?(Numeric) && position.even?
-  end
-
   def before_render
     super
 

data/app/components/fox_tail/table_component.rb

@@ -13,19 +13,19 @@ class FoxTail::TableComponent < FoxTail::BaseComponent
   }
 
   renders_one :header, lambda { |options = {}|
-    options = options.merge self.options
+    options = options.merge section_options
     options[:theme] = theme.theme :header
     FoxTail::Table::HeaderComponent.new options
   }
 
   renders_many :rows, lambda { |options = {}|
-    options = options.merge self.options
+    options = options.merge section_options
     options[:theme] = theme.theme :row
     FoxTail::Table::RowComponent.new options
   }
 
   renders_one :footer, lambda { |options = {}|
-    options = options.merge self.options
+    options = options.merge section_options
     options[:theme] = theme.theme :footer
     FoxTail::Table::RowComponent.new options
   }
@@ -39,4 +39,10 @@ class FoxTail::TableComponent < FoxTail::BaseComponent
 
     html_attributes[:class] = classnames theme.apply(:root, self), html_class
   end
+
+  private
+
+  def section_options
+    self.options.slice :highlight, :hover, :border
+  end
 end

data/app/components/fox_tail/textarea_component.rb

@@ -11,7 +11,7 @@ class FoxTail::TextareaComponent < FoxTail::InputBaseComponent
   end
 
   def call
-    content_tag :textarea, content, html_attributes
+    content_tag :textarea, object_name? ? value_from_object : content, html_attributes
   end
 
   class AutoResizeStimulusController < FoxTail::StimulusController

data/app/helpers/fox_tail/form_builder.rb

@@ -125,18 +125,11 @@ class FoxTail::FormBuilder < ActionView::Helpers::FormBuilder
   end
 
   def select(method, choices = nil, options = {}, html_options = {}, &block)
-    include_blank = options.delete :include_blank
-    prompt = options.delete :prompt
     options = objectify_component_options(method, options.merge(html_options))
+    options[:placeholder] = options.delete(:placeholder) || options.delete(:prompt)
     choices = choices.to_a if choices.is_a? Range
 
     @template.render FoxTail::SelectComponent.new(options) do |select|
-      if !!prompt
-        select.with_placeholder prompt_text(prompt)
-      elsif !!include_blank
-        select.with_placeholder "", disabled: false
-      end
-
       if choices.present?
         choices.each do |choice|
           choice_options = option_html_attributes choice
@@ -145,7 +138,7 @@ class FoxTail::FormBuilder < ActionView::Helpers::FormBuilder
         end
       end
 
-      capture select, &block if block
+      @template.capture select, &block if block
     end
   end
 
@@ -172,8 +165,8 @@ class FoxTail::FormBuilder < ActionView::Helpers::FormBuilder
 
   def button(value = nil, options = {}, &block)
     if value.is_a? Hash
-      value = nil
       options = value
+      value = nil
     end
 
     options = objectify_component_options nil, options

data/lib/fox_tail/version.rb

@@ -1,3 +1,3 @@
 module FoxTail
-  VERSION = "0.1.0"
+  VERSION = "0.1.1"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: fox_tail
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.1.1
 platform: ruby
 authors:
 - James Fawks
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-10-17 00:00:00.000000000 Z
+date: 2024-01-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
@@ -1065,6 +1065,10 @@ files:
 - app/components/fox_tail/select/option_component.rb
 - app/components/fox_tail/select/option_group_component.rb
 - app/components/fox_tail/select_component.rb
+- app/components/fox_tail/sidebar/menu_component.rb
+- app/components/fox_tail/sidebar/menu_item_component.rb
+- app/components/fox_tail/sidebar_component.rb
+- app/components/fox_tail/sidebar_component.theme.yml
 - app/components/fox_tail/spinner_component.rb
 - app/components/fox_tail/spinner_component.theme.yml
 - app/components/fox_tail/stepper/step_component.html.erb