@livenetworks/ashlar 1.5.1 → 1.6.0

package/js/ln-form/README.md

@@ -1,101 +1,264 @@
 # ln-form
 
-A high-performance **Form Coordinator** that upgrades native HTML forms. It acts as the orchestration layer: coordinating bulk population (`fill`), native reset procedures, reactive validation state gating, and debounced auto-submission.
-
-It delegates per-field validation rules to the `ln-validate` primitive and visual formatting to SCSS layout mixins, focusing purely on gating the submission flow and serializing form data into clean JSON.
+A minimal **form manipulation** primitive. `ln-form` does exactly two
+things to a native `<form>`: populate it when an `ln-fill` event delivers
+a record, and rewrite `action` / `_method` for RESTful edit routing.
+Submit is entirely native HTML — `ln-form` does not listen for `submit`
+at all. Validation display and the submit gate are owned entirely by
+[`ln-validate`](../ln-validate/README.md).
 
 ---
 
-## 🧭 Philosophy & Architecture
+## 1. Philosophy
 
-1. **The Form as Coordinator:** `ln-form` maintains no internal registry of validation rules or values. It listens to bubbled DOM events (`ln-validate:valid`, `ln-validate:invalid`) and enforces a single rule: *the form submit button is disabled until all marked fields are valid and at least one has been touched.*
-2. **Zero Network Coupling:** The component does not make XHR or fetch requests. On successful submission, it serializes values and dispatches an uncancellable `ln-form:submit` CustomEvent carrying the payload. Network integration belongs entirely in a separate transport layer (`ln-http` or a custom controller).
-3. **Reactive Integrity:** Data flows strictly through DOM events. Programmatic changes must trigger standard events (`input` / `change`) so that dependent primitives (`ln-validate`, `ln-autoresize`) can react in synchrony.
+1. **Populate, don't orchestrate.** `ln-form` writes values into the form
+   on `ln-fill` and dispatches synthetic `input`/`change` events so
+   reactive consumers (`ln-validate`, `ln-autoresize`) react in sync. It
+   keeps no validation state and no submit-button logic.
+2. **Native submit, always.** Forms MUST carry a real `action` and
+   `method` in HTML. Without JavaScript they do a normal native submit.
+   PUT/DELETE ride on POST via an auto-ensured hidden `_method` input
+   (Laravel method spoofing) — `ln-form` never serializes data, never
+   dispatches a submit event, and never listens for `submit` at all.
+3. **Transport is someone else's job.** Ajax interception (if wanted) is
+   a separate component's concern — it listens to the native `submit`
+   event itself. Validation is owned by the browser's constraint
+   validation plus `ln-validate` for field error display and the submit
+   gate — a form with at least one `data-ln-validate` field gets
+   `novalidate` injected automatically and the first such field attaches
+   the form's submit gate; a form with none keeps native validation as
+   the default.
 
 ---
 
-## 📦 Minimal Blueprint
+## 2. Minimal Blueprint
 
 ```html
-<form id="user-form" data-ln-form>
-  <!-- Sibling elements wrapped in a semantic form-element -->
-  <div class="form-element">
-    <label for="username">Username</label>
-    <input id="username" name="username" required data-ln-validate>
-    <ul data-ln-validate-errors>
-      <li class="hidden" data-ln-validate-error="required">Username is required</li>
-    </ul>
-  </div>
-
-  <!-- Form Actions Footer -->
-  <ul class="form-actions">
-    <li><button type="button" data-ln-modal-close>Cancel</button></li>
-    <li><button type="submit">Save</button></li>
-  </ul>
+<form id="user-form" data-ln-form action="/users" method="post">
+	<div class="form-element">
+		<label for="username">Username</label>
+		<input id="username" name="username" required data-ln-validate>
+		<ul data-ln-validate-errors>
+			<li hidden data-ln-validate-error="required">Username is required</li>
+		</ul>
+	</div>
+
+	<ul class="form-actions">
+		<li><button type="button" data-ln-modal-close>Cancel</button></li>
+		<li><button type="submit">Save</button></li>
+	</ul>
 </form>
 ```
 
 > [!WARNING]
-> Always set `type="button"` on Cancel buttons. Otherwise, the browser defaults to `type="submit"` and triggers validation/submission.
+> Always set `type="button"` on Cancel buttons. Otherwise the browser
+> defaults to `type="submit"` and triggers a real submit.
 
 ---
 
-## 🛠️ Declarative API Contract
+## 3. Declarative API Contract
 
 ### HTML Attributes
 
 | Attribute | Elements | Description |
 | :--- | :--- | :--- |
