Properly handles Stimulus controller in parent folders

[benoittgt]

If you try to register Stimulus controllers from another path than controller/ the regex does not process it properly.

Also we do not need to add controllers-- for controller in controllers/ folder. See doc.

Examples with dedicated stimulus view components controllers.

import { Application } from "@hotwired/stimulus"

const application = Application.start()
window.Stimulus = application

import componentControllers from '../components/**/*_controller.js';
componentControllers.forEach((controller) => {
  application.register(controller.name, controller.module.default)
});

import controllers from "./**/*_controller.js"
controllers.forEach((controller) => {
  application.register(controller.name, controller.module.default)
})

To try this code.

const ok =[
  'controllers/release_target_controller.js',
  'controllers/admin/toggle_controller.js',
  '../components/deploy_slack_pref_component_controller.js'
].map((module) => module
  .replace(/_controller.[j|t]s$/, "")
  .replace(/^controllers\//, "") // do not namespace controllers in controllers directory
  .replace(/\.\.\//, "") // do not use parent folder anotation for controller name
  .replace(/\//g, "--")
  .replace(/_/g, '-')
)
console.log(ok)

// [
//   'release-target',
//   'admin--toggle',
//   'components--deploy-slack-pref-component'
// ]

This is a breaking change.

Fix: #15

[excid3]

I would introduce an index.js in each folder and import them from that directory like Rails does out of the box.

// app/components/index.js
import { application } from "../javascript/controllers/application"

import controllers from "./**/*_controller.js"
controllers.forEach((controller) => {
  application.register(controller.name, controller.module.default)
})

// application.js
import "../components"

We can introduce a config option to strip prefixes in addition, but I don't think it's required.