jet_ui 0.2.6 → 0.2.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: efe57dd136891f58327f2aed1a96f910ff7abd5a8b84de101478840e9e3e038e
-  data.tar.gz: 51f5c493690b7cac04d13dd8e8c9bc2ac0294c00c943ef593a528c4493471b4a
+  metadata.gz: 7d81819a27f5eda163c7f4dd9d8b12973ae46cc82932cd1f272b59f40e2bf55d
+  data.tar.gz: de6951399df6add4915be32c9d55f1cdc1a9b1be4e090039f4d055bed24f4987
 SHA512:
-  metadata.gz: a4a32d30ee92783c2ab643cda03987f66cab7dba666afd8fdeb3fcea336c3835b6b9f61da4a2a423efcb89d600239a8e6dfd7f0b4479781e33593e78d9f0fa16
-  data.tar.gz: bdd0a366d4f2bac9e35a9a622835e499e3000541a6b143f5c357029c697e7efd20b7a9b5379f5c085c476f33cad25d409b369bff93f17ac7e360cf2627e488f1
+  metadata.gz: 9259ec8446ed0c0c6d6f790ad00c27e9f24c93cd065a3d6bba7fe07a5068b079ea1e70de6e70b47d37a2e4ecf25c211bca85a3ec1c940d991215273710aba7f1
+  data.tar.gz: e2c5e84a989af0b3e935e4f39bb0cfa3c0653e235f5839fe23ee39736349b749cba938b20f3511ad620f09d65ceaff27e92638d5b3f8d1506cea6ab4e61649fc

data/CHANGELOG.md

@@ -7,6 +7,29 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.2.8] - 2026-07-09
+
+### Added
+- `@jetrockets/jet-ui` npm package for Vite/esbuild/Webpack users — import Stimulus controllers without vendoring
+- `JsRuntime` module for auto-detecting JS bundler (Vite, esbuild, Webpack) vs importmap
+- `jet_ui:install` generator now detects runtime and prints runtime-specific setup instructions
+
+### Fixed
+- Importmap crash (`Errno::EISDIR`) — removed invalid directory path from `importmap.paths`
+
+## [0.2.7] - 2026-05-29
+
+### Added
+- Generator tests for `jet_ui:eject` and `jet_ui:install`
+
+### Changed
+- `jet_ui:eject --help` now lists all available components derived directly from `MANIFEST` — always accurate, never stale
+- `jet_ui:install --help` updated with gem overview and pointer to `jet_ui:eject --help`
+- Upgrade development Ruby version to 4.0.5
+
+### Removed
+- Stale `USAGE` files for `eject` and `install` generators — superseded by the class-level `desc`
+
 ## [0.2.6] - 2026-05-13
 
 ### Changed

data/README.md

@@ -37,6 +37,36 @@ The generator:
 
 When the gem is updated, both CSS and JS are picked up automatically — no further changes needed. Safe to re-run after upgrades.
 
+### Alternative: npm package (Vite)
+
+The above (importmap) setup needs no npm install — the gem ships the controllers itself. If your app bundles JavaScript with Vite instead, run the install generator: it detects Vite, **installs the `@jetrockets/jet_ui` npm package** for you (running `yarn add @jetrockets/jet_ui`, or the npm/pnpm/bun equivalent it detects), and prints the wiring steps:
+
+```bash
+rails generate jet_ui:install
+# detects Vite → runs: yarn add @jetrockets/jet_ui
+```
+
+Then register the controllers you use (`@hotwired/stimulus` is a peer dependency):
+
+```javascript
+import { ModalController } from "@jetrockets/jet_ui"
+
+application.register("modal", ModalController)
+```
+
+Import the component styles in your Tailwind/CSS entry point:
+
+```css
+@import "@jetrockets/jet_ui/css";
+```
+
+Or, if you'd rather manage styles through the bundler than the Rails asset pipeline, import the CSS straight from JavaScript:
+
+```javascript
+import "@jetrockets/jet_ui/css"          // all component styles
+import "@jetrockets/jet_ui/css/btn.css"  // a single component
+```
+
 ## Usage
 
 The `jet_ui` helper is available in all views:

data/lib/generators/jet_ui/eject/eject_generator.rb

@@ -9,35 +9,6 @@ module JetUi
         [File.expand_path('../../../..', __dir__)]
       end
 
