studio-engine 0.115.0 → 0.115.1.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6c4ec89a15db3597c3fbb5ec688fc5f635f20d16ea4a7354fbf71b6d30265442
-  data.tar.gz: 648bd9c73a07a9868de36cb0188ce0460f912fa24e82f239b269f6fc4e210d5c
+  metadata.gz: fabe1d2bfd93ef94f291f09e43bc3c6116cbd80023cfffb91d77af00d9bbfbc6
+  data.tar.gz: ec6b825a90b3bbbf1ef0c4183ffe1f0b2555a34429df2d6877c8f7c4c94f838f
 SHA512:
-  metadata.gz: 86d05be2c55f6e60dc5b896586ea4b8bb0a6aa178c5a52787bd2f3da51ed2a84ceb40b4e83b73f78b3fd641c46e3f94e066ea22c39ed70efeac2936b5f7b7a93
-  data.tar.gz: 3993e767f3bc3b907a0af88e7d209ba94b6ad64d4c1e252fd76adbcb1058a69a2ab29bba012443a1cc7e773168855a06754e4279e4f40ed6ab081821d19cb232
+  metadata.gz: 8ac4e8a7fc5a8510ec63eb126ed44110a3205e072d2adf4861dfefcae0584de24ac2eb3624958c15c0a15e11a986dc1608116b51013d76879fb8cc26b1129516
+  data.tar.gz: d358e292cf4c84be548bf75235ec4613d9d9a3b9c9ddec008879976b696198b7ff1608ca3b46a82bd20d2e419f39f97b12aa7df08556ab808faca510a853d84c

data/CHANGELOG.md

