shadcn-ui 0.0.12 → 0.0.13

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d36b644105b526361e08e906fb9404b89f4099f4f860afdc229bebe36a4b1996
-  data.tar.gz: ad0edad68914c4d1eee78f8b468b5f28cbead6ebd22fbd58f174ef7b5f00d77a
+  metadata.gz: 403f7186d9ebbcca03f5f3bc13901e29db5d84bcdefa1d8648be46387822defc
+  data.tar.gz: eb7e79a3a62954cdbb21777e46aea6bee225a1fbde655e2e85616f2a7d357648
 SHA512:
-  metadata.gz: d2d42f118d6048f572eab0597f8958be014e653ae2a0d020843308c96b2be4777798e91d54b648333caf67f516494b480edf7993639b64fbdaf5661ceb4389b6
-  data.tar.gz: cd3967406dcf715fd6604bf25f20e2e7f1c719feefa27b239f982be71ecc811118f74fd7351d59f230f6a0e8269a1be378b9760ee6ebb82fb6f8d6609503eee8
+  metadata.gz: 05b4c95efea37e11f8251081572564b057ab11a77e10e97af756f5e3c9f880b0dbc68d15105dfb91af2c5c2b59723a8b0ced098b7f68f2e57e15603a8386c29f
+  data.tar.gz: 8e03c73187dca4d4408962a83e676c5fe0ff8a344dd27bc60fe0575a5c1014386bc7d1de29ddc31414c14264b75c6626456ce3eb715ad0200f28f90b9156d7a2

data/app/assets/stylesheets/shadcn.css

@@ -1,84 +1,64 @@
+:root {
+  --font-sans: "Inter var";
+
+  --background: 0 0% 100%;
+  --foreground: 240 10% 3.9%;
+  --card: 0 0% 100%;
+  --card-foreground: 240 10% 3.9%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 240 10% 3.9%;
+  --primary: 240 5.9% 10%;
+  --primary-foreground: 0 0% 98%;
+  --secondary: 240 4.8% 95.9%;
+  --secondary-foreground: 240 5.9% 10%;
+  --muted: 240 4.8% 95.9%;
+  --muted-foreground: 240 3.8% 46.1%;
+  --accent: 240 4.8% 95.9%;
+  --accent-foreground: 240 5.9% 10%;
+  --destructive: 0 84.2% 60.2%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 240 5.9% 90%;
+  --input: 240 5.9% 90%;
+  --ring: 240 5% 64.9%;
+  --radius: 0.5rem;
+
+  --success: 132, 95.3%, 33.3%, 0.74;
+  --success-foreground: 109 55% 28%;
+
+  --info: 223 78% 42%;
+  --info-foreground: 225 100% 50%;
+
+  --attention: 45 90% 45%;
+  --attention-foreground: 60 98.4% 48.8% 0.82;
+}
 @layer base {
-  :root {
-    --font-sans: "Inter var";
-    --background: 0 0% 100%;
-    --foreground: 222.2 47.4% 11.2%;
-
-    --muted: 210 40% 96.1%;
-    --muted-foreground: 215.4 16.3% 46.9%;
-
-    --popover: 0 0% 100%;
-    --popover-foreground: 222.2 47.4% 11.2%;
-
-    --border: 214.3 31.8% 91.4%;
-    --input: 214.3 31.8% 91.4%;
-
-    --card: 0 0% 100%;
-    --card-foreground: 222.2 47.4% 11.2%;
-
-    --primary: 222.2 47.4% 11.2%;
-    --primary-foreground: 210 40% 98%;
-
-    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 222.2 47.4% 11.2%;
-
-    --accent: 210 40% 96.1%;
-    --accent-foreground: 222.2 47.4% 11.2%;
-
-    --destructive: 0 100% 50%;
-    --destructive-foreground: 210 40% 98%;
-
-    --success: 132, 95.3%, 33.3%, 0.74;
-    --success-foreground: 109 55% 28%;
-
-    --info: 223 78% 42%;
-    --info-foreground: 225 100% 50%;
-
-    --attention: 45 90% 45%;
-    --attention-foreground: 60 98.4% 48.8% 0.82;
-
-    --ring: 215 20.2% 65.1%;
-
-    --radius: 0.5rem;
-  }
-
   .dark {
-    --background: 224 71% 4%;
-    --foreground: 213 31% 91%;
-
-    --muted: 223 47% 11%;
-    --muted-foreground: 215.4 16.3% 56.9%;
-
-    --accent: 216 34% 17%;
-    --accent-foreground: 210 40% 98%;
-
-    --popover: 224 71% 4%;
-    --popover-foreground: 215 20.2% 65.1%;
-
-    --border: 216 34% 17%;
-    --input: 216 34% 17%;
-
-    --card: 224 71% 4%;
-    --card-foreground: 213 31% 91%;
-
-    --primary: 210 40% 98%;
-    --primary-foreground: 222.2 47.4% 1.2%;
-
-    --secondary: 222.2 47.4% 11.2%;
-    --secondary-foreground: 210 40% 98%;
-
-    --destructive: 0 63% 31%;
-    --destructive-foreground: 210 40% 98%;
-
-    --attention: 45, 90%, 45%, 0.8;
-    --attention-foreground: 60 98.4% 48.8% 0.82;
+    --background: 240 10% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 240 10% 3.9%;
+    --card-foreground: 0 0% 98%;
+    --popover: 240 10% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 0 0% 98%;
+    --primary-foreground: 240 5.9% 10%;
+    --secondary: 240 3.7% 15.9%;
+    --secondary-foreground: 0 0% 98%;
+    --muted: 240 3.7% 15.9%;
+    --muted-foreground: 240 5% 64.9%;
+    --accent: 240 3.7% 15.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 85.7% 97.3%;
+    --border: 240 3.7% 15.9%;
+    --input: 240 3.7% 15.9%;
+    --ring: 240 4.9% 83.9%;
+    --radius: 0.5rem;
 
     --success: 109 55% 28%;
     --success-foreground: 109 55% 28%;
 
-    --ring: 216 34% 17%;
-
-    --radius: 0.5rem;
+    --attention: 45, 90%, 45%, 0.8;
+    --attention-foreground: 60 98.4% 48.8% 0.82;
   }
 }
 
