@livenetworks/ashlar 1.6.1 → 2.0.0

package/{js → components}/ln-confirm/README.md

@@ -1,12 +1,15 @@
 # ln-confirm
 
-A zero-dependency, ultra-lightweight **Interaction Gate Primitive** (~131 lines of JavaScript) that creates a self-contained, two-click confirmation checkpoint on standard buttons. It intercepts accidental clicks, morphs in-place to reveal confirmation prompts, and passes the second click directly to native platform events.
+> Applied directly to `<button data-ln-confirm>` or `<a data-ln-confirm>`. On the first `click`, it calls
+> `e.preventDefault()`, sets `data-ln-confirm-state="confirming"`, unhides `[data-ln-confirm-active]` (or swaps text),
+> and starts a `setTimeout`. A second `click` before timeout lets the native event proceed; if the timer fires first,
+> it clears the attribute and restores the original DOM content.
 
 ---
 
 ## 🧭 Philosophy & Architecture
 
-1. **In-Place Morphing:** Instead of launching heavy, separate dialogs or using frozen, unstyleable `window.confirm()` scripts, confirmation lives **directly on the target button**. It preserves structural styling while using CSS mixins to display temporary labels or icon tooltips.
+1. **In-Place Morphing:** Instead of launching heavy, separate dialogs or using frozen, unstyleable `window.confirm()` scripts, confirmation lives **directly on the target button**. It preserves structural styling while swapping labels, child states or the icon in place.
 2. **Platform Event Release:** `ln-confirm` does not implement a custom `accept` handler. The acceptance is the standard platform `click` event. On the second click, the component steps out of the way of the *default action* — form submissions (`type="submit"`), links (`href`), or custom AJAX click listeners execute natively. It does **not** step out of the way of propagation: the click stops at the button on both clicks, so an ancestor click surface never sees it.
 3. **Graceful Auto-Revert:** The gate is timed. When armed, a countdown timer is scheduled. If a second click does not arrive within the window, the button cleanly reverts to its idle text or icon state.
 
@@ -59,8 +62,8 @@ On click, the idle content hides and the active content unhides, without mutatin
 | :--- | :--- | :--- |
 | `data-ln-confirm="Prompt"` | `<button>`, `<a>` | Action gate marker. Empty value defaults to `"Confirm?"` (in legacy mode). If using Two-Element Mode, this value is left blank. |
 | `data-ln-confirm-timeout="3"` | `<button>`, `<a>` | Auto-revert delay in seconds (default `3`). |
-| `data-confirming="true"` | `<button>` (auto) | Managed state. Set during active confirmation; acts as public CSS hook. |
-| `data-tooltip-text="Prompt"` | `<button>` (auto) | Managed state. Displays tooltip bubble in legacy icon-only mode. |
+| `data-ln-confirm-state="confirming"` | `<button>` (auto) | Managed state. Set during active confirmation; acts as public CSS hook. |
+| `data-ln-confirm-announcer` | injected `<span>` (auto) | Marker on the transient `role="alert"` node that speaks the prompt in icon-only mode. |
 | `data-ln-confirm-idle` | Any child | Defines the idle state layout/content (button icon/text) in Two-Element Mode. |
 | `data-ln-confirm-active` | Any child | Defines the confirmation prompt content in Two-Element Mode. |
 
@@ -73,7 +76,7 @@ Access the confirmation instance directly via the `lnConfirm` property on the bu
 ```javascript
 const button = document.getElementById('delete-btn');
 
-// 1. Check if armed (Boolean getter)
+// 1. Check if armed (live read-only getter over data-ln-confirm-state)
 if (button.lnConfirm.confirming) { ... }
 
 // 2. Disarm immediately, restore visual states, and unbind listeners
@@ -109,7 +112,7 @@ button.lnConfirm.destroy();
 
 ## 🔧 Internals
 
-Source: `js/ln-confirm/ln-confirm.js`. Imports nothing from other components, consumes no `ln-*` event, and emits nothing the library listens to. Its entire contract is the platform `click` sequence on its own button.
+Source: `components/ln-confirm/ln-confirm.js`. Imports nothing from other components, consumes no `ln-*` event, and emits nothing the library listens to. Its entire contract is the platform `click` sequence on its own button.
 
 ### Two-click flow
 
@@ -118,7 +121,7 @@ The click handler branches on `this.confirming`.
 **First click** (`confirming === false`) — arm:
 - `preventDefault()` blocks the platform action (submit / navigate).
 - `stopImmediatePropagation()` stops *later* same-element listeners, so a project's own analytics/validation click handler does not fire on the arming click — only on the second, accepting click. Listeners bound *before* ln-confirm still run, which is why the bundle must be defer-loaded.
-- `_enterConfirm()`: set `confirming`, write `data-confirming="true"` (CSS hook), swap the button to its confirm presentation (see Modes), schedule the auto-revert timer, dispatch `ln-confirm:waiting`.
+- `_enterConfirm()`: set `confirming`, write `data-ln-confirm-state="confirming"` (CSS hook), swap the button to its confirm presentation (see Modes), schedule the auto-revert timer, dispatch `ln-confirm:waiting`.
 
 **Second click** (`confirming === true`) — accept:
 - No `preventDefault` — the click runs its native default (form submit, link nav, existing handler) unmodified. That is the whole design: insert a checkpoint, then step out.
@@ -129,36 +132,84 @@ Containment covers listener-based ancestors. It does not cover an ancestor `<a h
 
 There is deliberately no `ln-confirm:accept` event and no second-click cancel signal — "accept" is just the native click; listen on the form `submit`, the link, or the button `click`.
 