@@ -4,6 +4,65 @@ The format is [Keep a Changelog](https://keepachangelog.com/en/1.1.0/). This pro
 
 ## Unreleased
 
+## 0.115.1 — 2026-10-27
+
+### Changed
+
+- **Five of the engine's six classic scripts are ES modules.** No host change
+  is needed: every host renders `layouts/studio/head`, which now loads them as
+  modules, and every global a host calls is kept.
+  - `studio/sticky_table_header` and `studio/studio_confetti` moved from
+    `app/assets/javascripts/studio/` to `app/javascript/studio/`, so the
+    importmap pins them as `studio/<name>` like every engine module. Each has a
+    default export (the sticky-header API, `{ burst, cannons }`);
+    `studio/studio_confetti` also exports `burst`, `cannons` and `confetti`.
+  - Alpine and canvas-confetti stay vendored, unedited, in
+    `app/assets/javascripts/studio/`, which now holds only those builds and the
+    classic `studio/session.js`.
+    Alpine loads by a `type="module"` tag; canvas-confetti is pinned as
+    `"canvas-confetti"` and imported by `studio/studio_confetti`, so the head no
+    longer has its own tag for it.
+  - Leaflet is imported by `studio/footer_map` with `import()` of the URL on the
+    map element, not a `<script>` element injected into the head. A failed fetch
+    is retried under `?retry=n`, because a browser never refetches a module whose
+    fetch failed.
+  - Every head script with a `src`, but the session store, is a `type="module"`
+    tag below the import map (a module tag above it makes browsers without
+    dynamic import maps ignore the map). The head adds no inline script, so the
+    strict-nonce count is unchanged.
+  - **Held: `studio/session.js` stays a synchronous classic script**, above the
+    import map, unchanged. Host code registers identity sources with
+    `window.StudioSession` as its own modules evaluate (turf-monster's
+    `wallet_signal.js` calls solana-studio's `walletIdentity.register()` at
+    import), and a host's entry point is the module tag
+    `javascript_importmap_tags` renders, which an engine module tag below the
+    map would follow: the store would not exist yet and the registration would
+    silently be null. It becomes a module once those consumers wait for it.
+  - **Timing.** `window.confetti` and `window.studioConfetti` used to exist
+    while the body parsed (synchronous classic tags); they now exist once the
+    head's modules run, which is still before Alpine starts and before
+    `DOMContentLoaded`. A host's inline body
+    script that calls one of them at parse time, rather than from a handler,
+    would now find it missing. No host on `origin/accepted` does: turf-monster's
+    `confetti()` calls in `solana_utils.js` and `shared/_alpine_factories` run
+    from functions its handlers call, and each checks `typeof confetti` first.
+  - `host.css` no longer scans `app/assets/javascripts` (its `@source` line and
+    the vendored-file exclusion are gone): it holds the vendored builds and
+    `studio/session.js`, which puts no class on a page, and a test measures
+    that. The moved scripts are scanned under `app/javascript`.
+
+### Deprecated
+
+- **Compatibility globals for the converted scripts.** Each stays for classic
+  callers; new code imports the module instead:
+  - `window.studioConfetti`: `import { burst, cannons } from "studio/studio_confetti"`.
+  - `window.confetti` (the canvas-confetti library global) as a host call:
+    `import { confetti } from "studio/studio_confetti"`. turf-monster calls it
+    today; the engine's own `fireSuccessConfetti` still reads it.
+  - `window.StudioStickyTableHeaders`: `import StickyTableHeaders from "studio/sticky_table_header"`.
+  `window.Alpine` and `window.L` are not deprecated: Alpine and Leaflet read
+  their own globals.
+
 ## 0.115.0 — 2026-10-26
 
 ### Breaking

data/app/assets/tailwind/studio_engine/host.css

@@ -28,13 +28,15 @@
    files put a utility class on the page is scanned here, relative to this
    file, in every host that imports it, with no host edit: views and
    partials, the ViewComponents (their colour classes live in Ruby), the
-   helpers that build markup (admin_model_table), and both JavaScript trees
-   (classes added at runtime).
-
-   The exclusions are NARROW on purpose: the vendored, minified third-party
-   bundles (Stimulus, Alpine, Leaflet, Sortable, canvas-confetti) are not
-   engine markup, and scanning them mints junk utilities from their
-   identifiers. Never exclude a whole directory: the hub's
+   helpers that build markup (admin_model_table), and the engine's ES modules
+   (app/javascript: classes added at runtime). app/assets/javascripts is not
+   scanned: since the engine's scripts became modules it holds the vendored,
+   minified third-party builds (Alpine, Leaflet, Sortable, canvas-confetti) and
+   studio/session.js, which puts no class on a page (held by
+   test/integration/component_tailwind_source_test.rb).
+
+   The exclusions are NARROW on purpose: the vendored bundles are not engine
+   markup, and scanning them mints junk utilities from their identifiers. Never exclude a whole directory: the hub's
    `@source not "../../../vendor/bundle"` once dropped every one of these
    lines in CI, because the gem itself lives under vendor/bundle there.
 
@@ -47,8 +49,6 @@
 @source "../../../helpers";
 @source "../../../javascript";
 @source not "../../../javascript/studio/vendor";
-@source "../../javascripts";
-@source not "../../javascripts/studio/{alpine,canvas_confetti,leaflet,sortable}.js";
 
 /* -- Motion / effect / leveling layer ---------------------------------------
    Last, so the theme and component layer it reads are in scope, as when hosts

data/app/javascript/studio/footer_map.js

@@ -18,8 +18,16 @@
 // fail on its elements: that app's map carries no data-leaflet-js, so there is
 // nothing here to fetch.
 //
-// It imports nothing; test/javascript/footer_map.test.mjs loads it as a data:
-// module. Started by the footer-map controller.
+// LEAFLET IS A MODULE IMPORT. The vendored build (studio/leaflet.js) is
+// imported by the URL the element carries, as a dynamic import(), not a
+// <script> element injected into the head: it assigns window.L when it is
+// evaluated, and an import is governed by the page's script-src exactly as the
+// module that asks for it is. A browser never refetches a module whose fetch
+// failed, so a retry asks for the same file under a fresh query string.
+//
+// It imports nothing statically; test/javascript/footer_map.test.mjs loads it as
+// a data: module and hands installFooterMaps its own importer. Started by the
+// footer-map controller.
 
 export const MAPS = "[data-footer-map][data-leaflet-js]"
 export const TILES = "https://tile.openstreetmap.org/{z}/{x}/{y}.png"
@@ -33,15 +41,25 @@ export function mapOptions(dataset) {
   return { at, zoom: parseInt(dataset.zoom, 10) || 15, zoomControl: dataset.controls !== "false" }
 }
 
+// The URL of the nth attempt at one file: the file itself first, then the same
+// file under ?retry=n, because the module map remembers a failed fetch.
+export function attemptUrl(src, attempt) {
+  if (!attempt) return src
+  return `${src}${src.includes("?") ? "&" : "?"}retry=${attempt}`
+}
+
+const importModule = (url) => import(url)
+
 // Installs the footer maps, once per document. Answers the function that arms
 // the maps now on the page (after `load`), whether this call installed it or an
-// earlier one did.
-export function installFooterMaps(win, doc) {
+// earlier one did. `load` is how a module is imported (a test passes its own).
+export function installFooterMaps(win, doc, { load = importModule } = {}) {
   if (win.__studioFooterMapsArmed) return win.__studioFooterMapsArm || (() => {})
   win.__studioFooterMapsArmed = true
 
   let maps = []
   let loading = null
+  let attempts = 0
 
   // Checked on every mount, not once: a page visit that rebuilds the head must
   // not leave a mounted map without its stylesheet.
@@ -57,14 +75,12 @@ export function installFooterMaps(win, doc) {
   function loadLeaflet(src) {
     if (win.L) return Promise.resolve()
     if (loading) return loading
-    loading = new Promise((resolve, reject) => {
-      const s = doc.createElement("script")
-      s.src = src
-      s.onload = resolve
+    const url = attemptUrl(src, attempts)
+    attempts += 1
+    loading = new Promise((resolve) => resolve(load(url)))
+      .then(() => { if (!win.L) throw new Error("leaflet loaded without window.L") })
       // A failed fetch must not be remembered: the next visit tries again.
-      s.onerror = () => { loading = null; s.remove(); reject(new Error("leaflet failed to load")) }
-      doc.head.appendChild(s)
-    })
+      .catch((error) => { loading = null; throw error })
     return loading
   }
 

data/app/{assets/javascripts → javascript}/studio/sticky_table_header.js

@@ -1,3 +1,12 @@
+// studio/sticky_table_header: pins a cloned header row over a long table as it
+// scrolls under the navbar (docs/NAVBAR_SETUP.md). An ES module that installs on
+// import: the head loads it with a type="module" tag when
+// Studio.sticky_table_headers is on (or the head's sticky_table_headers local
+// says so). Its default export is window.StudioStickyTableHeaders
+// ({ loaded, pinnedEdge, placement }), which stays as the compatibility global
+// (CHANGELOG, "Deprecated"). The body stays one function with no import, so
+// test/javascript/sticky_table_header.test.mjs still runs it in a node:vm
+// context per test (cutting the single export line).
 (() => {
   if (window.StudioStickyTableHeaders?.loaded) return;
 
@@ -259,3 +268,5 @@
   window.addEventListener("scroll", scheduleUpdate, { passive: true });
   window.addEventListener("resize", scheduleUpdate, { passive: true });
 })();
+
+export default window.StudioStickyTableHeaders

data/app/javascript/studio/studio_confetti.js

@@ -0,0 +1,117 @@
+/*
+  studio/studio_confetti — two zero-dependency celebration effects built on the
+  vendored canvas-confetti (app/assets/javascripts/studio/canvas_confetti.js,
+  pinned as "canvas-confetti", no CDN).
+
+  An ES module (the head loads it with a type="module" tag after the import
+  map). It imports canvas-confetti for its side effect, which defines the
+  library's global `confetti`, and exports:
+
+    import { burst, cannons, confetti } from "studio/studio_confetti"
+    burst(cardEl)    // radial burst behind a card/modal
+    cannons()        // side-cannons full-screen celebration
+    confetti(opts)   // the canvas-confetti call itself, a no-op if it failed to load
+
+  Ported faithfully from turf-monster:
+    - burst(target)  → the radial card-burst that explodes from BEHIND a card or
+      modal, emanating from its center (TM solana_utils.js fireConfettiFromModal /
+      shared/_alpine_factories fireQuestBadgeConfetti). Pass the DOM element (or a
+      selector, or an {x,y} origin in 0..1 viewport space) to aim it; defaults to
+      screen center.
+    - cannons(opts)  → the full-screen "you joined a contest" celebration: a center
+      burst plus left + right side-cannons firing inward and a top shell (the same
+      choreography as the engine head's window.fireSuccessConfetti).
+
+  Both honor prefers-reduced-motion: reduce (no-op, and disableForReducedMotion is
+  also passed through to canvas-confetti as a second belt). Colors come from
+  window.CONFETTI_COLORS when a host sets it, else a neutral festive default.
+
+  DEPRECATED COMPATIBILITY GLOBALS (CHANGELOG, "Deprecated"): window.studioConfetti
+  ({ burst, cannons }) and the library's own window.confetti stay, because hosts
+  call them from classic code (turf-monster's solana_utils and _alpine_factories).
+  New code imports from this module. Both now exist once the head's modules have
+  run (deferred, before Alpine starts), no longer during the body's parse.
+*/
+import "canvas-confetti"
+
+const DEFAULT_COLORS = [
+  "#4BAF50", "#8E82FE", "#06D6A0", "#FF7C47",
+  "#FFD700", "#00BFFF", "#FF6B9D", "#C084FC"
+]
+
+function colors(opts) {
+  return (opts && opts.colors) || window.CONFETTI_COLORS || DEFAULT_COLORS
+}
+
+function reducedMotion() {
+  return !!(window.matchMedia &&
+            window.matchMedia("(prefers-reduced-motion: reduce)").matches)
+}
+
+// The canvas-confetti call. Read off the window on every call, not captured at
+// import: the vendored build assigns the global when it is evaluated, and a
+// failed load leaves it undefined, which makes every effect a no-op.
+export function confetti(opts) {
+  if (typeof window.confetti !== "function") return null
+  return window.confetti(opts)
+}
+
+function available() {
+  return typeof window.confetti === "function" && !reducedMotion()
+}
+
+// Resolve a burst origin ({x,y} in 0..1 viewport space) from an element, a
+// selector, or a literal {x,y}. Falls back to screen center when the target is
+// missing or not laid out (e.g. a card that just unmounted).
+function originFor(target) {
+  const el = (typeof target === "string") ? document.querySelector(target) : target
+  if (el && el.nodeType === 1) {
+    const r = el.getBoundingClientRect()
+    if (r.width || r.height) {
+      return {
+        x: (r.left + r.width / 2) / window.innerWidth,
+        y: (r.top + r.height / 2) / window.innerHeight
+      }
+    }
+  }
+  if (target && typeof target.x === "number" && typeof target.y === "number") {
+    return { x: target.x, y: target.y }
+  }
+  return { x: 0.5, y: 0.5 }
+}
+
+// Radial burst from behind a card/modal — spread:360 fires in every direction
+// from the card center, low velocity + gravity keep it clustered around the
+// card rather than blasting off-screen. A smaller follow-shell layers texture,
+// and two bottom-corner sweeps give the moment theatre.
+export function burst(target, opts) {
+  if (!available()) return
+  opts = opts || {}
+  const origin = originFor(target)
+  const c = colors(opts)
+  const z = opts.zIndex || 9999
+  confetti({ particleCount: 140, angle: 90, spread: 360, origin: origin, colors: c, zIndex: z, startVelocity: 30, gravity: 0.7, ticks: 220, scalar: 1.0, disableForReducedMotion: true })
+  setTimeout(() => {
+    confetti({ particleCount: 60, angle: 60, spread: 70, origin: { x: Math.max(0, origin.x - 0.18), y: Math.min(1, origin.y + 0.05) }, colors: c, zIndex: z, startVelocity: 40, gravity: 0.9, ticks: 200, scalar: 0.9, disableForReducedMotion: true })
+    confetti({ particleCount: 60, angle: 120, spread: 70, origin: { x: Math.min(1, origin.x + 0.18), y: Math.min(1, origin.y + 0.05) }, colors: c, zIndex: z, startVelocity: 40, gravity: 0.9, ticks: 200, scalar: 0.9, disableForReducedMotion: true })
+  }, 180)
+}
+
+// Full-screen side-cannon celebration: center burst, then left + right cannons
+// firing inward, then a wide top shell. Mirrors window.fireSuccessConfetti.
+export function cannons(opts) {
+  if (!available()) return
+  opts = opts || {}
+  const c = colors(opts)
+  const z = opts.zIndex || 9999
+  confetti({ particleCount: 150, spread: 100, origin: { x: 0.5, y: 0.5 }, colors: c, zIndex: z, startVelocity: 45, gravity: 0.8, ticks: 300, scalar: 1.2, disableForReducedMotion: true })
+  setTimeout(() => { confetti({ particleCount: 80, angle: 60,  spread: 60,  origin: { x: 0,   y: 0.6 }, colors: c, zIndex: z, startVelocity: 55, gravity: 1,   ticks: 250, disableForReducedMotion: true }) }, 150)
+  setTimeout(() => { confetti({ particleCount: 80, angle: 120, spread: 60,  origin: { x: 1,   y: 0.6 }, colors: c, zIndex: z, startVelocity: 55, gravity: 1,   ticks: 250, disableForReducedMotion: true }) }, 150)
+  setTimeout(() => { confetti({ particleCount: 100, spread: 160, origin: { x: 0.5, y: 0.3 }, colors: c, zIndex: z, startVelocity: 30, gravity: 1.2, ticks: 200, scalar: 0.8, disableForReducedMotion: true }) }, 400)
+}
+
+const studioConfetti = { burst, cannons }
+export default studioConfetti
+
+// DEPRECATED: the compatibility global for classic callers. Import the module.
+window.studioConfetti = studioConfetti

data/app/views/layouts/studio/_head.html.erb

@@ -28,7 +28,15 @@
 <%= csrf_meta_tags %>
 <%= csp_meta_tag %>
 <%# The session-drift stamp + browser store. Renders nothing unless the controller
-    includes Studio::ErrorHandling. See studio/_session_stamp. %>
+    includes Studio::ErrorHandling. See studio/_session_stamp.
+
+    THE ONE ENGINE SCRIPT THAT STAYS CLASSIC, AND SYNCHRONOUS. Host code
+    registers identity sources with window.StudioSession as its own modules
+    EVALUATE (turf-monster registers its identity source from a module at
+    import; CHANGELOG, "Held"), and the host's entry point is the module tag
+    javascript_importmap_tags renders, which any engine module tag below the map
+    would follow. A module store would not exist yet, and the registration would
+    silently be null. It becomes a module when those consumers wait for it. %>
 <%= render "studio/session_stamp" %>
 <%= render "layouts/studio/smooth_load" %>
 <%# The favicon's URL carries its content version (Studio::PublicFileVersion),
@@ -116,14 +124,8 @@
   }
 </style>
 
