shadcn_phlexcomponents 0.1.9 → 0.1.11

data/lib/shadcn_phlexcomponents/components/sheet/sheet_content.rb

@@ -1,65 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetContent < Base
-    STYLES = <<~HEREDOC
-      fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out
-      data-[state=closed]:duration-300 data-[state=open]:duration-500
-      data-[state=open]:animate-in data-[state=closed]:animate-out pointer-events-auto
-    HEREDOC
-
-    CLOSE_BUTTON_STYLES = <<~HEREDOC
-      absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background
-      transition-opacity hover:opacity-100 focus:outline-none focus:ring-2
-      focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none
-      cursor-pointer
-    HEREDOC
-
-    SIDES = {
-      left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left
-            data-[state=open]:slide-in-from-left sm:max-w-sm",
-      right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right
-            data-[state=open]:slide-in-from-right sm:max-w-sm",
-      top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
-      bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom
-            data-[state=open]:slide-in-from-bottom",
-    }
-
-    def initialize(side: :right, aria_id: nil, **attributes)
-      @side = side
-      @aria_id = aria_id
-      super(**attributes)
-    end
-
-    def view_template(&)
-      @class = @attributes.delete(:class)
-      div(class: "#{@class} hidden", **@attributes) do
-        yield
-
-        button(class: CLOSE_BUTTON_STYLES, data: { action: "click->dialog#close" }) do
-          icon("x", class: "size-4")
-          span(class: "sr-only") { "close" }
-        end
-      end
-    end
-
-    def default_attributes
-      {
-        id: "#{@aria_id}-content",
-        tabindex: -1,
-        role: "dialog",
-        aria: {
-          describedby: "#{@aria_id}-description",
-          labelledby: "#{@aria_id}-title",
-        },
-        data: {
-          "dialog-target": "content",
-        },
-      }
-    end
-
-    def default_styles
-      "#{STYLES} #{SIDES[@side]}"
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sheet/sheet_description.rb

