jssm 5.141.13 → 5.142.0

package/dist/cdn/instance.js

@@ -21430,7 +21430,7 @@ var constants = /*#__PURE__*/Object.freeze({
  *  Useful for runtime diagnostics and for embedding in serialized machine
  *  snapshots so that deserializers can detect version-skew.
  */
-const version = "5.141.13";
+const version = "5.142.0";
 
 // whargarbl lots of these return arrays could/should be sets
 const { state_name_chars, state_name_first_chars, action_label_chars } = constants;
@@ -25342,6 +25342,74 @@ function abstract_everything_hook_step(maybe_hook, hook_args) {
     }
 }
 
+/**
+ * Shared helpers for the dual-prefix (`fsl-` canonical, `jssm-` synonym)
+ * web-component naming convention.  Centralizes the "match either prefix"
+ * rule so it lives in exactly one place.
+ */
+/**
+ * Returns true when `tag_name` is exactly `fsl-<suffix>` or `jssm-<suffix>`
+ * (case-insensitive).
+ *
+ * @param tag_name - The element tag name to test (e.g. `"FSL-VIZ"`, `"jssm-viz"`).
+ * @param suffix   - The suffix to match after the prefix (e.g. `"viz"`).
+ * @returns `true` when `tag_name` is `fsl-<suffix>` or `jssm-<suffix>`.
+ *
+ * @example
+ * wc_suffix_matches('FSL-VIZ', 'viz');   // true
+ * wc_suffix_matches('jssm-viz', 'viz');  // true
+ * wc_suffix_matches('div', 'viz');       // false
+ * wc_suffix_matches('fsl-vizard', 'viz'); // false — suffix must match exactly
+ */
+function wc_suffix_matches(tag_name, suffix) {
+    const lower = tag_name.toLowerCase();
+    return lower === `fsl-${suffix}` || lower === `jssm-${suffix}`;
+}
+/**
+ * Returns the nearest ancestor of `el` (or `el` itself) whose tag is
+ * `fsl-<suffix>` or `jssm-<suffix>`, or `null` if none exists.
+ *
+ * @param el     - The element to start the search from.
+ * @param suffix - The suffix to match (e.g. `"instance"`).
+ * @returns The closest matching ancestor element, or `null`.
+ *
+ * @example
+ * // <fsl-instance><div id="k"></div></fsl-instance>
+ * closest_wc(document.getElementById('k'), 'instance'); // <fsl-instance>
+ *
+ * @see wc_suffix_matches
+ */
+function closest_wc(el, suffix) {
+    return el.closest(`fsl-${suffix}, jssm-${suffix}`);
+}
+/**
+ * Registers a canonical custom-element tag and its synonym tag.
+ *
+ * `customElements.define` requires a distinct constructor per tag name, so
+ * callers pass the canonical class and a thin subclass for the synonym.
+ * The function is idempotent: if either tag is already registered it skips
+ * that `define` call rather than throwing.
+ *
+ * @param canonical_tag  - The primary tag name (e.g. `"fsl-instance"`).
+ * @param synonym_tag    - The alias tag name (e.g. `"jssm-instance"`).
+ * @param CanonicalClass - Constructor to register under `canonical_tag`.
+ * @param SynonymClass   - Constructor to register under `synonym_tag`
+ *                         (must be a distinct class from `CanonicalClass`).
+ *
+ * @example
+ * class FslInstance extends HTMLElement {}
+ * class JssmInstance extends FslInstance {}
+ * define_with_synonym('fsl-instance', 'jssm-instance', FslInstance, JssmInstance);
+ *
+ * @see closest_wc
+ */
+function define_with_synonym(canonical_tag, synonym_tag, CanonicalClass, SynonymClass) {
+    if (!customElements.get(canonical_tag))
+        customElements.define(canonical_tag, CanonicalClass);
+    if (!customElements.get(synonym_tag))
+        customElements.define(synonym_tag, SynonymClass);
+}
+
 /**
  * Walk a dotted path into a value.  Used by the `data.path.to.field`
  * variant of {@link resolve_binding}.  Returns `undefined` whenever the
@@ -25505,12 +25573,13 @@ function install_bindings(host, machine) {
         apply();
         unsubs.push(machine.on('transition', apply));
     }
-    // Form 2: dedicated `<jssm-bind>` configuration tags.  Only direct
-    // children are considered configuration tags for THIS host — nested
-    // `<jssm-instance>` children would have their own bindings handled by
-    // their own component.
-    const config_tags = host.querySelectorAll(':scope > jssm-bind');
-    for (const tag of Array.from(config_tags)) {
+    // Form 2: dedicated `<fsl-bind>` / `<jssm-bind>` configuration tags.  Only
+    // direct children are considered configuration tags for THIS host — nested
+    // `<fsl-instance>` / `<jssm-instance>` children would have their own
+    // bindings handled by their own component.
+    const all_direct = host.querySelectorAll(':scope > *');
+    const config_tags = Array.from(all_direct).filter(el => wc_suffix_matches(el.tagName, 'bind'));
+    for (const tag of config_tags) {
         const selector = tag.getAttribute('selector');
         const expr = tag.getAttribute('source');
         const target = (_b = tag.getAttribute('target')) !== null && _b !== void 0 ? _b : 'textContent';
@@ -25532,22 +25601,22 @@ function install_bindings(host, machine) {
     return unsubs;
 }
 /**
- * `<jssm-bind>` configuration tag.  The element itself is invisible —
- * it carries `selector`, `source`, and optional `target` attributes
- * that the parent `<jssm-instance>` reads during its connection
+ * `<fsl-bind>` / `<jssm-bind>` configuration tag.  The element itself is
+ * invisible — it carries `selector`, `source`, and optional `target`
+ * attributes that the parent `<fsl-instance>` reads during its connection
  * lifecycle to wire up a machine-to-DOM binding.
  *
  * Registering it as a `LitElement` (rather than leaving it as a generic
  * unknown tag) gives it a stable upgrade timing, a `display: none`
  * default style, and a proper place in the custom-elements registry so
- * `customElements.get('jssm-bind')` resolves.
+ * `customElements.get('fsl-bind')` resolves.
  *
- * @element jssm-bind
+ * @element fsl-bind
  * @attribute selector - CSS selector for the target element(s), scoped to the host.
  * @attribute source - Binding expression (see {@link resolve_binding}).
  * @attribute target - Target property name; defaults to `textContent`.
  */
-class JssmBind extends i {
+class FslBind extends i {
     /**
      * No-op render.  The tag's purpose is purely declarative
      * configuration; it must not contribute any DOM to the page.
@@ -25556,7 +25625,7 @@ class JssmBind extends i {
         return null;
     }
 }
-JssmBind.styles = i$3 `:host { display: none; }`;
+FslBind.styles = i$3 `:host { display: none; }`;
 
 const VALID_KINDS = new Set([
     'hook',
@@ -25974,9 +26043,10 @@ function resolve_fsl_source(host, fsl_attr) {
         const clone = host.cloneNode(true);
         // Drop every script tag (any type — we only want raw text FSL here).
         clone.querySelectorAll('script').forEach(n => n.remove());
-        // Drop every <jssm-*> companion tag (e.g. <jssm-hook>, <jssm-on>, etc.).
+        // Drop every <fsl-*> or <jssm-*> companion tag (e.g. <fsl-hook>, <jssm-on>, etc.).
         clone.querySelectorAll('*').forEach(n => {
-            if (n.tagName.toLowerCase().startsWith('jssm-')) {
+            const t = n.tagName.toLowerCase();
+            if (t.startsWith('fsl-') || t.startsWith('jssm-')) {
                 n.remove();
             }
         });
@@ -26017,7 +26087,7 @@ function resolve_fsl_source(host, fsl_attr) {
  * and sets a `--current-state` CSS custom property so consumer CSS can
  * style by state without subclassing.
  *
- * @element jssm-instance
+ * @element fsl-instance
  * @cssproperty [--current-state] - The machine's current state name as a CSS string token.
  * @slot title - Heading area for the instance.
  * @slot viz - Visualization slot; fallback is a placeholder string.
@@ -26027,7 +26097,7 @@ function resolve_fsl_source(host, fsl_attr) {
  * @slot info-panel - Slot for an info / status panel.
  * @slot footer - Footer slot.
  */
-class JssmInstance extends i {
+class FslInstance extends i {
     constructor() {
         super(...arguments);
         /**
@@ -26047,7 +26117,7 @@ class JssmInstance extends i {
          */
         this._machine = undefined;
         /**
-         * Live unsubscribe callbacks for #645 `<jssm-bind>` / `data-jssm-bind`
+         * Live unsubscribe callbacks for #645 `<fsl-bind>` / `data-jssm-bind`
          * projections.  Every entry must be invoked exactly once during
          * {@link disconnectedCallback}.
          */
@@ -26060,7 +26130,8 @@ class JssmInstance extends i {
         this._on_unsubscribes = [];
         /**
          * Per-instance registry of named hook handlers consulted before
-         * `globalThis` when resolving `<jssm-hook handler="name">`.
+         * `globalThis` when resolving `<fsl-hook handler="name">` /
+         * `<jssm-hook handler="name">`.
          */
         this.registry = new Map();
         /**
@@ -26083,7 +26154,7 @@ class JssmInstance extends i {
      */
     get machine() {
         if (this._machine === undefined) {
-            throw new Error('jssm-instance: machine accessed before connection');
+            throw new Error('fsl-instance: machine accessed before connection');
         }
         return this._machine;
     }
@@ -26126,7 +26197,7 @@ class JssmInstance extends i {
         // Step 1: resolve FSL source.
         const resolved = resolve_fsl_source(this, this.fsl);
         if (resolved.error !== undefined) {
-            throw new Error(`jssm-instance: ${resolved.error}`);
+            throw new Error(`fsl-instance: ${resolved.error}`);
         }
         // Step 2: construct the machine.
         // (The resolver guarantees `fsl` is a non-empty string when error is undefined.)
@@ -26171,7 +26242,7 @@ class JssmInstance extends i {
      */
     _install_jssm_on_children() {
         const machine = this._machine;
-        const on_nodes = this.querySelectorAll(':scope > jssm-on');
+        const on_nodes = this.querySelectorAll(':scope > fsl-on, :scope > jssm-on');
         let index = 0;
         for (const el of Array.from(on_nodes)) {
             index += 1;
@@ -26199,7 +26270,7 @@ class JssmInstance extends i {
      */
     _install_declarative_hooks() {
         const machine = this._machine;
-        const hook_els = this.querySelectorAll(':scope > jssm-hook');
+        const hook_els = this.querySelectorAll(':scope > fsl-hook, :scope > jssm-hook');
         for (const el of Array.from(hook_els)) {
             const debug_id = `${this._hook_id_prefix()}${++this._hook_debug_counter}`;
             const spec = parse_hook_element(el, debug_id, this.registry);
@@ -26260,7 +26331,7 @@ class JssmInstance extends i {
      */
     _discover_jssm_actions() {
         var _a, _b, _c, _d;
-        const inline_targets = Array.from(this.querySelectorAll('[data-jssm-action]')).filter(el => el.closest('jssm-action') === null);
+        const inline_targets = Array.from(this.querySelectorAll('[data-jssm-action]')).filter(el => closest_wc(el, 'action') === null);
         for (const el of inline_targets) {
             this._install_action_listener({
                 source: el,
@@ -26272,7 +26343,7 @@ class JssmInstance extends i {
                 stop_propagation: 'jssmStopPropagation' in el.dataset,
             });
         }
-        const tags = this.querySelectorAll(':scope > jssm-action');
+        const tags = this.querySelectorAll(':scope > fsl-action, :scope > jssm-action');
         for (const tag of Array.from(tags)) {
             const selector = tag.getAttribute('selector');
             const action_name = tag.getAttribute('action');
@@ -26363,7 +26434,7 @@ class JssmInstance extends i {
         return b `
       <div class="container">
         <header>
-          <slot name="title"><span class="placeholder">jssm-instance</span></slot>
+          <slot name="title"><span class="placeholder">fsl-instance</span></slot>
         </header>
         <section class="viz">
           <slot name="viz"><span class="placeholder">no viz configured</span></slot>
@@ -26390,7 +26461,7 @@ class JssmInstance extends i {
     `;
     }
 }
-JssmInstance.styles = i$3 `
+FslInstance.styles = i$3 `
     :host {
       display: block;
     }
@@ -26409,12 +26480,13 @@ JssmInstance.styles = i$3 `
  * survives the future companion-tag work without colliding with
  * dynamically declared attributes.
  */
-JssmInstance.properties = {
+FslInstance.properties = {
     fsl: { type: String, reflect: false },
 };
 
-if (!customElements.get('jssm-instance')) {
-    customElements.define('jssm-instance', JssmInstance);
+/** Thin subclass so `<jssm-instance>` registers under a distinct constructor. */
+class JssmInstance extends FslInstance {
 }
+define_with_synonym('fsl-instance', 'jssm-instance', FslInstance, JssmInstance);
 
-export { JssmInstance };
+export { FslInstance, JssmInstance };

package/dist/cdn/viz.js

@@ -21455,7 +21455,7 @@ var constants = /*#__PURE__*/Object.freeze({
  *  Useful for runtime diagnostics and for embedding in serialized machine
  *  snapshots so that deserializers can detect version-skew.
  */
-const version = "5.141.13";
+const version = "5.142.0";
 
 // whargarbl lots of these return arrays could/should be sets
 const { state_name_chars, state_name_first_chars, action_label_chars } = constants;
@@ -25988,6 +25988,70 @@ async function machine_to_svg_string(u_jssm, opts = {}) {
     return dot_to_svg(machine_to_dot(u_jssm, opts));
 }
 
+/**
+ * Shared helpers for the dual-prefix (`fsl-` canonical, `jssm-` synonym)
+ * web-component naming convention.  Centralizes the "match either prefix"
+ * rule so it lives in exactly one place.
+ */
+/**
+ * Returns true when `tag_name` is exactly `fsl-<suffix>` or `jssm-<suffix>`
+ * (case-insensitive).
+ *
+ * @param tag_name - The element tag name to test (e.g. `"FSL-VIZ"`, `"jssm-viz"`).
+ * @param suffix   - The suffix to match after the prefix (e.g. `"viz"`).
+ * @returns `true` when `tag_name` is `fsl-<suffix>` or `jssm-<suffix>`.
+ *
+ * @example
+ * wc_suffix_matches('FSL-VIZ', 'viz');   // true
+ * wc_suffix_matches('jssm-viz', 'viz');  // true
+ * wc_suffix_matches('div', 'viz');       // false
+ * wc_suffix_matches('fsl-vizard', 'viz'); // false — suffix must match exactly
+ */
+/**
+ * Returns the nearest ancestor of `el` (or `el` itself) whose tag is
+ * `fsl-<suffix>` or `jssm-<suffix>`, or `null` if none exists.
+ *
+ * @param el     - The element to start the search from.
+ * @param suffix - The suffix to match (e.g. `"instance"`).
+ * @returns The closest matching ancestor element, or `null`.
+ *
+ * @example
+ * // <fsl-instance><div id="k"></div></fsl-instance>
+ * closest_wc(document.getElementById('k'), 'instance'); // <fsl-instance>
+ *
+ * @see wc_suffix_matches
+ */
+function closest_wc(el, suffix) {
+    return el.closest(`fsl-${suffix}, jssm-${suffix}`);
+}
+/**
+ * Registers a canonical custom-element tag and its synonym tag.
+ *
+ * `customElements.define` requires a distinct constructor per tag name, so
+ * callers pass the canonical class and a thin subclass for the synonym.
+ * The function is idempotent: if either tag is already registered it skips
+ * that `define` call rather than throwing.
+ *
+ * @param canonical_tag  - The primary tag name (e.g. `"fsl-instance"`).
+ * @param synonym_tag    - The alias tag name (e.g. `"jssm-instance"`).
+ * @param CanonicalClass - Constructor to register under `canonical_tag`.
+ * @param SynonymClass   - Constructor to register under `synonym_tag`
+ *                         (must be a distinct class from `CanonicalClass`).
+ *
+ * @example
+ * class FslInstance extends HTMLElement {}
+ * class JssmInstance extends FslInstance {}
+ * define_with_synonym('fsl-instance', 'jssm-instance', FslInstance, JssmInstance);
+ *
+ * @see closest_wc
+ */
+function define_with_synonym(canonical_tag, synonym_tag, CanonicalClass, SynonymClass) {
+    if (!customElements.get(canonical_tag))
+        customElements.define(canonical_tag, CanonicalClass);
+    if (!customElements.get(synonym_tag))
+        customElements.define(synonym_tag, SynonymClass);
+}
+
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -26030,20 +26094,20 @@ function normalize_viz_error(e) {
  *
  * Two operating modes:
  *
- *   1. **Standalone** (no parent `<jssm-instance>` ancestor): render from
+ *   1. **Standalone** (no parent `<fsl-instance>` ancestor): render from
  *      the element's own `fsl=""` attribute / property.  Re-renders on
  *      attribute change.
- *   2. **Nested** (inside a `<jssm-instance>` ancestor, found via
- *      `closest('jssm-instance')` at `connectedCallback`): bind to the
- *      parent's machine and re-render on every `transition` event.  The
- *      element's own `fsl` attribute is ignored in this mode; supplying it
- *      emits a `console.warn` for developer feedback.
+ *   2. **Nested** (inside a `<fsl-instance>` or `<jssm-instance>` ancestor,
+ *      found via `closest_wc(this, 'instance')` at `connectedCallback`):
+ *      bind to the parent's machine and re-render on every `transition`
+ *      event.  The element's own `fsl` attribute is ignored in this mode;
+ *      supplying it emits a `console.warn` for developer feedback.
  *
- * @element jssm-viz
+ * @element fsl-viz
  * @cssproperty [--jssm-viz-min-height=100px] - Minimum height of the rendered SVG container.
  * @fires {CustomEvent<{ message: string; location?: unknown }>} viz-error - Fires when the FSL source fails to parse or render.
  */
-class JssmViz extends i$1 {
+class FslViz extends i$1 {
     constructor() {
         super(...arguments);
         /** FSL source to render. */
@@ -26052,9 +26116,10 @@ class JssmViz extends i$1 {
         this.engine = undefined;
         this._svg = '';
         /**
-         * Parent `<jssm-instance>` host reference, set in `connectedCallback`
-         * when a parent is found.  When non-null the viz is in nested mode and
-         * renders the parent's machine instead of its own `fsl` attribute.
+         * Parent `<fsl-instance>` (or `<jssm-instance>`) host reference, set in
+         * `connectedCallback` when a parent is found.  When non-null the viz is
+         * in nested mode and renders the parent's machine instead of its own
+         * `fsl` attribute.
          */
         this._parent_host = null;
         /**
@@ -26087,9 +26152,9 @@ class JssmViz extends i$1 {
     }
     /**
      * Web Components lifecycle hook.  Walks up to find a parent
-     * `<jssm-instance>` ancestor; if found, switches into nested mode and
-     * subscribes to the parent machine's `transition` events.  Otherwise
-     * leaves standalone behavior intact.
+     * `<fsl-instance>` or `<jssm-instance>` ancestor via `closest_wc`; if
+     * found, switches into nested mode and subscribes to the parent machine's
+     * `transition` events.  Otherwise leaves standalone behavior intact.
      *
      * Subscription setup is deferred via `customElements.whenDefined` so the
      * parent has had a chance to upgrade and construct its machine before
@@ -26097,7 +26162,7 @@ class JssmViz extends i$1 {
      */
     connectedCallback() {
         super.connectedCallback();
-        const host = this.closest('jssm-instance');
+        const host = closest_wc(this, 'instance');
         if (host === null) {
             return; // standalone: existing behavior, willUpdate handles render
         }
@@ -26106,13 +26171,13 @@ class JssmViz extends i$1 {
         // owns the machine.
         if (typeof this.fsl === 'string' && this.fsl.trim().length > 0) {
             // eslint-disable-next-line no-console
-            console.warn('<jssm-viz>: `fsl` ignored when nested inside <jssm-instance>; parent owns the machine');
+            console.warn('<fsl-viz>: `fsl` ignored when nested inside <fsl-instance>; parent owns the machine');
         }
         this._parent_host = host;
         // Defer to whenDefined so a not-yet-upgraded host has its machine
         // available before we access `host.machine` (which throws when called
         // pre-connection).
-        void customElements.whenDefined('jssm-instance').then(() => {
+        void customElements.whenDefined('fsl-instance').then(() => {
             // Re-check the host is still attached and the viz still belongs to
             // it — disconnection between the deferred resolution and now is
             // legal and should not error.
@@ -26227,7 +26292,7 @@ class JssmViz extends i$1 {
         return b `<div class="container">${o(this._svg)}</div>`;
     }
 }
-JssmViz.styles = i$4 `
+FslViz.styles = i$4 `
     :host {
       display: block;
       min-height: var(--jssm-viz-min-height, 100px);
@@ -26239,33 +26304,17 @@ JssmViz.styles = i$4 `
   `;
 __decorate([
     n({ type: String })
-], JssmViz.prototype, "fsl", void 0);
+], FslViz.prototype, "fsl", void 0);
 __decorate([
     n({ type: String })
-], JssmViz.prototype, "engine", void 0);
+], FslViz.prototype, "engine", void 0);
 __decorate([
     r()
-], JssmViz.prototype, "_svg", void 0);
+], FslViz.prototype, "_svg", void 0);
 
-/**
- * Empty subclass that allows the same class to be registered under a
- * second tag name. `customElements.define` requires a distinct constructor
- * per tag, so the only portable way to publish `<fsl-viz>` as a synonym
- * for `<jssm-viz>` is to register a no-op subclass.
- *
- * Both tags render identically; `<fsl-viz>` is provided as an alternative
- * spelling for users whose mental model is "FSL viz" rather than "jssm
- * viz".  Parent-context binding for both tags lives on the shared
- * `JssmViz` base class (see {@link JssmViz}); the synonym inherits it
- * automatically.
- */
-class FslViz extends JssmViz {
-}
-if (!customElements.get('jssm-viz')) {
-    customElements.define('jssm-viz', JssmViz);
-}
-if (!customElements.get('fsl-viz')) {
-    customElements.define('fsl-viz', FslViz);
+/** Thin subclass so `<jssm-viz>` registers under a distinct constructor. */
+class JssmViz extends FslViz {
 }
+define_with_synonym('fsl-viz', 'jssm-viz', FslViz, JssmViz);
 
 export { FslViz, JssmViz };