-| `data-ln-form` | `<form>` | Initializes the coordinator. Evaluates initial button states. |
-| `data-ln-form-auto` | `<form>` | Automatically submits the form on any user value change. |
-| `data-ln-form-debounce="ms"` | `<form>` | Debounce duration in milliseconds before auto-submitting. |
+| `data-ln-form` | `<form>` | Initializes the coordinator. |
+| `data-ln-form-action-edit` | `<form>` | Opt-in RESTful action routing. See below. |
+| `data-ln-form-action-method="PUT"` | `<form>` | Override verb for `_method` (default `PUT`). Requires `data-ln-form-action-edit`. |
+| `data-ln-form-scope` | `<form>` | Opt-in local-first write path. Empty = nearest ancestor `[data-ln-data-coordinator]`. Named = explicit coordinator override. Intercepts submit; incompatible with native/ajax submit on the same form. |
 
 ### JS API
 
-Access the coordinator instance directly via the `lnForm` property on the form element:
+Access the instance directly via the `lnForm` property on the form
+element:
 
 ```javascript
 const form = document.getElementById('user-form');
 
-// 1. Bulk populate fields by name (fires synthetic input/change events)
+// Bulk populate fields by name (fires synthetic input/change events)
 form.lnForm.fill({ username: 'dalibor', role: 'admin' });
 
-// 2. Force-validate all fields and trigger submission if clean
-form.lnForm.submit();
-
-// 3. Clear all fields, reset validity states, and re-enable the fresh guard
-form.lnForm.reset();
-
-// 4. Check if all data-ln-validate fields are valid (Boolean getter)
-if (form.lnForm.isValid) { ... }
-
-// 5. Clean up listeners and destroy the instance
+// Clean up listeners and destroy the instance
 form.lnForm.destroy();
 ```
 
 ---
 
-## ⚡ DOM Events
+## 4. DOM Events
 
 ### Emitted
 
 | Event | Bubbles | Payload | Description |
 | :--- | :--- | :--- | :--- |
-| `ln-form:submit` | Yes | `{ data: Object }` | Dispatched with serialized form key-values on valid submission. |
-| `ln-form:reset-complete` | Yes | `{ target: HTMLElement }` | Dispatched after a complete reactive reset cycle. |
 | `ln-form:destroyed` | Yes | `{ target: HTMLElement }` | Dispatched when the coordinator is torn down. |
 
 ### Received
 
 | Event | Payload | Description |
 | :--- | :--- | :--- |
-| `ln-form:fill` | `{ key: value }` | Triggers form population. (Prefer direct `form.lnForm.fill()` API). |
-| `ln-form:reset` | None | Triggers form reset. (Prefer direct `form.lnForm.reset()` API). |
+| `ln-fill` | `record \| null` | Canonical fan-out fill. `detail` → `this.fill(detail)` + apply action mode; `null` → native `form.reset()`. Guarded: only handled when `e.target === self.dom`. |
+
+---
+
+## 5. RESTful action routing (create vs. edit)
+
+For Laravel REST backends, `ln-form` can rewrite `form.action` and inject
+a hidden `_method` input driven off the fill record — no coordinator JS,
+no second click listener.
+
+**Opt-in:** add `data-ln-form-action-edit` to the `<form>`. Forms without
+this attribute are completely inert — this feature does not exist for
+them.
+
+### Attributes
+
+| Attribute | On | Description |
+| :--- | :--- | :--- |
+| `data-ln-form-action-edit` | `<form>` | Opt-in. Empty value = RESTful default (`baseAction + '/' + id`). Non-empty value = template with `:id` placeholder. |
+| `data-ln-form-action-edit="/path/:id"` | `<form>` | Template variant — `:id` is replaced with `encodeURIComponent(record.id)`. |
+| `data-ln-form-action-method="PUT"` | `<form>` | HTTP verb written into `_method` on edit. Default: `PUT`. |
+
+> The `<input name="_method">` is auto-ensured — do not author it
+> manually. `ln-form` creates it on first fill if absent, or reuses the
+> existing one.
+
+### Behavior
+
+| Fill state | `form.action` | `<input name="_method">` |
+| :--- | :--- | :--- |
+| Edit (record with `id`) | Rewritten to edit URL | `PUT` (or custom verb) |
+| New (`null` detail) | Restored to base action | `''` (empty — Laravel ignores) |
+
+### Examples
+
+```html
+<!-- Minimal: baseAction + '/' + id -->
+<form data-ln-form action="/packages" data-ln-form-action-edit>
+
+<!-- Custom template -->
+<form data-ln-form action="/packages" data-ln-form-action-edit="/packages/:id">
+
+<!-- Custom verb -->
+<form data-ln-form action="/packages"
+      data-ln-form-action-edit="/packages/:id"
+      data-ln-form-action-method="PATCH">
+```
+
+> [!NOTE]
+> This feature only rewrites `action`/`_method`. The actual HTTP request
+> (native submit or ajax) is out of scope for `ln-form`.
+
+---
+
+## 6. What ln-form does NOT do
+
+- **No transport.** It does not make XHR/fetch requests. Submit is
+  native HTML; ajax interception (if desired) belongs to a separate
+  component that listens to the native `submit` event.
+- **No serialization, ever.** There is no `serializeForm` call inside
+  `ln-form`, no `ln-form:submit-record` event, no JSON payload — scoped
+  forms are serialized by the claiming `ln-data-coordinator`, not by
+  `ln-form`.
+- **No validation orchestration, no submit listener at all.** `ln-form`
+  never dispatches `ln-validate:request-validate`, never calls
+  `preventDefault()`, and never touches `novalidate` — all of that is
+  entirely [`ln-validate`](../ln-validate/README.md)'s job (see its
+  README §Philosophy). Claiming a valid submit for the write pipeline
+  (scoped forms only) is `ln-data-coordinator`'s job (native `submit`,
+  bubble phase, its own `preventDefault()`) — `ln-form` plays no role in
+  that decision either.
 
 ---
 