-### Construction-time snapshot
+### Attribute contract
 
-`originalText` (`dom.textContent.trim()`) and `confirmText` (`data-ln-confirm`, default `"Confirm?"`) are captured **once at construction**, not per click. Mutating the button's text or the attribute afterwards does not propagate to the live instance — the contract is snapshotted once and run on every click. This is intentional: re-reading per confirm would race AJAX-driven content updates and change the button text mid-confirm.
+The `ATTRIBUTES` table is the single source of truth for the host attributes. Each entry
+with a `prop` becomes a **live getter** via `defineAttrs` — `confirmText`, `timeout` and
+`confirming` read the DOM on every access, so nothing is copied into instance state and
+there is no sync step. The getters have no setter; assigning to them throws.
 
-For the same reason the shared observer watches `data-ln-confirm` only, **not** `data-ln-confirm-timeout`. The timeout is read once, at arm time, in `_startTimer` (`parseFloat`, falling back to `3` on `NaN`/`≤0`). Changing it while armed does not affect the running timer — set it before the user arms.
+`data-ln-confirm` and `data-ln-confirm-timeout` are therefore read at the moment they are
+used — the prompt when the button arms, the timeout when `_startTimer` schedules the
+revert. Changing the timeout while armed does not affect the already-running timer.
+
+No entry declares an `effect`, so the component is deliberately non-reactive: the shared
+observer watches `data-ln-confirm` for instance creation only, and editing any of these
+attributes never runs component code on its own.
+
+`originalText` is the one genuine snapshot — it is `dom.textContent.trim()` captured at
+construction, not an attribute, and is what `_reset` restores. Text mode therefore reverts
+to the label the button had when it was hydrated; use Two-Element mode for labels that
+change at runtime.
 
 ### Modes
 
 - **Two-Element (recommended):** if the button contains `[data-ln-confirm-idle]` and `[data-ln-confirm-active]`, the component only toggles their `hidden` attribute — no DOM mutation, so inner icons / selection-count spans survive and all text stays authored in HTML.
 - **Legacy text:** no child markers → `dom.textContent` is swapped to `confirmText` and restored on revert.
-- **Icon-only:** fires when `originalText === ''` **and** a `svg.ln-icon use` exists at confirm time (checked fresh, to handle async-rendered icons). Swaps `<use href>` to `#ln-icon-check` (ln-icon fetches it on demand), adds `.ln-confirm-tooltip` + `data-tooltip-text`, and handles a11y (below). Everything is restored symmetrically in `_reset`.
+- **Icon-only:** fires when `originalText === ''` **and** a `svg.ln-icon use` exists at confirm time (checked fresh, to handle async-rendered icons). Swaps `<use href>` to `#ln-icon-check` (ln-icon fetches it on demand) and handles a11y (below). Everything is restored symmetrically in `_reset`.
 
 ### Icon-only accessibility
 
-The tooltip bubble is a CSS `::after` — invisible to AT. So the icon branch also:
+The icon swap is silent to AT and there is no visible text to read. So the icon branch:
 1. swaps `aria-label` to `confirmText` (original captured, restored on reset), and
-2. appends a transient `<span class="sr-only" role="alert">` carrying the prompt — `role="alert"` is announced on insertion, which an `aria-label` change alone is not. Removed on reset.
+2. appends a transient `<span data-ln-confirm-announcer role="alert">` carrying the prompt,
+   removed again in `_reset`.
+
+`role="alert"` is its own assertive live region, which is why this branch deliberately does
+**not** also set `aria-live` on the button — a live region nested inside a live region gets
+announced twice. The two-element branch does still set `aria-live="polite"`, because there
+the button's own content changes (`hidden` flips) and nothing is injected.
 
-Text mode needs neither: `textContent` *is* the accessible name.
+The announcer is hidden by a co-located rule on `[data-ln-confirm-announcer]` rather than
+by `.sr-only`: this component's SCSS ships in `ln-ashlar-core.css` and `.sr-only` does not,
+so a core-only consumer would otherwise see the prompt printed inside the button.
+
+Text mode needs neither: `textContent` *is* the accessible name, and changing it is itself
+the announcement.
 
 ### CSS hooks
 
-Co-located SCSS is two JS-state rules (the accepted co-located exception):
+Co-located SCSS carries two functional rules. This file ships in the **core** bundle, so
+neither may lean on theme tokens or theme utilities:
+
+```scss
+[data-ln-confirm] [hidden]  { display: none; }
+[data-ln-confirm-announcer] { /* visually hidden, no theme dependency */ }
+```
+
+The first is the П4 hiding contract: native `hidden` is the mechanism — `_enterConfirm` and
+`_reset` toggle it on the idle/active children — and the rule backs the UA default up at
+(0,2,0) so a `display` set on a child cannot defeat it. There is deliberately no second,
+state-keyed rule performing the same hiding. A two-element button whose
+`[data-ln-confirm-active]` is missing `hidden` in the authored markup is a markup bug, and
+`ln-confirm-dev.scss` says so under `[data-ln-debug]` instead of silently papering over it.
+
+The single themed rule rebinds the accent token while armed:
 
 ```scss
-[data-confirming]:not(.ln-confirm-tooltip) { --color-primary: var(--color-error); }
-[data-ln-table]:has([data-confirming])     { overflow: visible; }
+// theme/components/_confirm.scss
+[data-ln-confirm-state="confirming"] { --color-primary: var(--color-error); }
 ```
 