@@ -104,7 +84,19 @@
   .code-sample span {
     @apply bg-zinc-950;
   }
+  input.error {
+    @apply border-red-400;
+  }
+
+  label.error {
+    @apply text-destructive;
+  }
+
+  input.error:focus-visible {
+    @apply ring-destructive;
+  }
 }
+
 input[type="range"] {
   display: inline-block;
   vertical-align: middle;
@@ -214,11 +206,3 @@ input[type="range"]::-ms-track {
   overflow: hidden;
   transition: all 0.2s;
 }
-
-input.error {
-  @apply border-red-400;
-}
-
-label.error {
-  @apply text-destructive;
-}

data/app/components/shadcn/form_builder.rb

@@ -37,7 +37,18 @@ class Shadcn::FormBuilder < ActionView::Helpers::FormBuilder
       type: "email", **options
     )
   end
-
+  
+  def text_area(method, options = {})
+    error_class = @object.errors[method].any? ? "error" : ""
+    options[:class] = @template.tw("#{options[:class]} #{error_class}")
+    @template.render_textarea(
+      name: "#{object_name}[#{method}]",
+      id: "#{object_name}_#{method}",
+      value: @object.send(method),
+      type: "text", **options
+    )
+  end
+  
   def submit(value = nil, options = {})
     @template.render_button(value, **options)
   end

data/app/helpers/components/badge_helper.rb

@@ -1,7 +1,7 @@
 module Components::BadgeHelper
   def render_badge(label = "", data: "", text: "", variant: :default, **options)
     badge_classes = " inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2  "
-    varianet_classes = case variant.to_sym
+    variant_classes = case variant.to_sym
     when :default
       ComponentsHelper::PRIMARY_CLASSES
     when :secondary
@@ -13,7 +13,7 @@ module Components::BadgeHelper
     when :ghost
       ComponentsHelper::GHOST_CLASSES
     end
-    badge_classes << " #{varianet_classes}"
+    badge_classes << " #{variant_classes}"
     text = label if label.present?
 
     content_tag :div, class: badge_classes do

data/app/helpers/components/button_helper.rb

@@ -1,7 +1,7 @@
 module Components::ButtonHelper
   def render_button(label = "", text: nil, variant: :default, as: :button, href: nil, data: {}, **options, &block)
     button_classes = " inline-flex items-center justify-center 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 h-10 px-4 py-2 "
-    varianet_classes = case variant.to_sym
+    variant_classes = case variant.to_sym
     when :default
       " bg-primary text-primary-foreground hover:bg-primary/90 "
     when :secondary
@@ -13,8 +13,8 @@ module Components::ButtonHelper
     when :ghost
       " hover:bg-accent hover:text-accent-foreground  "
     end
-    button_classes << " #{varianet_classes} #{options[:class]}"
-    button_classes = tw(button_classes)
+    button_classes = tw(button_classes, variant_classes, options[:class])
+
     text = label if label.present?
     text = capture(&block) if block
     render "components/ui/button", text:, button_classes:, as:, href:, data:, **options

data/app/helpers/components/filter_helper.rb

@@ -9,4 +9,8 @@ module Components::FilterHelper
     input_class = content_for?(:filter_icon) ? "pl-1" : ""
     render "components/ui/filter", items: items, options: options, input_class: input_class, content: content
   end
+
+  def list_item(:value, :name, :selected)
+     "#{name}"
+  end
 end

data/app/helpers/components/input_helper.rb