-<%# canvas-confetti is VENDORED into the engine (studio/canvas_confetti.js) and
-    shipped through the asset pipeline — no CDN, CSP-safe (same-origin :self),
-    zero-per-app dependency. Defines the global `confetti`; studio_confetti.js
-    then builds window.studioConfetti (burst/cannons). fireSuccessConfetti
-    (studio/head_chrome) rides the same global. %>
-<%= javascript_include_tag "studio/canvas_confetti", "data-turbo-track": "reload" %>
-<%= javascript_include_tag "studio/studio_confetti", "data-turbo-track": "reload" %>
-<%# The theme and devMode stores are studio/alpine_stores (its module tag is below).
+<%# Confetti is a module now: studio/studio_confetti, loaded below the import map.
+    The theme and devMode stores are studio/alpine_stores (its module tag is below).
     showNavSpinner / hideNavSpinner and fireSuccessConfetti are studio/head_chrome,
     installed by studio/alpine_shims. %>
 
@@ -187,6 +189,13 @@
   <%= stylesheet_link_tag "studio/sticky_table_header", "data-turbo-track": "reload" %>
 <% end %>
 <%= javascript_importmap_tags %>
+<%# EVERY ENGINE SCRIPT BELOW IS A MODULE, AND EVERY MODULE TAG COMES AFTER THE
+    IMPORT MAP. A browser without dynamic import maps ignores an import map that
+    arrives after its first module script, so a module tag above this line would
+    take every bare specifier on the page down with it. The ones below that load by
+    URL (type="module" with a src) are external files, not inline scripts: they
+    carry no body and need no nonce under a policy that allows 'self'. The session
+    store (studio/_session_stamp, above) is the one classic script, and says why. %>
 <%# THE ENGINE'S BROWSER BOOT (studio/application): its every-page Stimulus
     controllers, the pinned stack, and the Alpine shims. A module tag, so it
     carries the nonce. %>
