plutonium 0.8.0 → 0.9.1

data/app/views/components/form/form_builder.rb

@@ -4,12 +4,12 @@ module Plutonium::Ui
   class FormBuilder < SimpleForm::FormBuilder
     def input(attribute_name, options = {}, &block)
       label_class = options.dig(:label_html, :class)
-      if object.errors[attribute_name].present?
+      if object&.errors&.[](attribute_name).present?
         # Don't show the hint
         options.delete(:hint)
         # Apply error class if there are errors
         label_class = [label_class, "text-red-700 dark:text-red-500"].compact.join(" ")
-      elsif object.persisted? || !object.errors.empty?
+      elsif object&.persisted? || !object&.errors&.empty?
         # Apply success class if the object is persisted, has been validated (errors are not empty), and the field has no errors
         label_class = [label_class, "block mb-2 text-sm font-medium text-green-700 dark:text-green-500"].compact.join(" ")
       else

data/app/views/components/form/form_component.html.erb

@@ -21,13 +21,13 @@
 
   <div>
   <% form.inputs.values.each do |input| %>
-    <%= input.render f, form.record %>
+    <%= input.render self, f, form.record %>
   <% end %>
   </div>
 
   <div class="flex justify-end space-x-2">
     <%# TODO: move this into its own component %>
-    <div class="flex">
+    <div class="flex" data-controller="resource-drop-down">
       <button type="submit"
               name="commit"
               value="<%= preferred_action_after_submit %>"
@@ -40,19 +40,18 @@
       </button>
       <button type="button"
               id="form-submit-options-toggle"
-              data-dropdown-toggle="form-submit-options-dropdown"
+              data-resource-drop-down-target="trigger"
               class="inline-flex items-center px-4 py-2 bg-primary-600 text-white
                      rounded-e-md hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-primary-500
                      dark:border-gray-300
-                     border-s"
-      >
+                     border-s">
         <svg class="w-2.5 h-2.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">
           <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
         </svg>
       </button>
 
       <!-- Dropdown menu -->
-      <div id="form-submit-options-dropdown"
+      <div data-resource-drop-down-target="menu"
            class="z-10 hidden w-56 bg-white divide-y divide-gray-100 rounded-lg shadow dark:bg-gray-700 dark:divide-gray-600">
           <ul class="p-3 space-y-3 text-sm text-gray-700 dark:text-gray-200"
               aria-labelledby="form-submit-options-toggle">

data/app/views/components/interactive_action_form/interactive_action_form_component.html.erb

@@ -21,7 +21,7 @@
 
   <div>
   <% interactive_action.inputs.values.each do |input| %>
-    <%= input.render f, interaction %>
+    <%= input.render self, f, interaction %>
   <% end %>
   </div>
 

data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_component.html.erb

@@ -0,0 +1,66 @@
+<div data-controller="nested-resource-form-fields"
+      data-nested-resource-form-fields-limit-value="<%= limit %>"
+      <%= render_component_attributes %>>
+  <h2 class="text-lg font-bold dark:text-white ">
+    <%= label %>
+  </h2>
+  <p class="mb-4 text-md font-normal text-gray-500 dark:text-gray-400">
+    <%= description %>
+  </p>
+
+  <template data-nested-resource-form-fields-target="template">
+    <% new_record = resource_class.new %>
+    <%= form.simple_fields_for name, new_record, child_index: 'NEW_RECORD' do |nested| %>
+      <fieldset class="border-t mt-4 pt-4 first:border-t-0 first:pt-0 nested-resource-form-fields" data-new-record="<%= nested.object.new_record? %>">
+        <% inputs.values.each do |input| %>
+          <%= input.render self, nested, new_record %>
+        <% end %>
+
+        <div class="text-right">
+          <% if nested.object.new_record? || allow_destroy %>
+            <label class="text-md font-medium text-red-900">
+              <%= "Delete" %>
+              <input type="checkbox" value=""
+                      data-action="nested-resource-form-fields#remove"
+                      class="w-4 h-4 ms-2 text-red-600 bg-red-100 border-red-300 rounded focus:ring-red-500 dark:focus:ring-red-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+            </label>
+          <% end %>
+        </div>
+
+        <%= nested.hidden_field :_destroy %>
+      </fieldset>
+    <% end %>
+  </template>
+
+  <div>
+    <%= form.simple_fields_for name do |nested| %>
+      <fieldset class="border-t mt-4 pt-4 first:border-t-0 first:pt-0 nested-resource-form-fields" data-new-record="<%= nested.object.new_record? %>">
+        <% inputs.values.each do |input| %>
+          <%= input.render self, nested, new_record %>
+        <% end %>
+
+        <div>
+          <% if nested.object.new_record? || allow_destroy %>
+            <label class="flex items-center justify-end text-md font-medium text-red-900">
+              <%= "Delete" %>
+              <input type="checkbox" value=""
+                      data-action="nested-resource-form-fields#remove"
+                      class="w-4 h-4 ms-2 text-red-600 bg-red-100 border-red-300 rounded focus:ring-red-500 dark:focus:ring-red-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+            </label>
+          <% end %>
+        </div>
+
+        <%= nested.hidden_field :_destroy %>
+      </fieldset>
+    <% end %>
+
+    <div data-nested-resource-form-fields-target="target" hidden></div>
+  </div>
+
+  <%=
+    render_component :button, label: "Add #{name.to_s.singularize.humanize}", classname: "mt-4", data: {
+      action: "nested-resource-form-fields#add",
+      "nested-resource-form-fields-target": "addButton"
+    }
+  %>
+</div>

