@livenetworks/ashlar 1.5.1 → 1.6.1

package/js/ln-icons/README.md

@@ -1,88 +0,0 @@
-# ln-icons
-
-A zero-dependency, local-first **On-Demand SVG Sprite Generator** that dynamically monitors, fetches, and compiles SVG icons at runtime.
-
-Instead of bundling thousands of heavy vector paths or requiring complex manual build steps, it intercepts standard DOM `<use>` tags, fetches vector definitions from a remote CDN, caches them in `localStorage`, and injects them into a single unified hidden SVG sprite sheet.
-
----
-
-## 🧭 Philosophy & Architecture
-
-1. **Declarative On-Demand Rendering:** Icons are declared directly in HTML. The component monitors the DOM via `MutationObserver` for `<use>` references with `#ln-` and `#lnc-` prefixes. It only fetches and compiles icons that are actively present on the page.
-2. **Dual-Prefix Routing:**
-   - **`#ln-{name}`**: Automatically routes to the [Tabler Icons](https://tabler.io/icons) library fetched from a public CDN. No configuration required.
-   - **`#lnc-{name}`**: Routes to a custom corporate CDN defined via global window settings.
-3. **Local Caching Layer:** Fetched SVG path structures are instantly cached in `localStorage` under `lni:{id}`. Subsequent visits render icons instantly with zero network roundtrips.
-
----
-
-## 📦 Minimal Blueprint
-
-### Native Tabler Icon
-```html
-<svg class="ln-icon" aria-hidden="true">
-  <use href="#ln-home"></use>
-</svg>
-```
-
-### Custom Asset Icon
-Define your custom CDN endpoint before importing the library:
-```html
-<script>
-  window.LN_ICONS_CUSTOM_CDN = "https://cdn.mycompany.com/assets/icons";
-</script>
-<script src="dist/ln-ashlar.iife.js" defer></script>
-
-<!-- Renders icon from your custom CDN -->
-<svg class="ln-icon" aria-hidden="true">
-  <use href="#lnc-corporate-logo"></use>
-</svg>
-```
-
----
-
-## 🛠️ Declarative API Contract
-
-### CSS Utility Classes
-
-Configure icon sizes and alignments using standard CSS classes:
-
-| Class | Size | Description |
-| :--- | :--- | :--- |
-| `ln-icon` | `1.25rem` | Base styles, sets `fill: none`, `stroke: currentColor`, inherits color. |
-| `ln-icon--sm` | `1rem` | Small icon, designed for inline text badges or buttons. |
-| `ln-icon--lg` | `1.5rem` | Large icon, designed for toolbar buttons. |
-| `ln-icon--xl` | `4rem` | Extra-large icon, designed for empty state illustrations. |
-| `ln-chevron` | — | Automatically rotates `90deg` when an ancestor `.is-active` class is toggled. |
-
-### Global Configuration (`window`)
-
-Configure these properties before script initialization:
-
-| Variable | Default | Description |
-| :--- | :--- | :--- |
-| `LN_ICONS_CDN` | `https://cdn.jsdelivr.net/npm/@tabler/icons@3.31.0/icons/outline` | Base CDN URL for Tabler Icons. |
-| `LN_ICONS_CUSTOM_CDN` | `null` | Base CDN URL for custom `#lnc-` prefixed SVG resources. |
-
----
-
-## ⚡ Dynamic Interaction Flow
-
-### Automated Mutation Observability
-The loader observes the DOM continuously. When new content is injected (e.g. by `ln-ajax` or `ln-store`), any new icon `<use>` tag is intercepted, resolved, and rendered.
-
-### Dynamic Attribute Swaps
-Modifying the `href` attribute of a `<use>` element dynamically via JavaScript triggers automatic resolution of the new target icon:
-```javascript
-const useElement = document.querySelector('use');
-// Dynamically fetches and switches the icon to a checkmark
-useElement.setAttribute('href', '#ln-check');
-```
-
----
-
-## ⚠️ Common Pitfalls
-
-- **Forgetting `ln-icon` Class:** Standard SVGs default to `100%` width/height. Failing to include the `ln-icon` class will cause the icon to blow up to full viewport size.
-- **Incorrect Prefix Configuration:** Forgetting to define `window.LN_ICONS_CUSTOM_CDN` when using `#lnc-` will cause the loader to fail silently with undefined endpoint errors.
-- **Omitting `aria-hidden="true"`:** Screen readers attempt to read SVG nodes. Always decorate decorative icons with `aria-hidden="true"`, or include an `aria-label` on their parent button.

package/js/ln-icons/ln-icons.js

@@ -1 +0,0 @@
-(function(){"use strict";(function(){const h="ln-icons-sprite",a="#ln-",o="#lnc-",d=new Set,l=new Set;let c=null;const C=(window.LN_ICONS_CDN||"https://cdn.jsdelivr.net/npm/@tabler/icons@3.31.0/icons/outline").replace(/\/$/,""),g=(window.LN_ICONS_CUSTOM_CDN||"").replace(/\/$/,""),u="lni:",m="lni:v",S="1";function v(){try{if(localStorage.getItem(m)!==S){for(let t=localStorage.length-1;t>=0;t--){const n=localStorage.key(t);n&&n.indexOf(u)===0&&localStorage.removeItem(n)}localStorage.setItem(m,S)}}catch{}}v();function N(){return c||(c=document.getElementById(h),c||(c=document.createElementNS("http://www.w3.org/2000/svg","svg"),c.id=h,c.setAttribute("hidden",""),c.setAttribute("aria-hidden","true"),c.appendChild(document.createElementNS("http://www.w3.org/2000/svg","defs")),document.body.insertBefore(c,document.body.firstChild))),c}function A(t){return t.indexOf(o)===0?g+"/"+t.slice(o.length)+".svg":C+"/"+t.slice(a.length)+".svg"}function w(t,n){const e=n.match(/viewBox="([^"]+)"/),i=e?e[1]:"0 0 24 24",s=n.match(/<svg[^>]*>([\s\S]*?)<\/svg>/i),I=s?s[1].trim():"",y=n.match(/<svg([^>]*)>/i),O=y?y[1]:"",r=document.createElementNS("http://www.w3.org/2000/svg","symbol");r.id=t,r.setAttribute("viewBox",i),["fill","stroke","stroke-width","stroke-linecap","stroke-linejoin"].forEach(function(_){const b=O.match(new RegExp(_+'="([^"]*)"'));b&&r.setAttribute(_,b[1])}),r.innerHTML=I,N().querySelector("defs").appendChild(r)}function f(t){if(d.has(t)||l.has(t)||t.indexOf(o)===0&&!g)return;const n=t.slice(1);try{const e=localStorage.getItem(u+n);if(e){w(n,e),d.add(t);return}}catch{}l.add(t),fetch(A(t)).then(function(e){if(!e.ok)throw new Error(e.status);return e.text()}).then(function(e){w(n,e),d.add(t),l.delete(t);try{localStorage.setItem(u+n,e)}catch{}}).catch(function(){l.delete(t)})}function E(t){const n='use[href^="'+a+'"], use[href^="'+o+'"]',e=t.querySelectorAll?t.querySelectorAll(n):[];if(t.matches&&t.matches(n)){const i=t.getAttribute("href");i&&f(i)}Array.prototype.forEach.call(e,function(i){const s=i.getAttribute("href");s&&f(s)})}function p(){E(document),new MutationObserver(function(t){t.forEach(function(n){if(n.type==="childList")n.addedNodes.forEach(function(e){e.nodeType===1&&E(e)});else if(n.type==="attributes"&&n.attributeName==="href"){const e=n.target.getAttribute("href");e&&(e.indexOf(a)===0||e.indexOf(o)===0)&&f(e)}})}).observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["href"]})}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",p):p()})()})();

package/js/ln-table/ln-table-sort.js

@@ -1 +0,0 @@
-(function(){"use strict";function y(t,e,s){t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:s||{}}))}function f(t,e){if(!document.body){document.addEventListener("DOMContentLoaded",function(){f(t,e)}),console.warn("["+e+'] Script loaded before <body> — add "defer" to your <script> tag');return}t()}const h={};function _(t,e){h[t]=e}function w(t){return h[t]||{ingress:e=>e,egress:e=>e}}typeof window<"u"&&(window.lnCore=window.lnCore||{},window.lnCore.registerDataMapper=_,window.lnCore.getDataMapper=w);const g="ln:";function S(){return location.pathname.replace(/\/+$/,"").toLowerCase()||"/"}function p(t,e){const s=e.getAttribute("data-ln-persist"),l=s!==null&&s!==""?s:e.id;return l?g+t+":"+S()+":"+l:(console.warn('[ln-persist] Element requires id or data-ln-persist="key"',e),null)}function m(t,e){const s=p(t,e);if(!s)return null;try{const l=localStorage.getItem(s);return l!==null?JSON.parse(l):null}catch{return null}}function b(t,e,s){const l=p(t,e);if(l)try{localStorage.setItem(l,JSON.stringify(s))}catch{}}(function(){const t="lnTableSort",e="data-ln-sort",s="data-ln-table-sort";if(window[t]!==void 0)return;function l(o){a(o)}function a(o){const r=Array.from(o.querySelectorAll("table"));o.tagName==="TABLE"&&r.push(o),r.forEach(function(n){if(n[t])return;const c=Array.from(n.querySelectorAll("th["+e+"]"));c.length&&(n[t]=new u(n,c))})}function u(o,r){this.table=o,this.ths=r,this._col=-1,this._dir=null;const n=this;r.forEach(function(i,E){if(i[t+"Bound"])return;i[t+"Bound"]=!0;const d=i.querySelector("["+s+"]");d&&(d._lnSortClick=function(){n._handleClick(E,i)},d.addEventListener("click",d._lnSortClick))});const c=o.closest("[data-ln-table][data-ln-persist]");if(c){const i=m("table-sort",c);i&&i.dir&&i.col>=0&&i.col<r.length&&(this._handleClick(i.col,r[i.col]),i.dir==="desc"&&this._handleClick(i.col,r[i.col]))}return this}u.prototype._handleClick=function(o,r){let n;this._col!==o?n="asc":this._dir==="asc"?n="desc":this._dir==="desc"?n=null:n="asc",this.ths.forEach(function(i){i.classList.remove("ln-sort-asc","ln-sort-desc")}),n===null?(this._col=-1,this._dir=null):(this._col=o,this._dir=n,r.classList.add(n==="asc"?"ln-sort-asc":"ln-sort-desc")),y(this.table,"ln-table:sort",{column:o,sortType:r.getAttribute(e),direction:n});const c=this.table.closest("[data-ln-table][data-ln-persist]");c&&(n===null?b("table-sort",c,null):b("table-sort",c,{col:o,dir:n}))},u.prototype.destroy=function(){this.table[t]&&(this.ths.forEach(function(o){const r=o.querySelector("["+s+"]");r&&r._lnSortClick&&(r.removeEventListener("click",r._lnSortClick),delete r._lnSortClick),delete o[t+"Bound"]}),delete this.table[t])};function C(){f(function(){new MutationObserver(function(r){r.forEach(function(n){n.type==="childList"?n.addedNodes.forEach(function(c){c.nodeType===1&&a(c)}):n.type==="attributes"&&a(n.target)})}).observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[e]})},"ln-table-sort")}window[t]=l,C(),document.readyState==="loading"?document.addEventListener("DOMContentLoaded",function(){l(document.body)}):l(document.body)})()})();