@@ -229,8 +238,15 @@
     module that owns it. Its imports import nothing, and studio/alpine_shims
     imports it, so a failed boot leaves a page its uploads. %>
 <%= javascript_import_module_tag "studio/alpine_scopes" %>
-<%# ALPINE LOADS AFTER THE MODULE TAGS, and the order is the contract. Deferred
-    classic scripts and module scripts execute in document order, so by the time
+<%# CONFETTI, BY URL. studio/studio_confetti imports the vendored canvas-confetti
+    (pinned "canvas-confetti", app/assets/javascripts/studio/canvas_confetti.js:
+    no CDN, same-origin) and exports burst, cannons and confetti. It also keeps
+    the deprecated globals window.studioConfetti and window.confetti, which
+    studio/head_chrome's fireSuccessConfetti and host classic code still call.
+    Before Alpine, so both exist by the time an x-init can fire one. %>
+<%= javascript_include_tag "studio/studio_confetti", type: "module", "data-turbo-track": "reload" %>
+<%# ALPINE LOADS AFTER THE MODULE TAGS, and the order is the contract. Module
+    scripts (and deferred classic ones) execute in document order, so by the time
     Alpine starts, studio/application has defined the shims it evaluates
     (x-data="navCollapse()"), studio/alpine_stores has registered the
     `alpine:init` listener that installs $store.theme and $store.devMode, and