data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_component.rb

@@ -0,0 +1,23 @@
+module Plutonium::Ui
+  class NestedResourceFormFieldsComponent < Plutonium::Ui::Base
+    option :name
+    option :resource_class
+    option :form
+    option :inputs
+    option :label, optional: true
+    option :description, optional: true
+    option :allow_destroy, optional: true
+    option :update_only, optional: true
+    option :limit, optional: true
+
+    def base_classname
+      "mt-6 mb-4"
+    end
+
+    def label
+      super || name.to_s.humanize
+    end
+  end
+end
+
+Plutonium::ComponentRegistry.register :nested_resource_form_fields, to: Plutonium::Ui::NestedResourceFormFieldsComponent

data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_controller.js

@@ -0,0 +1,64 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="nested-resource-form-fields"
+// Copied from https://github.com/stimulus-components/stimulus-rails-nested-form/blob/master/src/index.ts
+export default class extends Controller {
+  static targets = ["target", "template", "addButton"]
+
+  static values = {
+    wrapperSelector: {
+      type: String,
+      default: ".nested-resource-form-fields",
+    },
+    limit: Number,
+  }
+
+  connect() {
+    this.updateState()
+  }
+
+  add(e) {
+    e.preventDefault()
+
+    const content = this.templateTarget.innerHTML.replace(/NEW_RECORD/g, new Date().getTime().toString())
+    this.targetTarget.insertAdjacentHTML("beforebegin", content)
+
+    const event = new CustomEvent("nested-resource-form-fields:add", { bubbles: true })
+    this.element.dispatchEvent(event)
+
+    this.updateState()
+  }
+
+  remove(e) {
+    e.preventDefault()
+
+    const wrapper = e.target.closest(this.wrapperSelectorValue)
+
+    if (wrapper.dataset.newRecord === "true") {
+      wrapper.remove()
+    } else {
+      wrapper.style.display = "none"
+
+      const input = wrapper.querySelector("input[name*='_destroy']")
+      input.value = "1"
+    }
+
+    const event = new CustomEvent("nested-resource-form-fields:remove", { bubbles: true })
+    this.element.dispatchEvent(event)
+
+    this.updateState()
+  }
+
+  updateState() {
+    if (!this.hasAddButtonTarget || this.limitValue == 0) return
+
+    if (this.childCount >= this.limitValue)
+      this.addButtonTarget.style.display = "none"
+    else
+      this.addButtonTarget.style.display = "initial"
+  }
+
+  get childCount() {
+    return this.element.querySelectorAll(this.wrapperSelectorValue).length
+  }
+}

data/app/views/components/sidebar/sidebar_component.html.erb

@@ -86,69 +86,67 @@
       updateColorMode()
     </script>
 
