add combobox and v1 of rbui

Gemfile

@@ -73,7 +73,7 @@ group :test do
 end
 
 gem "phlex-rails"
-gem "phlex_ui", github: "PhlexUI/phlex_ui", branch: "main"
+gem "phlex_ui", github: "PhlexUI/phlex_ui", branch: "v1"
 # gem "phlex_ui", path: "../phlex_ui"
 
 gem "dockerfile-rails", ">= 1.6", group: :development

Gemfile.lock

@@ -1,12 +1,12 @@
 GIT
   remote: https://github.com/PhlexUI/phlex_ui.git
-  revision: ba2cc503725ea8a9dd25648201dbd79a27a44691
-  branch: main
+  revision: ade1fb28ff5695fb70e28dd1453ad2106f479eff
+  branch: v1
   specs:
     phlex_ui (0.1.10)
-      activesupport (>= 6.0)
-      phlex (~> 1.11)
+      phlex (~> 1.10)
       rouge (~> 4.2.0)
+      tailwind_merge (>= 0.12)
       zeitwerk (~> 2.6)
 
 GEM
@@ -145,6 +145,7 @@ GEM
       view_component (>= 2.0)
       yard (~> 0.9)
       zeitwerk (~> 2.5)
+    lru_redux (1.1.0)
     lucide-rails (0.4.0)
       railties (>= 4.1.0)
     mail (2.8.1)
@@ -294,6 +295,8 @@ GEM
       railties (>= 6.0.0)
     stringio (3.1.1)
     strscan (3.1.0)
+    tailwind_merge (0.12.0)
+      lru_redux (~> 1.1)
     thor (1.3.1)
     timeout (0.4.1)
     turbo-rails (2.0.6)

app/controllers/docs_controller.rb

@@ -86,6 +86,10 @@ def collapsible
     render Docs::CollapsibleView.new
   end
 
+  def combobox
+    render Docs::ComboboxView.new
+  end
+
   def command
     render Docs::CommandView.new
   end

app/javascript/application.js

@@ -1,4 +1,5 @@
 // Entry point for the build script in your package.json
-import "@hotwired/turbo-rails"
-import "phlex_ui"
-import "./controllers"
+import "@hotwired/turbo-rails";
+import "rbui-js";
+import "phlex_ui";
+import "./controllers";

app/views/application_view.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 class ApplicationView < ApplicationComponent
+  include RBUI
   # The ApplicationView is an abstract class for all your views.
 
   # By default, it inherits from `ApplicationComponent`, but you

app/views/docs/combobox_view.rb

@@ -0,0 +1,67 @@
+# frozen_string_literal: true
+
+class Docs::ComboboxView < ApplicationView
+  def view_template
+    div(class: "max-w-2xl mx-auto w-full py-10 space-y-10") do
+      render Docs::Header.new(title: "Combobox", description: "Autocomplete input and command palette with a list of suggestions.", premium: @premium)
+
+      TypographyH2 { "Usage" }
+
+      render Docs::VisualCodeExample.new(title: "Example", context: self, premium: @premium) do
+        <<~RUBY
+          Combobox do
+            ComboboxTrigger(placeholder: "Select event...", aria_controls: "list")
+            ComboboxContent(id: "list") do
+              ComboboxSearchInput(placeholder: "Search event...")
+              ComboboxList do
+                ComboboxEmpty { "No results found." }
+                ComboboxGroup(heading: "Suggestions") do
+                  ComboboxItem(value: "railsworld") do
+                    span { "Rails World" }
+                  end
+                  ComboboxItem(value: "tropicalrb") do
+                    span { "Tropical.rb" }
+                  end
+                  ComboboxItem(value: "friendly.rb") do
+                    span { "Friendly.rb" }
+                  end
+                end
+
+                ComboboxSeparator()
+
+                ComboboxGroup(heading: "Others") do
+                  ComboboxItem(value: "railsconf") do
+                    span { "RailsConf" }
+                  end
+                  ComboboxItem(value: "euruko") do
+                    span { "Euruko" }
+                  end
+                  ComboboxItem(value: "rubykaigi") do
+                    span { "RubyKaigi" }
+                  end
+                end
+              end
+            end
+          end
+        RUBY
+      end
+      render Docs::ComponentsTable.new(components)
+    end
+  end
+
+  private
+
+  def components
+    [
+      Docs::ComponentStruct.new(name: "ComboboxController", source: "https://github.com/PhlexUI/phlex_ui_stimulus_pro/blob/main/controllers/command_controller.js", built_using: :stimulus),
+      Docs::ComponentStruct.new(name: "ComboboxSeparator", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/dialog.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxTrigger", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/dialog_trigger.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxContent", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/dialog_content.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "Combobox", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxSearchInput", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/input.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxList", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/list.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxGroup", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/group.rb", built_using: :phlex),
+      Docs::ComponentStruct.new(name: "ComboboxItem", source: "https://github.com/PhlexUI/phlex_ui_pro/blob/main/lib/phlex_ui_pro/command/item.rb", built_using: :phlex)
+    ]
+  end
+end

config/routes.rb

@@ -29,6 +29,7 @@
     get "checkbox", to: "docs#checkbox", as: :docs_checkbox
     get "codeblock", to: "docs#codeblock", as: :docs_codeblock
     get "collapsible", to: "docs#collapsible", as: :docs_collapsible
+    get "combobox", to: "docs#combobox", as: :docs_combobox
     get "command", to: "docs#command", as: :docs_command
     get "context_menu", to: "docs#context_menu", as: :docs_context_menu
     get "date_picker", to: "docs#date_picker", as: :docs_date_picker

package.json

@@ -10,8 +10,9 @@
     "clsx": "2.1.1",
     "esbuild": "0.23.0",
     "lottie-web": "5.12.2",
-    "phlex_ui": "0.1.5",
+    "phlex_ui": "https://github.com/PhlexUI/phlex_ui_stimulus.git",
     "postcss": "8.4.40",
+    "rbui-js": "https://github.com/PhlexUI/phlex_ui.git#v1",
     "tailwindcss": "3.4.7",
     "tailwindcss-animate": "1.0.7"
   },
@@ -20,4 +21,4 @@
     "build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify"
   },
   "packageManager": "[email protected]"
-}
+}