@@ -255,7 +271,13 @@
     Investigated as a suspect in the board-filter flake (three PRs reddened in one
     day, 2026-08-15). This removes a real source of run-to-run variance; it does NOT
     claim to be that flake's cause, and the remaining suspect there is untouched. %>
-<%= javascript_include_tag "studio/alpine", defer: true, "data-turbo-track": "reload" %>
+<%# A MODULE TAG, NOT A DEFERRED CLASSIC ONE (it was `defer: true` until the
+    engine's scripts became modules). A module is deferred by definition, so its
+    place in the document order is unchanged. The vendored build is unedited: it
+    assigns window.Alpine and starts Alpine in a microtask after it is evaluated,
+    which as a module is after every module above it. window.Alpine is not
+    deprecated; Alpine itself and every host read it. %>
+<%= javascript_include_tag "studio/alpine", type: "module", "data-turbo-track": "reload" %>
 <% if sticky_table_headers %>
-  <%= javascript_include_tag "studio/sticky_table_header", defer: true, "data-turbo-track": "reload" %>
+  <%= javascript_include_tag "studio/sticky_table_header", type: "module", "data-turbo-track": "reload" %>
 <% end %>

data/config/importmap.rb

@@ -15,6 +15,11 @@
 # is the classic build (app/assets/javascripts/studio/sortable.js), which assigns
 # window.Sortable when it is imported.
 #