-
-    <button
-      type="button"
-      data-dropdown-toggle="color-mode-dropdown"
-      class="inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:hover:text-white dark:text-gray-200 hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600"
-    >
-      <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24">
-        <path d="M5 13.17a3.001 3.001 0 0 0 0 5.66V20a1 1 0 1 0 2 0v-1.17a3.001 3.001 0 0 0 0-5.66V4a1 1 0 0 0-2 0v9.17ZM11 20v-9.17a3.001 3.001 0 0 1 0-5.66V4a1 1 0 1 1 2 0v1.17a3.001 3.001 0 0 1 0 5.66V20a1 1 0 1 1-2 0Zm6-1.17V20a1 1 0 1 0 2 0v-1.17a3.001 3.001 0 0 0 0-5.66V4a1 1 0 1 0-2 0v9.17a3.001 3.001 0 0 0 0 5.66Z"/>
-      </svg>
-    </button>
-
-
-    <div
-      class="hidden z-50 my-4 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700"
-      id="color-mode-dropdown"
-    >
-      <ul class="py-1" role="none">
-        <li>
-          <button
-            type="button"
-            class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
-            role="menuitem"
-            onclick="setLightColorMode()"
-          >
-            <div class="flex justify-start">
-              <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
-                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 5V3m0 18v-2M7.05 7.05 5.636 5.636m12.728 12.728L16.95 16.95M5 12H3m18 0h-2M7.05 16.95l-1.414 1.414M18.364 5.636 16.95 7.05M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Z"/>
-              </svg>
-              Light
-            </div>
-          </a>
-        </li>
-        <li>
-          <button
-            type="button"
-            class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
-            role="menuitem"
-            onclick="setDarkColorMode()"
-          >
-            <div class="flex justify-start">
-              <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
-                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 21a9 9 0 0 1-.5-17.986V3c-.354.966-.5 1.911-.5 3a9 9 0 0 0 9 9c.239 0 .254.018.488 0A9.004 9.004 0 0 1 12 21Z"/>
-              </svg>
-              Dark
-            </div>
-          </a>
-        </li>
-        <li>
-          <button
-            type="button"
-            class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
-            role="menuitem"
-            onclick="setSystemColorMode()"
-          >
-            <div class="flex justify-start">
-              <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
-                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 16H5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v1M9 12H4m8 8V9h8v11h-8Zm0 0H9m8-4a1 1 0 1 0-2 0 1 1 0 0 0 2 0Z"/>
-              </svg>
-              System
-            </div>
-          </a>
-        </li>
-      </ul>
+    <!-- Color Modes -->
+    <div data-controller="resource-drop-down">
+      <button
+        type="button"
+        data-resource-drop-down-target="trigger"
+        class="inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:hover:text-white dark:text-gray-200 hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-600">
+        <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24">
+          <path d="M5 13.17a3.001 3.001 0 0 0 0 5.66V20a1 1 0 1 0 2 0v-1.17a3.001 3.001 0 0 0 0-5.66V4a1 1 0 0 0-2 0v9.17ZM11 20v-9.17a3.001 3.001 0 0 1 0-5.66V4a1 1 0 1 1 2 0v1.17a3.001 3.001 0 0 1 0 5.66V20a1 1 0 1 1-2 0Zm6-1.17V20a1 1 0 1 0 2 0v-1.17a3.001 3.001 0 0 0 0-5.66V4a1 1 0 1 0-2 0v9.17a3.001 3.001 0 0 0 0 5.66Z"/>
+        </svg>
+      </button>
+      <div
+        class="hidden z-50 my-4 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700"
+        data-resource-drop-down-target="menu">
+        <ul class="py-1" role="none">
+          <li>
+            <button
+              type="button"
+              class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
+              role="menuitem"
+              onclick="setLightColorMode()"
+            >
+              <div class="flex justify-start">
+                <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
+                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 5V3m0 18v-2M7.05 7.05 5.636 5.636m12.728 12.728L16.95 16.95M5 12H3m18 0h-2M7.05 16.95l-1.414 1.414M18.364 5.636 16.95 7.05M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Z"/>
+                </svg>
+                Light
+              </div>
+            </a>
+          </li>
+          <li>
+            <button
+              type="button"
+              class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
+              role="menuitem"
+              onclick="setDarkColorMode()"
+            >
+              <div class="flex justify-start">
+                <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
+                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 21a9 9 0 0 1-.5-17.986V3c-.354.966-.5 1.911-.5 3a9 9 0 0 0 9 9c.239 0 .254.018.488 0A9.004 9.004 0 0 1 12 21Z"/>
+                </svg>
+                Dark
+              </div>
+            </a>
+          </li>
+          <li>
+            <button
+              type="button"
+              class="w-full block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600"
+              role="menuitem"
+              onclick="setSystemColorMode()"
+            >
+              <div class="flex justify-start">
+                <svg class="w-6 h-6 me-2 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
+                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 16H5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v1M9 12H4m8 8V9h8v11h-8Zm0 0H9m8-4a1 1 0 1 0-2 0 1 1 0 0 0 2 0Z"/>
+                </svg>
+                System
+              </div>
+            </a>
+          </li>
+        </ul>
+      </div>
     </div>
   </div>
 </aside>

