Switch to rollup for js building

.gitignore

@@ -15,6 +15,7 @@
 .rspec_status
 
 # yarn
+app/assets/builds/
 node_modules/
 yarn-debug.log*
 yarn-error.log*

.rubocop.yml

@@ -5,6 +5,7 @@ require:
 
 # https://raw.githubusercontent.com/thoughtbot/guides/master/style/ruby/.rubocop.yml
 AllCops:
+  TargetRubyVersion: 3.2
   Exclude:
     - bin/*
     - config/**/*

Gemfile

@@ -7,19 +7,20 @@ gemspec
 gem "dartsass-rails"
 gem "importmap-rails"
 gem "katalyst-tables"
+gem "propshaft"
 gem "rails"
 gem "rake"
-gem "rubocop-katalyst", require: false
-gem "sprockets-rails"
 gem "sqlite3"
 gem "stimulus-rails"
 gem "turbo-rails"
 
 group :development, :test do
+  gem "erb_lint", require: false
   gem "factory_bot_rails"
   gem "puma"
   gem "rspec-rails"
   gem "rubocop"
+  gem "rubocop-katalyst", require: false
   gem "rubocop-rails"
   gem "rubocop-rake"
   gem "rubocop-rspec"

Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    katalyst-navigation (1.4.1)
+    katalyst-navigation (1.5.0.beta.1)
 
 GEM
   remote: https://rubygems.org/
@@ -84,6 +84,13 @@ GEM
       public_suffix (>= 2.0.2, < 6.0)
     ast (2.4.2)
     base64 (0.2.0)
+    better_html (2.0.2)
+      actionview (>= 6.0)
+      activesupport (>= 6.0)
+      ast (~> 2.0)
+      erubi (~> 1.4)
+      parser (>= 2.4)
+      smart_properties
     bigdecimal (3.1.4)
     builder (3.2.4)
     capybara (3.39.2)
@@ -108,6 +115,13 @@ GEM
     diff-lcs (1.5.0)
     drb (2.2.0)
       ruby2_keywords
+    erb_lint (0.5.0)
+      activesupport
+      better_html (>= 2.0.1)
+      parser (>= 2.7.1.4)
+      rainbow
+      rubocop
+      smart_properties
     erubi (1.12.0)
     factory_bot (6.4.2)
       activesupport (>= 5.0.0)
@@ -182,6 +196,11 @@ GEM
     parser (3.2.2.4)
       ast (~> 2.4.1)
       racc
+    propshaft (0.8.0)
+      actionpack (>= 7.0.0)
+      activesupport (>= 7.0.0)
+      rack
+      railties (>= 7.0.0)
     psych (5.1.1.1)
       stringio
     public_suffix (5.0.4)
@@ -302,13 +321,7 @@ GEM
       google-protobuf (~> 3.23)
     shoulda-matchers (5.3.0)
       activesupport (>= 5.2.0)
-    sprockets (4.2.1)
-      concurrent-ruby (~> 1.0)
-      rack (>= 2.2.4, < 4)
-    sprockets-rails (3.4.2)
-      actionpack (>= 5.2)
-      activesupport (>= 5.2)
-      sprockets (>= 3.0.0)
+    smart_properties (1.17.0)
     sqlite3 (1.6.9)
       mini_portile2 (~> 2.8.0)
     sqlite3 (1.6.9-arm64-darwin)
@@ -347,11 +360,13 @@ DEPENDENCIES
   capybara
   cuprite
   dartsass-rails
+  erb_lint
   factory_bot_rails
   faker
   importmap-rails
   katalyst-navigation!
   katalyst-tables
+  propshaft
   puma
   rails
   rails-controller-testing
@@ -363,7 +378,6 @@ DEPENDENCIES
   rubocop-rake
   rubocop-rspec
   shoulda-matchers
-  sprockets-rails
   sqlite3
   stimulus-rails
   turbo-rails

README.md

@@ -4,17 +4,41 @@ Generates and edits navigation menus.
 
 ## Installation
 
-Install the gem and add to the application's Gemfile by executing:
+Install the gem as usual
 
-    $ bundle add katalyst-navigation
+```ruby
+gem "katalyst-navigation"
+```
 
-If bundler is not being used to manage dependencies, install the gem by executing:
+Mount the engine in your `routes.rb` file:
 
