@livenetworks/ashlar 1.6.0 → 2.0.0

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

@@ -1,196 +1,198 @@
-# ln-toggle
-
-> The smallest reactive primitive in `ln-ashlar` — a highly-specialized binary state machine. 
-
----
-
-## 1. Philosophy & The Primitive Mindset
-
-In `ln-ashlar`, the core design principle is **orthogonality**. Rather than creating heavy components that mix state, visual presentation, and layout, we separate them into isolated concerns:
-
-1. **The State Machine (JavaScript)**: The `ln-toggle` component (145 lines) only manages binary `open` / `close` state in the DOM and synchronizes ARIA accessibility. It does not own animations or visual geometries.
-2. **The Visual Presentation (CSS)**: Visual transitions are handled in Vanilla CSS. The component simply toggles the `.open` class on the panel. CSS reads this class and runs transitions (e.g. height collapse or sliding drawers).
-3. **Decoupled Binding (HTML)**: Triggers and panels are matched purely by ID. They can live anywhere in the DOM. Multiple triggers pointing to a single panel are supported natively, and all triggers stay perfectly synchronized.
-
----
-
-## 2. Minimal Blueprint
-
-Triggers and panels are bound via ID. A panel must have a unique `id` and the `data-ln-toggle` attribute.
-
-```html
-<!-- Trigger anywhere -->
-<button data-ln-toggle-for="example-panel">Toggle Options</button>
-
-<!-- Panel anywhere -->
-<section id="example-panel" data-ln-toggle class="collapsible">
-    <article class="collapsible-body">
-        <p>This is smooth collapsible content.</p>
-    </article>
-</section>
-```
-
-### Key Anatomy Rules
-- **The Panel (`data-ln-toggle`)**: The value `open` represents open; anything else (empty or `close`) represents closed.
-- **The Trigger (`data-ln-toggle-for="id"`)**: Automatically intercepts clicks to toggle the panel. 
-- **The Close Trigger (`data-ln-toggle-action="close"`)**: Forces the trigger to only close the panel (e.g. an "X" button inside a sidebar drawer).
-- **The Body (`.collapsible-body`)**: Holds all padding and margins. The parent `.collapsible` container must have zero padding so it can transition to exactly `0px` height cleanly.
-
----
-
-## 3. The Declarative API & State Contract
-
-There are no imperative JavaScript methods (like `open()` or `close()`) on the component instance. **The HTML attribute is the sole contract.** 
-
-Triggers, sibling components, external scripts, and manual DevTools edits all change state by writing the attribute:
-
-```js
-const panel = document.getElementById('example-panel');
-
-// Open the panel
-panel.setAttribute('data-ln-toggle', 'open');
-
-// Close the panel
-panel.setAttribute('data-ln-toggle', 'close');
-
-// Read-only state query
-panel.lnToggle.isOpen; // Returns true/false
-```
-
-### Attributes
-- `data-ln-toggle`: Placed on the panel to create the toggle instance.
-- `data-ln-toggle-for`: Placed on triggers referencing the panel ID.
-- `data-ln-toggle-action="open|close"`: Forces a trigger button to only open or only close the target.
-- `data-ln-persist`: Saves the panel state individually in `localStorage`. 
-  - storage key: `ln:toggle:{pagePath}:{id}`. Same IDs on different pages store separately.
-
----
-
-## 4. Transition Events
-
-All events bubble. `event.detail.target` is always the panel element.
-
-| Event | Cancelable | Dispatched When |
-|---|---|---|
-| **`ln-toggle:before-open`** | **Yes** | After attribute flips to `"open"`, before transition starts. Calling `event.preventDefault()` cancels the transition and reverts the attribute. |
-| **`ln-toggle:open`** | No | After panel is fully open, classes added, and ARIA synced. |
-| **`ln-toggle:before-close`** | **Yes** | After attribute flips to `"close"`, before transition starts. Calling `event.preventDefault()` cancels the close and reverts the attribute. |
-| **`ln-toggle:close`** | No | After panel is fully closed, classes removed, and ARIA synced. |
-
-```js
-// Example: Cancel open transition for unauthorized users
-document.addEventListener('ln-toggle:before-open', (e) => {
-    if (e.detail.target.id === 'secure-panel' && !currentUser.isAdmin) {
-        e.preventDefault(); // Reverts attribute back to "close"
-    }
-});
-```
-
----
-
-## 5. Integration Patterns
-
-### A. Sidebar Drawer
-Combine the panel with the library's `@mixin sidebar-drawer` and add a close button inside the sidebar:
-```html
-<aside id="menu" data-ln-toggle data-ln-persist class="sidebar">
-    <button data-ln-toggle-for="menu" data-ln-toggle-action="close">×</button>
-</aside>
-```
-
-### B. Smooth Height Collapsible
-Combine the panel with the library's `@mixin collapsible` and `.collapsible-body` wrapper to animate height cleanly:
-```html
-<section id="panel" data-ln-toggle class="collapsible">
-    <div class="collapsible-body">Content goes here...</div>
-</section>
-```
-
-### C. Dismissible Alert
-Combine the alert card with `data-ln-persist` so that once the user closes the alert, it stays closed across page reloads:
-```html
-<div class="alert" id="promo-banner" data-ln-toggle="open" data-ln-persist>
-    <p>Promo code active!</p>
-    <button data-ln-toggle-for="promo-banner" data-ln-toggle-action="close">×</button>
-</div>
-```
-
----
-
-## 6. 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-toggle/ln-toggle.js" defer></script>
-  ```
-- **Active Source (ESM)**: Development source is located at [js/ln-toggle/src/ln-toggle.js](file:///c:/laragon/www/ln-ashlar/js/ln-toggle/src/ln-toggle.js).
-
----
-
-## Related
-- **[`ln-accordion`](../ln-accordion/README.md)** — Single-open coordinator for toggle panels.
-- **[`ln-dropdown`](../ln-dropdown/README.md)** — Menu wrapper adding click-outside/top-layer promotion.
-
----
-
-## 🔧 Internals
-
-Source: `js/ln-toggle/ln-toggle.js`. Imports `registerComponent`, `dispatch`, `dispatchCancelable` from `ln-core/helpers.js` and `persistGet`/`persistSet` from `ln-core/persist.js` — no other library component.
-
-### Instance state
-
-| Field | Description |
-|---|---|
-| `dom` | The panel element |
-| `isOpen` | Cache of the attribute, kept current by `_syncAttribute`; used only to skip no-op transitions and as a read-only convenience getter |
-
-No cached trigger list, no saved previous-value for revert, no timer/queue — every attribute change runs the pipeline immediately. Triggers are re-queried document-wide on each state change; cheap because the matching set is typically 1-3 elements.
-
-### Init
-
-`registerComponent` scans for `[data-ln-toggle]`, watches `data-ln-toggle`/`data-ln-toggle-for` mutations, and calls `_attachTriggers(document.body)` on init. `_component(dom)`:
-1. **Persistence restore** — if `data-ln-persist` is present, `persistGet('toggle', dom)`; a saved value is applied via `setAttribute` *inside the constructor*. The observer does fire for that write, but `el[DOM_ATTRIBUTE]` is still `undefined` at that point (assigned only after the constructor returns), so `_syncAttribute`'s instance guard catches it and the pipeline does not run — no spurious `:before-open`/`:open` during restore.
-2. Reads the (possibly restored) attribute into `isOpen`, adds `.open` if true, calls `_syncTriggerAria` for the initial ARIA state.
-
-No `:open`/`:close` event fires at init — the attribute is already in its final state; there's been no transition.
-
-### Trigger attachment
-
-`_attachTriggers(root)` finds every `[data-ln-toggle-for]` under `root` (skipping ones already wired via a stashed-handler guard) and binds `click`: ignores modifier-key clicks, `preventDefault`s, resolves the target by ID, then writes `data-ln-toggle` — `"open"`/`"close"` for an explicit `data-ln-toggle-action`, or the inverse of the current value for the default toggle action. The handler reference is stashed on the trigger for `destroy` to remove later. Newly attached triggers also get their `aria-expanded` set immediately from the target's current state (no waiting for the next transition).
-
-### `_syncAttribute` — the transition pipeline
-
-Runs only when the mutated element already has an `lnToggle` instance (a brand-new element getting the attribute takes the init/upgrade path instead, via `findElements`, not a transition). Order, for the "open" direction (close mirrors it):
-
-1. `dispatchCancelable('ln-toggle:before-open')` — listeners see `isOpen` at its **pre-transition** value.
-2. If canceled: revert the attribute to `'close'` and return. The revert re-fires the observer, but `isOpen` was never changed, so the second pass is a no-op — no loop, no duplicate event.
-3. `isOpen = true`, `.open` class added.
-4. `_syncTriggerAria(el, true)` — before the post-event, so `:open` listeners see settled ARIA.
-5. `dispatch('ln-toggle:open')`.
-6. If `data-ln-persist`: `persistSet('toggle', el, 'open')` — last, so a listener that removes `data-ln-persist` synchronously during `:open` skips the write.
-
-This ordering (cancelable → class → aria → event → persist) is the same shape for every transition in the library that follows the attribute-as-contract pattern.
-
-### `_syncTriggerAria`
-
-Document-scoped `querySelectorAll('[data-ln-toggle-for="<id>"]')`, sets `aria-expanded` on each match — document-scoped because triggers can live anywhere relative to their panel. Drives both screen-reader state and the CSS chevron rotation rule in `scss/components/_toggle.scss`. Called from init, every transition, and `_attachTriggers` (so late-added triggers inherit current state).
-
-### Persistence
-
-Key: `ln:toggle:{pagePath}:{id}` (`_resolveKey` in `ln-core/persist.js`); path-scoped and non-overrideable, so the same panel `id` on two routes stores independently. `persistGet`/`persistSet` wrap `localStorage` in `try/catch` and swallow failures silently (private browsing, quota, disabled storage) — toggle keeps working without persistence, no error surfaces.
-
-### Destroy
-
-Guards double-destroy, dispatches `ln-toggle:destroyed`, removes the click listener from every matching trigger (using the stashed handler ref), deletes the instance. Does **not** remove `data-ln-toggle` or the `.open` class — only the JS coupling is severed; the consumer removes markup state separately if a full teardown is wanted.
-
-### What it deliberately does not do
-
-No keyboard handling (ESC, Space/Enter on the panel), no outside-click, no focus management, no resize listener. Each is a separate concern owned by a wrapping component: `ln-dropdown` (outside-click/resize/teleport), `ln-modal` (focus trap), or project code.
-
-### Cross-component contract
-
-`ln-accordion` and `ln-dropdown` both reach in only through the public contract — listening for `ln-toggle:open`/`:close`, and writing `data-ln-toggle="..."` directly (never an instance method). `ln-accordion` writes `'close'` on siblings from its wrapper listener; `ln-dropdown` listens on its inner toggle and teleports/wires outside-click on `:open`, reverses on `:close`. Because the attribute is the only mutation path, cancelable events and persistence fire identically regardless of which caller changed the state — there is no private mutator to bypass the pipeline.
+# ln-toggle
+
+> Applied to any collapsible panel element via `data-ln-toggle`, with triggers bound from anywhere in the DOM via `data-ln-toggle-for="id"`.
+> It listens for trigger clicks and reacts to direct attribute mutations to toggle binary `open`/`close` state. The `data-ln-toggle`
+> attribute is the single source of truth — automatically keeping `aria-expanded` and the `.open` CSS class in sync with zero JS height calculations or shadow state.
+
+---
+
+## 1. Philosophy & The Primitive Mindset
+
+In `ln-ashlar`, the core design principle is **orthogonality**. Rather than creating heavy components that mix state, visual presentation, and layout, we separate them into isolated concerns:
+
+1. **The State Machine (JavaScript)**: The `ln-toggle` component (145 lines) only manages binary `open` / `close` state in the DOM and synchronizes ARIA accessibility. It does not own animations or visual geometries.
+2. **The Visual Presentation (CSS)**: Visual transitions are handled in Vanilla CSS. The component synchronizes the `.open` class and `[data-ln-toggle="open"]` on the panel. CSS reads these selectors and runs transitions (e.g. height collapse or sliding drawers).
+3. **Decoupled Binding (HTML)**: Triggers and panels are matched purely by ID. They can live anywhere in the DOM. Multiple triggers pointing to a single panel are supported natively, and all triggers stay perfectly synchronized.
+
+---
+
+## 2. Minimal Blueprint
+
+Triggers and panels are bound via ID. A panel must have a unique `id` and the `data-ln-toggle` attribute.
+
+```html
+<!-- Trigger anywhere -->
+<button data-ln-toggle-for="example-panel">Toggle Options</button>
+
+<!-- Panel anywhere -->
+<section id="example-panel" data-ln-toggle class="collapsible">
+    <article class="collapsible-body">
+        <p>This is smooth collapsible content.</p>
+    </article>
+</section>
+```
+
+### Key Anatomy Rules
+- **The Panel (`data-ln-toggle`)**: The value `open` represents open; anything else (empty or `close`) represents closed.
+- **The Trigger (`data-ln-toggle-for="id"`)**: Automatically intercepts clicks to toggle the panel. 
+- **The Close Trigger (`data-ln-toggle-action="close"`)**: Forces the trigger to only close the panel (e.g. an "X" button inside a sidebar drawer).
+- **The Body (`.collapsible-body`)**: Holds all padding and margins. The parent `.collapsible` container must have zero padding so it can transition to exactly `0px` height cleanly.
+
+---
+
+## 3. The Declarative API & State Contract
+
+There are no imperative JavaScript methods (like `open()` or `close()`) on the component instance. **The HTML attribute is the sole contract.** 
+
+Triggers, sibling components, external scripts, and manual DevTools edits all change state by writing the attribute:
+
+```js
+const panel = document.getElementById('example-panel');
+
+// Open the panel
+panel.setAttribute('data-ln-toggle', 'open');
+
+// Close the panel
+panel.setAttribute('data-ln-toggle', 'close');
+
+// Read-only state query (committed state tracker)
+panel.lnToggle.isOpen; // Returns true/false
+```
+
+### Attributes
+- `data-ln-toggle`: Placed on the panel to create the toggle instance.
+- `data-ln-toggle-for`: Placed on triggers referencing the panel ID.
+- `data-ln-toggle-action="open|close"`: Forces a trigger button to only open or only close the target.
+- `data-ln-persist`: Saves the panel state individually in `localStorage`.
+  - storage key: `ln:{id}:data-ln-toggle` (global by default).
+- `data-ln-persist-scope="page"`: Opt-in, independent attribute. Scopes the storage key to the current pathname: `ln:{id}:{pagePath}:data-ln-toggle`. Same IDs on different pages then store separately.
+
+---
+
+## 4. Transition Events
+
+All events bubble. `event.detail.target` is always the panel element.
+
+| Event | Cancelable | Dispatched When |
+|---|---|---|
+| **`ln-toggle:before-open`** | **Yes** | After attribute flips to `"open"`, before transition starts. Calling `event.preventDefault()` cancels the transition and reverts the attribute. |
+| **`ln-toggle:open`** | No | After panel is fully open, classes added, and ARIA synced. |
+| **`ln-toggle:before-close`** | **Yes** | After attribute flips to `"close"`, before transition starts. Calling `event.preventDefault()` cancels the close and reverts the attribute. |
+| **`ln-toggle:close`** | No | After panel is fully closed, classes removed, and ARIA synced. |
+
+```js
+// Example: Cancel open transition for unauthorized users
+document.addEventListener('ln-toggle:before-open', (e) => {
+    if (e.detail.target.id === 'secure-panel' && !currentUser.isAdmin) {
+        e.preventDefault(); // Reverts attribute back to "close"
+    }
+});
+```
+
+---
+
+## 5. Integration Patterns
+
+### A. Sidebar Drawer
+Combine the panel with the library's `@mixin sidebar-drawer` and add a close button inside the sidebar:
+```html
+<aside id="menu" data-ln-toggle data-ln-persist class="sidebar">
+    <button data-ln-toggle-for="menu" data-ln-toggle-action="close">×</button>
+</aside>
+```
+
+### B. Smooth Height Collapsible
+Combine the panel with the library's `@mixin collapsible` and `.collapsible-body` wrapper to animate height cleanly:
+```html
+<section id="panel" data-ln-toggle class="collapsible">
+    <div class="collapsible-body">Content goes here...</div>
+</section>
+```
+
+### C. Dismissible Alert
+Combine the alert card with `data-ln-persist` so that once the user closes the alert, it stays closed across page reloads:
+```html
+<div class="alert" id="promo-banner" data-ln-toggle="open" data-ln-persist>
+    <p>Promo code active!</p>
+    <button data-ln-toggle-for="promo-banner" data-ln-toggle-action="close">×</button>
+</div>
+```
+
+---
+
+## 6. 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="components/ln-toggle/ln-toggle.js" defer></script>
+  ```
+- **Active Source (ESM)**: Development source is located at [components/ln-toggle/src/ln-toggle.js](file:///c:/laragon/www/ln-ashlar/components/ln-toggle/src/ln-toggle.js).
+
+---
+
+## Related
+- **[`ln-accordion`](../ln-accordion/README.md)** — Single-open coordinator for toggle panels.
+- **[`ln-dropdown`](../ln-dropdown/README.md)** — Menu wrapper adding click-outside/top-layer promotion.
+
+---
+
+## 🔧 Internals
+
+Source: `components/ln-toggle/ln-toggle.js`. Imports `registerComponent`, `dispatch`, `dispatchCancelable` from `ln-core` — no other library component. Persistence is declared, not imported: `registerComponent(...)` is passed `persist: { attr: DOM_SELECTOR, hashActive: null }`, and `ln-persist` (a separate component) does the restoring/saving from outside.
+
+### Instance state
+
+| Field | Description |
+|---|---|
+| `dom` | The panel element |
+| `isOpen` | Cache of the attribute, kept current by `_syncAttribute`; used only to skip no-op transitions and as a read-only convenience getter |
+
+No cached trigger list, no saved previous-value for revert, no timer/queue — every attribute change runs the pipeline immediately. Triggers are re-queried document-wide on each state change; cheap because the matching set is typically 1-3 elements.
+
+### Init
+
+`registerComponent` scans for `[data-ln-toggle]`, watches `data-ln-toggle` mutations, and instantiates panels. Triggers are handled document-wide by a single delegated click listener. `_component(dom)`:
+1. **Persistence restore already happened** — if `data-ln-persist` is present, `ln-persist`'s sink already wrote the saved value onto `data-ln-toggle` via `setAttribute`, synchronously, *before* this constructor runs (inside `findElements`, immediately before `el[attribute] = new ComponentClass(el)`). The mutation-delivery microtask for that write fires *after* the constructor has already set `el.lnToggle` and read `isOpen` from the (already-restored) attribute, so `_syncAttribute`'s `shouldBeOpen === instance.isOpen` guard finds them equal and no-ops — no spurious `:before-open`/`:open` during restore.
+2. Reads the (possibly restored) attribute into `isOpen`, adds `.open` if true, calls `_syncTriggerAria` for the initial ARIA state.
+
+No `:open`/`:close` event fires at init — the attribute is already in its final state; there's been no transition.
+
+### Delegated trigger handling
+
+A module-level `instances` Set tracks all initialized toggle panels. A single delegated `document` click listener (`_ensureClickListener`) intercepts clicks on `[data-ln-toggle-for]`: ignores modifier-key clicks, ignores disabled targets (`isTargetDisabled`), calls `preventDefault()`, resolves the target panel by ID, and writes `data-ln-toggle` — `"open"`/`"close"` for an explicit `data-ln-toggle-action`, or the inverse of the current value for the default toggle action. There are no per-trigger event listeners or stashed handlers.
+
+### `_syncAttribute` — the transition pipeline
+
+Runs only when the mutated element already has an `lnToggle` instance (a brand-new element getting the attribute takes the init/upgrade path instead, via `findElements`, not a transition). Order, for the "open" direction (close mirrors it):
+
+1. `dispatchCancelable('ln-toggle:before-open')` — listeners see `isOpen` at its **pre-transition** value.
+2. If canceled: revert the attribute to `'close'` and return. The revert re-fires the observer, but `isOpen` was never changed, so the second pass is a no-op — no loop, no duplicate event.
+3. `isOpen = true`, `.open` class added.
+4. `_syncTriggerAria(el, true)` — before the post-event, so `:open` listeners see settled ARIA.
+5. `dispatch('ln-toggle:open')`.
+
+Persistence is not a step in this pipeline — `ln-persist`'s save handler is wired separately via `observeAttributes([DOM_SELECTOR], ...)` and reacts to the `data-ln-toggle` mutation on its own, after this function returns.
+
+### `_syncTriggerAria`
+
+Document-scoped `querySelectorAll('[data-ln-toggle-for="<id>"]')`, sets `aria-expanded` on each match — document-scoped because triggers can live anywhere relative to their panel. Drives both screen-reader state and the CSS chevron rotation rule in `theme/components/_toggle.scss`. Called from init and every transition.
+
+### Persistence
+
+Key: `ln:{id}:data-ln-toggle` (global by default), or `ln:{id}:{pagePath}:data-ln-toggle` when `data-ln-persist-scope="page"` is present, so the same panel `id` on two routes can be made to store independently (`_resolveKey` in `ln-persist/src/ln-persist.js`). The sink wraps `localStorage` in `try/catch` and swallows failures silently (private browsing, quota, disabled storage) — toggle keeps working without persistence, no error surfaces.
+
+### Destroy
+
+Guards double-destroy, removes request listeners (`ln-toggle:request-open/close/toggle`), removes the instance from the module-level `instances` Set, unbinds the delegated `document` click listener if no instances remain (`_maybeRemoveClickListener`), and deletes `el.lnToggle`. Does **not** remove `data-ln-toggle` or the `.open` class — only the JS coupling is severed; the consumer removes markup state separately if a full teardown is wanted.
+
+### What it deliberately does not do
+
+No keyboard handling (ESC, Space/Enter on the panel), no outside-click, no focus management, no resize listener. Each is a separate concern owned by a wrapping component: `ln-dropdown` (outside-click/resize), `ln-modal` (focus trap), or project code.
+
+### Cross-component contract
+
+`ln-accordion` and `ln-dropdown` both reach in only through the public contract — listening for `ln-toggle:open`/`:close`, and writing `data-ln-toggle="..."` directly (never an instance method). `ln-accordion` writes `'close'` on siblings from its wrapper listener; `ln-dropdown` listens on its inner toggle and wires outside-click on `:open`, reverses on `:close`. Because the attribute is the only mutation path, cancelable events and persistence fire identically regardless of which caller changed the state — there is no private mutator to bypass the pipeline.

package/{js → components}/ln-toggle/ln-toggle-dev.scss

@@ -1,13 +1,13 @@
-@use '../../scss/config/mixins' as *;
-
-[data-ln-debug] {
-	// 1. Toggle Panel Missing ID: panels controlled by data-ln-toggle must have an id for triggering/ARIA linking
-	[data-ln-toggle]:not([id]) {
-		@include dev-dom-error("[data-ln-toggle] is missing a required 'id' attribute for trigger linking.");
-	}
-
-	// 2. Toggle Trigger Empty ID: trigger elements must point to a target panel ID
-	[data-ln-toggle-for=""] {
-		@include dev-inline-error("data-ln-toggle-for target ID cannot be empty");
-	}
-}
+@use '../../theme/config/mixins' as *;
+
+[data-ln-debug] {
+	// 1. Toggle Panel Missing ID: panels controlled by data-ln-toggle must have an id for triggering/ARIA linking
+	[data-ln-toggle]:not([id]) {
+		@include dev-dom-error("[data-ln-toggle] is missing a required 'id' attribute for trigger linking.");
+	}
+
+	// 2. Toggle Trigger Empty ID: trigger elements must point to a target panel ID
+	[data-ln-toggle-for=""] {
+		@include dev-inline-error("data-ln-toggle-for target ID cannot be empty");
+	}
+}

package/components/ln-toggle/ln-toggle.js

@@ -0,0 +1 @@
+(function(){"use strict";function x(){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 o=null;for(let l=1;l<t.length;l++)if(t[l]&&t[l].nodeType===1){o=t[l];break}if(!A(o))return}e.apply(console,t)}}function _(e,t,n){const o=n||{};window.lnCore._debugSink&&window.lnCore._debugSink("event",t,e,o),e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:o}))}function R(e,t,n){const o=n||{};window.lnCore._debugSink&&window.lnCore._debugSink("event",t,e,o);const l=new CustomEvent(t,{bubbles:!0,cancelable:!0,detail:o});return e.dispatchEvent(l),l}function y(e,t){if(!document.body){document.addEventListener("DOMContentLoaded",function(){y(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)}function K(e){return!!(!e||e.disabled||typeof e.getAttribute=="function"&&e.getAttribute("aria-disabled")==="true"||typeof e.closest=="function"&&e.closest("[inert]"))}const I={};function U(e,t){I[e]=t}function Q(e){return I[e]||{ingress:t=>t,egress:t=>t}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=U,window.lnCore.getDataMapper=Q);function G(){typeof window>"u"||(window.lnCore=window.lnCore||{},!window.lnCore._localeObserverBound&&(window.lnCore._localeObserverBound=!0,y(function(){new MutationObserver(function(){_(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 J(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=J,window.lnCore.ensureLocaleObserver=G);const v={};function z(e,t){v[e]||(v[e]=document.querySelector('[data-ln-template="'+e+'"]'));const n=v[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 r=0;r<n.length;r++){const u=n[r],s=u.getAttribute("data-ln-field");t[s]!=null&&(u.textContent=t[s])}const o=e.querySelectorAll("[data-ln-attr]");for(let r=0;r<o.length;r++){const u=o[r],s=u.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 a=f[0].trim(),b=f[1].trim();t[b]!=null&&u.setAttribute(a,t[b])}}const l=e.querySelectorAll("[data-ln-show]");for(let r=0;r<l.length;r++){const u=l[r],s=u.getAttribute("data-ln-show");s in t&&u.classList.toggle("hidden",!t[s])}const i=e.querySelectorAll("[data-ln-class]");for(let r=0;r<i.length;r++){const u=i[r],s=u.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 a=f[0].trim(),b=f[1].trim();b in t&&u.classList.toggle(a,!!t[b])}}return e}function X(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 o=0;o<n.length;o++)window.lnCore._debugSink&&window.lnCore._debugSink("event","ln-fill",n[o],t??null),n[o].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 B(e,t){if(!e||!t)return e;const n=document.createTreeWalker(e,NodeFilter.SHOW_TEXT);for(;n.nextNode();){const i=n.currentNode;i.textContent.indexOf("{{")!==-1&&(i.textContent=i.textContent.replace(/\{\{\s*(\w+)\s*\}\}/g,function(r,u){return t[u]!==void 0?t[u]:""}))}const o=function(i,r){return t[r]!==void 0?t[r]:""},l=Array.from(e.querySelectorAll("*"));e.nodeType===1&&l.push(e);for(let i=0;i<l.length;i++){const r=l[i],u=r.attributes;for(let s=0;s<u.length;s++){const d=u[s];d.value.indexOf("{{")!==-1&&r.setAttribute(d.name,d.value.replace(/\{\{\s*(\w+)\s*\}\}/g,o))}}return e}function Y(e,t,n,o,l,i){const r={};for(let s=0;s<e.children.length;s++){const d=e.children[s],f=d.getAttribute("data-ln-render-key");f&&(r[f]=d)}const u=document.createDocumentFragment();for(let s=0;s<t.length;s++){const d=t[s],f=String(o(d));let a=r[f];if(a)l(a,d,s);else{const b=z(n,i);if(!b||(B(b,d),a=b.firstElementChild,!a))continue;a.setAttribute("data-ln-render-key",f),l(a,d,s)}u.appendChild(a)}e.textContent="",e.appendChild(u)}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.fillTemplate=B,window.lnCore.fill=$,window.lnCore.lnFill=X,window.lnCore.renderList=Y);function F(e,t,n,o,l){if(!e||t===null)return!0;const i=o||"ln-component",r=e.type;if(r==="trigger"||r==="marker"||r==="string"||r==="list"||!r||t===""&&e.fallback!==void 0)return!0;const u=s=>{l?console.warn(s,l):console.warn(s)};if(r==="boolean"){const s=t.trim().toLowerCase();return s!==""&&s!=="true"&&s!=="false"&&s!=="1"&&s!=="0"?(u(`[${i}] Invalid value "${t}" for boolean attribute "${n}". Allowed: "true", "false", or presence-only.`),!1):!0}if(r==="enum"){const s=e.values||[];return s.includes(t)?!0:(u(`[${i}] Invalid value "${t}" for attribute "${n}". Allowed: ${s.join(", ")}. Fallback: "${e.fallback}".`),!1)}if(r==="integer"){if(!/^-?\d+$/.test(t))return u(`[${i}] Invalid integer "${t}" for attribute "${n}". Fallback: ${e.fallback}.`),!1;const s=parseInt(t,10);return e.min!==void 0&&s<e.min?(u(`[${i}] Value ${s} for attribute "${n}" is less than min (${e.min}).`),!1):e.max!==void 0&&s>e.max?(u(`[${i}] Value ${s} for attribute "${n}" is greater than max (${e.max}).`),!1):!0}if(r==="float")return isNaN(Number(t))?(u(`[${i}] Invalid float "${t}" for attribute "${n}". Fallback: ${e.fallback}.`),!1):!0;if(r==="json")try{return JSON.parse(t),!0}catch(s){return u(`[${i}] Invalid JSON for attribute "${n}": ${s.message}. Fallback: ${e.fallback}.`),!1}return!0}function Z(e){const t={};for(const n in e){const o=e[n];o&&o.effect&&(t[n]=o.effect)}return Object.keys(t).length?t:null}function ee(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 k(e,t,n,o){if(e.nodeType!==1)return;const i=t.indexOf("[")!==-1||t.indexOf(".")!==-1||t.indexOf("#")!==-1?t:"["+t+"]",r=Array.from(e.querySelectorAll(i));e.matches&&e.matches(i)&&r.push(e);for(const u of r)if(!u[n]){window.lnCore._persistSink&&u.hasAttribute("data-ln-persist")&&window.lnCore._persistSink(u,t);try{u[n]=new o(u)}catch(s){console.error("["+n+"] init failed",u,s)}}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore._bootHolds=window.lnCore._bootHolds||0,window.lnCore._bootQueue=window.lnCore._bootQueue||[]);function te(){return typeof window<"u"&&window.lnCore&&window.lnCore._bootHolds||0}function ne(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 M(){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 oe(e){const t=M(),n=e.observed||[];for(let o=0;o<n.length;o++){const l=n[o];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 o in e.attributes){t.byDeclaredAttr.has(o)||t.byDeclaredAttr.set(o,[]);const l=t.byDeclaredAttr.get(o);l.some(i=>i.componentTag===e.componentTag)||l.push({spec:e.attributes[o],componentTag:e.componentTag})}if(e.onAttrChange||e.effects){t.reactive.push(e);const o=ee(e);if(o===null)t.reactiveWildcard.push(e);else for(const l of o)t.byReactive.has(l)||t.byReactive.set(l,[]),t.byReactive.get(l).push(e)}e.persist&&t.persist.push(e)}function W(e,t,n,o){for(let l=0;l<e.length;l++){const i=e[l];if(!t[i.attribute])continue;const r=i.effects&&i.effects[n];r?r(t,n,o):i.onAttrChange&&(!i.declared||i.declared.has(n))&&i.onAttrChange(t,n,o)}}function re(e){const t=e.target,n=e.attributeName;if(e.oldValue===t.getAttribute(n))return;const o=M(),l=o.byAttr.get(n);if(x()&&o.byDeclaredAttr&&o.byDeclaredAttr.has(n)&&A(t)){const i=o.byDeclaredAttr.get(n),r=t.getAttribute(n);for(let u=0;u<i.length;u++)F(i[u].spec,r,n,i[u].componentTag,t)}if(window.lnCore._debugSink&&(n.indexOf("data-ln-")===0||l)&&window.lnCore._debugSink("attr",n,t,{oldValue:e.oldValue,newValue:t.getAttribute(n)}),n.indexOf("data-ln-")===0){const i=o.byReactive.get(n);i&&W(i,t,n,e.oldValue),o.reactiveWildcard.length&&W(o.reactiveWildcard,t,n,e.oldValue)}if(l)for(let i=0;i<l.length;i++){const r=l[i];if(r.handler){r.handler(t,n,e.oldValue);continue}r.onAttributeChange&&t[r.attribute]?r.onAttributeChange(t,n):(k(t,r.selector,r.attribute,r.ComponentFn),r.onInit&&r.onInit(t))}}function ie(){window.lnCore=window.lnCore||{},!window.lnCore._attrObserverBound&&(window.lnCore._attrObserverBound=!0,y(function(){new MutationObserver(function(t){for(let n=0;n<t.length;n++)try{re(t[n])}catch(o){console.error("[ln-core] mutation handler failed",t[n].target,o)}}).observe(document.body,{attributes:!0,subtree:!0,attributeOldValue:!0})},"ln-core"))}function N(){return window.lnCore=window.lnCore||{},window.lnCore._lifecycleRegistry=window.lnCore._lifecycleRegistry||[]}function le(e){const t=N();if(t.length){if(e.target)for(let n=0;n<t.length;n++){const o=t[n];if(o.onSubtreeChange){const l=o.query,i=e.target.nodeType===1?e.target.matches(l)?e.target:e.target.closest(l):e.target.parentElement?e.target.parentElement.closest(l):null;i&&o.onSubtreeChange(i,e)}}for(let n=0;n<e.addedNodes.length;n++){const o=e.addedNodes[n];if(o.nodeType===1)for(let l=0;l<t.length;l++){const i=t[l];k(o,i.selector,i.attribute,i.ComponentFn),i.onInit&&i.onInit(o)}}for(let n=0;n<e.removedNodes.length;n++){const o=e.removedNodes[n];if(o.nodeType===1)for(let l=0;l<t.length;l++){const i=t[l],r=i.query,u=Array.from(o.querySelectorAll(r));o.matches&&o.matches(r)&&u.push(o);for(let s=0;s<u.length;s++){const d=u[s];if(!document.contains(d)){const f=d[i.attribute];if(f&&typeof f.destroy=="function")try{f.destroy()}catch(a){console.error("["+i.attribute+"] destroy failed",d,a)}delete d[i.attribute]}}}}}}function se(){window.lnCore=window.lnCore||{},!window.lnCore._lifecycleObserverBound&&(window.lnCore._lifecycleObserverBound=!0,y(function(){new MutationObserver(function(t){for(let n=0;n<t.length;n++){const o=t[n];if(o.type==="childList")try{le(o)}catch(l){console.error("[ln-core] lifecycle handler failed",o.target,l)}}}).observe(document.body,{childList:!0,subtree:!0})},"ln-core"))}function ue(e,t,n,o,l={}){const i=l.extraAttributes||[],r=l.onAttributeChange||null,u=l.onSubtreeChange||null,s=l.onInit||null,d=l.onAttrChange||null,f=l.effects||null,a=l.attributes||null,b=a?Z(a):f,c=a?new Set(Object.keys(a)):null,g=l.persist||null;function h(L){const p=L||document.body;if(k(p,e,t,n),a&&x())for(const C in a){const pe=a[C],T=Array.from(p.querySelectorAll("["+C+"]"));p.matches&&p.matches("["+C+"]")&&T.push(p);for(let E=0;E<T.length;E++){const q=T[E];A(q)&&F(pe,q.getAttribute(C),C,o,q)}}s&&s(p)}const w=[];if(e.indexOf("[")!==-1){const L=/\[([\w-]+)/g;let p;for(;(p=L.exec(e))!==null;)w.push(p[1])}else w.push(e);oe({selector:e,attribute:t,componentTag:o,attributes:a,ComponentFn:n,onInit:s,observed:w.concat(i),onAttributeChange:r,onAttrChange:d,effects:b,declared:c,persist:g}),ie();const O=e.indexOf("[")!==-1||e.indexOf(".")!==-1||e.indexOf("#")!==-1?e:"["+e+"]";N().push({selector:e,attribute:t,ComponentFn:n,onInit:s,onSubtreeChange:u,query:O}),se(),window[t]=h;function V(){te()>0?ne(function(){h(document.body)}):h(document.body)}return document.readyState==="loading"?document.addEventListener("DOMContentLoaded",V):V(),h}function j(e){return(e||"").replace(/^#/,"")}function S(e){const t=e===void 0?location.hash:e,n={},o=j(t);if(!o)return n;const l=o.split("&");for(let i=0;i<l.length;i++){const r=l[i];if(!r)continue;const u=r.indexOf(":"),s=u>-1?r.slice(0,u):r,d=u>-1?r.slice(u+1):"";if(s)try{n[s]=decodeURIComponent(d)}catch{n[s]=d}}return n}function ce(e){if(!e)return null;const t=S();return e in t?t[e]:null}function de(e,t){if(!e)return;const n=S();t==null?delete n[e]:n[e]=String(t);const l=Object.keys(n).map(function(i){const r=n[i];return r===""?i:i+":"+encodeURIComponent(r)}).join("&");j(location.hash)!==l&&(location.hash=l)}function ae(e){return e.button===1||e.ctrlKey||e.metaKey||e.shiftKey?!1:(e.preventDefault(),!0)}function fe(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 o=e.getAttribute("data-ln-sort")||e.getAttribute("data-ln-search-for")||e.getAttribute("data-ln-search")||e.getAttribute("data-ln-filter")||e.id;return o?t?o+"-"+t:o:t||null}function ge(e,t){return!t||t==="none"||e===null||e===void 0?null:String(e)+"."+t}function we(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 be(e,t){return!e||!Array.isArray(t)||t.length===0?null:e+":"+t.map(encodeURIComponent).join(",")}function he(e){if(!e||typeof e!="string")return null;const t=e.indexOf(":");if(t===-1)return null;const n=e.slice(0,t),o=e.slice(t+1),l=o?o.split(",").map(function(i){try{return decodeURIComponent(i)}catch{return i}}).filter(Boolean):[];return{key:n,values:l}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.hashParse=S,window.lnCore.hashGet=ce,window.lnCore.hashSet=de,window.lnCore.hashLinkClick=ae,window.lnCore.resolveHashNamespace=fe,window.lnCore.hashSortEncode=ge,window.lnCore.hashSortDecode=we,window.lnCore.hashFilterEncode=be,window.lnCore.hashFilterDecode=he),(function(){const e="data-ln-toggle",t="lnToggle",n="data-ln-toggle-for",o="data-ln-toggle-action";if(window[t]!==void 0)return;const l={"data-ln-toggle":{effect:b,type:"enum",values:["open","close"],fallback:"close",description:"Visibility state of toggleable element"},"data-ln-toggle-for":{type:"string",description:"Target element ID to toggle on trigger click"},"data-ln-toggle-action":{type:"enum",values:["open","close","toggle"],fallback:"toggle",description:"Action performed on target element when trigger is clicked"}},i=new Set;let r=null;function u(c,g){return g==="open"?"open":g==="close"||c==="open"?"close":"open"}function s(){r||(r=function(c){if(H(c))return;const g=c.target.closest("["+n+"]");if(!g||K(g))return;const h=g.getAttribute(n);if(!h)return;const w=document.getElementById(h);if(!w||!w[t])return;c.preventDefault();const m=g.getAttribute(o)||"toggle",O=w.getAttribute(e);w.setAttribute(e,u(O,m))},document.addEventListener("click",r))}function d(){i.size>0||!r||(document.removeEventListener("click",r),r=null)}function f(c,g){if(!c||!c.id)return;const h=document.querySelectorAll("["+n+'="'+c.id+'"]');for(let w=0;w<h.length;w++)h[w].setAttribute("aria-expanded",g?"true":"false")}function a(c){this.dom=c;const g=this;return this._onRequestOpen=function(){g.open()},this._onRequestClose=function(){g.close()},this._onRequestToggle=function(){g.toggle()},this.dom.addEventListener("ln-toggle:request-open",this._onRequestOpen),this.dom.addEventListener("ln-toggle:request-close",this._onRequestClose),this.dom.addEventListener("ln-toggle:request-toggle",this._onRequestToggle),this.isOpen=c.getAttribute(e)==="open",this.isOpen&&c.classList.add("open"),f(c,this.isOpen),i.add(this),s(),this}a.prototype.open=function(){this.dom.setAttribute(e,"open")},a.prototype.close=function(){this.dom.setAttribute(e,"close")},a.prototype.toggle=function(){const c=this.dom.getAttribute(e);this.dom.setAttribute(e,u(c,"toggle"))},a.prototype.destroy=function(){this.dom[t]&&(this.dom.removeEventListener("ln-toggle:request-open",this._onRequestOpen),this.dom.removeEventListener("ln-toggle:request-close",this._onRequestClose),this.dom.removeEventListener("ln-toggle:request-toggle",this._onRequestToggle),i.delete(this),delete this.dom[t],d())};function b(c){const g=c[t];if(!g)return;const w=c.getAttribute(e)==="open";if(w!==g.isOpen)if(w){if(R(c,"ln-toggle:before-open",{target:c}).defaultPrevented){c.setAttribute(e,"close");return}g.isOpen=!0,c.classList.add("open"),f(c,!0),_(c,"ln-toggle:open",{target:c})}else{if(R(c,"ln-toggle:before-close",{target:c}).defaultPrevented){c.setAttribute(e,"open");return}g.isOpen=!1,c.classList.remove("open"),f(c,!1),_(c,"ln-toggle:close",{target:c})}}ue(e,t,a,"ln-toggle",{attributes:l,persist:{attr:e,hashActive:null}})})()})();

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

@@ -0,0 +1,52 @@
+{
+	"$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-toggle",
+	"generator": "scripts/sync-ln-schemas.mjs",
+	"attributes": {
+		"data-ln-debug": {
+			"direction": null,
+			"sources": [
+				"ln-toggle-dev.scss"
+			]
+		},
+		"data-ln-toggle": {
+			"direction": "both",
+			"sources": [
+				"ln-toggle-dev.scss",
+				"ln-toggle.scss",
+				"src/ln-toggle.js"
+			],
+			"type": "enum",
+			"values": [
+				"open",
+				"close"
+			],
+			"fallback": "close",
+			"description": "Visibility state of toggleable element"
+		},
+		"data-ln-toggle-action": {
+			"direction": "author",
+			"sources": [
+				"src/ln-toggle.js"
+			],
+			"type": "enum",
+			"values": [
+				"open",
+				"close",
+				"toggle"
+			],
+			"fallback": "toggle",
+			"description": "Action performed on target element when trigger is clicked"
+		},
+		"data-ln-toggle-for": {
+			"direction": "author",
+			"sources": [
+				"ln-toggle-dev.scss",
+				"ln-toggle.scss",
+				"src/ln-toggle.js"
+			],
+			"type": "string",
+			"description": "Target element ID to toggle on trigger click"
+		}
+	}
+}

package/components/ln-toggle/ln-toggle.scss

@@ -0,0 +1,37 @@
+// ==========================================================================
+// ln-toggle — Functional Grid Collapse & Chevron Mechanics
+// ==========================================================================
+
+.collapsible {
+	display: grid;
+	grid-template-rows: 0fr;
+	@media (prefers-reduced-motion: no-preference) {
+		transition: grid-template-rows 200ms ease;
+	}
+
+	&.open,
+	&[data-ln-toggle="open"] {
+		grid-template-rows: 1fr;
+	}
+
+	> * {
+		overflow: hidden;
+		min-height: 0;
+	}
+}
+
+.collapsible-body {
+	overflow: hidden;
+	min-height: 0;
+}
+
+[data-ln-toggle-for] .ln-chevron {
+	flex-shrink: 0;
+	@media (prefers-reduced-motion: no-preference) {
+		transition: transform 200ms ease;
+	}
+}
+
+[data-ln-toggle-for][aria-expanded="true"] .ln-chevron {
+	transform: rotate(180deg);
+}