data/app/views/components/table_search_input/table_search_input_component.html.erb

@@ -7,7 +7,7 @@
                 <path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd" />
             </svg>
         </div>
-        <%= search_object.search_filter.input_definitions[:search].render f, nil,
+        <%= search_object.search_filter.input_definitions[:search].render self, f, nil,
             wrapper: false, label: false,
             as: :string, # force string for search
             placeholder: "search...",

data/app/views/layouts/resource.html copy.erb

@@ -15,8 +15,6 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slim-select/2.6.0/slimselect.min.css" integrity="sha512-GvqWM4KWH8mbgWIyvwdH8HgjUbyZTXrCq0sjGij9fDNiXz3vJoy3jCcAaWNekH2rJe4hXVWCJKN+bEW8V7AAEQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
     <script src="https://cdnjs.cloudflare.com/ajax/libs/slim-select/2.6.0/slimselect.min.js" integrity="sha512-0E8oaoA2v32h26IycsmRDShtQ8kMgD91zWVBxdIvUCjU3xBw81PV61QBsBqNQpWkp/zYJZip8Ag3ifmzz1wCKQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
-
     <%== Plutonium::Config.stylesheet_tag.call self %>
     <%== Plutonium::Config.script_tag.call self %>
     <%= yield(:head) %>

data/app/views/layouts/resource.html.erb

@@ -21,8 +21,6 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slim-select/2.6.0/slimselect.min.css" integrity="sha512-GvqWM4KWH8mbgWIyvwdH8HgjUbyZTXrCq0sjGij9fDNiXz3vJoy3jCcAaWNekH2rJe4hXVWCJKN+bEW8V7AAEQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
     <script src="https://cdnjs.cloudflare.com/ajax/libs/slim-select/2.6.0/slimselect.min.js" integrity="sha512-0E8oaoA2v32h26IycsmRDShtQ8kMgD91zWVBxdIvUCjU3xBw81PV61QBsBqNQpWkp/zYJZip8Ag3ifmzz1wCKQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
-
     <%= yield(:assets) %>
 
     <%== Plutonium::Config.stylesheet_tag.call self %>
@@ -34,6 +32,7 @@
     <%= render("resource_header") %>
     <%= render("resource_sidebar") %>
     <main class="p-4 lg:ml-64 h-auto pt-20">
+      <%= render "flash" %>
       <%= yield %>
     </main>
   </body>
@@ -45,6 +44,5 @@
     <%= modal_frame_tag do %>
       <%= yield(:modal) %>
     <% end %>
-    <%= render "flash" %>
 
 -->

data/app/views/layouts/rodauth.html.erb

@@ -12,7 +12,6 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap" rel="stylesheet">
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
     <%== Plutonium::Config.stylesheet_tag.call self %>
     <%== Plutonium::Config.script_tag.call self %>
   </head>

data/app/views/resource/_interactive_resource_action_form.html.erb

@@ -25,7 +25,7 @@
               </div>
               <div class="form-inputs">
                 <% interactive_action.inputs.values.each do |input| %>
-                  <%= input.render f, @interaction %>
+                  <%= input.render self, f, @interaction %>
                 <% end %>
               </div>
             </div>

data/css.manifest

@@ -0,0 +1,3 @@
+{
+  "plutonium.css": "plutonium.50232e35b5495f5ad90d.css"
+}

data/esbuild.config.js