+# The vendored canvas-confetti is pinned the same way, as "canvas-confetti", and
+# not preloaded: studio/studio_confetti imports it, and the head loads that
+# module by its own tag. It too is the classic build, which assigns
+# window.confetti when it is imported.
+#
 # `pin`, not `pin_all_from`, so a host can override one: importmap-rails expands
 # a pin_all_from directory AFTER every plain pin, so a directory pin would beat
 # the host's own `pin` of the same name. Plain pins are last-drawn-wins, and the
@@ -28,3 +33,4 @@ Studio::Engine.javascript_module_logical_paths.each do |logical_path|
 end
 pin "@hotwired/stimulus", to: "studio/vendor/stimulus.js", preload: true
 pin "sortablejs", to: "studio/sortable.js", preload: false
+pin "canvas-confetti", to: "studio/canvas_confetti.js", preload: false

data/docs/SITE_FOOTER.md

@@ -279,7 +279,9 @@ element, isolate that element too.
 Leaflet is served by the engine through the app's asset pipeline
 (`studio/leaflet.js`, `studio/leaflet.css`, both in the engine's precompile
 list), so it works on Heroku with no extra step in either a Sprockets or a
-Propshaft app. The engine's copy of the stylesheet drops Leaflet's default marker
+Propshaft app. `studio/footer_map` imports the script as a module, with a
+dynamic `import()` of the URL on the map element, and the vendored build
+assigns `window.L` when it is evaluated. The engine's copy of the stylesheet drops Leaflet's default marker
 image and its layers-control image, which are not shipped: mark a point with
 `L.divIcon`, as the footer does.
 

data/lib/studio/engine.rb

@@ -76,12 +76,16 @@ module Studio
     end
 
     initializer "studio.assets" do |app|