-      desc <<~DESC
-        Copies one or more JetUi component source files into your application
-        so they can be customised locally. Ejected files take precedence over
-        the gem's built-in versions automatically — no extra configuration needed.
-
-        Available components: #{%w[accordion btn card clipboard divider drawer dropdown empty flash header icon list modal navbar pagy popover sidebar spinner stat stepper table tabs timeline tooltip turbo_confirm].join(', ')}
-
-        Examples:
-          rails generate jet_ui:eject btn
-          rails generate jet_ui:eject flash
-          rails generate jet_ui:eject modal drawer
-          rails generate jet_ui:eject btn --skip-test
-          rails generate jet_ui:eject btn --skip-preview
-          rails generate jet_ui:eject flash --skip-javascript
-          rails generate jet_ui:eject btn --skip-test --skip-preview
-      DESC
-
-      argument :components, type: :array, banner: 'component [component ...]',
-                            desc: 'One or more component names to eject (e.g. btn card)'
-
-      class_option :skip_test, type: :boolean, default: false,
-                               desc: 'Skip ejecting the component test file'
-
-      class_option :skip_preview, type: :boolean, default: false,
-                                  desc: 'Skip ejecting the ViewComponent preview file'
-
-      class_option :skip_javascript, type: :boolean, default: false,
-                                     desc: 'Skip ejecting the Stimulus controller JS file (for components that have one)'
-
       MANIFEST = {
         'btn' => {
           files: [
@@ -338,11 +309,41 @@ module JetUi
         }
       }.freeze
 
+      desc <<~DESC
+        Copies one or more JetUi component source files into your application
+        so they can be customised locally. Ejected files take precedence over
+        the gem's built-in versions automatically — no extra configuration needed.
+
+        Available components (#{MANIFEST.size}):
+        #{MANIFEST.keys.sort.join(', ')}
+
+        Examples:
+          rails generate jet_ui:eject btn
+          rails generate jet_ui:eject flash
+          rails generate jet_ui:eject modal drawer
+          rails generate jet_ui:eject btn --skip-test
+          rails generate jet_ui:eject btn --skip-preview
+          rails generate jet_ui:eject flash --skip-javascript
+          rails generate jet_ui:eject btn --skip-test --skip-preview
+      DESC
+
+      argument :components, type: :array, banner: 'component [component ...]',
+                            desc: 'One or more component names to eject (e.g. btn card)'
+
+      class_option :skip_test, type: :boolean, default: false,
+                               desc: 'Skip ejecting the component test file'
+
+      class_option :skip_preview, type: :boolean, default: false,
+                                  desc: 'Skip ejecting the ViewComponent preview file'
+
+      class_option :skip_javascript, type: :boolean, default: false,
+                                     desc: 'Skip ejecting the Stimulus controller JS file (for components that have one)'
+
       def eject_components
         unknown = components.map(&:downcase) - MANIFEST.keys
         if unknown.any?
           say "\nUnknown component(s): #{unknown.join(', ')}", :red
-          say "Available: #{MANIFEST.keys.join(', ')}\n", :red
+          say "Available: #{MANIFEST.keys.join(', ')}", :red
           exit 1
         end
 

data/lib/generators/jet_ui/install/install_generator.rb

@@ -1,6 +1,8 @@
 # frozen_string_literal: true
 
 require 'rails/generators'
+require_relative '../eject/eject_generator'
+require_relative '../js_runtime'
 
 module JetUi
   module Generators
@@ -11,63 +13,52 @@ module JetUi
     class InstallGenerator < Rails::Generators::Base
       source_root File.expand_path('templates', __dir__)
 
+      class_option :skip_install, type: :boolean, default: false,
+                                  desc: 'Vite apps: skip running the package manager install, just print the command'
+
       desc <<~DESC
-        Sets up JetUi in your Rails application.
+        JetUi is a ViewComponent-based UI library for Rails — #{EjectGenerator::MANIFEST.size} ready-made
+        components styled with Tailwind CSS v4, matching the design system at
+        ui.jetrockets.com.
+
+        This generator detects how your app manages JavaScript and sets JetUi up
+        accordingly — no flags needed:
 
-        1. CSS — Detects your Tailwind source file and injects a single @import
-           that covers all JetUi component stylesheets. New components added in
-           future gem updates are picked up automatically on the next CSS build.
+        • Importmap apps — injects the gem's CSS @import into your Tailwind source
+          and adds eagerLoadControllersFrom("jet_ui", application) to your Stimulus
+          controllers index. Controllers are auto-registered, no npm needed.
 
-        2. JS — Adds eagerLoadControllersFrom("jet_ui", application) to your
-           Stimulus controllers index. All current and future JetUi Stimulus
-           controllers (flash, modal, etc.) are registered automatically when
-           you update the gem — no further changes needed.
+        • Vite apps — installs the npm package with your package manager and
+          prints the controller registration and stylesheet @import. Vite apps own
+          their JS/CSS entry points, so those are not modified automatically.
 
-        Safe to run multiple times — already-configured steps are skipped.
+        Safe to run multiple times — already-configured importmap steps are skipped.
 
-        Supported Tailwind source file locations:
+        Importmap Tailwind source files detected for the CSS @import:
           app/assets/tailwind/application.css
           app/assets/stylesheets/application.tailwind.css
           app/assets/stylesheets/application.postcss.css
 
+        To see all available components with descriptions:
+          rails generate jet_ui:eject --help
+
         Example:
           rails generate jet_ui:install
       DESC
 
-      def inject_css
-        if (file = tailwind_source_file)
-          content = File.read(File.join(destination_root, file))
-          if content.include?('jet_ui')
-            say "  JetUi CSS already imported in #{file}", :yellow
-          else
-            # Tailwind CSS v4: import each file with an absolute path so the
-            # Tailwind CLI can process @apply directives at build time.
-            append_to_file file, tailwind_imports
-            say "  Injected JetUi imports into #{file}", :green
-          end
-        else
-          say '  Could not detect a Tailwind CSS source file.', :yellow
-          say '  Add the following to your Tailwind CSS source manually:', :yellow
-          say tailwind_imports, :yellow
+      def show_runtime
+        case js_runtime
+        when :importmap then say '  Detected importmap — wiring JetUi via the gem.', :green
+        when :vite      then say '  Detected Vite — wiring JetUi via the npm package.', :green
+        else say '  Could not detect importmap or Vite — printing both setups.', :yellow
         end
       end
 
-      def inject_js
-        path = File.join(destination_root, JS_CONTROLLERS_FILE)
-        unless File.exist?(path)
-          say '  No Stimulus controllers index found — skipping JS setup.', :yellow
-          say '  If you use Stimulus, add this line to your controllers index manually:', :yellow
-          say %(    eagerLoadControllersFrom("jet_ui", application)), :yellow
-          return
-        end
-
-        if File.read(path).include?('jet_ui')
-          say "  JetUi controllers already registered in #{JS_CONTROLLERS_FILE}", :yellow
-        else
-          insert_into_file JS_CONTROLLERS_FILE, after: /eagerLoadControllersFrom\("controllers".*\n/ do
-            %(eagerLoadControllersFrom("jet_ui", application)\n)
-          end
-          say "  Registered JetUi controllers in #{JS_CONTROLLERS_FILE}", :green
+      def setup
+        case js_runtime
+        when :importmap then setup_importmap
+        when :vite      then setup_vite
+        else setup_unknown
         end
       end
 
@@ -89,6 +80,8 @@ module JetUi
         say "  rails generate jet_ui:eject btn card\n"
       end
 
+      NPM_PACKAGE = '@jetrockets/jet_ui'
+
       JS_CONTROLLERS_FILE = 'app/javascript/controllers/index.js'
 
       TAILWIND_SOURCE_FILES = %w[
@@ -99,10 +92,94 @@ module JetUi
 
       private
 
+      def js_runtime
+        @js_runtime ||= JsRuntime.detect(destination_root)
+      end
+
+      # --- importmap: auto-wire from the gem -------------------------------
+
+      def setup_importmap
+        inject_importmap_css
+        inject_importmap_controllers
+      end
+
+      def inject_importmap_css
+        file = tailwind_source_file
+        unless file
+          say '  Could not detect a Tailwind CSS source file.', :yellow
+          say '  Add the following to your Tailwind CSS source manually:', :yellow
+          say gem_css_import, :yellow
+          return
+        end
+
+        if File.read(File.join(destination_root, file)).include?('jet_ui')
+          say "  JetUi CSS already imported in #{file}", :yellow
+        else
+          # Tailwind CSS v4: import the gem's stylesheet by absolute path so the
+          # Tailwind CLI can process its @apply directives at build time.
+          append_to_file file, gem_css_import
+          say "  Injected JetUi CSS into #{file}", :green
+        end
+      end
+
+      def inject_importmap_controllers
+        path = File.join(destination_root, JS_CONTROLLERS_FILE)
+        unless File.exist?(path)
+          say '  No Stimulus controllers index found — add this line to it manually:', :yellow
+          say %(    eagerLoadControllersFrom("jet_ui", application)), :yellow
+          return
+        end
+
+        if File.read(path).include?('jet_ui')
+          say "  JetUi controllers already registered in #{JS_CONTROLLERS_FILE}", :yellow
+        else
+          insert_into_file JS_CONTROLLERS_FILE, after: /eagerLoadControllersFrom\("controllers".*\n/ do
+            %(eagerLoadControllersFrom("jet_ui", application)\n)
+          end
+          say "  Registered JetUi controllers in #{JS_CONTROLLERS_FILE}", :green
+        end
+      end
+
+      # --- vite: install the package, but never touch the app's entry points ---
+
+      def setup_vite
+        install_npm_package
+        say '  Ensure @hotwired/stimulus is installed — it is a peer dependency the controllers import.', :yellow
+        say '  Register the controllers you use, in your Stimulus controllers index:'
+        say %(    import { ModalController, DrawerController } from "#{NPM_PACKAGE}")
+        say %(    application.register("modal", ModalController))
+        say %(    application.register("drawer", DrawerController))
+        say '  Import the styles, in your Tailwind/CSS entry point:'
+        say %(    @import "#{NPM_PACKAGE}/css";)
+      end
+
+      def install_npm_package
+        command = JsRuntime.install_command(destination_root, NPM_PACKAGE)
+        if options[:skip_install]
+          say '  Skipped install — run it yourself:', :yellow
+          say "    #{command}"
+        else
+          say "  Installing #{NPM_PACKAGE}…", :green
+          run command
+        end
+      end
+
+      def setup_unknown
+        say '  Importmap apps — add to your Stimulus controllers index:', :yellow
+        say %(    eagerLoadControllersFrom("jet_ui", application))
+        say '  Vite apps — install the npm package and import its styles:', :yellow
+        say "    #{JsRuntime.install_command(destination_root, NPM_PACKAGE)}"
+        say %(    @import "#{NPM_PACKAGE}/css";)
+      end
+
       def tailwind_source_file
         TAILWIND_SOURCE_FILES.find { |f| File.exist?(File.join(destination_root, f)) }
       end
 
+      def gem_css_import
+        %(\n@import "#{File.join(gem_stylesheets_path, 'jet_ui.css')}";\n)
+      end
+
       def gem_stylesheets_path
         spec = begin
           Gem::Specification.find_by_name('jet_ui')
@@ -112,10 +189,6 @@ module JetUi
         base = spec&.gem_dir || File.expand_path('../../../../..', __dir__)
         File.join(base, 'app/assets/stylesheets')
       end
-
-      def tailwind_imports
-        %(\n@import "#{File.join(gem_stylesheets_path, 'jet_ui.css')}";\n)
-      end
     end
   end
 end

data/lib/generators/jet_ui/js_runtime.rb

@@ -0,0 +1,81 @@
+# frozen_string_literal: true
+
+require 'json'
+
+module JetUi
+  module Generators
+    # Detects how a host application manages its JavaScript, so the install
+    # generator can wire JetUi the right way without asking: pin controllers via
+    # importmap, or point the app at the npm package for Vite.
+    module JsRuntime
+      VITE_CONFIGS = %w[
+        vite.config.js vite.config.mjs vite.config.ts
+        config/vite.json
+      ].freeze
+
+      # Ordered: the first lockfile found wins.
+      PACKAGE_MANAGERS = {
+        'bun.lockb' => :bun,
+        'pnpm-lock.yaml' => :pnpm,
+        'yarn.lock' => :yarn,
+        'package-lock.json' => :npm
+      }.freeze
+
+      module_function
+
+      # Vite wins when both are present: a working Vite config is a stronger
+      # signal than a leftover config/importmap.rb.
+      def detect(root)
+        return :vite if vite?(root)
+        return :importmap if importmap?(root)
+
+        :unknown
+      end
+
+      def vite?(root)
+        VITE_CONFIGS.any? { |file| File.exist?(File.join(root, file)) } ||
+          package_json_vite?(root)
+      end
+
+      def importmap?(root)
+        File.exist?(File.join(root, 'config/importmap.rb'))
+      end
+
+      def package_manager(root)
+        PACKAGE_MANAGERS.each { |lock, name| return name if File.exist?(File.join(root, lock)) }
+        package_manager_field(root) || :npm
+      end
+
+      # corepack's `"packageManager": "yarn@4.5.0"` — the declared manager when
+      # there's no lockfile yet (e.g. a fresh vite_rails clone).
+      def package_manager_field(root)
+        path = File.join(root, 'package.json')
+        return unless File.exist?(path)
+
+        field = JSON.parse(File.read(path))['packageManager']
+        return unless field
+
+        PACKAGE_MANAGERS.values.find { |name| name.to_s == field.split('@').first }
+      rescue JSON::ParserError
+        nil
+      end
+
+      def install_command(root, package)
+        manager = package_manager(root)
+        verb = manager == :npm ? 'install' : 'add'
+
+        "#{manager} #{verb} #{package}"
+      end
+
+      def package_json_vite?(root)
+        path = File.join(root, 'package.json')
+        return false unless File.exist?(path)
+
+        deps = JSON.parse(File.read(path)).values_at('dependencies', 'devDependencies').compact
+        deps.flat_map(&:keys).include?('vite')
+      rescue JSON::ParserError
+        false
+      end
+    end
+  end
+end

data/lib/jet_ui/engine.rb

@@ -17,7 +17,6 @@ module JetUi
           root.join('app/assets/javascripts/jet_ui'),
           under: 'jet_ui'
         )
-        app.config.importmap.paths << root.join('app/assets/javascripts')
         app.config.importmap.cache_sweepers << root.join('app/assets/javascripts')
       end
     end

data/lib/jet_ui/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module JetUi
-  VERSION = '0.2.6'
+  VERSION = '0.2.8'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jet_ui
 version: !ruby/object:Gem::Version
-  version: 0.2.6
+  version: 0.2.8
 platform: ruby
 authors:
 - JetRockets
@@ -633,10 +633,9 @@ files:
 - app/components/jet_ui/turbo_confirm/component.html.erb
 - app/components/jet_ui/turbo_confirm/component.rb
 - app/helpers/jet_ui_helper.rb
-- lib/generators/jet_ui/eject/USAGE
 - lib/generators/jet_ui/eject/eject_generator.rb
-- lib/generators/jet_ui/install/USAGE
 - lib/generators/jet_ui/install/install_generator.rb
+- lib/generators/jet_ui/js_runtime.rb
 - lib/jet_ui.rb
 - lib/jet_ui/engine.rb
 - lib/jet_ui/version.rb

data/lib/generators/jet_ui/eject/USAGE

@@ -1,20 +0,0 @@
-Description:
-    Ejects one or more JetUi components into your application so they can
-    be customised locally. The ejected files take precedence over the gem's
-    built-in versions, similar to how `rails generate devise:views` works.
-
-    For components that include a Stimulus controller (e.g. flash), the JS
-    file is also ejected alongside the Ruby and CSS files.
-
-    Available components:
-      btn, card, icon, spinner, avatar, breadcrumbs, tabs, empty, list,
-      divider, timeline, stepper, table, pagy, flash
-
-Examples:
-    rails generate jet_ui:eject btn
-    rails generate jet_ui:eject flash
-    rails generate jet_ui:eject btn card flash
-    rails generate jet_ui:eject btn --skip-test
-    rails generate jet_ui:eject btn --skip-preview
-    rails generate jet_ui:eject flash --skip-javascript
-    rails generate jet_ui:eject btn --skip-test --skip-preview

data/lib/generators/jet_ui/install/USAGE

@@ -1,11 +0,0 @@
-Description:
-    Sets up JetUi in your Rails application.
-
-    - Injects the JetUi CSS import into your Tailwind entrypoint
-    - Registers JetUi Stimulus controllers via eagerLoadControllersFrom
-      (requires @hotwired/stimulus-loading, included in default Rails apps)
-
-    Safe to run multiple times — already-configured steps are skipped.
-
-Example:
-    rails generate jet_ui:install