-## ⚠️ Common Pitfalls
+## 5b. Local-first write routing (`data-ln-form-scope`)
+
+A form carrying `data-ln-form-scope` becomes the universal write entry
+point for local-first/SPA pages. The `submit` event is intercepted at
+three possible rungs, and whichever rung claims it decides the archetype:
+
+1. **Nobody** — native browser submit to `action` (+ `_method`), SSR.
+2. **`ln-ajax`** — fetch to `action`, page stays put (progressive
+   enhancement). `ln-ajax` explicitly skips forms carrying
+   `data-ln-form-scope` (see the `ln-ajax` README).
+3. **`ln-data-coordinator`** — a form with `data-ln-form-scope` has its
+   valid submit left native; `ln-form` never intercepts it beyond the
+   validation gate (§7 below). The nearest ancestor
+   `[data-ln-data-coordinator]` (or the named coordinator, if
+   `data-ln-form-scope="name"`) listens for the native `submit` on
+   `document` (bubble phase), claims it with `preventDefault()` once its
+   own scope/containment matches, serializes the form itself, and routes
+   it through the store → queue → connector write pipeline. See the
+   `ln-data-coordinator` README for the intake contract.
+
+`ln-validate`'s submit gate runs on every method — GET included, exactly
+like the native browser validation it replaces. A search form nested
+inside a coordinator with invalid `data-ln-validate` fields is blocked
+the same as any other form; a form with no `data-ln-validate` fields has
+no gate at all. `ln-data-coordinator` reads the effective method
+(`_method` input if present and non-empty, else the form's `method`
+attribute) independently, purely to decide whether to claim the native
+submit for the write pipeline (`POST` → create, `PUT`/`PATCH` → update) —
+a `GET` form is never claimed, regardless of validity. `ln-form` itself
+stays coordinator-blind and validation-blind: it never serializes, never
+dispatches a custom event, and never listens for `submit`.
+
+---
+
+## 7. Common Pitfalls
+
+- **Setting `input.value` directly:** Doing `input.value = 'new'` is
+  silent in the DOM. Neither validation nor layout systems will detect
+  the change. **Always** use `form.lnForm.fill()` or manually dispatch an
+  `input`/`change` event.
+- **Expecting a submit event:** `ln-form` never dispatches anything on
+  submit — there is no `ln-form:submit` and no `ln-form:submit-record`
+  either. Listen to the form's native `submit` event, or the resulting
+  `ln-data-store:created`/`ln-data-store:updated` outcome, instead.
+
+---
+
+## 8. Integration & Source Files
+
+- **Unified Bundle**: Loaded automatically with the main bundle:
+  ```html
+  <script src="dist/ln-ashlar.iife.js" defer></script>
+  ```
+- **Standalone IIFE**: For lightweight pages, load the standalone,
+  self-registering IIFE version:
+  ```html
+  <script src="js/ln-form/ln-form.js" defer></script>
+  ```
+- **Active Source (ESM)**: Development source is located at
+  [js/ln-form/src/ln-form.js](file:///c:/laragon/www/ln-ashlar/js/ln-form/src/ln-form.js).
+
+---
+
+## 🔧 Internals
+
+Source: `js/ln-form/ln-form.js`. Instance state is minimal: `dom` (the form) and `_baseAction` (the `action` attribute captured once at init, restored on "new" mode). No validation index, no debounce, no submit-button bookkeeping — `ln-form` does not orchestrate submission.
+
+### `fill(data)`
+
+Iterates `form.elements` writing by `name`: checkboxes get `.checked = Boolean(value)`, radios match `el.value === String(value)`, `select-multiple` sets `options[n].selected`, everything else sets `.value`. Each written element then dispatches exactly one synthetic event — `change` for `SELECT`/checkbox/radio, `input` otherwise (the `isChangeBased` discriminator). This mirrors the same discriminator `ln-validate` and `ln-autoresize` use for their own listener registration, so every field fires the event those consumers actually listen for — no double fires, no missed reactions.
+
+### `ln-fill` handling
+
+Guarded to `e.target === self.dom` (ignores bubbled `ln-fill` from nested `[data-ln-fillable]` children). A record calls `fill()` then `_applyActionMode(record)`; `null` calls `form.reset()` — the native `reset` event that fires from that call is what actually restores the base action (see below), not the `ln-fill` handler directly.
+
+### Reset routing
+
+The native `reset` event — whether from `form.reset()` above, a `<button type="reset">`, or any other trigger — always runs `_applyActionMode(null)`, restoring `_baseAction` and clearing `_method`. There is no synthetic input/change replay on reset and no `ln-form:reset-complete` event.
+
+### Action-mode guard
+
+`_applyActionMode` exits immediately on forms without `data-ln-form-action-edit` — unrelated forms are untouched by the reset/fill listeners' side effects.
+
+### Relation to ln-validate
+
+Independent siblings, no imports between them. `ln-validate` injects `novalidate` the moment its first field initializes (authors never write it by hand); a form with zero `data-ln-validate` fields keeps native validation as the default. `ln-validate` has its own separate `reset` listener (clears field error classes / `_touched` state) — unrelated to `ln-form`'s reset listener, which only handles action/`_method`.
+
+---
 
-- **Setting `input.value` directly:** Doing `input.value = 'new'` is silent in the DOM. Neither validation nor layout systems will detect the change. **Always** use `form.lnForm.fill()` or manually dispatch an `input` or `change` event.
-- **Relying on Native Form Resets:** Clicking a `<button type="reset">` only reverts DOM attributes. It does not trigger synthetic events, leaving textareas at expanded heights and custom controls out of sync. Use `form.lnForm.reset()` instead.
-- **Debounced fill on auto-submit forms:** Calling `fill()` on an auto-submit form will trigger an automatic submission after the debounce timeout.
+## Related
+- **[`ln-validate`](../ln-validate/README.md)** — Field-level validation and error display.
+- **[`ln-fill`](../ln-fill/README.md)** — Fan-out fill event source.

package/js/ln-form/ln-form.js

@@ -1 +1 @@
-(function(){"use strict";function y(s,t,u){s.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:u||{}}))}function E(s,t){if(!document.body){document.addEventListener("DOMContentLoaded",function(){E(s,t)}),console.warn("["+t+'] Script loaded before <body> — add "defer" to your <script> tag');return}s()}function v(s,t,u,a){if(s.nodeType!==1)return;const o=t.indexOf("[")!==-1||t.indexOf(".")!==-1||t.indexOf("#")!==-1?t:"["+t+"]",r=Array.from(s.querySelectorAll(o));s.matches&&s.matches(o)&&r.push(s);for(const e of r)e[u]||(e[u]=new a(e))}function S(s){const t={},u=s.elements;for(let a=0;a<u.length;a++){const i=u[a];if(!(!i.name||i.disabled||i.type==="file"||i.type==="submit"||i.type==="button"))if(i.type==="checkbox")t[i.name]||(t[i.name]=[]),i.checked&&t[i.name].push(i.value);else if(i.type==="radio")i.checked&&(t[i.name]=i.value);else if(i.type==="select-multiple"){t[i.name]=[];for(let o=0;o<i.options.length;o++)i.options[o].selected&&t[i.name].push(i.options[o].value)}else t[i.name]=i.value}return t}function w(s,t){const u=s.elements,a=[];for(let i=0;i<u.length;i++){const o=u[i];if(!o.name||!(o.name in t)||o.type==="file"||o.type==="submit"||o.type==="button")continue;const r=t[o.name];if(o.type==="checkbox")o.checked=Array.isArray(r)?r.indexOf(o.value)!==-1:!!r,a.push(o);else if(o.type==="radio")o.checked=o.value===String(r),a.push(o);else if(o.type==="select-multiple"){if(Array.isArray(r))for(let e=0;e<o.options.length;e++)o.options[e].selected=r.indexOf(o.options[e].value)!==-1;a.push(o)}else o.value=r,a.push(o)}return a}function x(s,t,u,a,i={}){const o=i.extraAttributes||[],r=i.onAttributeChange||null,e=i.onInit||null;function n(l){const d=l||document.body;v(d,s,t,u),e&&e(d)}return E(function(){const l=new MutationObserver(function(f){for(let h=0;h<f.length;h++){const c=f[h];if(c.type==="childList"){for(let p=0;p<c.addedNodes.length;p++){const m=c.addedNodes[p];m.nodeType===1&&(v(m,s,t,u),e&&e(m))}for(let p=0;p<c.removedNodes.length;p++){const m=c.removedNodes[p];if(m.nodeType===1){const L=s.indexOf("[")!==-1||s.indexOf(".")!==-1||s.indexOf("#")!==-1?s:"["+s+"]",b=Array.from(m.querySelectorAll(L));m.matches&&m.matches(L)&&b.push(m);for(let g=0;g<b.length;g++){const T=b[g];if(!document.contains(T)){const _=T[t];_&&typeof _.destroy=="function"&&_.destroy()}}}}}else c.type==="attributes"&&(r&&c.target[t]?r(c.target,c.attributeName):(v(c.target,s,t,u),e&&e(c.target)))}});let d=[];if(s.indexOf("[")!==-1){const f=/\[([\w-]+)/g;let h;for(;(h=f.exec(s))!==null;)d.push(h[1])}else d.push(s);l.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:d.concat(o)})},a),window[t]=n,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",function(){n(document.body)}):n(document.body),n}const A={};function C(s,t){A[s]=t}function O(s){return A[s]||{ingress:t=>t,egress:t=>t}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=C,window.lnCore.getDataMapper=O),(function(){const s="data-ln-form",t="lnForm",u="data-ln-form-auto",a="data-ln-form-debounce",i="data-ln-validate",o="lnValidate";if(window[t]!==void 0)return;function r(e){this.dom=e,this._debounceTimer=null;const n=this;if(this._onValid=function(){n._updateSubmitButton()},this._onInvalid=function(){n._updateSubmitButton()},this._onSubmit=function(l){l.preventDefault(),n.submit()},this._onFill=function(l){l.detail&&n.fill(l.detail)},this._onFormReset=function(){n.reset()},this._onNativeReset=function(){setTimeout(function(){n._resetValidation()},0)},e.addEventListener("ln-validate:valid",this._onValid),e.addEventListener("ln-validate:invalid",this._onInvalid),e.addEventListener("submit",this._onSubmit),e.addEventListener("ln-form:fill",this._onFill),e.addEventListener("ln-form:reset",this._onFormReset),e.addEventListener("reset",this._onNativeReset),this._onAutoInput=null,e.hasAttribute(u)){const l=parseInt(e.getAttribute(a))||0;this._onAutoInput=function(){l>0?(clearTimeout(n._debounceTimer),n._debounceTimer=setTimeout(function(){n.submit()},l)):n.submit()},e.addEventListener("input",this._onAutoInput),e.addEventListener("change",this._onAutoInput)}return this._updateSubmitButton(),this}r.prototype._updateSubmitButton=function(){const e=this.dom.querySelectorAll('button[type="submit"], input[type="submit"]');if(!e.length)return;const n=this.dom.querySelectorAll("["+i+"]");let l=!1;if(n.length>0){let d=!1,f=!1;for(let h=0;h<n.length;h++){const c=n[h][o];c&&c._touched&&(d=!0),n[h].checkValidity()||(f=!0)}l=f||!d}for(let d=0;d<e.length;d++)e[d].disabled=l},r.prototype.fill=function(e){const n=w(this.dom,e);for(let l=0;l<n.length;l++){const d=n[l],f=d.tagName==="SELECT"||d.type==="checkbox"||d.type==="radio";d.dispatchEvent(new Event(f?"change":"input",{bubbles:!0}))}},r.prototype.submit=function(){const e=this.dom.querySelectorAll("["+i+"]");let n=!0;for(let d=0;d<e.length;d++){const f=e[d][o];f&&(f.validate()||(n=!1))}if(!n)return;const l=S(this.dom);y(this.dom,"ln-form:submit",{data:l})},r.prototype.reset=function(){this.dom.reset();const e=this.dom.querySelectorAll("input, textarea, select");for(let n=0;n<e.length;n++){const l=e[n],d=l.tagName==="SELECT"||l.type==="checkbox"||l.type==="radio";l.dispatchEvent(new Event(d?"change":"input",{bubbles:!0}))}this._resetValidation(),y(this.dom,"ln-form:reset-complete",{target:this.dom})},r.prototype._resetValidation=function(){const e=this.dom.querySelectorAll("["+i+"]");for(let n=0;n<e.length;n++){const l=e[n][o];l&&l.reset()}this._updateSubmitButton()},Object.defineProperty(r.prototype,"isValid",{get:function(){const e=this.dom.querySelectorAll("["+i+"]");for(let n=0;n<e.length;n++)if(!e[n].checkValidity())return!1;return!0}}),r.prototype.destroy=function(){this.dom[t]&&(this.dom.removeEventListener("ln-validate:valid",this._onValid),this.dom.removeEventListener("ln-validate:invalid",this._onInvalid),this.dom.removeEventListener("submit",this._onSubmit),this.dom.removeEventListener("ln-form:fill",this._onFill),this.dom.removeEventListener("ln-form:reset",this._onFormReset),this.dom.removeEventListener("reset",this._onNativeReset),this._onAutoInput&&(this.dom.removeEventListener("input",this._onAutoInput),this.dom.removeEventListener("change",this._onAutoInput)),clearTimeout(this._debounceTimer),y(this.dom,"ln-form:destroyed",{target:this.dom}),delete this.dom[t])},x(s,t,r,"ln-form")})()})();
+(function(){"use strict";if(typeof window<"u"){const t=console.warn;console.warn=function(...e){typeof e[0]=="string"&&(e[0].startsWith("[ln-")||e[0].startsWith("[lnCore"))&&!(document.documentElement.hasAttribute("data-ln-debug")||document.body&&document.body.hasAttribute("data-ln-debug"))||t.apply(console,e)}}const y={};function M(t,e){y[t]||(y[t]=document.querySelector('[data-ln-template="'+t+'"]'));const s=y[t];return s?s.content.cloneNode(!0):(console.warn("["+(e||"ln-core")+'] Template "'+t+'" not found'),null)}function D(t,e,s){t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:s||{}}))}function v(t,e){if(!t||!e)return t;const s=t.querySelectorAll("[data-ln-field]");for(let n=0;n<s.length;n++){const i=s[n],l=i.getAttribute("data-ln-field");e[l]!=null&&(i.textContent=e[l])}const d=t.querySelectorAll("[data-ln-attr]");for(let n=0;n<d.length;n++){const i=d[n],l=i.getAttribute("data-ln-attr").split(",");for(let r=0;r<l.length;r++){const u=l[r].trim().split(":");if(u.length!==2)continue;const a=u[0].trim(),f=u[1].trim();e[f]!=null&&i.setAttribute(a,e[f])}}const c=t.querySelectorAll("[data-ln-show]");for(let n=0;n<c.length;n++){const i=c[n],l=i.getAttribute("data-ln-show");l in e&&i.classList.toggle("hidden",!e[l])}const o=t.querySelectorAll("[data-ln-class]");for(let n=0;n<o.length;n++){const i=o[n],l=i.getAttribute("data-ln-class").split(",");for(let r=0;r<l.length;r++){const u=l[r].trim().split(":");if(u.length!==2)continue;const a=u[0].trim(),f=u[1].trim();f in e&&i.classList.toggle(a,!!e[f])}}return t}function q(t,e){t.matches&&t.matches("[data-ln-form], [data-ln-fillable]")&&t.dispatchEvent(new CustomEvent("ln-fill",{detail:e??null,bubbles:!0}));const s=t.querySelectorAll("[data-ln-form], [data-ln-fillable]");for(let d=0;d<s.length;d++)s[d].dispatchEvent(new CustomEvent("ln-fill",{detail:e??null,bubbles:!0}));return t}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore._fillBound||(window.lnCore._fillBound=!0,document.addEventListener("ln-fill",function(t){if(!(!t.target.matches||!t.target.matches("[data-ln-fillable]")))if(t.detail)v(t.target,t.detail);else{const e=t.target.querySelectorAll("[data-ln-field]");for(let s=0;s<e.length;s++)e[s].textContent=""}})));function x(t,e){if(!t||!e)return t;const s=document.createTreeWalker(t,NodeFilter.SHOW_TEXT);for(;s.nextNode();){const o=s.currentNode;o.textContent.indexOf("{{")!==-1&&(o.textContent=o.textContent.replace(/\{\{\s*(\w+)\s*\}\}/g,function(n,i){return e[i]!==void 0?e[i]:""}))}const d=function(o,n){return e[n]!==void 0?e[n]:""},c=Array.from(t.querySelectorAll("*"));t.nodeType===1&&c.push(t);for(let o=0;o<c.length;o++){const n=c[o],i=n.attributes;for(let l=0;l<i.length;l++){const r=i[l];r.value.indexOf("{{")!==-1&&n.setAttribute(r.name,r.value.replace(/\{\{\s*(\w+)\s*\}\}/g,d))}}return t}function I(t,e,s,d,c,o){const n={};for(let l=0;l<t.children.length;l++){const r=t.children[l],u=r.getAttribute("data-ln-key");u&&(n[u]=r)}const i=document.createDocumentFragment();for(let l=0;l<e.length;l++){const r=e[l],u=String(d(r));let a=n[u];if(a)c(a,r,l);else{const f=M(s,o);if(!f||(x(f,r),a=f.firstElementChild,!a))continue;a.setAttribute("data-ln-key",u),c(a,r,l)}i.appendChild(a)}t.textContent="",t.appendChild(i)}function _(t,e){if(!document.body){document.addEventListener("DOMContentLoaded",function(){_(t,e)}),console.warn("["+e+'] Script loaded before <body> — add "defer" to your <script> tag');return}t()}function g(t,e,s,d){if(t.nodeType!==1)return;const o=e.indexOf("[")!==-1||e.indexOf(".")!==-1||e.indexOf("#")!==-1?e:"["+e+"]",n=Array.from(t.querySelectorAll(o));t.matches&&t.matches(o)&&n.push(t);for(const i of n)i[s]||(i[s]=new d(i))}function N(t){if(typeof t!="string")return!!t;const e=t.trim().toLowerCase();return e!=="false"&&e!=="0"&&e!==""&&e!=="off"&&e!=="no"}function F(t,e){const s=t.elements,d=[],c={};for(let o=0;o<s.length;o++){const n=s[o];n.name&&n.type==="checkbox"&&(c[n.name]=(c[n.name]||0)+1)}for(let o=0;o<s.length;o++){const n=s[o];if(n.type==="file"||n.type==="submit"||n.type==="button")continue;const i=n.getAttribute("data-ln-fill-as")||n.name;if(!i||!(i in e))continue;const l=e[i];if(n.type==="checkbox"){if(Array.isArray(l))n.checked=l.indexOf(n.value)!==-1;else if(c[n.name]>1){const r=String(l).split(",").map(function(u){return u.trim()});n.checked=r.indexOf(n.value)!==-1}else n.checked=N(l);d.push(n)}else if(n.type==="radio")n.checked=n.value===String(l),d.push(n);else if(n.type==="select-multiple"){if(Array.isArray(l))for(let r=0;r<n.options.length;r++)n.options[r].selected=l.indexOf(n.options[r].value)!==-1;d.push(n)}else n.value=l,d.push(n)}return d}function R(t,e,s,d,c={}){const o=c.extraAttributes||[],n=c.onAttributeChange||null,i=c.onInit||null;function l(r){const u=r||document.body;g(u,t,e,s),i&&i(u)}return _(function(){const r=new MutationObserver(function(a){for(let f=0;f<a.length;f++){const h=a[f];if(h.type==="childList"){for(let m=0;m<h.addedNodes.length;m++){const p=h.addedNodes[m];p.nodeType===1&&(g(p,t,e,s),i&&i(p))}for(let m=0;m<h.removedNodes.length;m++){const p=h.removedNodes[m];if(p.nodeType===1){const O=t.indexOf("[")!==-1||t.indexOf(".")!==-1||t.indexOf("#")!==-1?t:"["+t+"]",b=Array.from(p.querySelectorAll(O));p.matches&&p.matches(O)&&b.push(p);for(let C=0;C<b.length;C++){const S=b[C];if(!document.contains(S)){const A=S[e];A&&typeof A.destroy=="function"&&A.destroy()}}}}}else h.type==="attributes"&&(n&&h.target[e]?n(h.target,h.attributeName):(g(h.target,t,e,s),i&&i(h.target)))}});let u=[];if(t.indexOf("[")!==-1){const a=/\[([\w-]+)/g;let f;for(;(f=a.exec(t))!==null;)u.push(f[1])}else u.push(t);r.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:u.concat(o)})},d),window[e]=l,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",function(){l(document.body)}):l(document.body),l}const L={};function j(t,e){L[t]=e}function B(t){return L[t]||{ingress:e=>e,egress:e=>e}}const E={};function k(t,e){if(!t||typeof e!="object")return;const s=t.toLowerCase().split("-")[0];E[s]=e}function W(t){if(!t)return null;const e=t.toLowerCase().split("-")[0];return E[e]||null}k("mk",{monthsLong:["јануари","февруари","март","април","мај","јуни","јули","август","септември","октомври","ноември","декември"],monthsShort:["јан","фев","мар","апр","мај","јун","јул","авг","септ","окт","ноем","дек"],daysLong:["недела","понеделник","вторник","среда","четврток","петок","сабота"],daysShort:["нед","пон","вт","ср","чет","пет","саб"]}),typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=j,window.lnCore.getDataMapper=B,window.lnCore.registerLocaleFallback=k,window.lnCore.getLocaleFallback=W,window.lnCore.fillTemplate=x,window.lnCore.fill=v,window.lnCore.lnFill=q,window.lnCore.renderList=I);function T(t){return(t||"").replace(/^#/,"")}function w(t){const e=t===void 0?location.hash:t,s={},d=T(e);if(!d)return s;const c=d.split("&");for(let o=0;o<c.length;o++){const n=c[o];if(!n)continue;const i=n.indexOf(":"),l=i>-1?n.slice(0,i):n,r=i>-1?n.slice(i+1):"";if(l)try{s[l]=decodeURIComponent(r)}catch{s[l]=r}}return s}function U(t){if(!t)return null;const e=w();return t in e?e[t]:null}function K(t,e){if(!t)return;const s=w();e==null?delete s[t]:s[t]=String(e);const c=Object.keys(s).map(function(o){const n=s[o];return n===""?o:o+":"+encodeURIComponent(n)}).join("&");T(location.hash)!==c&&(location.hash=c)}function G(t){return t.button===1||t.ctrlKey||t.metaKey||t.shiftKey?!1:(t.preventDefault(),!0)}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.hashParse=w,window.lnCore.hashGet=U,window.lnCore.hashSet=K,window.lnCore.hashLinkClick=G),(function(){const t="data-ln-form",e="lnForm",s="data-ln-form-action-edit",d="data-ln-form-action-method";if(window[e]!==void 0)return;function c(o){this.dom=o,this._baseAction=o.getAttribute("action")||"";const n=this;return this._onLnFill=function(i){i.target===n.dom&&(i.detail?(n.fill(i.detail),n._applyActionMode(i.detail)):n.dom.reset())},this._onReset=function(){n._applyActionMode(null)},o.addEventListener("ln-fill",this._onLnFill),o.addEventListener("reset",this._onReset),this}c.prototype.fill=function(o){const n=F(this.dom,o);for(let i=0;i<n.length;i++){const l=n[i],r=l.tagName==="SELECT"||l.type==="checkbox"||l.type==="radio";l.dispatchEvent(new Event(r?"change":"input",{bubbles:!0}))}},c.prototype._ensureMethodInput=function(){let o=this.dom.querySelector('input[name="_method"]');return o||(o=document.createElement("input"),o.type="hidden",o.name="_method",o.value="",this.dom.appendChild(o)),o},c.prototype._applyActionMode=function(o){if(!this.dom.hasAttribute(s))return;const n=o&&o.id!=null&&o.id!==""?o.id:null,i=this._ensureMethodInput();if(n!==null){const l=this.dom.getAttribute(s);l?this.dom.setAttribute("action",l.replace(":id",encodeURIComponent(n))):this.dom.setAttribute("action",this._baseAction.replace(/\/$/,"")+"/"+encodeURIComponent(n)),i.value=this.dom.getAttribute(d)||"PUT"}else this.dom.setAttribute("action",this._baseAction),i.value=""},c.prototype.destroy=function(){this.dom[e]&&(this.dom.removeEventListener("ln-fill",this._onLnFill),this.dom.removeEventListener("reset",this._onReset),D(this.dom,"ln-form:destroyed",{target:this.dom}),delete this.dom[e])},R(t,e,c,"ln-form")})()})();