+      # app/assets/javascripts/studio: the vendored third-party builds, each
+      # loaded as an ES module (Alpine by the head's type="module" tag,
+      # canvas-confetti and SortableJS through their importmap pins, Leaflet by
+      # studio/footer_map's import()), and studio/session.js, the one classic
+      # script (layouts/studio/_head says why). The engine's own modules are
+      # under app/javascript, enumerated below.
       app.config.assets.precompile += %w[
         studio/sticky_table_header.css
-        studio/sticky_table_header.js
         studio/alpine.js
         studio/canvas_confetti.js
-        studio/studio_confetti.js
         studio/sortable.js
         studio/leaflet.js
         studio/leaflet.css
@@ -130,9 +134,9 @@ module Studio
     # The contract a module joins by being here:
     #   - it lives under app/javascript/studio/ and is pinned as "studio/<name>";
     #   - pins are NOT preloaded, so a page fetches only the modules it imports;
-    #   - its logical asset path shares the studio/ prefix with the classic
-    #     scripts in app/assets/javascripts/studio, so a module may not reuse one
-    #     of those names (test/integration/engine_importmap_pins_test.rb).
+    #   - its logical asset path shares the studio/ prefix with the files in
+    #     app/assets/javascripts/studio (vendored builds, studio/session.js), so
+    #     a module may not reuse one of those names (test/integration/engine_importmap_pins_test.rb).
     # A host without importmap-rails (a footer-only consumer) skips this.
     initializer "studio.importmap", before: "importmap" do |app|
       next unless app.config.respond_to?(:importmap)

data/lib/studio/version.rb

@@ -1,3 +1,3 @@
 module Studio
-  VERSION = "0.115.0"
+  VERSION = "0.115.1.rc1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: studio-engine
 version: !ruby/object:Gem::Version
-  version: 0.115.0
+  version: 0.115.1.rc1
 platform: ruby
 authors:
 - Alex McRitchie
@@ -365,8 +365,6 @@ files:
 - app/assets/javascripts/studio/leaflet.js
 - app/assets/javascripts/studio/session.js
 - app/assets/javascripts/studio/sortable.js
-- app/assets/javascripts/studio/sticky_table_header.js
-- app/assets/javascripts/studio/studio_confetti.js
 - app/assets/stylesheets/studio/leaflet.css
 - app/assets/stylesheets/studio/sticky_table_header.css
 - app/assets/tailwind/studio_engine/engine-motion.css
@@ -471,7 +469,9 @@ files:
 - app/javascript/studio/newsletter_modal.js
 - app/javascript/studio/pinned_stack.js
 - app/javascript/studio/profile_form.js
+- app/javascript/studio/sticky_table_header.js
 - app/javascript/studio/stimulus.js
+- app/javascript/studio/studio_confetti.js
 - app/javascript/studio/style_guide.js
 - app/javascript/studio/style_modals.js
 - app/javascript/studio/survey.js

data/app/assets/javascripts/studio/studio_confetti.js

@@ -1,93 +0,0 @@
-/*
-  studio-engine — window.studioConfetti: two zero-dependency celebration effects
-  built on the vendored canvas-confetti (studio/canvas_confetti.js, no CDN).
-
-  Ported faithfully from turf-monster:
-    - burst(target)  → the radial card-burst that explodes from BEHIND a card or
-      modal, emanating from its center (TM solana_utils.js fireConfettiFromModal /
-      shared/_alpine_factories fireQuestBadgeConfetti). Pass the DOM element (or a
-      selector, or an {x,y} origin in 0..1 viewport space) to aim it; defaults to
-      screen center.
-    - cannons(opts)  → the full-screen "you joined a contest" celebration: a center
-      burst plus left + right side-cannons firing inward and a top shell (the same
-      choreography as the engine head's window.fireSuccessConfetti).
-
-  Both honor prefers-reduced-motion: reduce (no-op, and disableForReducedMotion is
-  also passed through to canvas-confetti as a second belt). Colors come from
-  window.CONFETTI_COLORS when a host sets it, else a neutral festive default.
-
-  Usage:
-    window.studioConfetti.burst(cardEl);   // radial burst behind a card/modal
-    window.studioConfetti.cannons();       // side-cannons full-screen celebration
-*/
-(function () {
-  "use strict";
-
-  var DEFAULT_COLORS = [
-    "#4BAF50", "#8E82FE", "#06D6A0", "#FF7C47",
-    "#FFD700", "#00BFFF", "#FF6B9D", "#C084FC"
-  ];
-
-  function colors(opts) {
-    return (opts && opts.colors) || window.CONFETTI_COLORS || DEFAULT_COLORS;
-  }
-
-  function reducedMotion() {
-    return !!(window.matchMedia &&
-              window.matchMedia("(prefers-reduced-motion: reduce)").matches);
-  }
-
-  // Resolve a burst origin ({x,y} in 0..1 viewport space) from an element, a
-  // selector, or a literal {x,y}. Falls back to screen center when the target is
-  // missing or not laid out (e.g. a card that just unmounted).
-  function originFor(target) {
-    var el = (typeof target === "string") ? document.querySelector(target) : target;
-    if (el && el.nodeType === 1) {
-      var r = el.getBoundingClientRect();
-      if (r.width || r.height) {
-        return {
-          x: (r.left + r.width / 2) / window.innerWidth,
-          y: (r.top + r.height / 2) / window.innerHeight
-        };
-      }
-    }
-    if (target && typeof target.x === "number" && typeof target.y === "number") {
-      return { x: target.x, y: target.y };
-    }
-    return { x: 0.5, y: 0.5 };
-  }
-
-  var studioConfetti = {
-    // Radial burst from behind a card/modal — spread:360 fires in every direction
-    // from the card center, low velocity + gravity keep it clustered around the
-    // card rather than blasting off-screen. A smaller follow-shell layers texture,
-    // and two bottom-corner sweeps give the moment theatre.
-    burst: function (target, opts) {
-      if (typeof confetti === "undefined" || reducedMotion()) return;
-      opts = opts || {};
-      var origin = originFor(target);
-      var c = colors(opts);
-      var z = opts.zIndex || 9999;
-      confetti({ particleCount: 140, angle: 90, spread: 360, origin: origin, colors: c, zIndex: z, startVelocity: 30, gravity: 0.7, ticks: 220, scalar: 1.0, disableForReducedMotion: true });
-      setTimeout(function () {
-        confetti({ particleCount: 60, angle: 60, spread: 70, origin: { x: Math.max(0, origin.x - 0.18), y: Math.min(1, origin.y + 0.05) }, colors: c, zIndex: z, startVelocity: 40, gravity: 0.9, ticks: 200, scalar: 0.9, disableForReducedMotion: true });
-        confetti({ particleCount: 60, angle: 120, spread: 70, origin: { x: Math.min(1, origin.x + 0.18), y: Math.min(1, origin.y + 0.05) }, colors: c, zIndex: z, startVelocity: 40, gravity: 0.9, ticks: 200, scalar: 0.9, disableForReducedMotion: true });
-      }, 180);
-    },
-
-    // Full-screen side-cannon celebration: center burst, then left + right cannons
-    // firing inward, then a wide top shell. Mirrors window.fireSuccessConfetti.
-    cannons: function (opts) {
-      if (typeof confetti === "undefined" || reducedMotion()) return;
-      opts = opts || {};
-      var c = colors(opts);
-      var z = opts.zIndex || 9999;
-      confetti({ particleCount: 150, spread: 100, origin: { x: 0.5, y: 0.5 }, colors: c, zIndex: z, startVelocity: 45, gravity: 0.8, ticks: 300, scalar: 1.2, disableForReducedMotion: true });
-      setTimeout(function () { confetti({ particleCount: 80, angle: 60,  spread: 60,  origin: { x: 0,   y: 0.6 }, colors: c, zIndex: z, startVelocity: 55, gravity: 1,   ticks: 250, disableForReducedMotion: true }); }, 150);
-      setTimeout(function () { confetti({ particleCount: 80, angle: 120, spread: 60,  origin: { x: 1,   y: 0.6 }, colors: c, zIndex: z, startVelocity: 55, gravity: 1,   ticks: 250, disableForReducedMotion: true }); }, 150);
-      setTimeout(function () { confetti({ particleCount: 100, spread: 160, origin: { x: 0.5, y: 0.3 }, colors: c, zIndex: z, startVelocity: 30, gravity: 1.2, ticks: 200, scalar: 0.8, disableForReducedMotion: true }); }, 400);
-    }
-  };
-
-  window.studioConfetti = studioConfetti;
-})();