RubyGems - railsui - Versions diffs - 3.2.7 → 3.3.0 - Mend

railsui 3.2.7 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (69) hide show

data/app/javascript/controllers/railsui_smooth_controller.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Controller } from "@hotwired/stimulus"
-export default class extends Controller {
+export default class extends Stimulus.Controller {
   scroll(event) {
     event.preventDefault()

data/app/javascript/controllers/railsui_snippet_controller.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Controller } from "@hotwired/stimulus"
-export default class extends Controller {
+export default class extends Stimulus.Controller {
   static targets = ["preview", "previewBtn", "code", "codeBtn"]
   ACTIVE_CLASSES = [

data/app/views/layouts/railsui/application.html.erb CHANGED Viewed

@@ -14,12 +14,14 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <%= favicon_link_tag "favicon.svg" %>
-    <%= javascript_include_tag "railsui/application" %>
-    <%= javascript_include_tag "https://unpkg.com/alpinejs@3.10.3/dist/cdn.min.js", defer: true %>
-    <%= stylesheet_link_tag "application", "railsui/railsui" %>
+    <%= render "railsui/shared/cdn_dependencies" %>
-    <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css" />
+    <%= stylesheet_link_tag "railsui/application" %>
+    <% if main_app_asset_exists?("tailwind") %>
+      <%= stylesheet_link_tag "tailwind" %>
+    <% end %>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -30,7 +32,7 @@
     <% end %>
     <%= yield :head %>
-  </head>
+  </head>
   <body class="relative antialiased font-normal leading-normal railsui text-neutral-800 lg:h-screen selection:bg-neutral-300/20 selection:text-neutral-900 dark:selection:text-white dark:bg-neutral-900 dark:text-neutral-50" data-controller="railsui-toggle railsui-scroll railsui-smooth railsui-scroll-spy" data-railsui-scroll-spy-active-class-value="text-neutral-900 hover:text-neutral-950 dark:hover:text-neutral-200 dark:text-white dark:hover:text-white truncate"
       data-railsui-scroll-spy-inactive-class-value="text-neutral-500 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-white truncate">

data/app/views/layouts/railsui/fullwidth.html.erb CHANGED Viewed

@@ -14,10 +14,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <%= favicon_link_tag "favicon.svg" %>
-    <%= javascript_include_tag "railsui/application" %>
-    <%= javascript_include_tag "https://unpkg.com/alpinejs@3.10.3/dist/cdn.min.js", defer: true %>
-    <%= stylesheet_link_tag "railsui/railsui", "application" %>
+    <%= render "railsui/shared/cdn_dependencies" %>
+    <%= stylesheet_link_tag "railsui/railsui", "tailwind" %>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -31,7 +31,7 @@
     <%= yield :head %>
   </head>
-  <body class="relative antialiased font-normal leading-normal railsui text-neutral-800 lg:h-screen selection:bg-neutral-800/80 selection:text-neutral-100 dark:bg-neutral-900 dark:text-neutral-50" data-controller="railsui-toggle railsui-scroll railsui-smooth railsui-scroll-spy">
+  <body class="relative antialiased font-normal leading-normal railsui text-neutral-800 lg:h-screen selection:bg-neutral-800/80 selection:text-neutral-100 dark:bg-neutral-900 dark:text-neutral-50" data-controller="railsui-toggle railsui-scroll railsui-smooth railsui-scroll-spy railsui-code">
     <div class="flex md:flex-row flex-col items-start justify-between md:h-[calc(100vh-2px)] overflow-x-clip relative">
       <%= image_tag "blur.png", class: "absolute -top-[500px] -right-[500px] opacity-[0.09] dark:opacity-20 z-0" %>

data/app/views/layouts/railsui/landing.html.erb CHANGED Viewed

@@ -14,11 +14,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <%= favicon_link_tag "favicon.svg" %>
-    <%= javascript_include_tag "railsui/application" %>
-    <%= javascript_include_tag "https://unpkg.com/alpinejs@3.10.3/dist/cdn.min.js", defer: true %>
-    <%= stylesheet_link_tag "railsui/application" %>
-    <%= stylesheet_link_tag "application" %>
+    <%= render "railsui/shared/cdn_dependencies" %>
+    <%= stylesheet_link_tag "railsui/application", "tailwind" %>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

data/app/views/layouts/railsui/routes.html.erb CHANGED Viewed

@@ -14,9 +14,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <%= favicon_link_tag "favicon.svg" %>
-    <%= javascript_include_tag "railsui/application" %>
-    <%= javascript_include_tag "https://unpkg.com/alpinejs@3.10.3/dist/cdn.min.js", defer: true %>
-    <%= stylesheet_link_tag "railsui/application", "application" %>
+    <%= render "railsui/shared/cdn_dependencies" %>
+    <%= stylesheet_link_tag "railsui/application", "tailwind" %>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

data/app/views/railsui/admin/_form.html.erb CHANGED Viewed

@@ -1,5 +1,22 @@
 <div class="pb-8">
-  <%= heading text: "Configuration", id: "configuration", tag: "h1", class: "lg:text-3xl text-2xl text-neutral-800 font-bold dark:text-white mb-2 tracking-tight" %>
+  <div class="flex items-center gap-3 mb-2">
+    <%= heading text: "Configuration", id: "configuration", tag: "h1", class: "lg:text-3xl text-2xl text-neutral-800 font-bold dark:text-white tracking-tight" %>
+    <% if @config.build_mode == "nobuild" %>
+      <span class="inline-flex items-center gap-1.5 px-3 py-1 text-xs font-medium rounded-full bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300">
+        <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+          <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/>
+        </svg>
+        No-Build Mode
+      </span>
+    <% else %>
+      <span class="inline-flex items-center gap-1.5 px-3 py-1 text-xs font-medium rounded-full bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300">
+        <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+          <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
+        </svg>
+        Build Mode
+      </span>
+    <% end %>
+  </div>
   <div class="prose dark:prose-invert prose-neutral max-w-full prose-lg mb-6">
     <p>Choose a theme, customize colors or stick with the defaults and go build. 🚀</p>
   </div>

data/app/views/railsui/admin/fields/_theme.html.erb CHANGED Viewed

@@ -67,7 +67,6 @@
         <p>Refer to <%= link_to "railsui.com/themes", "https://railsui.com/themes", target: :_blank %> for a good reference for Rails UI themes and their intended use case. We're always working on adding more.</p>
       </div>
     </details>
     <details class="group py-4">

data/app/views/railsui/shared/_cdn_dependencies.html.erb ADDED Viewed

@@ -0,0 +1,121 @@
+<!-- Stylesheets -->
+<link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css" />
+<link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/styles/atom-one-dark.min.css" />
+<style>
+  /* Custom styles for ERB/HAML code blocks using Ruby syntax */
+  .railsui .language-erb .hljs-comment,
+  .railsui .language-haml .hljs-comment {
+    color: #637777 !important;
+    font-style: italic;
+  }
+  /* Style HTML-like tags in ERB when they're not highlighted */
+  .railsui .language-erb code,
+  .railsui .language-haml code {
+    /* Ensure base text is visible */
+    color: #f5f5f5;
+  }
+  /* Ensure highlight.js styles aren't overridden */
+  .hljs {
+    background: transparent !important;
+    color: #abb2bf !important;
+  }
+  /* CSS syntax highlighting colors */
+  .language-css .hljs-attribute {
+    color: #e06c75 !important;
+  }
+  .language-css .hljs-number,
+  .language-css .hljs-literal {
+    color: #d19a66 !important;
+  }
+  .language-css .hljs-selector-class,
+  .language-css .hljs-selector-tag {
+    color: #e5c07b !important;
+  }
+  .language-css .hljs-built_in,
+  .language-css .hljs-title {
+    color: #61afef !important;
+  }
+  .language-css .hljs-comment {
+    color: #5c6370 !important;
+    font-style: italic;
+  }
+  .language-css .hljs-string {
+    color: #98c379 !important;
+  }
+</style>
+<!-- Import map for ES modules (required for railsui-stimulus package) -->
+<script type="importmap">
+{
+  "imports": {
+    "@hotwired/stimulus": "https://unpkg.com/@hotwired/stimulus@3.2.2/dist/stimulus.js",
+    "tippy.js": "https://unpkg.com/tippy.js@6.3.7/dist/tippy.esm.js"
+  }
+}
+</script>
+<!-- Core Dependencies -->
+<script src="https://unpkg.com/@hotwired/stimulus@3.2.2/dist/stimulus.umd.js"></script>
+<script src="https://unpkg.com/stimulus-use@0.52.2/dist/index.umd.js"></script>
+<!-- UI Libraries -->
+<script src="https://unpkg.com/@popperjs/core@2.11.8/dist/umd/popper.min.js"></script>
+<script src="https://unpkg.com/tippy.js@6.3.7/dist/tippy-bundle.umd.min.js"></script>
+<%= javascript_include_tag "https://unpkg.com/alpinejs@3.10.3/dist/cdn.min.js", defer: true %>
+<!-- Syntax Highlighting -->
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/highlight.min.js"></script>
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/languages/ruby.min.js"></script>
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/languages/javascript.min.js"></script>
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/languages/bash.min.js"></script>
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/languages/css.min.js"></script>
+<script src="https://unpkg.com/@highlightjs/cdn-assets@11.9.0/languages/xml.min.js"></script>
+<script>
+  // Ensure hljs is available globally
+  window.hljs = window.hljs || hljs;
+  // Register ERB as an alias for Ruby (better syntax highlighting for embedded Ruby)
+  // Register HAML as an alias for Ruby as well
+  if (window.hljs) {
+    hljs.registerAliases(['erb'], {languageName: 'ruby'})
+    hljs.registerAliases(['haml'], {languageName: 'ruby'})
+    // Highlight all code blocks on page load
+    document.addEventListener('DOMContentLoaded', function() {
+      hljs.highlightAll();
+    });
+    // Also run immediately in case DOMContentLoaded already fired
+    if (document.readyState === 'loading') {
+      // Still loading, wait for DOMContentLoaded
+    } else {
+      // DOM already loaded, run now
+      hljs.highlightAll();
+    }
+  }
+</script>
+<!-- Initialize Stimulus and register controllers -->
+<script>
+  (function() {
+    // Capture Stimulus globals before reassigning
+    const StimulusController = Stimulus.Controller
+    const StimulusApplication = Stimulus.Application
+    const application = StimulusApplication.start()
+    // Expose both application and Controller base class
+    window.Stimulus = {
+      application: application,
+      Controller: StimulusController,
+      Application: StimulusApplication
+    }
+    const hljs = window.hljs
+    const { useTransition, useClickOutside } = window.StimulusUse || {}
+    <%= render partial: "railsui/shared/inline_controllers" %>;
+  })()
+</script>