@@ -1,22 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetDescription < Base
-    STYLES = "text-sm text-muted-foreground"
-
-    def initialize(aria_id: nil, **attributes)
-      @aria_id = aria_id
-      super(**attributes)
-    end
-
-    def default_attributes
-      {
-        id: "#{@aria_id}-description",
-      }
-    end
-
-    def view_template(&)
-      p(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sheet/sheet_footer.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetFooter < Base
-    STYLES = "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sheet/sheet_header.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetHeader < Base
-    STYLES = "flex flex-col space-y-2 text-center sm:text-left"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sheet/sheet_title.rb

@@ -1,22 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetTitle < Base
-    STYLES = "text-lg font-semibold text-foreground"
-
-    def initialize(aria_id: nil, **attributes)
-      @aria_id = aria_id
-      super(**attributes)
-    end
-
-    def default_attributes
-      {
-        id: "#{@aria_id}-title",
-      }
-    end
-
-    def view_template(&)
-      h2(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sheet/sheet_trigger.rb

@@ -1,50 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SheetTrigger < Base
-    def initialize(as_child: false, aria_id: nil, **attributes)
-      @as_child = as_child
-      @aria_id = aria_id
-      super(**attributes)
-    end
-
-    def view_template(&)
-      if @as_child
-        content = capture(&)
-        element = find_as_child(content.to_s)
-
-        vanish(&)
-        element_attributes = nokogiri_attributes_to_hash(element)
-        styles = TAILWIND_MERGER.merge("#{@attributes[:class]} #{element_attributes[:class]}")
-        merged_attributes = mix(@attributes, element_attributes)
-        merged_attributes[:class] = styles
-
-        if element.name == "button"
-          merged_attributes.delete(:role)
-        end
-
-        send(element.name, **merged_attributes) do
-          sanitize_as_child(element.children.to_s)
-        end
-      else
-        div(**@attributes, &)
-      end
-    end
-
-    def default_attributes
-      {
-        role: "button",
-        aria: {
-          haspopup: "dialog",
-          expanded: false,
-          controls: "#{@aria_id}-content",
-        },
-        data: {
-          as_child: @as_child.to_s,
-          action: "click->dialog#open",
-          "dialog-target": "trigger",
-        },
-      }
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar.rb

@@ -1,108 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class Sidebar < Base
-    STYLES = <<~HEREDOC
-      bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col
-      group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border
-      group-data-[variant=floating]:shadow
-    HEREDOC
-
-    PANEL_STYLES = {
-      sidebar: "group-data-[side=left]:border-r group-data-[side=right]:border-l",
-      floating: "p-2",
-      inset: "p-2",
-    }
-
-    def initialize(id:, variant: :sidebar, side: :left, width: "16rem", expanded: true, **attributes)
-      @id = id
-      @variant = variant
-      @side = side
-      @width = width
-      @expanded = expanded
-      super(**attributes)
-    end
-
-    def header(**attributes, &)
-      SidebarHeader(**attributes, &)
-    end
-
-    def content(**attributes, &)
-      SidebarContent(**attributes, &)
-    end
-
-    def group(**attributes, &)
-      SidebarGroup(**attributes, &)
-    end
-
-    def group_content(**attributes, &)
-      SidebarGroupContent(**attributes, &)
-    end
-
-    def group_label(**attributes, &)
-      SidebarGroupLabel(**attributes, &)
-    end
-
-    def menu(**attributes, &)
-      SidebarMenu(**attributes, &)
-    end
-
-    def menu_item(**attributes, &)
-      SidebarMenuItem(**attributes, &)
-    end
-
-    def menu_button(**attributes, &)
-      SidebarMenuButton(**attributes, &)
-    end
-
-    def menu_sub(**attributes, &)
-      SidebarMenuSub(**attributes, &)
-    end
-
-    def menu_sub_item(**attributes, &)
-      SidebarMenuSubItem(**attributes, &)
-    end
-
-    def menu_sub_button(**attributes, &)
-      SidebarMenuSubButton(**attributes, &)
-    end
-
-    def footer(**attributes, &)
-      SidebarFooter(**attributes, &)
-    end
-
-    def view_template(&)
-      div(
-        id: @id,
-        class: "group peer hidden md:block",
-        style: { "--sidebar-width": @width },
-        data: {
-          side: @side,
-          variant: @variant,
-          collapsible: @expanded ? "" : "offcanvas",
-          sidebar_id: @sidebar_id,
-          state: @expanded ? "expanded" : "collapsed",
-          controller: "sidebar",
-        },
-      ) do
-        div(
-          class: "relative h-svh w-[var(--sidebar-width)] bg-transparent transition-[width] duration-200
-                    ease-linear group-data-[collapsible=offcanvas]:w-0 group-data-[side=right]:rotate-180
-                    group-data-[collapsible=icon]:w-[--sidebar-width-icon]",
-          data: { "sidebar-target": "panelOffset" },
-        )
-
-        div(
-          class: "fixed inset-y-0 z-10 hidden h-svh w-[var(--sidebar-width)] transition-[left,right,width] duration-200
-                    ease-linear md:flex left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]
-                    group-data-[collapsible=icon]:w-[--sidebar-width-icon] #{PANEL_STYLES[@variant]}",
-          data: {
-            "sidebar-target": "panel",
-          },
-        ) do
-          div(**@attributes, &)
-        end
-      end
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_container.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarContainer < Base
-    STYLES = "group/sidebar-wrapper text-sidebar-foreground has-[[data-variant=inset]]:bg-sidebar flex min-h-svh w-full"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_content.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarContent < Base
-    STYLES = "flex min-h-0 flex-1 flex-col gap-2 overflow-auto"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_footer.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarFooter < Base
-    STYLES = "flex flex-col gap-2 p-2"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_group.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarGroup < Base
-    STYLES = "relative flex w-full min-w-0 flex-col p-2"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_group_content.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarGroupContent < Base
-    STYLES = "w-full text-sm"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_group_label.rb

@@ -1,16 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarGroupLabel < Base
-    STYLES = <<~HEREDOC
-      text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center
-      rounded-md px-2 text-xs font-medium outline-none transition-[margin,opa]
-      duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0
-      group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0
-    HEREDOC
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_header.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarHeader < Base
-    STYLES = "flex flex-col gap-2 p-2"
-
-    def view_template(&)
-      div(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_inset.rb

@@ -1,15 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarInset < Base
-    STYLES = <<~HEREDOC
-      relative flex min-h-svh flex-1 flex-col bg-background peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))]
-      md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2
-      md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow
-    HEREDOC
-
-    def view_template(&)
-      main(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu.rb

@@ -1,11 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenu < Base
-    STYLES = "flex w-full min-w-0 flex-col gap-1"
-
-    def view_template(&)
-      ul(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu_button.rb

@@ -1,61 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenuButton < Base
-    STYLES = <<~HEREDOC
-      peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left
-      text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground
-      focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground
-      disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8
-      aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent
-      data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent
-      data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2!
-      [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 cursor-pointer
-    HEREDOC
-
-    SIZES = {
-      default: "h-8 text-sm",
-      sm: "h-7 text-xs",
-      lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!",
-    }
-
-    def initialize(size: :default, type: :button, active: false, as_child: false, **attributes)
-      @type = type
-      @size = size
-      @active = active
-      @as_child = as_child
-      super(**attributes)
-    end
-
-    def default_attributes
-      {
-        data: {
-          active: @active.to_s,
-        },
-      }
-    end
-
-    def default_styles
-      "#{STYLES} #{SIZES[@size]}"
-    end
-
-    def view_template(&)
-      if @as_child
-        content = capture(&)
-        element = find_as_child(content.to_s)
-
-        vanish(&)
-        element_attributes = nokogiri_attributes_to_hash(element)
-        styles = TAILWIND_MERGER.merge("#{@attributes[:class]} #{element_attributes[:class]}")
-        merged_attributes = mix(@attributes, element_attributes)
-        merged_attributes[:class] = styles
-
-        send(element.name, **merged_attributes) do
-          sanitize_as_child(element.children.to_s)
-        end
-      else
-        button(**@attributes, &)
-      end
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu_item.rb

@@ -1,9 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenuItem < Base
-    def view_template(&)
-      li(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu_sub.rb

@@ -1,14 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenuSub < Base
-    STYLES = <<~HEREDOC
-      border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col
-      gap-1 border-l px-2.5 py-0.5 group-data-[collapsible=icon]:hidden#{"  "}
-    HEREDOC
-
-    def view_template(&)
-      ul(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu_sub_button.rb

@@ -1,48 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenuSubButton < Base
-    STYLES = <<~HEREDOC
-      text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground
-      active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground
-      flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-none
-      focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none
-      aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0#{" "}
-      data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground#{" "}
-      text-sm group-data-[collapsible=icon]:hidden cursor-pointer
-    HEREDOC
-
-    def initialize(type: :button, active: false, as_child: false, **attributes)
-      @active = active
-      @as_child = as_child
-      super(**attributes)
-    end
-
-    def default_attributes
-      {
-        data: {
-          active: @active.to_s,
-        },
-      }
-    end
-
-    def view_template(&)
-      if @as_child
-        content = capture(&)
-        element = find_as_child(content.to_s)
-
-        vanish(&)
-        element_attributes = nokogiri_attributes_to_hash(element)
-        styles = TAILWIND_MERGER.merge("#{@attributes[:class]} #{element_attributes[:class]}")
-        merged_attributes = mix(@attributes, element_attributes)
-        merged_attributes[:class] = styles
-
-        send(element.name, **merged_attributes) do
-          sanitize_as_child(element.children.to_s)
-        end
-      else
-        button(**@attributes, &)
-      end
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_menu_sub_item.rb

@@ -1,9 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarMenuSubItem < Base
-    def view_template(&)
-      li(**@attributes, &)
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/sidebar/sidebar_trigger.rb

@@ -1,40 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class SidebarTrigger < Base
-    STYLES = <<~HEREDOC
-      inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md
-      text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none
-      focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none
-      disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 hover:bg-accent
-      hover:text-accent-foreground h-7 w-7 -ml-1 cursor-pointer
-    HEREDOC
-
-    def initialize(sidebar_id:, **attributes)
-      @sidebar_id = sidebar_id
-      super(**attributes)
-    end
-
-    def default_attributes
-      {
-        data: {
-          sidebar_id: @sidebar_id,
-          controller: "sidebar-trigger",
-          action: "click->sidebar-trigger#toggle",
-        },
-      }
-    end
-
-    def view_template(&)
-      button(**@attributes) do
-        if block_given?
-          yield
-        else
-          icon("panel-left", class: "")
-        end
-
-        span(class: "sr-only") { "Toggle Sidebar" }
-      end
-    end
-  end
-end

data/lib/shadcn_phlexcomponents/components/switch/switch.rb

@@ -1,66 +0,0 @@
-# frozen_string_literal: true
-
-module ShadcnPhlexcomponents
-  class Switch < Base
-    STYLES = <<~HEREDOC
-      peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full
-      border-2 border-transparent transition-colors focus-visible:outline-none#{" "}
-      focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2
-      focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50
-      data-[checked=true]:bg-primary data-[checked=false]:bg-input group/switch
-    HEREDOC
-
-    def initialize(name: nil, value: "1", unchecked_value: "0", checked: false, id: nil, include_hidden: true,
-      **attributes)
-      @name = name
-      @value = value
-      @unchecked_value = unchecked_value
-      @checked = checked
-      @id = id || name
-      @include_hidden = include_hidden
-      super(**attributes)
-    end
-
-    def view_template(&)
-      button(**@attributes) do
-        span(class: "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg
-                    ring-0 transition-transform group-data-[checked=true]/switch:translate-x-5
-                    group-data-[checked=false]/switch:translate-x-0")
-
-        if @include_hidden
-          input(name: @name, type: "hidden", value: @unchecked_value, autocomplete: "off")
-        end
-
-        input(
-          type: "checkbox",
-          value: @value,
-          class: "-translate-x-full pointer-events-none absolute top-0 left-0 size-4 opacity-0",
-          name: @name,
-          tabindex: -1,
-          checked: @checked,
-          aria: { hidden: true },
-          data: {
-            "switch-target": "input",
-          },
-        )
-      end
-    end
-
-    def default_attributes
-      {
-        id: @id,
-        type: "button",
-        role: "switch",
-        aria: {
-          checked: @checked.to_s,
-        },
-        data: {
-          checked: @checked.to_s,
-          controller: "switch",
-          action: "click->switch#toggle",
-          "switch-checked-value": @checked,
-        },
-      }
-    end
-  end
-end