phlexy_ui 0.1.1 → 0.1.6

data/lib/phlexy_ui/configurable.rb

@@ -10,12 +10,36 @@ module PhlexyUI
       @configuration ||= Configuration.new
     end
 
+    class Modifiers
+      def initialize
+        @modifiers = {}
+      end
+
+      def add(modifier, classes:, component: nil)
+        @modifiers[component] ||= {}
+        @modifiers[component][modifier] = classes
+      end
+
+      def remove(modifier, component: nil)
+        @modifiers[component] ||= {}
+        @modifiers[component]&.delete(modifier)
+      end
+
+      def for(component: nil)
+        @modifiers[component] || {}
+      end
+    end
+
     class Configuration
       attr_accessor :prefix
 
       def initialize
         @prefix = nil
       end
+
+      def modifiers
+        @modifiers ||= Modifiers.new
+      end
     end
   end
 end

data/lib/phlexy_ui/drawer.rb

@@ -0,0 +1,75 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Drawer < Base
+    def initialize(*, id:, as: :section, **)
+      super(*, **)
+      @as = as
+      @id = id
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :drawer,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    def toggle(**options, &)
+      generate_classes!(
+        component_html_class: :"drawer-toggle",
+        options:
+      ).then do |classes|
+        input(id:, type: :checkbox, class: classes, **options, &)
+      end
+    end
+
+    def content(as: :div, **options, &)
+      generate_classes!(
+        component_html_class: :"drawer-content",
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    def side(as: :div, **options, &)
+      generate_classes!(
+        component_html_class: :"drawer-side",
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    def overlay(**options, &)
+      generate_classes!(
+        component_html_class: :"drawer-overlay",
+        options:
+      ).then do |classes|
+        label(for: id, class: classes, **options, &)
+      end
+    end
+
+    def button(*, **, &)
+      render Button.new(*, as: :label, for: id, **, &)
+    end
+
+    private
+
+    register_modifiers(
+        # "sm:drawer-end"
+        # "md:drawer-end"
+        # "lg:drawer-end"
+      end: "drawer-end",
+      # "sm:drawer-open"
+      # "md:drawer-open"
+      # "lg:drawer-open"
+      open: "drawer-open"
+    )
+  end
+end

data/lib/phlexy_ui/dropdown.rb

@@ -0,0 +1,92 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Dropdown < Base
+    def initialize(*, as: :div, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :dropdown,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        if base_modifiers.include?(:tap_to_close)
+          details(class: classes, **options, &)
+        else
+          public_send(as, class: classes, **options, &)
+        end
+      end
+    end
+
+    def button(*, **, &)
+      if base_modifiers.include?(:tap_to_close)
+        render Button.new(*, as: :summary, **, &)
+      else
+        render Button.new(*, as: :div, role: :button, tabindex: 0, **, &)
+      end
+    end
+
+    def content(*, as: :div, **options, &)
+      generate_classes!(
+        component_html_class: :"dropdown-content",
+        options:
+      ).then do |classes|
+        if base_modifiers.include?(:tap_to_close)
+          render_as(*, as:, class: classes, **options, &)
+        else
+          render_as(*, as:, tabindex: 0, class: classes, **options, &)
+        end
+      end
+    end
+
+    def menu(*, **options, &)
+      generate_classes!(
+        component_html_class: :"dropdown-content",
+        options:
+      ).then do |classes|
+        if base_modifiers.include?(:tap_to_close)
+          render Menu.new(*, class: classes, **options, &)
+        else
+          render Menu.new(*, tabindex: 0, class: classes, **options, &)
+        end
+      end
+    end
+
+    private
+
+    register_modifiers(
+        # "sm:dropdown-end"
+        # "md:dropdown-end"
+        # "lg:dropdown-end"
+      end: "dropdown-end",
+      # "sm:dropdown-top"
+      # "md:dropdown-top"
+      # "lg:dropdown-top"
+      top: "dropdown-top",
+      # "sm:dropdown-bottom"
+      # "md:dropdown-bottom"
+      # "lg:dropdown-bottom"
+      bottom: "dropdown-bottom",
+      # "sm:dropdown-left"
+      # "md:dropdown-left"
+      # "lg:dropdown-left"
+      left: "dropdown-left",
+      # "sm:dropdown-right"
+      # "md:dropdown-right"
+      # "lg:dropdown-right"
+      right: "dropdown-right",
+      # "sm:dropdown-hover"
+      # "md:dropdown-hover"
+      # "lg:dropdown-hover"
+      hover: "dropdown-hover",
+      # "sm:dropdown-open"
+      # "md:dropdown-open"
+      # "lg:dropdown-open"
+      open: "dropdown-open"
+    )
+  end
+end

data/lib/phlexy_ui/link.rb

@@ -0,0 +1,90 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Link < Base
+    def view_template(&)
+      generate_classes!(
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        a(class: classes, **options, &)
+      end
+    end
+
+    private
+
+    attr_reader :link_to_name
+
+    register_modifiers(
+      # "sm:link"
+      # "md:link"
+      # "lg:link"
+      underlined: "link",
+      # "sm:link-hover"
+      # "md:link-hover"
+      # "lg:link-hover"
+      hover: "link-hover",
+      # "sm:active"
+      # "md:active"
+      # "lg:active"
+      active: "active",
+      # "sm:image-full"
+      # "md:image-full"
+      # "lg:image-full"
+      image_full: "image-full",
+      # "sm:card-bordered"
+      # "md:card-bordered"
+      # "lg:card-bordered"
+      bordered: "card-bordered",
+      # "sm:card-normal"
+      # "md:card-normal"
+      # "lg:card-normal"
+      normal: "card-normal",
+      # "sm:card-compact"
+      # "md:card-compact"
+      # "lg:card-compact"
+      compact: "card-compact",
+      # "sm:card-side"
+      # "md:card-side"
+      # "lg:card-side"
+      side: "card-side",
+      # "sm:glass"
+      # "md:glass"
+      # "lg:glass"
+      glass: "glass",
+      # "sm:link-primary"
+      # "md:link-primary"
+      # "lg:link-primary"
+      primary: "link-primary",
+      # "sm:link-secondary"
+      # "md:link-secondary"
+      # "lg:link-secondary"
+      secondary: "link-secondary",
+      # "sm:link-accent"
+      # "md:link-accent"
+      # "lg:link-accent"
+      accent: "link-accent",
+      # "sm:link-neutral"
+      # "md:link-neutral"
+      # "lg:link-neutral"
+      neutral: "link-neutral",
+      # "sm:link-info"
+      # "md:link-info"
+      # "lg:link-info"
+      info: "link-info",
+      # "sm:link-success"
+      # "md:link-success"
+      # "lg:link-success"
+      success: "link-success",
+      # "sm:link-warning"
+      # "md:link-warning"
+      # "lg:link-warning"
+      warning: "link-warning",
+      # "sm:link-error"
+      # "md:link-error"
+      # "lg:link-error"
+      error: "link-error"
+    ).freeze
+  end
+end

data/lib/phlexy_ui/loading.rb

@@ -0,0 +1,98 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Loading < Base
+    def initialize(*, as: :span, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :loading,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    private
+
+    register_modifiers(
+      # "sm:loading-spinner"
+      # "md:loading-spinner"
+      # "lg:loading-spinner"
+      spinner: "loading-spinner",
+      # "sm:loading-dots"
+      # "md:loading-dots"
+      # "lg:loading-dots"
+      dots: "loading-dots",
+      # "sm:loading-ring"
+      # "md:loading-ring"
+      # "lg:loading-ring"
+      ring: "loading-ring",
+      # "sm:loading-ball"
+      # "md:loading-ball"
+      # "lg:loading-ball"
+      ball: "loading-ball",
+      # "sm:loading-bars"
+      # "md:loading-bars"
+      # "lg:loading-bars"
+      bars: "loading-bars",
+      # "sm:loading-infinity"
+      # "md:loading-infinity"
+      # "lg:loading-infinity"
+      infinity: "loading-infinity",
+      # "sm:loading-xs"
+      # "md:loading-xs"
+      # "lg:loading-xs"
+      xs: "loading-xs",
+      # "sm:loading-sm"
+      # "md:loading-sm"
+      # "lg:loading-sm"
+      sm: "loading-sm",
+      # "sm:loading-md"
+      # "md:loading-md"
+      # "lg:loading-md"
+      md: "loading-md",
+      # "sm:loading-lg"
+      # "md:loading-lg"
+      # "lg:loading-lg"
+      lg: "loading-lg",
+      # "sm:text-primary"
+      # "md:text-primary"
+      # "lg:text-primary"
+      primary: "text-primary",
+      # "sm:text-secondary"
+      # "md:text-secondary"
+      # "lg:text-secondary"
+      secondary: "text-secondary",
+      # "sm:text-accent"
+      # "md:text-accent"
+      # "lg:text-accent"
+      accent: "text-accent",
+      # "sm:text-neutral"
+      # "md:text-neutral"
+      # "lg:text-neutral"
+      neutral: "text-neutral",
+      # "sm:text-info"
+      # "md:text-info"
+      # "lg:text-info"
+      info: "text-info",
+      # "sm:text-success"
+      # "md:text-success"
+      # "lg:text-success"
+      success: "text-success",
+      # "sm:text-warning"
+      # "md:text-warning"
+      # "lg:text-warning"
+      warning: "text-warning",
+      # "sm:text-error"
+      # "md:text-error"
+      # "lg:text-error"
+      error: "text-error"
+    ).freeze
+  end
+end

data/lib/phlexy_ui/mask.rb

@@ -0,0 +1,110 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Mask < Base
+    def initialize(*, as: :div, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :mask,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    private
+
+    register_modifiers(
+      # "sm:mask-squircle"
+      # "md:mask-squircle"
+      # "lg:mask-squircle"
+      squircle: "mask-squircle",
+      # "sm:mask-heart"
+      # "md:mask-heart"
+      # "lg:mask-heart"
+      heart: "mask-heart",
+      # "sm:mask-hexagon"
+      # "md:mask-hexagon"
+      # "lg:mask-hexagon"
+      hexagon: "mask-hexagon",
+      # "sm:mask-hexagon-2"
+      # "md:mask-hexagon-2"
+      # "lg:mask-hexagon-2"
+      hexagon_2: "mask-hexagon-2",
+      # "sm:mask-decagon"
+      # "md:mask-decagon"
+      # "lg:mask-decagon"
+      decagon: "mask-decagon",
+      # "sm:mask-pentagon"
+      # "md:mask-pentagon"
+      # "lg:mask-pentagon"
+      pentagon: "mask-pentagon",
+      # "sm:mask-diamond"
+      # "md:mask-diamond"
+      # "lg:mask-diamond"
+      diamond: "mask-diamond",
+      # "sm:mask-square"
+      # "md:mask-square"
+      # "lg:mask-square"
+      square: "mask-square",
+      # "sm:mask-circle"
+      # "md:mask-circle"
+      # "lg:mask-circle"
+      circle: "mask-circle",
+      # "sm:mask-parallelogram"
+      # "md:mask-parallelogram"
+      # "lg:mask-parallelogram"
+      parallelogram: "mask-parallelogram",
+      # "sm:mask-parallelogram-2"
+      # "md:mask-parallelogram-2"
+      # "lg:mask-parallelogram-2"
+      parallelogram_2: "mask-parallelogram-2",
+      # "sm:mask-parallelogram-3"
+      # "md:mask-parallelogram-3"
+      # "lg:mask-parallelogram-3"
+      parallelogram_3: "mask-parallelogram-3",
+      # "sm:mask-parallelogram-4"
+      # "md:mask-parallelogram-4"
+      # "lg:mask-parallelogram-4"
+      parallelogram_4: "mask-parallelogram-4",
+      # "sm:mask-star"
+      # "md:mask-star"
+      # "lg:mask-star"
+      star: "mask-star",
+      # "sm:mask-star-2"
+      # "md:mask-star-2"
+      # "lg:mask-star-2"
+      star_2: "mask-star-2",
+      # "sm:mask-triangle"
+      # "md:mask-triangle"
+      # "lg:mask-triangle"
+      triangle: "mask-triangle",
+      # "sm:mask-triangle-2"
+      # "md:mask-triangle-2"
+      # "lg:mask-triangle-2"
+      triangle_2: "mask-triangle-2",
+      # "sm:mask-triangle-3"
+      # "md:mask-triangle-3"
+      # "lg:mask-triangle-3"
+      triangle_3: "mask-triangle-3",
+      # "sm:mask-triangle-4"
+      # "md:mask-triangle-4"
+      # "lg:mask-triangle-4"
+      triangle_4: "mask-triangle-4",
+      # "sm:mask-half-1"
+      # "md:mask-half-1"
+      # "lg:mask-half-1"
+      half_1: "mask-half-1",
+      # "sm:mask-half-2"
+      # "md:mask-half-2"
+      # "lg:mask-half-2"
+      half_2: "mask-half-2"
+    )
+  end
+end

data/lib/phlexy_ui/menu.rb

@@ -0,0 +1,114 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Menu < Base
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :menu,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        ul(class: classes, **options, &)
+      end
+    end
+
+    def title(*, as: :li, **options, &)
+      generate_classes!(
+        component_html_class: :"menu-title",
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    def item(*, **, &)
+      render MenuItem.new(*, **, &)
+    end
+
+    def submenu(*base_modifiers, **, &)
+      if base_modifiers.include?(:collapsible)
+        li do
+          render CollapsibleSubMenu.new(*base_modifiers, **, &)
+        end
+      else
+        li do
+          render SubMenu.new(*base_modifiers, **, &)
+        end
+      end
+    end
+
+    private
+
+    register_modifiers(
+      # "sm:menu-xs"
+      # "md:menu-xs"
+      # "lg:menu-xs"
+      xs: "menu-xs",
+      # "sm:menu-sm"
+      # "md:menu-sm"
+      # "lg:menu-sm"
+      sm: "menu-sm",
+      # "sm:menu-md"
+      # "md:menu-md"
+      # "lg:menu-md"
+      md: "menu-md",
+      # "sm:menu-lg"
+      # "md:menu-lg"
+      # "lg:menu-lg"
+      lg: "menu-lg",
+      # "sm:menu-vertical"
+      # "md:menu-vertical"
+      # "lg:menu-vertical"
+      vertical: "menu-vertical",
+      # "sm:menu-horizontal"
+      # "md:menu-horizontal"
+      # "lg:menu-horizontal"
+      horizontal: "menu-horizontal",
+      # "sm:bg-primary sm:text-primary-content"
+      # "md:bg-primary md:text-primary-content"
+      # "lg:bg-primary lg:text-primary-content"
+      primary: "bg-primary text-primary-content",
+      # "sm:bg-secondary sm:text-secondary-content"
+      # "md:bg-secondary md:text-secondary-content"
+      # "lg:bg-secondary lg:text-secondary-content"
+      secondary: "bg-secondary text-secondary-content",
+      # "sm:bg-accent sm:text-accent-content"
+      # "md:bg-accent md:text-accent-content"
+      # "lg:bg-accent lg:text-accent-content"
+      accent: "bg-accent text-accent-content",
+      # "sm:bg-neutral sm:text-neutral-content"
+      # "md:bg-neutral md:text-neutral-content"
+      # "lg:bg-neutral lg:text-neutral-content"
+      neutral: "bg-neutral text-neutral-content",
+      # "sm:bg-base-100 sm:text-base-content"
+      # "md:bg-base-100 md:text-base-content"
+      # "lg:bg-base-100 lg:text-base-content"
+      base_100: "bg-base-100 text-base-content",
+      # "sm:bg-base-200 sm:text-base-content"
+      # "md:bg-base-200 md:text-base-content"
+      # "lg:bg-base-200 lg:text-base-content"
+      base_200: "bg-base-200 text-base-content",
+      # "sm:bg-base-300 sm:text-base-content"
+      # "md:bg-base-300 md:text-base-content"
+      # "lg:bg-base-300 lg:text-base-content"
+      base_300: "bg-base-300 text-base-content",
+      # "sm:bg-info sm:text-info-content"
+      # "md:bg-info sm:text-info-content"
+      # "lg:bg-info sm:text-info-content"
+      info: "bg-info text-info-content",
+      # "sm:bg-success sm:text-success-content"
+      # "md:bg-success md:text-success-content"
+      # "lg:bg-success lg:text-success-content"
+      success: "bg-success text-success-content",
+      # "sm:bg-warning sm:text-warning-content"
+      # "md:bg-warning md:text-warning-content"
+      # "lg:bg-warning lg:text-warning-content"
+      warning: "bg-warning text-warning-content",
+      # "sm:bg-error sm:text-error-content"
+      # "md:bg-error md:text-error-content"
+      # "lg:bg-error lg:text-error-content"
+      error: "bg-error text-error-content"
+    )
+  end
+end

data/lib/phlexy_ui/menu_item.rb

@@ -0,0 +1,50 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  # @private
+  class MenuItem < Base
+    def view_template(&)
+      generate_classes!(
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        li(class: classes, &)
+      end
+    end
+
+    def title(*, **options, &block)
+      generate_classes!(
+        component_html_class: :"menu-title",
+        options:
+      ).then do |classes|
+        h2(class: classes, **options, &block)
+      end
+    end
+
+    def submenu(*base_modifiers, **, &)
+      if base_modifiers.include?(:collapsible)
+        render CollapsibleSubMenu.new(*base_modifiers, **, &)
+      else
+        render SubMenu.new(*base_modifiers, **, &)
+      end
+    end
+
+    private
+
+    register_modifiers(
+      # "sm:disabled"
+      # "md:disabled"
+      # "lg:disabled"
+      disabled: "disabled",
+      # "sm:active"
+      # "md:active"
+      # "lg:active"
+      active: "active",
+      # "sm:focus"
+      # "md:focus"
+      # "lg:focus"
+      focus: "focus"
+    )
+  end
+end

data/lib/phlexy_ui/navbar.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Navbar < Base
+    def initialize(*, as: :nav, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :navbar,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options, &)
+      end
+    end
+
+    def start(&)
+      div(class: :"navbar-start", &)
+    end
+
+    def center(&)
+      div(class: :"navbar-center", &)
+    end
+
+    def end(&)
+      div(class: :"navbar-end", &)
+    end
+  end
+end