-    $ gem install katalyst-navigation
+```ruby
+mount Katalyst::Navigation::Engine, at: "navigation"
+```
+
+Add the Gem's migrations to your application:
+
+```ruby
+rake katalyst_navigation:install:migrations
+```
+
+Add the Gem's javascript and CSS to your build pipeline. This assumes that
+you're using `rails-dartsass` and `importmaps` to manage your assets.
+
+```javascript
+// app/javascript/controllers/application.js
+import { application } from "controllers/application";
+import navigation from "@katalyst/navigation";
+application.load(navigation);
+```
+
+```sass
+@use "katalyst/navigation";
+```
 
 ## Usage
 
-This gem is still experimental and is not yet ready for public consumption. See dummy app for example usage.
+See the dummy app for examples.
 
 ## Contributing
 

Rakefile

@@ -3,24 +3,34 @@
 require "bundler/setup"
 require "bundler/gem_tasks"
 require "rspec/core/rake_task"
-require "rubocop/rake_task"
 
 APP_RAKEFILE = File.expand_path("spec/dummy/Rakefile", __dir__)
 
 load "rails/tasks/engine.rake"
 load "rails/tasks/statistics.rake"
 
 # prepend test:prepare to run generators, and db:prepare to run migrations
-RSpec::Core::RakeTask.new(spec: %w[app:test:prepare app:db:prepare])
+RSpec::Core::RakeTask.new(spec: %w[app:spec:prepare])
 
-RuboCop::RakeTask.new
+require "rubocop/katalyst/rake_task"
+RuboCop::Katalyst::RakeTask.new
 
-desc "Run all linters"
-task lint: %w[rubocop app:yarn:lint]
+require "rubocop/katalyst/erb_lint_task"
+RuboCop::Katalyst::ErbLintTask.new
 
-desc "Run all auto-formatters"
-task format: %w[rubocop:autocorrect app:yarn:format]
+require "rubocop/katalyst/prettier_task"
+RuboCop::Katalyst::PrettierTask.new
 
-task default: %i[lint spec] do
+namespace :yarn do
+  desc "Compile javascript"
+  task build: :environment do
+    sh "yarn build"
+  end
+end
+
+desc "Compile assets"
+task build: ["yarn:build", "app:dartsass:build"]
+
+task default: %i[lint build spec] do
   puts "🎉 build complete! 🎉"
 end

app/assets/config/katalyst-navigation.js

@@ -1 +1 @@
-//= link_tree ../javascripts
+//= link_tree ../builds

app/javascript/navigation/application.js

@@ -0,0 +1,30 @@
+import MenuController from "./editor/menu_controller";
+import ItemController from "./editor/item_controller";
+import ListController from "./editor/list_controller";
+import NewItemController from "./editor/new_item_controller";
+import StatusBarController from "./editor/status_bar_controller";
+
+const Definitions = [
+  {
+    identifier: "navigation--editor--menu",
+    controllerConstructor: MenuController,
+  },
+  {
+    identifier: "navigation--editor--item",
+    controllerConstructor: ItemController,
+  },
+  {
+    identifier: "navigation--editor--list",
+    controllerConstructor: ListController,
+  },
+  {
+    identifier: "navigation--editor--new-item",
+    controllerConstructor: NewItemController,
+  },
+  {
+    identifier: "navigation--editor--status-bar",
+    controllerConstructor: StatusBarController,
+  },
+];
+
+export { Definitions as default };

app/assets/javascripts/controllers/navigation/editor/item_controller.js → app/javascript/navigation/editor/item_controller.js

@@ -1,5 +1,5 @@
 import { Controller } from "@hotwired/stimulus";