-The first rebinds `--color-primary` to `--color-error` while armed — the red fill falls out of `@mixin btn` reading the primary token, so theme overrides apply automatically. `:not(.ln-confirm-tooltip)` avoids double-coloring icon mode, where `@mixin confirm-tooltip` owns the color. The second lifts `ln-table`'s `overflow: clip` so the icon tooltip isn't clipped by the row while any confirm in the table is armed; other scrollable containers need their own parallel rule.
+`theme/base/_global.scss` documents this as *the* way to express a colour variant, so a
+button carrying `@mixin btn` — including `button[type="submit"]` — turns red while armed and
+theme overrides keep working. A bare `<button>` runs only `@mixin button-base`, whose
+`color: var(--btn-fg)` never reads `--color-primary`; it has no variant to recolour, so its
+armed signal is the icon swap alone. That is deliberate, not an oversight.
+
+`ln-confirm` renders no bubble, no tooltip and no overlay, and therefore needs no ancestor
+to relax `overflow`. A button that also wants a tooltip composes
+[ln-tooltip](../ln-tooltip/README.md) alongside it.
 
 ### Destroy
 

package/components/ln-confirm/ln-confirm-dev.scss

@@ -0,0 +1,24 @@
+@use '../../theme/config/mixins' as *;
+
+[data-ln-debug] {
+	// 1. Two-Element Mode Incomplete: if [data-ln-confirm-idle] is present, [data-ln-confirm-active] is required
+	[data-ln-confirm]:has([data-ln-confirm-idle]):not(:has([data-ln-confirm-active])) {
+		@include dev-inline-error("ln-confirm two-element mode is missing [data-ln-confirm-active]");
+	}
+
+	// 2. Two-Element Mode Incomplete: if [data-ln-confirm-active] is present, [data-ln-confirm-idle] is required
+	[data-ln-confirm]:has([data-ln-confirm-active]):not(:has([data-ln-confirm-idle])) {
+		@include dev-inline-error("ln-confirm two-element mode is missing [data-ln-confirm-idle]");
+	}
+
+	// 3. Confirm Empty Message: empty string without two-element mode
+	[data-ln-confirm=""]:not(:has([data-ln-confirm-idle])):not(:has([data-ln-confirm-active])) {
+		@include dev-inline-error("data-ln-confirm has empty prompt and no idle/active child elements");
+	}
+
+	// 4. Two-Element Mode: the active child must carry `hidden` in the authored markup,
+	//    otherwise both labels render at rest
+	[data-ln-confirm]:not([data-ln-confirm-state="confirming"]) [data-ln-confirm-active]:not([hidden]) {
+		@include dev-inline-error("ln-confirm [data-ln-confirm-active] is missing the hidden attribute");
+	}
+}

package/components/ln-confirm/ln-confirm.js