@@ -10,14 +10,15 @@ module Components::InputHelper
     options[:class] = tw(options[:class])
 
     options.reverse_merge!(
-      label: (options[:lable] || false),
+      label: (options[:label] || false),
       required: (options[:required] || false),
       disabled: (options[:disabled] || false),
       readonly: (options[:readonly] || false),
       placeholder: (options[:placeholder] || ""),
       autocomplete: (options[:autocomplete] || ""),
       autocapitalize: (options[:autocapitalize] || nil),
-      autocorrect: (options[:autocorrect] || nil)
+      autocorrect: (options[:autocorrect] || nil),
+      autofocus: (options[:autofocus] || nil)
     )
     render partial: "components/ui/input", locals: {
       type:,

data/app/javascript/controllers/ui/dialog_controller.js

@@ -61,6 +61,9 @@ export default class UIDialog extends Controller {
   closeBy(target) {
     this.toggleClass(false);
 
+    if (target.getAttribute('data-ui--dialog-target') === 'modal') {
+      document.body.classList.remove("overflow-hidden");
+    }
     this.dispatch("closed", { detail: { target: target } });
   }
 

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

@@ -1,4 +1,4 @@
-<div class="rounded-lg border bg-card text-card-foreground shadow-sm w-[350px] <%= options[:class] %>">
+<div class="<%= tw("rounded-lg border bg-card text-card-foreground shadow-sm w-[350px]", options[:class]) %">
   <% if title || subtitle %>
   <div class="flex flex-col space-y-1.5 p-6">
     <% if title %>

data/app/views/components/ui/_textarea.html.erb

@@ -1,9 +1,9 @@
 <textarea
-  class="flex min-h-[80px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 <%= options[:class] %>"
+  class="<%= tw("flex min-h-[80px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", options[:class]) %>"
   placeholder="<%= options[:placeholder] %>"
   name="<%= name %>"
   id="<% id %>"
   <%= options[:disabled] ? "disabled" : "" %>
   <%= options[:required] ? "required" : "" %>
   <%= options[:readonly] ? "readonly" : "" %>
-  <%= options[:rows] ? "rows" : "" %>></textarea>
+  <%= options[:rows] ? "rows" : "" %>><%= value %></textarea>

data/app/views/examples/components/dropdown-menu.html.erb

@@ -2,7 +2,7 @@
       description: "Displays a menu to the user — such as a set of actions or functions — triggered by a button." %>
 
 <%= content_for :preview, flush: true do %>
-  <% render_dropdown_menu do %>
+  <%= render_dropdown_menu do %>
     <%= dropdown_menu_trigger do %>
       <%= render_button "Open Dropdown", variant: :outline %>
     <% end %>

data/lib/shadcn-ui/version.rb

@@ -1,3 +1,3 @@
 module ShadcnUi
-  VERSION = "0.0.12"
+  VERSION = "0.0.13"
 end

data/shadcn-ui.gemspec

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+require_relative "lib/shadcn-ui/shadcn-ui"
+
+Gem::Specification.new do |spec|
+  spec.name = "shadcn-ui"
+  spec.version = ShadcnUi::VERSION
+  spec.authors = ["Avi Flombaum"]
+  spec.email = ["git@avi.nyc"]
+
+  spec.homepage = "https://shadcn.rails-components.com"
+  spec.summary = "Provides the shadcn-ui component library to a Ruby on Rails application."
+  spec.description = "This gem is a documentation site and gem that will copy components from the shadcn-ui library into a Ruby on Rails application."
+  spec.homepage = "https://github.com/aviflombaum/shadcn-rails"
+  spec.license = "MIT"
+  spec.required_ruby_version = ">= 2.6.0"
+
+  spec.metadata["homepage_uri"] = spec.homepage
+  spec.metadata["source_code_uri"] = "https://github.com/aviflombaum/shadcn-rails"
+  spec.metadata["changelog_uri"] = "https://github.com/aviflombaum/shadcn-rails/tree/main/CHANGELOG.md"
+
+  # Specify which files should be added to the gem when it is released.
+  # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
+  spec.files = Dir.chdir(__dir__) do
+    `git ls-files -z`.split("\x0").reject do |f|
+      (File.expand_path(f) == __FILE__) ||
+        f.start_with?(*%w[bin/ test/ spec/ features/ .git .circleci appveyor Gemfile])
+    end
+  end
+  spec.bindir = "bin"
+  spec.executables = spec.files.grep(%r{\Aexe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  # Uncomment to register a new dependency of your gem
+  spec.add_dependency "tailwind_merge", "~> 0.7"
+
+  # For more information and examples about making a new gem, check out our
+  # guide at: https://bundler.io/guides/creating_gem.html
+end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: shadcn-ui
 version: !ruby/object:Gem::Version
-  version: 0.0.12
+  version: 0.0.13
 platform: ruby
 authors:
 - Avi Flombaum
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-09-04 00:00:00.000000000 Z
+date: 2024-04-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: tailwind_merge
@@ -368,6 +368,7 @@ files:
 - public/favicon.ico
 - public/og.jpg
 - public/robots.txt
+- shadcn-ui.gemspec
 - sig/shadcn-ui.rbs
 - storage/.keep
 - tmp/.keep
@@ -397,7 +398,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.4.18
+rubygems_version: 3.5.4
 signing_key:
 specification_version: 4
 summary: Provides the shadcn-ui component library to a Ruby on Rails application.