@livenetworks/ashlar 1.6.1 → 2.0.0

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

@@ -1,124 +1,127 @@
-# ln-autosave
-
-A zero-dependency, localStorage-backed **Draft Buffer Primitive** that prevents data loss by capturing form states. It automatically saves drafts on field boundaries, restores values on load, and clears them cleanly on submit, reset, or custom cancellations.
-
----
-
-## 🧭 Philosophy & Architecture
-
-1. **Synchronous local storage:** Unlike async network databases, `ln-autosave` uses browser `localStorage`. This ensures drafts are written instantly on field blur/leave (`focusout` / `change`), eliminating race conditions during page changes.
-2. **Zero-Keystroke flood:** By default, writing only triggers on field blur. For continuous typing fields (like editors), an opt-in debounced input listener can be configured.
-3. **Decoupled Event Restoration:** restored values are applied by dispatching standard synthetic `input` and `change` events. This ensures sibling primitives (such as `ln-validate` and `ln-autoresize`) re-evaluate automatically.
-
----
-
-## 📦 Minimal Blueprint
-
-```html
-<form id="profile-edit" data-ln-autosave>
-  <div class="form-element">
-    <label for="bio">Biography</label>
-    <textarea id="bio" name="bio" data-ln-autoresize rows="1"></textarea>
-  </div>
-  
-  <ul class="form-actions">
-    <li><button type="button" data-ln-autosave-clear>Cancel (clear draft)</button></li>
-    <li><button type="submit">Save</button></li>
-  </ul>
-</form>
-```
-
-> [!IMPORTANT]
-> The form **must** have a unique `id` or you must specify a custom identifier in `data-ln-autosave="identifier"`. The final storage key is scoped uniquely as `ln-autosave:{pathname}:{identifier}`.
-
----
-
-## 🛠️ Declarative API Contract
-
-### HTML Attributes
-
-| Attribute | Elements | Description |
-| :--- | :--- | :--- |
-| `data-ln-autosave` | `<form>` | Persistence marker. Value overrides the form ID lookup. |
-| `data-ln-autosave-clear` | `<button>` | Click delegate. Instantly purges the localStorage entry. |
-| `data-ln-autosave-debounce-input="ms"` | `<form>` | Opt-in. Saves on idle keystrokes (defaults to 1000ms if empty). |
-
-### JS API
-
-Access the persistence instance directly via the `lnAutosave` property on the form element:
-
-```javascript
-const form = document.getElementById('profile-edit');
-
-// 1. Back-reference properties
-const storageKey = form.lnAutosave.key; // "ln-autosave:/path:profile-edit"
-
-// 2. Clean up listeners and pending timers
-form.lnAutosave.destroy();
-```
-
----
-
-## ⚡ DOM Events
-
-### Emitted
-
-| Event | Bubbles | Payload | Description |
-| :--- | :--- | :--- | :--- |
-| `ln-autosave:before-restore` | Yes (Cancelable) | `{ target, data }` | Fires before applying draft. Call `e.preventDefault()` to abort. |
-| `ln-autosave:restored` | Yes | `{ target, data }` | Dispatched after populated values and synthetic events are sent. |
-| `ln-autosave:saved` | Yes | `{ target, data }` | Dispatched on successful localStorage save. |
-| `ln-autosave:cleared` | Yes | `{ target }` | Dispatched after localStorage item removal. |
-
----
-
-## ⚠️ Common Pitfalls
-
-- **Stale Drafts Overwriting Server Data:** On pages where the database has rendered new state, draft restores must be aborted:
-  ```javascript
-  document.addEventListener('ln-autosave:before-restore', function (e) {
-      if (e.target.dataset.hasServerData === 'true') {
-          e.preventDefault();
-          localStorage.removeItem(e.target.lnAutosave.key);
-      }
-  });
-  ```
-- **ESC Modal Dismissals:** If a user closes a modal using the ESC key, no click triggers on cancel buttons. Wire draft cleanup to the modal's closed event manually:
-  ```javascript
-  modal.addEventListener('ln-modal:closed', () => {
-      localStorage.removeItem(form.lnAutosave.key);
-  });
-  ```
-- **Nameless & File Inputs:** `ln-autosave` ignores disabled inputs, button elements, `type="file"`, and inputs missing a `name` attribute.
-
----
-
-## 🔧 Internals
-
-Source: `js/ln-autosave/ln-autosave.js` (~130 lines). No `.scss` file — the component has no visual surface, no class it sets, no CSS-driving attribute.
-
-### State
-
-Per-form instance (`form.lnAutosave`): `dom`, `key` (resolved once at construction — `ln-autosave:{pathname}:{identifier}`; mutating the attribute, `form.id`, or navigating via the History API afterwards does NOT re-key — destroy and re-mount to switch), and the bound handlers (`_onFocusout`, `_onChange`, `_onSubmit`, `_onReset`, `_onClearClick`, plus `_onInput` only when debounce is opted in) held so `destroy()` can pass matching references to `removeEventListener`.
-
-### Storage key
-
-`_getStorageKey` resolves `identifier` from the attribute value if non-empty, else `form.id`. Empty attribute (`data-ln-autosave=""`) falls through to `form.id`; missing both returns `null` and construction aborts with a console warning — `form.lnAutosave` is never set.
-
-### Save / restore / clear
-
-- **Save** (`focusout`, `change`, optional debounced `input`): `serializeForm` → `localStorage.setItem`, wrapped in a silent `try/catch` (`QuotaExceededError`, storage disabled). A failed write fires no event — there is no `:save-failed`.
-- **Restore** (construction-time only): read + parse (silent try/catch) → cancelable `:before-restore` → `populateForm` → dispatch synthetic `input` **and** `change` on every restored field (covers both signal types regardless of field kind: text/textarea react to `input`, checkbox/radio/select to `change`) → `:restored`. Events fire after all fields are written, so cross-field validation sees the fully-restored form.
-- **Clear**: `localStorage.removeItem` (idempotent) → `:cleared`. Triggered by native `submit` (not by `form.submit()` — that call bypasses the event; use `requestSubmit()`), native `reset`, or a click on `[data-ln-autosave-clear]`. Touches only the storage entry, never field values.
-
-### Debounce is input-only, opt-in
-
-`focusout`/`change` are naturally rate-limited by user behaviour (one event per field visit) — no debounce needed. `input` fires per keystroke, so `data-ln-autosave-debounce-input` exists as an explicit opt-in for compose-style fields the user never blurs. Default off. The interval is read once at construction (`_resolveDebounceMs`); mutating the attribute afterwards has no effect on a live instance.
-
-### MutationObserver
-
-`registerComponent` watches `childList` (new `[data-ln-autosave]` forms) and `attributes` (filtered to `data-ln-autosave` only — NOT `-clear` or `-debounce-input`). The clear-button delegate uses `closest()` per click, so `data-ln-autosave-clear` works even if added after construction; the debounce attribute does not, since it's read once.
-
-### Destroy
-
-Removes all five listeners (plus `input` and its pending timer if debounce was active), dispatches `:destroyed`, deletes the instance. Does **not** call `_clear()` — the draft persists after destroy; destroy means "stop autosaving," not "discard the draft."
+# ln-autosave
+
+> Applied to a `<form id="..." data-ln-autosave>`. On initialization, it reads draft JSON from `localStorage.getItem(key)`
+> and populates form fields, dispatching synthetic `input` and `change` events. On field `focusout` or `change`, it serializes
+> form values — strictly excluding passwords (`input[type="password"]`) and `[data-ln-autosave-exclude]` — and saves them
+> via `localStorage.setItem(key, json)`. On form `submit`, `reset`, or click on `[data-ln-autosave-clear]`, it calls `localStorage.removeItem(key)` to purge the draft.
+
+---
+
+## 🧭 Philosophy & Architecture
+
+1. **Synchronous local storage:** Unlike async network databases, `ln-autosave` uses browser `localStorage`. This ensures drafts are written instantly on field blur/leave (`focusout` / `change`), eliminating race conditions during page changes.
+2. **Zero-Keystroke flood:** By default, writing only triggers on field blur. For continuous typing fields (like editors), an opt-in debounced input listener can be configured.
+3. **Decoupled Event Restoration:** restored values are applied by dispatching standard synthetic `input` and `change` events. This ensures sibling primitives (such as `ln-validate` and `ln-autoresize`) re-evaluate automatically.
+
+---
+
+## 📦 Minimal Blueprint
+
+```html
+<form id="profile-edit" data-ln-autosave>
+  <div class="form-element">
+    <label for="bio">Biography</label>
+    <textarea id="bio" name="bio" data-ln-autoresize rows="1"></textarea>
+  </div>
+  
+  <ul class="form-actions">
+    <li><button type="button" data-ln-autosave-clear>Cancel (clear draft)</button></li>
+    <li><button type="submit">Save</button></li>
+  </ul>
+</form>
+```
+
+> [!IMPORTANT]
+> The form **must** have a unique `id` or you must specify a custom identifier in `data-ln-autosave="identifier"`. The final storage key is scoped uniquely as `ln-autosave:{pathname}:{identifier}`.
+
+---
+
+## 🛠️ Declarative API Contract
+
+### HTML Attributes
+
+| Attribute | Elements | Description |
+| :--- | :--- | :--- |
+| `data-ln-autosave` | `<form>` | Persistence marker. Value overrides the form ID lookup. |
+| `data-ln-autosave-clear` | `<button>` | Click delegate. Instantly purges the localStorage entry. |
+| `data-ln-autosave-debounce-input="ms"` | `<form>` | Opt-in. Saves on idle keystrokes (defaults to 1000ms if empty). |
+
+### JS API
+
+Access the persistence instance directly via the `lnAutosave` property on the form element:
+
+```javascript
+const form = document.getElementById('profile-edit');
+
+// 1. Back-reference properties
+const storageKey = form.lnAutosave.key; // "ln-autosave:/path:profile-edit"
+
+// 2. Clean up listeners and pending timers
+form.lnAutosave.destroy();
+```
+
+---
+
+## ⚡ DOM Events
+
+### Emitted
+
+| Event | Bubbles | Payload | Description |
+| :--- | :--- | :--- | :--- |
+| `ln-autosave:before-restore` | Yes (Cancelable) | `{ target, data }` | Fires before applying draft. Call `e.preventDefault()` to abort. |
+| `ln-autosave:restored` | Yes | `{ target, data }` | Dispatched after populated values and synthetic events are sent. |
+| `ln-autosave:saved` | Yes | `{ target, data }` | Dispatched on successful localStorage save. |
+| `ln-autosave:cleared` | Yes | `{ target }` | Dispatched after localStorage item removal. |
+
+---
+
+## ⚠️ Common Pitfalls
+
+- **Stale Drafts Overwriting Server Data:** On pages where the database has rendered new state, draft restores must be aborted:
+  ```javascript
+  document.addEventListener('ln-autosave:before-restore', function (e) {
+      if (e.target.dataset.hasServerData === 'true') {
+          e.preventDefault();
+          localStorage.removeItem(e.target.lnAutosave.key);
+      }
+  });
+  ```
+- **ESC Modal Dismissals:** If a user closes a modal using the ESC key, no click triggers on cancel buttons. Wire draft cleanup to the modal's closed event manually:
+  ```javascript
+  modal.addEventListener('ln-modal:closed', () => {
+      localStorage.removeItem(form.lnAutosave.key);
+  });
+  ```
+- **Excluded Inputs:** `ln-autosave` automatically ignores disabled inputs, button elements, `type="file"`, `type="password"`, inputs missing a `name` attribute, and any element matching `[data-ln-autosave-exclude]`.
+
+---
+
+## 🔧 Internals
+
+Source: `components/ln-autosave/ln-autosave.js` (~150 lines). No `.scss` file — the component has no visual surface, no class it sets, no CSS-driving attribute.
+
+### State
+
+Per-form instance (`form.lnAutosave`): `dom`, `key` (resolved once at construction — `ln-autosave:{pathname}:{identifier}`; mutating the attribute, `form.id`, or navigating via the History API afterwards does NOT re-key — destroy and re-mount to switch), and the bound handlers (`_onFocusout`, `_onChange`, `_onSubmit`, `_onReset`, `_onClearClick`, plus `_onInput` only when debounce is opted in) held so `destroy()` can pass matching references to `removeEventListener`.
+
+### Storage key
+
+`_getStorageKey` resolves `identifier` from the attribute value if non-empty, else `form.id`. Empty attribute (`data-ln-autosave=""`) falls through to `form.id`; missing both returns `null` and construction aborts with a console warning — `form.lnAutosave` is never set.
+
+### Save / restore / clear
+
+- **Save** (`focusout`, `change`, optional debounced `input`): `serializeForm` → `localStorage.setItem`, wrapped in a silent `try/catch` (`QuotaExceededError`, storage disabled). A failed write fires no event — there is no `:save-failed`.
+- **Restore** (construction-time only): read + parse (silent try/catch) → cancelable `:before-restore` → `populateForm` → dispatch synthetic `input` **and** `change` on every restored field (covers both signal types regardless of field kind: text/textarea react to `input`, checkbox/radio/select to `change`) → `:restored`. Events fire after all fields are written, so cross-field validation sees the fully-restored form.
+- **Clear**: `localStorage.removeItem` (idempotent) → `:cleared`. Triggered by native `submit` (not by `form.submit()` — that call bypasses the event; use `requestSubmit()`), native `reset`, or a click on `[data-ln-autosave-clear]`. Touches only the storage entry, never field values.
+
+### Debounce is input-only, opt-in
+
+`focusout`/`change` are naturally rate-limited by user behaviour (one event per field visit) — no debounce needed. `input` fires per keystroke, so `data-ln-autosave-debounce-input` exists as an explicit opt-in for compose-style fields the user never blurs. Default off. The interval is read once at construction (`_resolveDebounceMs`); mutating the attribute afterwards has no effect on a live instance.
+
+### MutationObserver
+
+`registerComponent` watches `childList` (new `[data-ln-autosave]` forms) and `attributes` (filtered to `data-ln-autosave` only — NOT `-clear` or `-debounce-input`). The clear-button delegate uses `closest()` per click, so `data-ln-autosave-clear` works even if added after construction; the debounce attribute does not, since it's read once.
+
+### Destroy
+
+Removes all five listeners (plus `input` and its pending timer if debounce was active), deletes the instance. Does **not** call `_clear()` — the draft persists after destroy; destroy means "stop autosaving," not "discard the draft."

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