@@ -0,0 +1 @@
+(function(){"use strict";function L(){return typeof window>"u"?!1:window.lnDebug===!0||window.lnCore&&window.lnCore._debugSink?!0:typeof document<"u"&&document.body?document.body.hasAttribute("data-ln-debug")||document.body.querySelector("[data-ln-debug]")!==null:!1}function C(e){if(typeof window>"u")return!1;if(window.lnDebug===!0)return!0;if(window.lnCore&&window.lnCore._debugIsContained)return e?window.lnCore._debugIsContained(e):window.lnCore._debugSink!==null;if(e&&e.closest){const t=e.closest("[data-ln-debug]");return!(!t||typeof document<"u"&&t===document.documentElement)}return typeof document<"u"&&document.body?document.body.hasAttribute("data-ln-debug"):!1}if(typeof window<"u"&&(window.lnCore=window.lnCore||{},!window.lnCore._warnBound)){window.lnCore._warnBound=!0;const e=console.warn;console.warn=function(...t){if(typeof t[0]=="string"&&(t[0].startsWith("[ln-")||t[0].startsWith("[lnCore"))){let r=null;for(let i=1;i<t.length;i++)if(t[i]&&t[i].nodeType===1){r=t[i];break}if(!C(r))return}e.apply(console,t)}}function O(e,t,n){const r=n||{};window.lnCore._debugSink&&window.lnCore._debugSink("event",t,e,r),e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:r}))}function m(e,t){if(!document.body){document.addEventListener("DOMContentLoaded",function(){m(e,t)}),console.warn("["+t+'] Script loaded before <body> — add "defer" to your <script> tag');return}e()}function H(e){return!!(!e||e.ctrlKey||e.metaKey||e.shiftKey||e.altKey||typeof e.button=="number"&&e.button!==0)}const I={};function U(e,t){I[e]=t}function V(e){return I[e]||{ingress:t=>t,egress:t=>t}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=U,window.lnCore.getDataMapper=V);function K(){typeof window>"u"||(window.lnCore=window.lnCore||{},!window.lnCore._localeObserverBound&&(window.lnCore._localeObserverBound=!0,m(function(){new MutationObserver(function(){O(document,"ln-core:locale-change",{})}).observe(document.documentElement,{attributes:!0,attributeFilter:["lang"],subtree:!0})},"ln-core")))}const D={};function P(e,t){if(!e||typeof t!="object")return;const n=e.toLowerCase().split("-")[0];D[n]=t}function Q(e){if(!e)return null;const t=e.toLowerCase().split("-")[0];return D[t]||null}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerLocaleFallback=P,window.lnCore.getLocaleFallback=Q,window.lnCore.ensureLocaleObserver=K);const y={};function J(e,t){y[e]||(y[e]=document.querySelector('[data-ln-template="'+e+'"]'));const n=y[e];return n?n.content.cloneNode(!0):(console.warn("["+(t||"ln-core")+'] Template "'+e+'" not found'),null)}function $(e,t){if(!e||!t)return e;const n=e.querySelectorAll("[data-ln-field]");for(let l=0;l<n.length;l++){const a=n[l],s=a.getAttribute("data-ln-field");t[s]!=null&&(a.textContent=t[s])}const r=e.querySelectorAll("[data-ln-attr]");for(let l=0;l<r.length;l++){const a=r[l],s=a.getAttribute("data-ln-attr").split(",");for(let d=0;d<s.length;d++){const f=s[d].trim().split(":");if(f.length!==2)continue;const c=f[0].trim(),u=f[1].trim();t[u]!=null&&a.setAttribute(c,t[u])}}const i=e.querySelectorAll("[data-ln-show]");for(let l=0;l<i.length;l++){const a=i[l],s=a.getAttribute("data-ln-show");s in t&&a.classList.toggle("hidden",!t[s])}const o=e.querySelectorAll("[data-ln-class]");for(let l=0;l<o.length;l++){const a=o[l],s=a.getAttribute("data-ln-class").split(",");for(let d=0;d<s.length;d++){const f=s[d].trim().split(":");if(f.length!==2)continue;const c=f[0].trim(),u=f[1].trim();u in t&&a.classList.toggle(c,!!t[u])}}return e}function G(e,t){e.matches&&e.matches("[data-ln-form], [data-ln-fillable]")&&(window.lnCore._debugSink&&window.lnCore._debugSink("event","ln-fill",e,t??null),e.dispatchEvent(new CustomEvent("ln-fill",{detail:t??null,bubbles:!0})));const n=e.querySelectorAll("[data-ln-form], [data-ln-fillable]");for(let r=0;r<n.length;r++)window.lnCore._debugSink&&window.lnCore._debugSink("event","ln-fill",n[r],t??null),n[r].dispatchEvent(new CustomEvent("ln-fill",{detail:t??null,bubbles:!0}));return e}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore._fillBound||(window.lnCore._fillBound=!0,document.addEventListener("ln-fill",function(e){if(!(!e.target.matches||!e.target.matches("[data-ln-fillable]")))if(e.detail)$(e.target,e.detail);else{const t=e.target.querySelectorAll("[data-ln-field]");for(let n=0;n<t.length;n++)t[n].textContent=""}})));function q(e,t){if(!e||!t)return e;const n=document.createTreeWalker(e,NodeFilter.SHOW_TEXT);for(;n.nextNode();){const o=n.currentNode;o.textContent.indexOf("{{")!==-1&&(o.textContent=o.textContent.replace(/\{\{\s*(\w+)\s*\}\}/g,function(l,a){return t[a]!==void 0?t[a]:""}))}const r=function(o,l){return t[l]!==void 0?t[l]:""},i=Array.from(e.querySelectorAll("*"));e.nodeType===1&&i.push(e);for(let o=0;o<i.length;o++){const l=i[o],a=l.attributes;for(let s=0;s<a.length;s++){const d=a[s];d.value.indexOf("{{")!==-1&&l.setAttribute(d.name,d.value.replace(/\{\{\s*(\w+)\s*\}\}/g,r))}}return e}function X(e,t,n,r,i,o){const l={};for(let s=0;s<e.children.length;s++){const d=e.children[s],f=d.getAttribute("data-ln-render-key");f&&(l[f]=d)}const a=document.createDocumentFragment();for(let s=0;s<t.length;s++){const d=t[s],f=String(r(d));let c=l[f];if(c)i(c,d,s);else{const u=J(n,o);if(!u||(q(u,d),c=u.firstElementChild,!c))continue;c.setAttribute("data-ln-render-key",f),i(c,d,s)}a.appendChild(c)}e.textContent="",e.appendChild(a)}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.fillTemplate=q,window.lnCore.fill=$,window.lnCore.lnFill=G,window.lnCore.renderList=X);function M(e,t,n){const r=e.getAttribute(t);return r===null?n:r}function z(e,t,n){const r=parseInt(e.getAttribute(t),10);return isNaN(r)?n:r}function Y(e,t,n=!1){const r=e.getAttribute(t);if(r===null)return!!n;const i=r.trim().toLowerCase();return!(i==="false"||i==="0")}function Z(e,t){return(e.getAttribute(t)||"").split(",").map(n=>n.trim()).filter(Boolean)}const A=new Map;function ee(e,t){const n=(e?e.join("|"):"")+"::"+t;if(A.has(n))return A.get(n);const r=new Set(e||[]),i=function(o,l){const a=o.getAttribute(l);return a!==null&&r.has(a)?a:t};return A.set(n,i),i}function te(e,t,n){const r=parseFloat(e.getAttribute(t));return isNaN(r)?n:r}function ne(e,t,n){const r=e.getAttribute(t);if(!r)return n;try{return JSON.parse(r)}catch{return n}}function N(e,t,n,r,i){if(!e||t===null)return!0;const o=r||"ln-component",l=e.type;if(l==="trigger"||l==="marker"||l==="string"||l==="list"||!l||t===""&&e.fallback!==void 0)return!0;const a=s=>{i?console.warn(s,i):console.warn(s)};if(l==="boolean"){const s=t.trim().toLowerCase();return s!==""&&s!=="true"&&s!=="false"&&s!=="1"&&s!=="0"?(a(`[${o}] Invalid value "${t}" for boolean attribute "${n}". Allowed: "true", "false", or presence-only.`),!1):!0}if(l==="enum"){const s=e.values||[];return s.includes(t)?!0:(a(`[${o}] Invalid value "${t}" for attribute "${n}". Allowed: ${s.join(", ")}. Fallback: "${e.fallback}".`),!1)}if(l==="integer"){if(!/^-?\d+$/.test(t))return a(`[${o}] Invalid integer "${t}" for attribute "${n}". Fallback: ${e.fallback}.`),!1;const s=parseInt(t,10);return e.min!==void 0&&s<e.min?(a(`[${o}] Value ${s} for attribute "${n}" is less than min (${e.min}).`),!1):e.max!==void 0&&s>e.max?(a(`[${o}] Value ${s} for attribute "${n}" is greater than max (${e.max}).`),!1):!0}if(l==="float")return isNaN(Number(t))?(a(`[${o}] Invalid float "${t}" for attribute "${n}". Fallback: ${e.fallback}.`),!1):!0;if(l==="json")try{return JSON.parse(t),!0}catch(s){return a(`[${o}] Invalid JSON for attribute "${n}": ${s.message}. Fallback: ${e.fallback}.`),!1}return!0}function re(e,t,n){for(const r in n){const[i,o,l]=n[r];Object.defineProperty(e,r,{get:function(){return i(t,o,l)},enumerable:!0,configurable:!0})}return e}function ie(e){const t={};for(const n in e){const r=e[n];if(!r||!r.prop)continue;let i=r.read;if(!i&&r.type)switch(r.type){case"enum":i=ee(r.values,r.fallback);break;case"integer":i=z;break;case"float":i=te;break;case"boolean":i=Y;break;case"list":i=Z;break;case"json":i=ne;break;case"string":default:i=M;break}i||(i=M),t[r.prop]=[i,n,r.fallback]}return t}function oe(e){const t={};for(const n in e){const r=e[n];r&&r.effect&&(t[n]=r.effect)}return Object.keys(t).length?t:null}function le(e){if(e.onAttrChange&&!e.declared)return null;const t=new Set;if(e.effects)for(const n in e.effects)t.add(n);if(e.onAttrChange&&e.declared)for(const n of e.declared)t.add(n);return t}function v(e,t,n,r){if(e.nodeType!==1)return;const o=t.indexOf("[")!==-1||t.indexOf(".")!==-1||t.indexOf("#")!==-1?t:"["+t+"]",l=Array.from(e.querySelectorAll(o));e.matches&&e.matches(o)&&l.push(e);for(const a of l)if(!a[n]){window.lnCore._persistSink&&a.hasAttribute("data-ln-persist")&&window.lnCore._persistSink(a,t);try{a[n]=new r(a)}catch(s){console.error("["+n+"] init failed",a,s)}}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore._bootHolds=window.lnCore._bootHolds||0,window.lnCore._bootQueue=window.lnCore._bootQueue||[]);function se(){return typeof window<"u"&&window.lnCore&&window.lnCore._bootHolds||0}function ae(e){typeof window<"u"?(window.lnCore=window.lnCore||{},window.lnCore._bootHolds=window.lnCore._bootHolds||0,window.lnCore._bootQueue=window.lnCore._bootQueue||[],window.lnCore._bootHolds>0?window.lnCore._bootQueue.push(e):setTimeout(e,0)):e()}function R(){window.lnCore=window.lnCore||{};const e=window.lnCore._attrRegistry=window.lnCore._attrRegistry||{byAttr:new Map,reactive:[],persist:[]};return e.byReactive=e.byReactive||new Map,e.reactiveWildcard=e.reactiveWildcard||[],e}function ce(e){const t=R(),n=e.observed||[];for(let r=0;r<n.length;r++){const i=n[r];t.byAttr.has(i)||t.byAttr.set(i,[]),t.byAttr.get(i).push(e)}if(t.byDeclaredAttr=t.byDeclaredAttr||new Map,e.attributes)for(const r in e.attributes){t.byDeclaredAttr.has(r)||t.byDeclaredAttr.set(r,[]);const i=t.byDeclaredAttr.get(r);i.some(o=>o.componentTag===e.componentTag)||i.push({spec:e.attributes[r],componentTag:e.componentTag})}if(e.onAttrChange||e.effects){t.reactive.push(e);const r=le(e);if(r===null)t.reactiveWildcard.push(e);else for(const i of r)t.byReactive.has(i)||t.byReactive.set(i,[]),t.byReactive.get(i).push(e)}e.persist&&t.persist.push(e)}function F(e,t,n,r){for(let i=0;i<e.length;i++){const o=e[i];if(!t[o.attribute])continue;const l=o.effects&&o.effects[n];l?l(t,n,r):o.onAttrChange&&(!o.declared||o.declared.has(n))&&o.onAttrChange(t,n,r)}}function ue(e){const t=e.target,n=e.attributeName;if(e.oldValue===t.getAttribute(n))return;const r=R(),i=r.byAttr.get(n);if(L()&&r.byDeclaredAttr&&r.byDeclaredAttr.has(n)&&C(t)){const o=r.byDeclaredAttr.get(n),l=t.getAttribute(n);for(let a=0;a<o.length;a++)N(o[a].spec,l,n,o[a].componentTag,t)}if(window.lnCore._debugSink&&(n.indexOf("data-ln-")===0||i)&&window.lnCore._debugSink("attr",n,t,{oldValue:e.oldValue,newValue:t.getAttribute(n)}),n.indexOf("data-ln-")===0){const o=r.byReactive.get(n);o&&F(o,t,n,e.oldValue),r.reactiveWildcard.length&&F(r.reactiveWildcard,t,n,e.oldValue)}if(i)for(let o=0;o<i.length;o++){const l=i[o];if(l.handler){l.handler(t,n,e.oldValue);continue}l.onAttributeChange&&t[l.attribute]?l.onAttributeChange(t,n):(v(t,l.selector,l.attribute,l.ComponentFn),l.onInit&&l.onInit(t))}}function de(){window.lnCore=window.lnCore||{},!window.lnCore._attrObserverBound&&(window.lnCore._attrObserverBound=!0,m(function(){new MutationObserver(function(t){for(let n=0;n<t.length;n++)try{ue(t[n])}catch(r){console.error("[ln-core] mutation handler failed",t[n].target,r)}}).observe(document.body,{attributes:!0,subtree:!0,attributeOldValue:!0})},"ln-core"))}function B(){return window.lnCore=window.lnCore||{},window.lnCore._lifecycleRegistry=window.lnCore._lifecycleRegistry||[]}function fe(e){const t=B();if(t.length){if(e.target)for(let n=0;n<t.length;n++){const r=t[n];if(r.onSubtreeChange){const i=r.query,o=e.target.nodeType===1?e.target.matches(i)?e.target:e.target.closest(i):e.target.parentElement?e.target.parentElement.closest(i):null;o&&r.onSubtreeChange(o,e)}}for(let n=0;n<e.addedNodes.length;n++){const r=e.addedNodes[n];if(r.nodeType===1)for(let i=0;i<t.length;i++){const o=t[i];v(r,o.selector,o.attribute,o.ComponentFn),o.onInit&&o.onInit(r)}}for(let n=0;n<e.removedNodes.length;n++){const r=e.removedNodes[n];if(r.nodeType===1)for(let i=0;i<t.length;i++){const o=t[i],l=o.query,a=Array.from(r.querySelectorAll(l));r.matches&&r.matches(l)&&a.push(r);for(let s=0;s<a.length;s++){const d=a[s];if(!document.contains(d)){const f=d[o.attribute];if(f&&typeof f.destroy=="function")try{f.destroy()}catch(c){console.error("["+o.attribute+"] destroy failed",d,c)}delete d[o.attribute]}}}}}}function he(){window.lnCore=window.lnCore||{},!window.lnCore._lifecycleObserverBound&&(window.lnCore._lifecycleObserverBound=!0,m(function(){new MutationObserver(function(t){for(let n=0;n<t.length;n++){const r=t[n];if(r.type==="childList")try{fe(r)}catch(i){console.error("[ln-core] lifecycle handler failed",r.target,i)}}}).observe(document.body,{childList:!0,subtree:!0})},"ln-core"))}function we(e,t,n,r,i={}){const o=i.extraAttributes||[],l=i.onAttributeChange||null,a=i.onSubtreeChange||null,s=i.onInit||null,d=i.onAttrChange||null,f=i.effects||null,c=i.attributes||null,u=c?oe(c):f,h=c?new Set(Object.keys(c)):null,b=i.persist||null;function p(k){const w=k||document.body;if(v(w,e,t,n),c&&L())for(const g in c){const Te=c[g],S=Array.from(w.querySelectorAll("["+g+"]"));w.matches&&w.matches("["+g+"]")&&S.push(w);for(let E=0;E<S.length;E++){const x=S[E];C(x)&&N(Te,x.getAttribute(g),g,r,x)}}s&&s(w)}const T=[];if(e.indexOf("[")!==-1){const k=/\[([\w-]+)/g;let w;for(;(w=k.exec(e))!==null;)T.push(w[1])}else T.push(e);ce({selector:e,attribute:t,componentTag:r,attributes:c,ComponentFn:n,onInit:s,observed:T.concat(o),onAttributeChange:l,onAttrChange:d,effects:u,declared:h,persist:b}),de();const _e=e.indexOf("[")!==-1||e.indexOf(".")!==-1||e.indexOf("#")!==-1?e:"["+e+"]";B().push({selector:e,attribute:t,ComponentFn:n,onInit:s,onSubtreeChange:a,query:_e}),he(),window[t]=p;function W(){se()>0?ae(function(){p(document.body)}):p(document.body)}return document.readyState==="loading"?document.addEventListener("DOMContentLoaded",W):W(),p}function j(e){return(e||"").replace(/^#/,"")}function _(e){const t=e===void 0?location.hash:e,n={},r=j(t);if(!r)return n;const i=r.split("&");for(let o=0;o<i.length;o++){const l=i[o];if(!l)continue;const a=l.indexOf(":"),s=a>-1?l.slice(0,a):l,d=a>-1?l.slice(a+1):"";if(s)try{n[s]=decodeURIComponent(d)}catch{n[s]=d}}return n}function be(e){if(!e)return null;const t=_();return e in t?t[e]:null}function ge(e,t){if(!e)return;const n=_();t==null?delete n[e]:n[e]=String(t);const i=Object.keys(n).map(function(o){const l=n[o];return l===""?o:o+":"+encodeURIComponent(l)}).join("&");j(location.hash)!==i&&(location.hash=i)}function me(e){return e.button===1||e.ctrlKey||e.metaKey||e.shiftKey?!1:(e.preventDefault(),!0)}function pe(e,t){if(!e||!e.hasAttribute("data-ln-hash"))return null;const n=e.getAttribute("data-ln-hash");if(n&&n.trim()!=="")return n.trim();const r=e.getAttribute("data-ln-sort")||e.getAttribute("data-ln-search-for")||e.getAttribute("data-ln-search")||e.getAttribute("data-ln-filter")||e.id;return r?t?r+"-"+t:r:t||null}function Ce(e,t){return!t||t==="none"||e===null||e===void 0?null:String(e)+"."+t}function ye(e){return!e||typeof e!="string"?null:e.endsWith(".asc")?{fieldOrColumn:e.slice(0,-4),direction:"asc"}:e.endsWith(".desc")?{fieldOrColumn:e.slice(0,-5),direction:"desc"}:null}function Ae(e,t){return!e||!Array.isArray(t)||t.length===0?null:e+":"+t.map(encodeURIComponent).join(",")}function ve(e){if(!e||typeof e!="string")return null;const t=e.indexOf(":");if(t===-1)return null;const n=e.slice(0,t),r=e.slice(t+1),i=r?r.split(",").map(function(o){try{return decodeURIComponent(o)}catch{return o}}).filter(Boolean):[];return{key:n,values:i}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.hashParse=_,window.lnCore.hashGet=be,window.lnCore.hashSet=ge,window.lnCore.hashLinkClick=me,window.lnCore.resolveHashNamespace=pe,window.lnCore.hashSortEncode=Ce,window.lnCore.hashSortDecode=ye,window.lnCore.hashFilterEncode=Ae,window.lnCore.hashFilterDecode=ve),(function(){const e="data-ln-confirm",t="lnConfirm",n="data-ln-confirm-state",r="data-ln-confirm-announcer";if(window[t]!==void 0)return;function o(c,u,h){return c.getAttribute(u)||h}function l(c,u,h){const b=parseFloat(c.getAttribute(u));return isNaN(b)||b<=0?h:b}function a(c){const u=document.createElement("span");return u.setAttribute(r,""),u.setAttribute("role","alert"),u.textContent=c,u}const s={"data-ln-confirm":{prop:"confirmText",type:"string",read:o,fallback:"Confirm?",description:"Prompt text or confirmation action trigger"},"data-ln-confirm-timeout":{prop:"timeout",type:"float",read:l,fallback:3,min:.1,description:"Confirmation timeout in seconds before reverting"},"data-ln-confirm-state":{prop:"confirming",type:"enum",values:["confirming"],read:(c,u)=>c.getAttribute(u)==="confirming",description:'Active confirmation state marker on button ("confirming")'}},d=ie(s);function f(c){this.dom=c,re(this,c,d),this.revertTimer=null,this._submitted=!1,this.idleEl=c.querySelector("[data-ln-confirm-idle]"),this.activeEl=c.querySelector("[data-ln-confirm-active]"),this.isTwoElementMode=!!(this.idleEl||this.activeEl),this.originalText=this.isTwoElementMode?"":c.textContent.trim();const u=this;return this._onClick=function(h){if(!H(h))if(!u.confirming)h.preventDefault(),h.stopImmediatePropagation(),u._enterConfirm();else{if(u._submitted)return;u._submitted=!0,h.stopPropagation(),u._reset()}},c.addEventListener("click",this._onClick),this}f.prototype._enterConfirm=function(){if(this.dom.setAttribute(n,"confirming"),this.originalAriaLabel=this.dom.getAttribute("aria-label"),this.originalAriaLive=this.dom.getAttribute("aria-live"),this.isTwoElementMode){this.idleEl&&this.idleEl.setAttribute("hidden","true"),this.activeEl&&this.activeEl.removeAttribute("hidden");const c=this.activeEl?this.activeEl.textContent.trim():"";c&&(this.dom.setAttribute("aria-label",c),this.dom.setAttribute("aria-live","polite"))}else{const c=this.dom.querySelector("svg.ln-icon use");c&&this.originalText===""?(this.isIconButton=!0,this.originalIconHref=c.getAttribute("href"),c.setAttribute("href","#ln-icon-check"),this.dom.setAttribute("aria-label",this.confirmText),this.dom.appendChild(a(this.confirmText))):this.dom.textContent=this.confirmText}this._startTimer(),O(this.dom,"ln-confirm:waiting",{target:this.dom})},f.prototype._startTimer=function(){this.revertTimer&&clearTimeout(this.revertTimer);const c=this,u=this.timeout*1e3;this.revertTimer=setTimeout(function(){c._reset()},u)},f.prototype._reset=function(){if(this._submitted=!1,this.dom.removeAttribute(n),this.isTwoElementMode)this.idleEl&&this.idleEl.removeAttribute("hidden"),this.activeEl&&this.activeEl.setAttribute("hidden","true");else if(this.isIconButton){const c=this.dom.querySelector("svg.ln-icon use");c&&this.originalIconHref&&c.setAttribute("href",this.originalIconHref);const u=this.dom.querySelector("["+r+"]");u&&u.remove(),this.isIconButton=!1,this.originalIconHref=null}else this.dom.textContent=this.originalText;this.originalAriaLabel!==null&&this.originalAriaLabel!==void 0?this.dom.setAttribute("aria-label",this.originalAriaLabel):this.dom.removeAttribute("aria-label"),this.originalAriaLabel=null,this.originalAriaLive!==null&&this.originalAriaLive!==void 0?this.dom.setAttribute("aria-live",this.originalAriaLive):this.dom.removeAttribute("aria-live"),this.originalAriaLive=null,this.revertTimer&&(clearTimeout(this.revertTimer),this.revertTimer=null)},f.prototype.destroy=function(){this.dom[t]&&(this.confirming&&this._reset(),this.dom.removeEventListener("click",this._onClick),delete this.dom[t])},we(e,t,f,"ln-confirm",{attributes:s})})()})();

package/components/ln-confirm/ln-confirm.schema.json

@@ -0,0 +1,66 @@
+{
+	"$comment": "This file is partly generated. The $comment, component, generator, and each attribute's direction, sources, type, values, fallback, and description keys are owned by the generator and synchronized from JS source code. All other keys are preserved and safe to hand-author. Regenerate with `npm run sync:ln-schemas`.",
+	"component": "ln-confirm",
+	"generator": "scripts/sync-ln-schemas.mjs",
+	"attributes": {
+		"data-ln-confirm": {
+			"direction": null,
+			"sources": [
+				"ln-confirm-dev.scss",
+				"ln-confirm.scss",
+				"src/ln-confirm.js"
+			],
+			"type": "string",
+			"fallback": "Confirm?",
+			"description": "Prompt text or confirmation action trigger"
+		},
+		"data-ln-confirm-active": {
+			"direction": "author",
+			"sources": [
+				"ln-confirm-dev.scss",
+				"src/ln-confirm.js"
+			]
+		},
+		"data-ln-confirm-announcer": {
+			"direction": "both",
+			"sources": [
+				"ln-confirm.scss",
+				"src/ln-confirm.js"
+			]
+		},
+		"data-ln-confirm-idle": {
+			"direction": "author",
+			"sources": [
+				"ln-confirm-dev.scss",
+				"src/ln-confirm.js"
+			]
+		},
+		"data-ln-confirm-state": {
+			"direction": "runtime",
+			"sources": [
+				"ln-confirm-dev.scss",
+				"src/ln-confirm.js"
+			],
+			"type": "enum",
+			"values": [
+				"confirming"
+			],
+			"description": "Active confirmation state marker on button ("
+		},
+		"data-ln-confirm-timeout": {
+			"direction": null,
+			"sources": [
+				"src/ln-confirm.js"
+			],
+			"type": "float",
+			"min": 0.1,
+			"description": "Confirmation timeout in seconds before reverting"
+		},
+		"data-ln-debug": {
+			"direction": null,
+			"sources": [
+				"ln-confirm-dev.scss"
+			]
+		}
+	}
+}

package/components/ln-confirm/ln-confirm.scss

@@ -0,0 +1,24 @@
+// ==========================================================================
+// ln-confirm — Functional Hiding Contract & Announcer
+// ==========================================================================
+
+// П4 hiding contract: native `hidden` is the mechanism — the component toggles it
+// on the idle/active children. This backs up the UA default at (0,2,0) so a
+// `display` set on a child cannot defeat it.
+[data-ln-confirm] [hidden] {
+	display: none;
+}
+
+// Injected announcer. This file ships in the CORE bundle and `.sr-only` does not,
+// so the hiding cannot be delegated to the theme.
+[data-ln-confirm-announcer] {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0, 0, 0, 0);
+	white-space: nowrap;
+	border-width: 0;
+}