-import Item from "utils/navigation/editor/item";
+import Item from "./item";
 
 export default class ItemController extends Controller {
   get item() {

app/assets/javascripts/utils/navigation/editor/menu.js → app/javascript/navigation/editor/menu.js

@@ -1,4 +1,4 @@
-import Item from "utils/navigation/editor/item";
+import Item from "./item";
 
 /**
  * @param nodes {NodeList}

app/assets/javascripts/controllers/navigation/editor/menu_controller.js → app/javascript/navigation/editor/menu_controller.js

@@ -1,8 +1,8 @@
 import { Controller } from "@hotwired/stimulus";
 
-import Item from "utils/navigation/editor/item";
-import Menu from "utils/navigation/editor/menu";
-import RulesEngine from "utils/navigation/editor/rules-engine";
+import Item from "./item";
+import Menu from "./menu";
+import RulesEngine from "./rules-engine";
 
 export default class MenuController extends Controller {
   static targets = ["menu"];

bin/dev

@@ -0,0 +1,3 @@
+#!/usr/bin/env sh
+
+cd spec/dummy && exec bin/dev $@

config/importmap.rb

@@ -1,5 +1,2 @@
 # frozen_string_literal: true
-
-pin_all_from Katalyst::Navigation::Engine.root.join("app/assets/javascripts"),
-             # preload in tests so that we don't start clicking before controllers load
-             preload: Rails.env.test?
+pin "@katalyst/navigation", to: "katalyst/navigation.js"

katalyst-navigation.gemspec

@@ -1,17 +1,15 @@
 # frozen_string_literal: true
 
-require_relative "lib/katalyst/navigation/version"
-
 Gem::Specification.new do |spec|
   spec.name = "katalyst-navigation"
-  spec.version = Katalyst::Navigation::VERSION
+  spec.version = "1.5.0.beta.1"
   spec.authors = ["Katalyst Interactive"]
   spec.email = ["[email protected]"]
 
   spec.summary = "Navigation generator and editor"
   spec.homepage = "https://github.com/katalyst/navigation"
   spec.license = "MIT"
-  spec.required_ruby_version = ">= 2.7.0"
+  spec.required_ruby_version = ">= 3.2.0"
 
   spec.files = Dir["{app,config,db,lib/katalyst}/**/*", "spec/factories/**/*", "LICENSE.txt", "README.md"]
   spec.require_paths = ["lib"]

lib/katalyst/navigation.rb

@@ -2,7 +2,6 @@
 
 require "katalyst/navigation/config"
 require "katalyst/navigation/engine"
-require "katalyst/navigation/version"
 
 module Katalyst
   module Navigation # :nodoc:

lib/katalyst/navigation/engine.rb

@@ -18,7 +18,7 @@ class Engine < ::Rails::Engine
       initializer "katalyst-navigation.importmap", before: "importmap" do |app|
         if app.config.respond_to?(:importmap)
           app.config.importmap.paths << root.join("config/importmap.rb")
-          app.config.importmap.cache_sweepers << root.join("app/assets/javascripts")
+          app.config.importmap.cache_sweepers << root.join("app/assets/builds")
         end
       end
 

package.json

@@ -1,9 +1,13 @@
 {
+  "main": "app/assets/builds/katalyst/content.js",
   "scripts": {
-    "lint": "prettier --check *.json app/assets spec/dummy/app/assets",
-    "format": "prettier --write *.json app/assets spec/dummy/app/assets"
+    "build": "yarn exec rollup -- -c",
+    "clean": "rm -rf app/assets/builds/*"
   },
   "devDependencies": {
-    "prettier": "2.7.1"
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-terser": "^0.4.4",
+    "prettier": "^2.8.7",
+    "rollup": "^3.20.2"
   }
 }

rollup.config.mjs

@@ -0,0 +1,45 @@
+import resolve from "@rollup/plugin-node-resolve"
+import terser from "@rollup/plugin-terser"
+
+export default [
+  {
+    input: "navigation/application.js",
+    output: [
+      {
+        name: "navigation",
+        file: "app/assets/builds/katalyst/navigation.esm.js",
+        format: "esm",
+      },
+      {
+        file: "app/assets/builds/katalyst/navigation.js",
+        format: "es",
+      },
+    ],
+    context: "window",
+    plugins: [
+      resolve({
+        modulePaths: ["app/javascript"]
+      })
+    ],
+    external: ["@hotwired/stimulus", "@hotwired/turbo-rails"]
+  },
+  {
+    input: "navigation/application.js",
+    output: {
+      file: "app/assets/builds/katalyst/navigation.min.js",
+      format: "es",
+      sourcemap: true,
+    },
+    context: "window",
+    plugins: [
+      resolve({
+        modulePaths: ["app/javascript"]
+      }),
+      terser({
+        mangle: true,
+        compress: true
+      })
+    ],
+    external: ["@hotwired/stimulus", "@hotwired/turbo-rails"]
+  }
+]

spec/dummy/Procfile.dev

@@ -0,0 +1,3 @@
+web: bin/rails server -p 3000
+js: yarn build --watch
+css: bin/rails dartsass:watch