@@ -0,0 +1,13 @@
+@use '../../theme/config/mixins' as *;
+
+[data-ln-debug] {
+	// 1. Host Element Check: data-ln-autosave belongs only on <form>
+	[data-ln-autosave]:not(form) {
+		@include dev-inline-error("data-ln-autosave belongs only on <form> elements");
+	}
+
+	// 2. Storage Key Check: form must have an id or explicit data-ln-autosave key
+	form[data-ln-autosave=""]:not([id]) {
+		@include dev-dom-error("form[data-ln-autosave] requires an 'id' or explicit storage key value.");
+	}
+}

package/components/ln-autosave/ln-autosave.js

@@ -0,0 +1 @@
+(function(){"use strict";function D(){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 A(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 i=null;for(let l=1;l<t.length;l++)if(t[l]&&t[l].nodeType===1){i=t[l];break}if(!A(i))return}e.apply(console,t)}}function v(e,t,o){const i=o||{};window.lnCore._debugSink&&window.lnCore._debugSink("event",t,e,i),e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:i}))}function U(e,t,o){const i=o||{};window.lnCore._debugSink&&window.lnCore._debugSink("event",t,e,i);const l=new CustomEvent(t,{bubbles:!0,cancelable:!0,detail:i});return e.dispatchEvent(l),l}function _(e,t){if(!document.body){document.addEventListener("DOMContentLoaded",function(){_(e,t)}),console.warn("["+t+'] Script loaded before <body> — add "defer" to your <script> tag');return}e()}function H(e,t){const o=!!(t&&t.typed),i=t&&t.exclude,l={},s=e.elements,r={};if(o)for(let c=0;c<s.length;c++){const n=s[c];n.name&&n.type==="checkbox"&&!n.disabled&&(r[n.name]=(r[n.name]||0)+1)}for(let c=0;c<s.length;c++){const n=s[c];if(!(!n.name||n.disabled||n.type==="file"||n.type==="submit"||n.type==="button")&&!(i&&n.matches&&n.matches(i)))if(n.type==="checkbox")o&&r[n.name]===1?l[n.name]=n.checked:(l[n.name]||(l[n.name]=[]),n.checked&&l[n.name].push(n.value));else if(n.type==="radio")n.checked&&(l[n.name]=n.value);else if(n.type==="select-multiple"){l[n.name]=[];for(let a=0;a<n.options.length;a++)n.options[a].selected&&l[n.name].push(n.options[a].value)}else if(o&&n.type==="hidden")l[n.name]=n.value;else if(o&&(n.type==="number"||n.type==="range")){const a=Number(n.value);l[n.name]=n.value===""||isNaN(a)?null:a}else l[n.name]=n.value}return l}function V(e){if(typeof e!="string")return!!e;const t=e.trim().toLowerCase();return t!=="false"&&t!=="0"&&t!==""&&t!=="off"&&t!=="no"}function K(e,t){const o=e.elements,i=[],l={};for(let s=0;s<o.length;s++){const r=o[s];r.name&&r.type==="checkbox"&&(l[r.name]=(l[r.name]||0)+1)}for(let s=0;s<o.length;s++){const r=o[s];if(r.type==="file"||r.type==="submit"||r.type==="button")continue;const c=r.getAttribute("data-ln-fill-as")||r.name;if(!c||!(c in t))continue;const n=t[c];if(r.type==="checkbox"){if(Array.isArray(n))r.checked=n.indexOf(r.value)!==-1;else if(l[r.name]>1){const a=String(n).split(",").map(function(d){return d.trim()});r.checked=a.indexOf(r.value)!==-1}else r.checked=V(n);i.push(r)}else if(r.type==="radio")r.checked=r.value===String(n),i.push(r);else if(r.type==="select-multiple"){if(Array.isArray(n))for(let a=0;a<r.options.length;a++)r.options[a].selected=n.indexOf(r.options[a].value)!==-1;i.push(r)}else r.value=n,i.push(r)}return i}const R={};function Q(e,t){R[e]=t}function J(e){return R[e]||{ingress:t=>t,egress:t=>t}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=Q,window.lnCore.getDataMapper=J);function P(){typeof window>"u"||(window.lnCore=window.lnCore||{},!window.lnCore._localeObserverBound&&(window.lnCore._localeObserverBound=!0,_(function(){new MutationObserver(function(){v(document,"ln-core:locale-change",{})}).observe(document.documentElement,{attributes:!0,attributeFilter:["lang"],subtree:!0})},"ln-core")))}const $={};function X(e,t){if(!e||typeof t!="object")return;const o=e.toLowerCase().split("-")[0];$[o]=t}function G(e){if(!e)return null;const t=e.toLowerCase().split("-")[0];return $[t]||null}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerLocaleFallback=X,window.lnCore.getLocaleFallback=G,window.lnCore.ensureLocaleObserver=P);const k={};function z(e,t){k[e]||(k[e]=document.querySelector('[data-ln-template="'+e+'"]'));const o=k[e];return o?o.content.cloneNode(!0):(console.warn("["+(t||"ln-core")+'] Template "'+e+'" not found'),null)}function F(e,t){if(!e||!t)return e;const o=e.querySelectorAll("[data-ln-field]");for(let r=0;r<o.length;r++){const c=o[r],n=c.getAttribute("data-ln-field");t[n]!=null&&(c.textContent=t[n])}const i=e.querySelectorAll("[data-ln-attr]");for(let r=0;r<i.length;r++){const c=i[r],n=c.getAttribute("data-ln-attr").split(",");for(let a=0;a<n.length;a++){const d=n[a].trim().split(":");if(d.length!==2)continue;const u=d[0].trim(),h=d[1].trim();t[h]!=null&&c.setAttribute(u,t[h])}}const l=e.querySelectorAll("[data-ln-show]");for(let r=0;r<l.length;r++){const c=l[r],n=c.getAttribute("data-ln-show");n in t&&c.classList.toggle("hidden",!t[n])}const s=e.querySelectorAll("[data-ln-class]");for(let r=0;r<s.length;r++){const c=s[r],n=c.getAttribute("data-ln-class").split(",");for(let a=0;a<n.length;a++){const d=n[a].trim().split(":");if(d.length!==2)continue;const u=d[0].trim(),h=d[1].trim();h in t&&c.classList.toggle(u,!!t[h])}}return e}function Y(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 o=e.querySelectorAll("[data-ln-form], [data-ln-fillable]");for(let i=0;i<o.length;i++)window.lnCore._debugSink&&window.lnCore._debugSink("event","ln-fill",o[i],t??null),o[i].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)F(e.target,e.detail);else{const t=e.target.querySelectorAll("[data-ln-field]");for(let o=0;o<t.length;o++)t[o].textContent=""}})));function N(e,t){if(!e||!t)return e;const o=document.createTreeWalker(e,NodeFilter.SHOW_TEXT);for(;o.nextNode();){const s=o.currentNode;s.textContent.indexOf("{{")!==-1&&(s.textContent=s.textContent.replace(/\{\{\s*(\w+)\s*\}\}/g,function(r,c){return t[c]!==void 0?t[c]:""}))}const i=function(s,r){return t[r]!==void 0?t[r]:""},l=Array.from(e.querySelectorAll("*"));e.nodeType===1&&l.push(e);for(let s=0;s<l.length;s++){const r=l[s],c=r.attributes;for(let n=0;n<c.length;n++){const a=c[n];a.value.indexOf("{{")!==-1&&r.setAttribute(a.name,a.value.replace(/\{\{\s*(\w+)\s*\}\}/g,i))}}return e}function Z(e,t,o,i,l,s){const r={};for(let n=0;n<e.children.length;n++){const a=e.children[n],d=a.getAttribute("data-ln-render-key");d&&(r[d]=a)}const c=document.createDocumentFragment();for(let n=0;n<t.length;n++){const a=t[n],d=String(i(a));let u=r[d];if(u)l(u,a,n);else{const h=z(o,s);if(!h||(N(h,a),u=h.firstElementChild,!u))continue;u.setAttribute("data-ln-render-key",d),l(u,a,n)}c.appendChild(u)}e.textContent="",e.appendChild(c)}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.fillTemplate=N,window.lnCore.fill=F,window.lnCore.lnFill=Y,window.lnCore.renderList=Z);function q(e,t,o,i,l){if(!e||t===null)return!0;const s=i||"ln-component",r=e.type;if(r==="trigger"||r==="marker"||r==="string"||r==="list"||!r||t===""&&e.fallback!==void 0)return!0;const c=n=>{l?console.warn(n,l):console.warn(n)};if(r==="boolean"){const n=t.trim().toLowerCase();return n!==""&&n!=="true"&&n!=="false"&&n!=="1"&&n!=="0"?(c(`[${s}] Invalid value "${t}" for boolean attribute "${o}". Allowed: "true", "false", or presence-only.`),!1):!0}if(r==="enum"){const n=e.values||[];return n.includes(t)?!0:(c(`[${s}] Invalid value "${t}" for attribute "${o}". Allowed: ${n.join(", ")}. Fallback: "${e.fallback}".`),!1)}if(r==="integer"){if(!/^-?\d+$/.test(t))return c(`[${s}] Invalid integer "${t}" for attribute "${o}". Fallback: ${e.fallback}.`),!1;const n=parseInt(t,10);return e.min!==void 0&&n<e.min?(c(`[${s}] Value ${n} for attribute "${o}" is less than min (${e.min}).`),!1):e.max!==void 0&&n>e.max?(c(`[${s}] Value ${n} for attribute "${o}" is greater than max (${e.max}).`),!1):!0}if(r==="float")return isNaN(Number(t))?(c(`[${s}] Invalid float "${t}" for attribute "${o}". Fallback: ${e.fallback}.`),!1):!0;if(r==="json")try{return JSON.parse(t),!0}catch(n){return c(`[${s}] Invalid JSON for attribute "${o}": ${n.message}. Fallback: ${e.fallback}.`),!1}return!0}function ee(e){const t={};for(const o in e){const i=e[o];i&&i.effect&&(t[o]=i.effect)}return Object.keys(t).length?t:null}function te(e){if(e.onAttrChange&&!e.declared)return null;const t=new Set;if(e.effects)for(const o in e.effects)t.add(o);if(e.onAttrChange&&e.declared)for(const o of e.declared)t.add(o);return t}function E(e,t,o,i){if(e.nodeType!==1)return;const s=t.indexOf("[")!==-1||t.indexOf(".")!==-1||t.indexOf("#")!==-1?t:"["+t+"]",r=Array.from(e.querySelectorAll(s));e.matches&&e.matches(s)&&r.push(e);for(const c of r)if(!c[o]){window.lnCore._persistSink&&c.hasAttribute("data-ln-persist")&&window.lnCore._persistSink(c,t);try{c[o]=new i(c)}catch(n){console.error("["+o+"] init failed",c,n)}}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore._bootHolds=window.lnCore._bootHolds||0,window.lnCore._bootQueue=window.lnCore._bootQueue||[]);function ne(){return typeof window<"u"&&window.lnCore&&window.lnCore._bootHolds||0}function oe(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 B(){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 re(e){const t=B(),o=e.observed||[];for(let i=0;i<o.length;i++){const l=o[i];t.byAttr.has(l)||t.byAttr.set(l,[]),t.byAttr.get(l).push(e)}if(t.byDeclaredAttr=t.byDeclaredAttr||new Map,e.attributes)for(const i in e.attributes){t.byDeclaredAttr.has(i)||t.byDeclaredAttr.set(i,[]);const l=t.byDeclaredAttr.get(i);l.some(s=>s.componentTag===e.componentTag)||l.push({spec:e.attributes[i],componentTag:e.componentTag})}if(e.onAttrChange||e.effects){t.reactive.push(e);const i=te(e);if(i===null)t.reactiveWildcard.push(e);else for(const l of i)t.byReactive.has(l)||t.byReactive.set(l,[]),t.byReactive.get(l).push(e)}e.persist&&t.persist.push(e)}function M(e,t,o,i){for(let l=0;l<e.length;l++){const s=e[l];if(!t[s.attribute])continue;const r=s.effects&&s.effects[o];r?r(t,o,i):s.onAttrChange&&(!s.declared||s.declared.has(o))&&s.onAttrChange(t,o,i)}}function ie(e){const t=e.target,o=e.attributeName;if(e.oldValue===t.getAttribute(o))return;const i=B(),l=i.byAttr.get(o);if(D()&&i.byDeclaredAttr&&i.byDeclaredAttr.has(o)&&A(t)){const s=i.byDeclaredAttr.get(o),r=t.getAttribute(o);for(let c=0;c<s.length;c++)q(s[c].spec,r,o,s[c].componentTag,t)}if(window.lnCore._debugSink&&(o.indexOf("data-ln-")===0||l)&&window.lnCore._debugSink("attr",o,t,{oldValue:e.oldValue,newValue:t.getAttribute(o)}),o.indexOf("data-ln-")===0){const s=i.byReactive.get(o);s&&M(s,t,o,e.oldValue),i.reactiveWildcard.length&&M(i.reactiveWildcard,t,o,e.oldValue)}if(l)for(let s=0;s<l.length;s++){const r=l[s];if(r.handler){r.handler(t,o,e.oldValue);continue}r.onAttributeChange&&t[r.attribute]?r.onAttributeChange(t,o):(E(t,r.selector,r.attribute,r.ComponentFn),r.onInit&&r.onInit(t))}}function le(){window.lnCore=window.lnCore||{},!window.lnCore._attrObserverBound&&(window.lnCore._attrObserverBound=!0,_(function(){new MutationObserver(function(t){for(let o=0;o<t.length;o++)try{ie(t[o])}catch(i){console.error("[ln-core] mutation handler failed",t[o].target,i)}}).observe(document.body,{attributes:!0,subtree:!0,attributeOldValue:!0})},"ln-core"))}function j(){return window.lnCore=window.lnCore||{},window.lnCore._lifecycleRegistry=window.lnCore._lifecycleRegistry||[]}function se(e){const t=j();if(t.length){if(e.target)for(let o=0;o<t.length;o++){const i=t[o];if(i.onSubtreeChange){const l=i.query,s=e.target.nodeType===1?e.target.matches(l)?e.target:e.target.closest(l):e.target.parentElement?e.target.parentElement.closest(l):null;s&&i.onSubtreeChange(s,e)}}for(let o=0;o<e.addedNodes.length;o++){const i=e.addedNodes[o];if(i.nodeType===1)for(let l=0;l<t.length;l++){const s=t[l];E(i,s.selector,s.attribute,s.ComponentFn),s.onInit&&s.onInit(i)}}for(let o=0;o<e.removedNodes.length;o++){const i=e.removedNodes[o];if(i.nodeType===1)for(let l=0;l<t.length;l++){const s=t[l],r=s.query,c=Array.from(i.querySelectorAll(r));i.matches&&i.matches(r)&&c.push(i);for(let n=0;n<c.length;n++){const a=c[n];if(!document.contains(a)){const d=a[s.attribute];if(d&&typeof d.destroy=="function")try{d.destroy()}catch(u){console.error("["+s.attribute+"] destroy failed",a,u)}delete a[s.attribute]}}}}}}function ce(){window.lnCore=window.lnCore||{},!window.lnCore._lifecycleObserverBound&&(window.lnCore._lifecycleObserverBound=!0,_(function(){new MutationObserver(function(t){for(let o=0;o<t.length;o++){const i=t[o];if(i.type==="childList")try{se(i)}catch(l){console.error("[ln-core] lifecycle handler failed",i.target,l)}}}).observe(document.body,{childList:!0,subtree:!0})},"ln-core"))}function ae(e,t,o,i,l={}){const s=l.extraAttributes||[],r=l.onAttributeChange||null,c=l.onSubtreeChange||null,n=l.onInit||null,a=l.onAttrChange||null,d=l.effects||null,u=l.attributes||null,h=u?ee(u):d,m=u?new Set(Object.keys(u)):null,O=l.persist||null;function p(g){const b=g||document.body;if(E(b,e,t,o),u&&D())for(const y in u){const _e=u[y],L=Array.from(b.querySelectorAll("["+y+"]"));b.matches&&b.matches("["+y+"]")&&L.push(b);for(let T=0;T<L.length;T++){const I=L[T];A(I)&&q(_e,I.getAttribute(y),y,i,I)}}n&&n(b)}const C=[];if(e.indexOf("[")!==-1){const g=/\[([\w-]+)/g;let b;for(;(b=g.exec(e))!==null;)C.push(b[1])}else C.push(e);re({selector:e,attribute:t,componentTag:i,attributes:u,ComponentFn:o,onInit:n,observed:C.concat(s),onAttributeChange:r,onAttrChange:a,effects:h,declared:m,persist:O}),le();const f=e.indexOf("[")!==-1||e.indexOf(".")!==-1||e.indexOf("#")!==-1?e:"["+e+"]";j().push({selector:e,attribute:t,ComponentFn:o,onInit:n,onSubtreeChange:c,query:f}),ce(),window[t]=p;function x(){ne()>0?oe(function(){p(document.body)}):p(document.body)}return document.readyState==="loading"?document.addEventListener("DOMContentLoaded",x):x(),p}function W(e){return(e||"").replace(/^#/,"")}function S(e){const t=e===void 0?location.hash:e,o={},i=W(t);if(!i)return o;const l=i.split("&");for(let s=0;s<l.length;s++){const r=l[s];if(!r)continue;const c=r.indexOf(":"),n=c>-1?r.slice(0,c):r,a=c>-1?r.slice(c+1):"";if(n)try{o[n]=decodeURIComponent(a)}catch{o[n]=a}}return o}function ue(e){if(!e)return null;const t=S();return e in t?t[e]:null}function de(e,t){if(!e)return;const o=S();t==null?delete o[e]:o[e]=String(t);const l=Object.keys(o).map(function(s){const r=o[s];return r===""?s:s+":"+encodeURIComponent(r)}).join("&");W(location.hash)!==l&&(location.hash=l)}function fe(e){return e.button===1||e.ctrlKey||e.metaKey||e.shiftKey?!1:(e.preventDefault(),!0)}function he(e,t){if(!e||!e.hasAttribute("data-ln-hash"))return null;const o=e.getAttribute("data-ln-hash");if(o&&o.trim()!=="")return o.trim();const i=e.getAttribute("data-ln-sort")||e.getAttribute("data-ln-search-for")||e.getAttribute("data-ln-search")||e.getAttribute("data-ln-filter")||e.id;return i?t?i+"-"+t:i:t||null}function we(e,t){return!t||t==="none"||e===null||e===void 0?null:String(e)+"."+t}function be(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 pe(e,t){return!e||!Array.isArray(t)||t.length===0?null:e+":"+t.map(encodeURIComponent).join(",")}function ge(e){if(!e||typeof e!="string")return null;const t=e.indexOf(":");if(t===-1)return null;const o=e.slice(0,t),i=e.slice(t+1),l=i?i.split(",").map(function(s){try{return decodeURIComponent(s)}catch{return s}}).filter(Boolean):[];return{key:o,values:l}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.hashParse=S,window.lnCore.hashGet=ue,window.lnCore.hashSet=de,window.lnCore.hashLinkClick=fe,window.lnCore.resolveHashNamespace=he,window.lnCore.hashSortEncode=we,window.lnCore.hashSortDecode=be,window.lnCore.hashFilterEncode=pe,window.lnCore.hashFilterDecode=ge);const Ce="ln-autosave:",me=1e3;function ye(e,t){return t?Ce+(e||"")+":"+t:null}function ve(e,t=me){if(e==null)return 0;if(e==="")return t;const o=parseInt(String(e),10);return isNaN(o)||o<0?t:o}(function(){const e="data-ln-autosave",t="lnAutosave",o="data-ln-autosave-clear",i="data-ln-autosave-debounce-input",l='[data-ln-autosave-exclude], input[type="password"]';if(window[t]!==void 0)return;const s={"data-ln-autosave":{type:"string",description:"Form autosave storage key identifier"},"data-ln-autosave-debounce-input":{type:"integer",fallback:500,min:0,description:"Debounce delay in milliseconds before saving on input events"},"data-ln-autosave-clear":{type:"marker",description:"Designates a button that clears saved form data from localStorage"},"data-ln-autosave-exclude":{type:"marker",description:"Excludes form control from autosave serialization"}};function r(n){const a=n.tagName;return a==="INPUT"||a==="TEXTAREA"||a==="SELECT"}function c(n){const d=n.getAttribute(e)||n.id,u=ye(window.location.pathname,d);if(!u){console.warn("ln-autosave: form needs an id or data-ln-autosave value",n);return}this.dom=n,this.key=u;let h=null;function m(){const w=H(n,{exclude:l});try{localStorage.setItem(u,JSON.stringify(w))}catch{return}v(n,"ln-autosave:saved",{target:n,data:w})}function O(){let w;try{w=localStorage.getItem(u)}catch{return}if(!w)return;let f;try{f=JSON.parse(w)}catch{return}if(U(n,"ln-autosave:before-restore",{target:n,data:f}).defaultPrevented)return;const g=K(n,f);for(let b=0;b<g.length;b++)g[b].dispatchEvent(new Event("input",{bubbles:!0})),g[b].dispatchEvent(new Event("change",{bubbles:!0}));v(n,"ln-autosave:restored",{target:n,data:f})}function p(){try{localStorage.removeItem(u)}catch{return}v(n,"ln-autosave:cleared",{target:n})}this._onFocusout=function(w){const f=w.target;r(f)&&f.name&&!f.matches(l)&&m()},this._onChange=function(w){const f=w.target;r(f)&&f.name&&!f.matches(l)&&m()},this._onSubmit=function(){p()},this._onReset=function(){p()},this._onClearClick=function(w){w.target.closest("["+o+"]")&&p()},n.addEventListener("focusout",this._onFocusout),n.addEventListener("change",this._onChange),n.addEventListener("submit",this._onSubmit),n.addEventListener("reset",this._onReset),n.addEventListener("click",this._onClearClick);const C=ve(n.getAttribute(i));return C>0&&(this._onInput=function(w){const f=w.target;!r(f)||!f.name||f.matches(l)||(h!==null&&clearTimeout(h),h=setTimeout(m,C))},n.addEventListener("input",this._onInput)),this._getInputTimer=function(){return h},O(),this}c.prototype.destroy=function(){if(this.dom[t]){if(this.dom.removeEventListener("focusout",this._onFocusout),this.dom.removeEventListener("change",this._onChange),this.dom.removeEventListener("submit",this._onSubmit),this.dom.removeEventListener("reset",this._onReset),this.dom.removeEventListener("click",this._onClearClick),this._onInput){this.dom.removeEventListener("input",this._onInput);const n=this._getInputTimer();n!==null&&clearTimeout(n)}delete this.dom[t]}},ae(e,t,c,"ln-autosave",{attributes:s})})()})();

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

@@ -0,0 +1,48 @@
+{
+	"$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-autosave",
+	"generator": "scripts/sync-ln-schemas.mjs",
+	"attributes": {
+		"data-ln-autosave": {
+			"direction": "author",
+			"sources": [
+				"ln-autosave-dev.scss",
+				"src/ln-autosave.js"
+			],
+			"type": "string",
+			"description": "Form autosave storage key identifier"
+		},
+		"data-ln-autosave-clear": {
+			"direction": "author",
+			"sources": [
+				"src/ln-autosave.js"
+			],
+			"type": "marker",
+			"description": "Designates a button that clears saved form data from localStorage"
+		},
+		"data-ln-autosave-debounce-input": {
+			"direction": "author",
+			"sources": [
+				"src/ln-autosave.js"
+			],
+			"type": "integer",
+			"fallback": 500,
+			"min": 0,
+			"description": "Debounce delay in milliseconds before saving on input events"
+		},
+		"data-ln-autosave-exclude": {
+			"direction": null,
+			"sources": [
+				"src/ln-autosave.js"
+			],
+			"type": "marker",
+			"description": "Excludes form control from autosave serialization"
+		},
+		"data-ln-debug": {
+			"direction": null,
+			"sources": [
+				"ln-autosave-dev.scss"
+			]
+		}
+	}
+}

package/components/ln-autosave/src/autosave-model.js

@@ -0,0 +1,34 @@
+export const STORAGE_PREFIX = 'ln-autosave:';
+export const DEFAULT_DEBOUNCE_MS = 1000;
+
+/**
+ * Builds a deterministic storage key for autosave persistence.
+ * @param {string} pathname
+ * @param {string} identifier
+ * @returns {string|null}
+ */
+export function buildAutosaveKey(pathname, identifier) {
+	if (!identifier) return null;
+	const path = pathname || '';
+	return STORAGE_PREFIX + path + ':' + identifier;
+}
+
+/**
+ * Parses and sanitizes the debounce milliseconds attribute value for ln-autosave.
+ *
+ * Semantics:
+ * - Returns `0` if the attribute is absent (null/undefined), signaling that input debouncing is disabled (no listener).
+ * - Returns `fallbackMs` (default 1000) if the attribute is present as boolean/empty string `""` or contains an invalid value.
+ * - Returns the parsed positive integer if a valid numeric string is provided.
+ *
+ * @param {unknown} rawValue Raw DOM attribute value (e.g. data-ln-autosave-debounce-input)
+ * @param {number} [fallbackMs=1000] Fallback debounce duration in ms
+ * @returns {number} Milliseconds to debounce, or 0 if disabled
+ */
+export function parseAutosaveDebounce(rawValue, fallbackMs = DEFAULT_DEBOUNCE_MS) {
+	if (rawValue === null || rawValue === undefined) return 0;
+	if (rawValue === '') return fallbackMs;
+	const parsed = parseInt(String(rawValue), 10);
+	if (isNaN(parsed) || parsed < 0) return fallbackMs;
+	return parsed;
+}

package/{js → components}/ln-autosave/src/ln-autosave.js

@@ -1,19 +1,35 @@
-import { dispatch, dispatchCancelable, serializeForm, populateForm, registerComponent } from '../../ln-core';
+import { dispatch, dispatchCancelable, populateForm, registerComponent, serializeForm } from '../../ln-core';
+import { buildAutosaveKey, parseAutosaveDebounce } from './autosave-model.js';
 
 (function () {
 	const DOM_SELECTOR = 'data-ln-autosave';
 	const DOM_ATTRIBUTE = 'lnAutosave';
 	const CLEAR_SELECTOR = 'data-ln-autosave-clear';
 	const DEBOUNCE_SELECTOR = 'data-ln-autosave-debounce-input';
-	const STORAGE_PREFIX = 'ln-autosave:';
-	const DEFAULT_DEBOUNCE_MS = 1000;
+	const EXCLUDE_SELECTOR = '[data-ln-autosave-exclude], input[type="password"]';
 
 	if (window[DOM_ATTRIBUTE] !== undefined) return;
 
+	// ─── Attribute Contract (SSOT) ──────────────────────────
+	const ATTRIBUTES = {
+		'data-ln-autosave':                { type: 'string', description: 'Form autosave storage key identifier' },
+		'data-ln-autosave-debounce-input': { type: 'integer', fallback: 500, min: 0, description: 'Debounce delay in milliseconds before saving on input events' },
+		'data-ln-autosave-clear':          { type: 'marker', description: 'Designates a button that clears saved form data from localStorage' },
+		'data-ln-autosave-exclude':        { type: 'marker', description: 'Excludes form control from autosave serialization' }
+	};
+
+	function _isFormField(el) {
+		const tag = el.tagName;
+		return tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT';
+	}
+
 	// ─── Component ─────────────────────────────────────────────
 
 	function _component(form) {
-		const key = _getStorageKey(form);
+		const value = form.getAttribute(DOM_SELECTOR);
+		const identifier = value || form.id;
+		const key = buildAutosaveKey(window.location.pathname, identifier);
+
 		if (!key) {
 			console.warn('ln-autosave: form needs an id or data-ln-autosave value', form);
 			return;
@@ -24,20 +40,30 @@ import { dispatch, dispatchCancelable, serializeForm, populateForm, registerComp
 
 		let inputTimer = null;
 
-		// Closure-scoped helpers (NOT on prototype — internal only)
 		function _save() {
-			const data = serializeForm(form, { exclude: '[data-ln-autosave-exclude]' });
-			try { localStorage.setItem(key, JSON.stringify(data)); }
-			catch (e) { return; }
+			const data = serializeForm(form, { exclude: EXCLUDE_SELECTOR });
+			try {
+				localStorage.setItem(key, JSON.stringify(data));
+			} catch (_) {
+				return;
+			}
 			dispatch(form, 'ln-autosave:saved', { target: form, data: data });
 		}
 
 		function _restore() {
 			let raw;
-			try { raw = localStorage.getItem(key); } catch (e) { return; }
+			try {
+				raw = localStorage.getItem(key);
+			} catch (_) {
+				return;
+			}
 			if (!raw) return;
 			let data;
-			try { data = JSON.parse(raw); } catch (e) { return; }
+			try {
+				data = JSON.parse(raw);
+			} catch (_) {
+				return;
+			}
 			const before = dispatchCancelable(form, 'ln-autosave:before-restore', { target: form, data: data });
 			if (before.defaultPrevented) return;
 			const restored = populateForm(form, data);
@@ -49,24 +75,31 @@ import { dispatch, dispatchCancelable, serializeForm, populateForm, registerComp
 		}
 
 		function _clear() {
-			try { localStorage.removeItem(key); } catch (e) { return; }
+			try {
+				localStorage.removeItem(key);
+			} catch (_) {
+				return;
+			}
 			dispatch(form, 'ln-autosave:cleared', { target: form });
 		}
 
-		// Listener handlers (held on `this` for symmetric removal in destroy)
 		this._onFocusout = function (e) {
 			const el = e.target;
-			if (_isFormField(el) && el.name && !el.hasAttribute('data-ln-autosave-exclude')) _save();
+			if (_isFormField(el) && el.name && !el.matches(EXCLUDE_SELECTOR)) _save();
 		};
 
 		this._onChange = function (e) {
 			const el = e.target;
-			if (_isFormField(el) && el.name && !el.hasAttribute('data-ln-autosave-exclude')) _save();
+			if (_isFormField(el) && el.name && !el.matches(EXCLUDE_SELECTOR)) _save();
 		};
 
-		this._onSubmit = function () { _clear(); };
+		this._onSubmit = function () {
+			_clear();
+		};
 
-		this._onReset = function () { _clear(); };
+		this._onReset = function () {
+			_clear();
+		};
 
 		this._onClearClick = function (e) {
 			const btn = e.target.closest('[' + CLEAR_SELECTOR + ']');
@@ -74,74 +107,48 @@ import { dispatch, dispatchCancelable, serializeForm, populateForm, registerComp
 		};
 
 		form.addEventListener('focusout', this._onFocusout);
-		form.addEventListener('change',   this._onChange);
-		form.addEventListener('submit',   this._onSubmit);
-		form.addEventListener('reset',    this._onReset);
-		form.addEventListener('click',    this._onClearClick);
+		form.addEventListener('change', this._onChange);
+		form.addEventListener('submit', this._onSubmit);
+		form.addEventListener('reset', this._onReset);
+		form.addEventListener('click', this._onClearClick);
 
-		// Optional debounced input listener (opt-in via data-ln-autosave-debounce-input)
-		const debounceMs = _resolveDebounceMs(form);
+		const debounceMs = parseAutosaveDebounce(form.getAttribute(DEBOUNCE_SELECTOR));
 		if (debounceMs > 0) {
 			this._onInput = function (e) {
 				const el = e.target;
-				if (!_isFormField(el) || !el.name || el.hasAttribute('data-ln-autosave-exclude')) return;
+				if (!_isFormField(el) || !el.name || el.matches(EXCLUDE_SELECTOR)) return;
 				if (inputTimer !== null) clearTimeout(inputTimer);
 				inputTimer = setTimeout(_save, debounceMs);
 			};
 			form.addEventListener('input', this._onInput);
 		}
 
-		// Thunk so destroy() can reach the closure-scoped inputTimer
-		this._getInputTimer = function () { return inputTimer; };
+		this._getInputTimer = function () {
+			return inputTimer;
+		};
 
 		_restore();
-
 		return this;
 	}
 
 	_component.prototype.destroy = function () {
 		if (!this.dom[DOM_ATTRIBUTE]) return;
 		this.dom.removeEventListener('focusout', this._onFocusout);
-		this.dom.removeEventListener('change',   this._onChange);
-		this.dom.removeEventListener('submit',   this._onSubmit);
-		this.dom.removeEventListener('reset',    this._onReset);
-		this.dom.removeEventListener('click',    this._onClearClick);
+		this.dom.removeEventListener('change', this._onChange);
+		this.dom.removeEventListener('submit', this._onSubmit);
+		this.dom.removeEventListener('reset', this._onReset);
+		this.dom.removeEventListener('click', this._onClearClick);
 		if (this._onInput) {
 			this.dom.removeEventListener('input', this._onInput);
 			const t = this._getInputTimer();
 			if (t !== null) clearTimeout(t);
 		}
-		dispatch(this.dom, 'ln-autosave:destroyed', { target: this.dom });
 		delete this.dom[DOM_ATTRIBUTE];
 	};
 
-	// ─── Helpers ───────────────────────────────────────────────
-
-	function _getStorageKey(form) {
-		const value = form.getAttribute(DOM_SELECTOR);
-		const identifier = value || form.id;
-		if (!identifier) return null;
-		return STORAGE_PREFIX + window.location.pathname + ':' + identifier;
-	}
-
-	function _isFormField(el) {
-		const tag = el.tagName;
-		return tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT';
-	}
-
-	function _resolveDebounceMs(form) {
-		if (!form.hasAttribute(DEBOUNCE_SELECTOR)) return 0;
-		const raw = form.getAttribute(DEBOUNCE_SELECTOR);
-		if (raw === '' || raw === null) return DEFAULT_DEBOUNCE_MS;
-		const ms = parseInt(raw, 10);
-		if (isNaN(ms) || ms < 0) {
-			console.warn('ln-autosave: invalid debounce value, using default', form);
-			return DEFAULT_DEBOUNCE_MS;
-		}
-		return ms;
-	}
-
 	// ─── Init ──────────────────────────────────────────────────
 
-	registerComponent(DOM_SELECTOR, DOM_ATTRIBUTE, _component, 'ln-autosave');
+	registerComponent(DOM_SELECTOR, DOM_ATTRIBUTE, _component, 'ln-autosave', {
+		attributes: ATTRIBUTES
+	});
 })();