diff --git a/app/components/component_setup/cli_steps.rb b/app/components/component_setup/cli_steps.rb new file mode 100644 index 0000000..36a1536 --- /dev/null +++ b/app/components/component_setup/cli_steps.rb @@ -0,0 +1,53 @@ +module Components + module ComponentSetup + class CLISteps < Components::Base + def initialize(component_name:) + @component_name = component_name + end + + private + + attr_reader :component_name + + def view_template + div(class: "max-w-2xl mx-auto w-full py-10 space-y-6") do + Heading(level: 4, class: "pb-4 border-b") { "Using RubyUI CLI" } + Text do + "We provide a Ruby gem with useful generators to help you to setup RubyUI components in your apps." + end + + render Steps::Builder.new do |steps| + steps.add_step do + render Steps::Container do + Text(size: "4", weight: "semibold") do + plain "Add RubyUI gem to your Gemfile if you don't have it yet" + end + + code = <<~CODE + bundle add ruby_ui --group development --require false + CODE + div(class: "w-full") do + Codeblock(code, syntax: :javascript) + end + end + end + steps.add_step do + render Steps::Container do + Text(size: "4", weight: "semibold") do + "Run the install command" + end + + code = <<~CODE + rails g ruby_ui:component #{component_name.camelcase} + CODE + div(class: "w-full") do + Codeblock(code, syntax: :javascript) + end + end + end + end + end + end + end + end +end diff --git a/app/components/component_setup/tabs.rb b/app/components/component_setup/tabs.rb new file mode 100644 index 0000000..f5d20df --- /dev/null +++ b/app/components/component_setup/tabs.rb @@ -0,0 +1,32 @@ +module Components + module ComponentSetup + class Tabs < Components::Base + def initialize(component_name:) + @component_name = component_name + end + + private + + attr_reader :component_name + + def view_template + Heading(level: 2) { "Installation" } + + Tabs(default_value: "cli", class: "w-full") do + TabsList do + TabsTrigger(value: "cli") { "CLI" } + TabsTrigger(value: "manual") { "Manual" } + end + + TabsContent(value: "cli") do + render CLISteps.new(component_name:) + end + + TabsContent(value: "manual") do + Text { "Coming soon" } + end + end + end + end + end +end diff --git a/app/views/components/shared/menu.rb b/app/views/components/shared/menu.rb index cf1cb97..8834421 100644 --- a/app/views/components/shared/menu.rb +++ b/app/views/components/shared/menu.rb @@ -68,8 +68,8 @@ def components {name: "Avatar", path: helpers.docs_avatar_path}, {name: "Badge", path: helpers.docs_badge_path}, {name: "Button", path: helpers.docs_button_path}, - {name: "Card", path: helpers.docs_card_path}, {name: "Calendar", path: helpers.docs_calendar_path}, + {name: "Card", path: helpers.docs_card_path}, # { name: "Chart", path: helpers.docs_chart_path, badge: "New" }, {name: "Checkbox", path: helpers.docs_checkbox_path}, {name: "Checkbox Group", path: helpers.docs_checkbox_group_path}, @@ -83,8 +83,8 @@ def components {name: "Dialog / Modal", path: helpers.docs_dialog_path}, {name: "Dropdown Menu", path: helpers.docs_dropdown_menu_path}, {name: "Form", path: helpers.docs_form_path}, - {name: "Input", path: helpers.docs_input_path}, {name: "Hover Card", path: helpers.docs_hover_card_path}, + {name: "Input", path: helpers.docs_input_path}, {name: "Link", path: helpers.docs_link_path}, {name: "Masked Input", path: helpers.masked_input_path}, {name: "Pagination", path: helpers.docs_pagination_path, badge: "New"}, diff --git a/app/views/components/steps/container.rb b/app/views/components/steps/container.rb new file mode 100644 index 0000000..a474230 --- /dev/null +++ b/app/views/components/steps/container.rb @@ -0,0 +1,9 @@ +# frozen_string_literal: true + +module Steps + class Container < ApplicationComponent + def view_template(&) + div(class: "space-y-4", &) + end + end +end diff --git a/app/views/docs/accordion_view.rb b/app/views/docs/accordion_view.rb index 8250aad..5516587 100644 --- a/app/views/docs/accordion_view.rb +++ b/app/views/docs/accordion_view.rb @@ -45,6 +45,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/alert_dialog_view.rb b/app/views/docs/alert_dialog_view.rb index 4a47b14..99cd6f3 100644 --- a/app/views/docs/alert_dialog_view.rb +++ b/app/views/docs/alert_dialog_view.rb @@ -27,6 +27,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/alert_view.rb b/app/views/docs/alert_view.rb index 8ac39af..de05f44 100644 --- a/app/views/docs/alert_view.rb +++ b/app/views/docs/alert_view.rb @@ -57,6 +57,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/aspect_ratio_view.rb b/app/views/docs/aspect_ratio_view.rb index 17bcf41..acb0083 100644 --- a/app/views/docs/aspect_ratio_view.rb +++ b/app/views/docs/aspect_ratio_view.rb @@ -60,6 +60,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/avatar_view.rb b/app/views/docs/avatar_view.rb index f0151ab..4189a18 100644 --- a/app/views/docs/avatar_view.rb +++ b/app/views/docs/avatar_view.rb @@ -84,6 +84,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/badge_view.rb b/app/views/docs/badge_view.rb index e6566c7..ef3abae 100644 --- a/app/views/docs/badge_view.rb +++ b/app/views/docs/badge_view.rb @@ -2,6 +2,8 @@ class Docs::BadgeView < ApplicationView def view_template + component = "Badge" + div(class: "max-w-2xl mx-auto w-full py-10 space-y-10") do render Docs::Header.new(title: "Badge", description: "Displays a badge or a component that looks like a badge.") @@ -69,8 +71,10 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + # components - render Docs::ComponentsTable.new(component_files("Badge")) + render Docs::ComponentsTable.new(component_files(component)) end end end diff --git a/app/views/docs/button_view.rb b/app/views/docs/button_view.rb index 22771e4..1cc2217 100644 --- a/app/views/docs/button_view.rb +++ b/app/views/docs/button_view.rb @@ -2,6 +2,8 @@ class Docs::ButtonView < ApplicationView def view_template + component = "Button" + div(class: "max-w-2xl mx-auto w-full py-10 space-y-10") do render Docs::Header.new(title: "Button", description: "Displays a button or a component that looks like a button.") @@ -121,7 +123,9 @@ def view_template RUBY end - render Docs::ComponentsTable.new(component_files("Button")) + render Components::ComponentSetup::Tabs.new(component_name: component) + + render Docs::ComponentsTable.new(component_files(component)) end end end diff --git a/app/views/docs/calendar_view.rb b/app/views/docs/calendar_view.rb index 59d1676..65afd00 100644 --- a/app/views/docs/calendar_view.rb +++ b/app/views/docs/calendar_view.rb @@ -26,6 +26,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/card_view.rb b/app/views/docs/card_view.rb index f7292eb..2b1d85f 100644 --- a/app/views/docs/card_view.rb +++ b/app/views/docs/card_view.rb @@ -74,6 +74,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/chart_view.rb b/app/views/docs/chart_view.rb index ef24af2..9ba2077 100644 --- a/app/views/docs/chart_view.rb +++ b/app/views/docs/chart_view.rb @@ -98,6 +98,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: "Chart") + render Docs::ComponentsTable.new(components) end end diff --git a/app/views/docs/checkbox_group_view.rb b/app/views/docs/checkbox_group_view.rb index 8985828..85f504b 100644 --- a/app/views/docs/checkbox_group_view.rb +++ b/app/views/docs/checkbox_group_view.rb @@ -71,6 +71,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/checkbox_view.rb b/app/views/docs/checkbox_view.rb index 96ccea5..412de5f 100644 --- a/app/views/docs/checkbox_view.rb +++ b/app/views/docs/checkbox_view.rb @@ -33,6 +33,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/clipboard_view.rb b/app/views/docs/clipboard_view.rb index fc4a3f6..4d711c2 100644 --- a/app/views/docs/clipboard_view.rb +++ b/app/views/docs/clipboard_view.rb @@ -22,6 +22,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/codeblock_view.rb b/app/views/docs/codeblock_view.rb index 546c5f5..38b3c82 100644 --- a/app/views/docs/codeblock_view.rb +++ b/app/views/docs/codeblock_view.rb @@ -47,6 +47,8 @@ def hello_world RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/collapsible_view.rb b/app/views/docs/collapsible_view.rb index a94ac86..c53565d 100644 --- a/app/views/docs/collapsible_view.rb +++ b/app/views/docs/collapsible_view.rb @@ -70,6 +70,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/combobox_view.rb b/app/views/docs/combobox_view.rb index bf26cba..162052e 100644 --- a/app/views/docs/combobox_view.rb +++ b/app/views/docs/combobox_view.rb @@ -53,6 +53,9 @@ def view_template end RUBY end + + render Components::ComponentSetup::Tabs.new(component_name: "Combobox") + render Docs::ComponentsTable.new(component_files("Combobox")) end end diff --git a/app/views/docs/command_view.rb b/app/views/docs/command_view.rb index 6df16ca..dac3fac 100644 --- a/app/views/docs/command_view.rb +++ b/app/views/docs/command_view.rb @@ -93,6 +93,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/context_menu_view.rb b/app/views/docs/context_menu_view.rb index 88f06e1..7546a65 100644 --- a/app/views/docs/context_menu_view.rb +++ b/app/views/docs/context_menu_view.rb @@ -77,6 +77,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/date_picker_view.rb b/app/views/docs/date_picker_view.rb index ee85868..28a8449 100644 --- a/app/views/docs/date_picker_view.rb +++ b/app/views/docs/date_picker_view.rb @@ -27,6 +27,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/dialog_view.rb b/app/views/docs/dialog_view.rb index 54976df..7292872 100644 --- a/app/views/docs/dialog_view.rb +++ b/app/views/docs/dialog_view.rb @@ -97,6 +97,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/dropdown_menu_view.rb b/app/views/docs/dropdown_menu_view.rb index 4e2a0d1..01de6df 100644 --- a/app/views/docs/dropdown_menu_view.rb +++ b/app/views/docs/dropdown_menu_view.rb @@ -222,6 +222,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/form_view.rb b/app/views/docs/form_view.rb index fefaf29..8f4c991 100644 --- a/app/views/docs/form_view.rb +++ b/app/views/docs/form_view.rb @@ -140,6 +140,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/hover_card_view.rb b/app/views/docs/hover_card_view.rb index 5f1bab6..82ed987 100644 --- a/app/views/docs/hover_card_view.rb +++ b/app/views/docs/hover_card_view.rb @@ -52,6 +52,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/input_view.rb b/app/views/docs/input_view.rb index 0ce2027..22bd624 100644 --- a/app/views/docs/input_view.rb +++ b/app/views/docs/input_view.rb @@ -52,6 +52,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/link_view.rb b/app/views/docs/link_view.rb index 8189f3e..d1ff35d 100644 --- a/app/views/docs/link_view.rb +++ b/app/views/docs/link_view.rb @@ -56,6 +56,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/masked_input_view.rb b/app/views/docs/masked_input_view.rb index 82619a2..ab1a716 100644 --- a/app/views/docs/masked_input_view.rb +++ b/app/views/docs/masked_input_view.rb @@ -39,6 +39,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/pagination_view.rb b/app/views/docs/pagination_view.rb index f8c3c7c..a28c135 100644 --- a/app/views/docs/pagination_view.rb +++ b/app/views/docs/pagination_view.rb @@ -43,6 +43,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/popover_view.rb b/app/views/docs/popover_view.rb index d8ed08e..05aac92 100644 --- a/app/views/docs/popover_view.rb +++ b/app/views/docs/popover_view.rb @@ -963,6 +963,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/select_view.rb b/app/views/docs/select_view.rb index e6d9792..acf7af4 100644 --- a/app/views/docs/select_view.rb +++ b/app/views/docs/select_view.rb @@ -31,6 +31,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/sheet_view.rb b/app/views/docs/sheet_view.rb index 269f707..96a6b91 100644 --- a/app/views/docs/sheet_view.rb +++ b/app/views/docs/sheet_view.rb @@ -68,6 +68,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/shortcut_key_view.rb b/app/views/docs/shortcut_key_view.rb index 7841d40..85bec7c 100644 --- a/app/views/docs/shortcut_key_view.rb +++ b/app/views/docs/shortcut_key_view.rb @@ -21,6 +21,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/table_view.rb b/app/views/docs/table_view.rb index 05de731..1efb546 100644 --- a/app/views/docs/table_view.rb +++ b/app/views/docs/table_view.rb @@ -44,6 +44,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/tabs_view.rb b/app/views/docs/tabs_view.rb index 24d0e56..a62b083 100644 --- a/app/views/docs/tabs_view.rb +++ b/app/views/docs/tabs_view.rb @@ -107,6 +107,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/textarea_view.rb b/app/views/docs/textarea_view.rb index 969e109..5572fce 100644 --- a/app/views/docs/textarea_view.rb +++ b/app/views/docs/textarea_view.rb @@ -39,6 +39,8 @@ def view_template end end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/theme_toggle_view.rb b/app/views/docs/theme_toggle_view.rb index 75d9e75..605a356 100644 --- a/app/views/docs/theme_toggle_view.rb +++ b/app/views/docs/theme_toggle_view.rb @@ -63,6 +63,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/tooltip_view.rb b/app/views/docs/tooltip_view.rb index 2e8786b..4e27eb1 100644 --- a/app/views/docs/tooltip_view.rb +++ b/app/views/docs/tooltip_view.rb @@ -24,6 +24,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/app/views/docs/typography_view.rb b/app/views/docs/typography_view.rb index f6f111e..135de51 100644 --- a/app/views/docs/typography_view.rb +++ b/app/views/docs/typography_view.rb @@ -99,6 +99,8 @@ def view_template RUBY end + render Components::ComponentSetup::Tabs.new(component_name: component) + render Docs::ComponentsTable.new(component_files(component)) end end diff --git a/config/initializers/inflections.rb b/config/initializers/inflections.rb index 3860f65..ddf7cf8 100644 --- a/config/initializers/inflections.rb +++ b/config/initializers/inflections.rb @@ -11,6 +11,6 @@ # end # These inflection rules are supported but not enabled by default: -# ActiveSupport::Inflector.inflections(:en) do |inflect| -# inflect.acronym "RESTful" -# end +ActiveSupport::Inflector.inflections(:en) do |inflect| + inflect.acronym "CLI" +end