package/js/ln-table/src/ln-table-sort.js

@@ -1,156 +0,0 @@
-import { guardBody, dispatch } from '../../ln-core';
-import { persistGet, persistSet } from '../../ln-core';
-
-(function () {
-	const DOM_ATTRIBUTE = 'lnTableSort';
-	const SORT_ATTR = 'data-ln-sort';
-	const BUTTON_HOOK = 'data-ln-table-sort';
-
-	if (window[DOM_ATTRIBUTE] !== undefined) return;
-
-	// ─── Constructor ───────────────────────────────────────────
-	// Auto-initializes any <table> that contains th[data-ln-sort] headers.
-
-	function constructor(domRoot) {
-		findElements(domRoot);
-	}
-
-	// Local findElements — intentional divergence from ln-core helper: tag selector ('table') + two-arg constructor (table, ths).
-	function findElements(root) {
-		const tables = Array.from(root.querySelectorAll('table'));
-		if (root.tagName === 'TABLE') tables.push(root);
-
-		tables.forEach(function (table) {
-			if (table[DOM_ATTRIBUTE]) return;
-			const ths = Array.from(table.querySelectorAll('th[' + SORT_ATTR + ']'));
-			if (ths.length) table[DOM_ATTRIBUTE] = new _component(table, ths);
-		});
-	}
-
-	// ─── Component ─────────────────────────────────────────────
-
-	function _component(table, ths) {
-		this.table = table;
-		this.ths = ths;
-		this._col = -1;
-		this._dir = null;
-		const self = this;
-
-		ths.forEach(function (th, index) {
-			if (th[DOM_ATTRIBUTE + 'Bound']) return;
-			th[DOM_ATTRIBUTE + 'Bound'] = true;
-
-			// D1/Option A: bind click to the sort button, not the whole <th>.
-			// Columns without a [data-ln-table-sort] button skip binding.
-			const btn = th.querySelector('[' + BUTTON_HOOK + ']');
-			if (!btn) return;
-
-			btn._lnSortClick = function () {
-				self._handleClick(index, th);
-			};
-			btn.addEventListener('click', btn._lnSortClick);
-		});
-
-		// ─── Restore persisted sort ───────────────────────────────
-		const persistRoot = table.closest('[data-ln-table][data-ln-persist]');
-		if (persistRoot) {
-			const saved = persistGet('table-sort', persistRoot);
-			if (saved && saved.dir && saved.col >= 0 && saved.col < ths.length) {
-				// Programmatically trigger the saved sort
-				this._handleClick(saved.col, ths[saved.col]);
-				if (saved.dir === 'desc') {
-					this._handleClick(saved.col, ths[saved.col]);
-				}
-			}
-		}
-
-		return this;
-	}
-
-	_component.prototype._handleClick = function (colIndex, th) {
-		let newDir;
-
-		if (this._col !== colIndex) {
-			newDir = 'asc';
-		} else if (this._dir === 'asc') {
-			newDir = 'desc';
-		} else if (this._dir === 'desc') {
-			newDir = null;
-		} else {
-			newDir = 'asc';
-		}
-
-		// JS-2: use state classes on <th>; CSS owns icon visibility.
-		this.ths.forEach(function (t) {
-			t.classList.remove('ln-sort-asc', 'ln-sort-desc');
-		});
-
-		if (newDir === null) {
-			this._col = -1;
-			this._dir = null;
-		} else {
-			this._col = colIndex;
-			this._dir = newDir;
-			th.classList.add(newDir === 'asc' ? 'ln-sort-asc' : 'ln-sort-desc');
-		}
-
-		dispatch(this.table, 'ln-table:sort', {
-			column: colIndex,
-			sortType: th.getAttribute(SORT_ATTR),
-			direction: newDir
-		});
-		const persistRoot = this.table.closest('[data-ln-table][data-ln-persist]');
-		if (persistRoot) {
-			if (newDir === null) {
-				persistSet('table-sort', persistRoot, null);
-			} else {
-				persistSet('table-sort', persistRoot, { col: colIndex, dir: newDir });
-			}
-		}
-	};
-
-	_component.prototype.destroy = function () {
-		if (!this.table[DOM_ATTRIBUTE]) return;
-		this.ths.forEach(function (th) {
-			const btn = th.querySelector('[' + BUTTON_HOOK + ']');
-			if (btn && btn._lnSortClick) {
-				btn.removeEventListener('click', btn._lnSortClick);
-				delete btn._lnSortClick;
-			}
-			delete th[DOM_ATTRIBUTE + 'Bound'];
-		});
-		delete this.table[DOM_ATTRIBUTE];
-	};
-
-	// ─── DOM Observer ──────────────────────────────────────────
-
-	function _domObserver() {
-		guardBody(function () {
-			const observer = new MutationObserver(function (mutations) {
-				mutations.forEach(function (mutation) {
-					if (mutation.type === 'childList') {
-						mutation.addedNodes.forEach(function (node) {
-							if (node.nodeType === 1) findElements(node);
-						});
-					} else if (mutation.type === 'attributes') {
-						findElements(mutation.target);
-					}
-				});
-			});
-			observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: [SORT_ATTR] });
-		}, 'ln-table-sort');
-	}
-
-	// ─── Init ──────────────────────────────────────────────────
-
-	window[DOM_ATTRIBUTE] = constructor;
-	_domObserver();
-
-	if (document.readyState === 'loading') {
-		document.addEventListener('DOMContentLoaded', function () {
-			constructor(document.body);
-		});
-	} else {
-		constructor(document.body);
-	}
-})();