@@ -0,0 +1,44 @@
+const esbuild = require('esbuild');
+const manifestPlugin = require('esbuild-plugin-manifest')
+
+
+if (process.argv.includes("--prod")) {
+  esbuild.build({
+    outdir: "public/plutonium-assets",
+    entryPoints: [
+      "app/assets/javascripts/plutonium-app.js"
+    ],
+    plugins: [
+      manifestPlugin({
+        filename: `${__dirname}/js.manifest`,
+        shortNames: true,
+      })
+    ],
+    minify: true,
+    sourcemap: true,
+    bundle: true,
+  })
+
+  esbuild.build({
+    outdir: "app/assets/build",
+    entryPoints: [
+      "app/assets/javascripts/plutonium.js"
+    ],
+    bundle: true,
+  })
+}
+else {
+  esbuild.context({
+    outdir: "public/plutonium-assets/build",
+    entryPoints: [
+      "app/assets/javascripts/plutonium-app.js"
+    ],
+    plugins: [
+      manifestPlugin({
+        filename: `${__dirname}/js.dev.manifest`,
+        shortNames: true,
+      })
+    ],
+    bundle: true,
+  }).then((context) => context.watch().catch((e) => console.error(e.message)))
+}

data/exe/pug

@@ -0,0 +1,6 @@
+#!/usr/bin/env ruby
+
+require File.expand_path("../lib/generators/pu/lib/plutonium_generators.rb", __dir__)
+
+ENV["PU_CLI"] = "1"
+PlutoniumGenerators::CLI.start(ARGV)

data/lib/generators/pu/gen/component/component_generator.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-return if PlutoniumGenerators.rails?
+return unless PlutoniumGenerators.cli?
 
 module Pu
   module Gen
@@ -20,8 +20,10 @@ module Pu
         template "component.html.erb", "#{component_path}.html.erb"
         template "controller.js", controller_path
 
-        controllers_file = File.join __dir__, "../../../../../app/assets/js/controllers/index.js"
-        insert_into_file controllers_file, controller_registration, after: /.*Register controllers here.*\n\n/
+        controllers_index_file = File.join __dir__, "../../../../../app/assets/javascripts/controllers/index.js"
+        insert_into_file controllers_index_file, controller_import, after: /.*Import controllers here*\n/
+        insert_into_file controllers_index_file, controller_registration, after: /.*Register controllers here*\n/
+        insert_into_file controllers_index_file, controller_export, after: /.*Export controllers here*\n/
       end
 
       protected
@@ -78,9 +80,16 @@ module Pu
         [component_module, "#{component_name}Controller"].compact.join("::").gsub("::", "_")
       end
 
+      def controller_import
+        "import #{controller_reference} from \"../../../../#{controller_path}\"\n"
+      end
+
       def controller_registration
-        %(import #{controller_reference} from "../../../../#{controller_path}"\n) +
-          %(application.register("#{controller_identifier}", #{controller_reference})\n\n)
+        "  application.register(\"#{controller_identifier}\", #{controller_reference})\n"
+      end
+
+      def controller_export
+        "export { #{controller_reference} }\n"
       end
     end
   end

data/lib/generators/pu/gen/pug/pug_generator.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-return if PlutoniumGenerators.rails?
+return unless PlutoniumGenerators.cli?
 
 module Pu
   module Gen

data/lib/generators/pu/lib/plutonium_generators/cli.rb

@@ -0,0 +1,42 @@
+# frozen_string_literal: true
+
+require "rails/generators"
+require File.expand_path("../plutonium_generators", __dir__)
+
+module PlutoniumGenerators
+  class CLI < Thor
+    map "i" => :install
+    map "g" => :generate
+    map "ls" => :list
+    map %w[--version -v] => :__print_version
+
+    # desc "install", "Install Plutonium"
+    # def install
+    #   Rails::Generators.invoke("pu:install")
+    # end
+
+    desc "generate, g GENERATOR [options]", "Run plutonium generator"
+    def generate(generator, *options)
+      Rails::Generators.invoke("pu:#{generator}", options)
+    end
+
+    desc "list, ls", "View list of available generators"
+    def list
+      generators = Rails::Generators.sorted_groups.to_h["pu"]
+      puts
+      generators.each { |gen| puts gen.sub(/^pu:/, "") }
+      puts
+    end
+
+    desc "--version, -v", "Print gem version"
+    def __print_version
+      puts "Plutonium generators #{PlutoniumGenerators::VERSION}"
+    end
+
+    class << self
+      def exit_on_failure?
+        true
+      end
+    end
+  end
+end