@ahriknow/lux 0.0.1

package/dist/components/lux-scroll/index.min.js

@@ -0,0 +1,137 @@
+const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function s(t){return t&&void 0!==t._$luxType$}const r=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function o(e,r,o){if(r!==t&&null!=r)if(function(t){return t&&"repeat"===t._type}(r))!function(t,e){const{items:r,keyFn:o,renderFn:i}=e,n=t._repeatState;if(n)for(const t of n.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const c=document.createDocumentFragment(),a=[];for(const t of r){const e=o(t),r=i(t),n=document.createElement("span");n.style.display="contents",s(r)?l(r,n):null!=r&&!1!==r&&n.appendChild(document.createTextNode(String(r))),c.appendChild(n),a.push({key:e,result:r,span:n})}t.appendChild(c),t._repeatState={entries:a}}(e,r);else if(s(r))l(r,e);else if(Array.isArray(r)){i(e);for(const t of r)if(s(t)){const s=document.createElement("span");s.style.display="contents",l(t,s),e.appendChild(s)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(r instanceof Node)return i(e),void e.appendChild(r);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(r):(i(e),e.appendChild(document.createTextNode(String(r))))}else i(e)}function i(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function n(e,s){const{element:r,name:o,prefix:i}=e;switch(i){case"@":{const i=e.committedValue,n=null==s||s===t,l=n&&null!=i||s?.capture!==i?.capture||s?.once!==i?.once||s?.passive!==i?.passive,c=!n&&(null==i||l);if(l&&r.removeEventListener(o,e._handler||i,i),c)if("function"==typeof s){const t=e._host||(e._host={handleEvent(t){const s=e.committedValue;if("function"==typeof s){const e=r.getRootNode().host||r;s.call(e,t)}}});e._handler=t,r.addEventListener(o,t)}else if("object"==typeof s&&s?.handleEvent){const t={handleEvent:t=>s.handleEvent.call(s,t)};e._handler=t,r.addEventListener(o,t,{capture:s.capture,once:s.once,passive:s.passive})}e.committedValue=s;break}case".":r[o]=s===t?void 0:s;break;case"?":r.toggleAttribute(o,!!s);break;case"ref":"function"==typeof s&&s(r);break;case"class":if("string"==typeof s)r.className=s;else if("object"==typeof s&&null!=s){const t=r.className||"",e=t?t.split(/\s+/):[];for(const[t,r]of Object.entries(s))if(r)e.includes(t)||e.push(t);else{const s=e.indexOf(t);-1!==s&&e.splice(s,1)}r.className=e.filter(Boolean).join(" ")}break;default:null==s||!1===s?r.removeAttribute(o):r.setAttribute(o,!0===s?"":String(s))}}function l(t,e,i){if(!s(t))return void(e.textContent=t??"");const{strings:l,values:c}=t;if(e._luxActiveParts&&e._luxStrings===l){for(const t of e._luxActiveParts)t.index<c.length&&("child"===t.type?o(t.span,c[t.index]):n(t,c[t.index]));return}const a=document.createElement("template"),h=function(t){const e=[];let s="";for(let o=0;o<t.length;o++)if(s+=t[o],o<t.length-1){const t=s.match(r);if(t){const r=t[1],i=!!t[2],n=!!t[3];let l="",c="";r?(l=r[0],c=r.slice(1)):i?(l="ref",c="ref"):n&&(l="class",c="class");const a=`lux-attr-${o}`;s=s.slice(0,-t[0].length)+`${a}="${c}" `,e.push({type:"attr",name:c,prefix:l,marker:a,index:o})}else{const t=`lux-${o}`;s+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:o})}}return{html:s,parts:e}}(l);a.innerHTML=h.html;const d=a.content.cloneNode(!0),u=[];for(const t of h.parts)if("child"===t.type){const e=document.createTreeWalker(d,NodeFilter.SHOW_COMMENT);let s;for(;s=e.nextNode();)if(s.data===t.marker){const e=document.createElement("span");e.style.display="contents",s.parentNode.replaceChild(e,s),o(e,c[t.index]),u.push({type:"child",span:e,index:t.index});break}}else{const e=d.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const s={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};n(s,c[t.index]),u.push(s)}}e.textContent="",e.appendChild(d),e._luxActiveParts=u,e._luxStrings=l}const c=new Set;let a=!1;function h(t){var e;c.add(t),a||(a=!0,e=()=>{a=!1;const t=[...c];c.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const d={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class u extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of e)this.createProperty(s,t[s])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const s=this.__attributeNameForProperty(t,e);void 0!==s&&this.__attributeToPropertyMap.set(s,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const s=e.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const s=Symbol(),r=this.getPropertyDescriptor(t,s,e);void 0!==r&&Object.defineProperty(this.prototype,t,r)}}static getPropertyDescriptor(t,e,s){const{type:r,reflect:o,converter:i}=s;return{get(){return this[e]},set(r){const o=this[e];this[e]=r,this.requestUpdate(t,o,s)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,s]of t)if(!s.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,s]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(s);if(e){const r=e.converter?.fromAttribute??d.fromAttribute;this[s]=r(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,s){const r=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==r&&this.__reflectingProperty!==r){const t=this.constructor.elementProperties.get(r);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:d;this.__reflectingProperty=r;const o=e.fromAttribute(s,t.type);this[r]=o,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],r=[];for(const t of e)"string"==typeof t?r.push(t):s(t)&&r.push(t.strings.join(""));if(0!==r.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(r.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=r.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,s){if(void 0!==t){if(!(s?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,h(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const s=this[t],r=e.converter?.toAttribute??d.toAttribute,o=this.constructor.__attributeNameForProperty(t,e);if(void 0!==o){this.__reflectingProperty=t;const i=r(s,e.type);null==i?this.removeAttribute(o):this.setAttribute(o,String(i)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&l(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,s){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,s={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...s}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}const p=(function(t,...e){return{_$luxType$:3,strings:t,values:e}})`
+    :host {
+        display: block;
+        position: relative;
+        width: var(--scroll-w, 100%);
+        height: var(--scroll-h, 100%);
+    }
+
+    .scroll-container {
+        width: 100%;
+        height: 100%;
+        overflow-y: auto;
+        overflow-x: hidden;
+        position: relative;
+        scrollbar-width: none;
+        -ms-overflow-style: none;
+    }
+
+    .scroll-container::-webkit-scrollbar {
+        display: none;
+    }
+
+    /* ── Custom Track ── */
+    .scroll-track {
+        position: absolute;
+        top: 4px;
+        right: 4px;
+        width: 6px;
+        height: calc(100% - 8px);
+        background: rgb(var(--lux-border, 226 232 240) / 0.2);
+        border-radius: 3px;
+        z-index: 10;
+        opacity: 0;
+        transition: opacity 0.2s ease;
+    }
+
+    :host(:hover) .scroll-track,
+    .scroll-container:hover + .scroll-track,
+    .scroll-track.visible {
+        opacity: 1;
+    }
+
+    /* ── Custom Thumb ── */
+    .scroll-thumb {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        border-radius: 3px;
+        background: rgb(var(--lux-scrollbar, 180 196 214));
+        cursor: grab;
+        transition:
+            background 0.15s ease,
+            height 0.15s ease;
+        min-height: 20px;
+    }
+
+    .scroll-thumb:hover,
+    .scroll-thumb.dragging {
+        background: rgb(var(--lux-primary-400, 129 120 247));
+    }
+
+    .scroll-thumb.dragging {
+        cursor: grabbing;
+    }
+
+    /* ── Scroll Buttons ─── */
+    .scroll-buttons {
+        position: absolute;
+        top: 8px;
+        right: 8px;
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+        z-index: 11;
+        opacity: 0;
+        transition: opacity 0.2s ease;
+    }
+
+    :host(:hover) .scroll-buttons,
+    .scroll-buttons.visible {
+        opacity: 1;
+    }
+
+    .scroll-btn {
+        width: 28px;
+        height: 28px;
+        border-radius: 50%;
+        border: 1px solid rgb(var(--lux-border, 51 65 85));
+        background: rgb(var(--lux-card, 30 41 59));
+        color: rgb(var(--lux-text-secondary, 148 163 184));
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 12px;
+        transition: all 0.15s ease;
+        padding: 0;
+    }
+
+    .scroll-btn:hover {
+        background: rgb(var(--lux-primary-400, 129 120 247));
+        color: #fff;
+        border-color: rgb(var(--lux-primary-400, 129 120 247));
+    }
+
+    .scroll-btn:disabled {
+        opacity: 0.3;
+        pointer-events: none;
+    }
+
+    /* ── Disabled (show native) ── */
+    :host([disabled]) .scroll-track,
+    :host([disabled]) .scroll-buttons {
+        display: none;
+    }
+    :host([disabled]) .scroll-container {
+        scrollbar-width: auto;
+        -ms-overflow-style: auto;
+    }
+    :host([disabled]) .scroll-container::-webkit-scrollbar {
+        display: block;
+    }
+`;class f extends u{static styles=p;static properties={height:{type:String,attribute:"height",reflect:!0},width:{type:String,attribute:"width",reflect:!0},showButtons:{type:Boolean,attribute:"show-buttons",reflect:!0},disabled:{type:Boolean,attribute:"disabled",reflect:!0}};constructor(){super(),this.height="100%",this.width="100%",this.showButtons=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),this.style.height=this.height,this.style.width=this.width}firstUpdated(){this._setupScroll()}updated(){this.style.height=this.height,this.style.width=this.width,requestAnimationFrame(()=>this._syncThumb())}disconnectedCallback(){super.disconnectedCallback(),this._teardownScroll()}_setupScroll(){const t=this.renderRoot.querySelector(".scroll-container"),e=this.renderRoot.querySelector(".scroll-thumb"),s=this.renderRoot.querySelector(".scroll-track");t&&e&&s&&(this._container=t,this._thumb=e,this._track=s,this._onScroll=()=>this._syncThumb(),t.addEventListener("scroll",this._onScroll,{passive:!0}),this._onThumbDown=t=>this._startDrag(t),e.addEventListener("mousedown",this._onThumbDown),this._onTrackClickBound=t=>this._onTrackClick(t),s.addEventListener("click",this._onTrackClickBound),this._onMouseEnter=()=>{s.classList.add("visible"),this._showButtons(!0)},this._onMouseLeave=()=>{s.classList.remove("visible"),this._showButtons(!1)},this.addEventListener("mouseenter",this._onMouseEnter),this.addEventListener("mouseleave",this._onMouseLeave),requestAnimationFrame(()=>this._syncThumb()))}_teardownScroll(){this._container&&this._container.removeEventListener("scroll",this._onScroll),this._thumb&&this._thumb.removeEventListener("mousedown",this._onThumbDown),this._track&&this._track.removeEventListener("click",this._onTrackClickBound),this.removeEventListener("mouseenter",this._onMouseEnter),this.removeEventListener("mouseleave",this._onMouseLeave)}_syncThumb(){const t=this._container,e=this._thumb,s=this._track;if(!t||!e||!s)return;const r=t.scrollHeight,o=t.clientHeight,i=s.offsetHeight||o-8;if(r<=o)return e.style.height="0px",void(e.style.opacity="0");const n=o/r,l=Math.max(20,i*n),c=i-l,a=t.scrollTop,h=r-o,d=h>0?a/h*c:0;e.style.height=l+"px",e.style.top=d+"px",e.style.opacity="1"}_startDrag(t){t.preventDefault();const e=this._container,s=this._thumb;if(!e||!s)return;const r=t.clientY,o=e.scrollTop,i=e.scrollHeight,n=e.clientHeight,l=s.offsetHeight,c=i-n,a=n-l,h=c>a?c/a:1;s.classList.add("dragging");const d=t=>{const s=t.clientY-r,i=o+s*h;e.scrollTop=Math.max(0,Math.min(c,i))},u=()=>{s.classList.remove("dragging"),document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",u)};document.addEventListener("mousemove",d),document.addEventListener("mouseup",u)}_onTrackClick(t){const e=this._container;if(!e)return;const s=this._track.getBoundingClientRect(),r=(t.clientY-s.top)/s.height,o=e.scrollHeight-e.clientHeight;e.scrollTop=r*o}_showButtons(t){if(!this.showButtons)return;const e=this.renderRoot.querySelector(".scroll-buttons");e&&e.classList.toggle("visible",t)}scrollToTop(){this._container?.scrollTo({top:0,behavior:"smooth"})}scrollToBottom(){const t=this._container;t&&t.scrollTo({top:t.scrollHeight,behavior:"smooth"})}render(){return e`
+            <div class="scroll-container">
+                <slot></slot>
+            </div>
+            <div class="scroll-track">
+                <div class="scroll-thumb"></div>
+            </div>
+            ${this.showButtons?e`
+                    <div class="scroll-buttons">
+                        <button class="scroll-btn" @click=${()=>this.scrollToTop()}>▲</button>
+                        <button class="scroll-btn" @click=${()=>this.scrollToBottom()}>▼</button>
+                    </div>
+                `:""}
+        `}}!function(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}("lux-scroll",f);export{f as default};

package/dist/components/lux-switch/index.iife.min.js

@@ -0,0 +1,116 @@
+var LuxSwitch=function(){"use strict";const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function r(t){return t&&void 0!==t._$luxType$}const s=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function o(e,s,o){if(s!==t&&null!=s)if(function(t){return t&&"repeat"===t._type}(s))!function(t,e){const{items:s,keyFn:o,renderFn:n}=e,i=t._repeatState;if(i)for(const t of i.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const c=document.createDocumentFragment(),l=[];for(const t of s){const e=o(t),s=n(t),i=document.createElement("span");i.style.display="contents",r(s)?a(s,i):null!=s&&!1!==s&&i.appendChild(document.createTextNode(String(s))),c.appendChild(i),l.push({key:e,result:s,span:i})}t.appendChild(c),t._repeatState={entries:l}}(e,s);else if(r(s))a(s,e);else if(Array.isArray(s)){n(e);for(const t of s)if(r(t)){const r=document.createElement("span");r.style.display="contents",a(t,r),e.appendChild(r)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(s instanceof Node)return n(e),void e.appendChild(s);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(s):(n(e),e.appendChild(document.createTextNode(String(s))))}else n(e)}function n(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function i(e,r){const{element:s,name:o,prefix:n}=e;switch(n){case"@":{const n=e.committedValue,i=null==r||r===t,a=i&&null!=n||r?.capture!==n?.capture||r?.once!==n?.once||r?.passive!==n?.passive,c=!i&&(null==n||a);if(a&&s.removeEventListener(o,e._handler||n,n),c)if("function"==typeof r){const t=e._host||(e._host={handleEvent(t){const r=e.committedValue;if("function"==typeof r){const e=s.getRootNode().host||s;r.call(e,t)}}});e._handler=t,s.addEventListener(o,t)}else if("object"==typeof r&&r?.handleEvent){const t={handleEvent:t=>r.handleEvent.call(r,t)};e._handler=t,s.addEventListener(o,t,{capture:r.capture,once:r.once,passive:r.passive})}e.committedValue=r;break}case".":s[o]=r===t?void 0:r;break;case"?":s.toggleAttribute(o,!!r);break;case"ref":"function"==typeof r&&r(s);break;case"class":if("string"==typeof r)s.className=r;else if("object"==typeof r&&null!=r){const t=s.className||"",e=t?t.split(/\s+/):[];for(const[t,s]of Object.entries(r))if(s)e.includes(t)||e.push(t);else{const r=e.indexOf(t);-1!==r&&e.splice(r,1)}s.className=e.filter(Boolean).join(" ")}break;default:null==r||!1===r?s.removeAttribute(o):s.setAttribute(o,!0===r?"":String(r))}}function a(t,e,n){if(!r(t))return void(e.textContent=t??"");const{strings:a,values:c}=t;if(e._luxActiveParts&&e._luxStrings===a){for(const t of e._luxActiveParts)t.index<c.length&&("child"===t.type?o(t.span,c[t.index]):i(t,c[t.index]));return}const l=document.createElement("template"),h=function(t){const e=[];let r="";for(let o=0;o<t.length;o++)if(r+=t[o],o<t.length-1){const t=r.match(s);if(t){const s=t[1],n=!!t[2],i=!!t[3];let a="",c="";s?(a=s[0],c=s.slice(1)):n?(a="ref",c="ref"):i&&(a="class",c="class");const l=`lux-attr-${o}`;r=r.slice(0,-t[0].length)+`${l}="${c}" `,e.push({type:"attr",name:c,prefix:a,marker:l,index:o})}else{const t=`lux-${o}`;r+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:o})}}return{html:r,parts:e}}(a);l.innerHTML=h.html;const d=l.content.cloneNode(!0),p=[];for(const t of h.parts)if("child"===t.type){const e=document.createTreeWalker(d,NodeFilter.SHOW_COMMENT);let r;for(;r=e.nextNode();)if(r.data===t.marker){const e=document.createElement("span");e.style.display="contents",r.parentNode.replaceChild(e,r),o(e,c[t.index]),p.push({type:"child",span:e,index:t.index});break}}else{const e=d.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const r={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};i(r,c[t.index]),p.push(r)}}e.textContent="",e.appendChild(d),e._luxActiveParts=p,e._luxStrings=a}const c=new Set;let l=!1;function h(t){var e;c.add(t),l||(l=!0,e=()=>{l=!1;const t=[...c];c.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const d={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class p extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const r of e)this.createProperty(r,t[r])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const r=this.__attributeNameForProperty(t,e);void 0!==r&&this.__attributeToPropertyMap.set(r,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const r=e.attribute;return!1===r?void 0:"string"==typeof r?r:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const r=Symbol(),s=this.getPropertyDescriptor(t,r,e);void 0!==s&&Object.defineProperty(this.prototype,t,s)}}static getPropertyDescriptor(t,e,r){const{type:s,reflect:o,converter:n}=r;return{get(){return this[e]},set(s){const o=this[e];this[e]=s,this.requestUpdate(t,o,r)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,r]of t)if(!r.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,r]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(r);if(e){const s=e.converter?.fromAttribute??d.fromAttribute;this[r]=s(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,r){const s=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==s&&this.__reflectingProperty!==s){const t=this.constructor.elementProperties.get(s);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:d;this.__reflectingProperty=s;const o=e.fromAttribute(r,t.type);this[s]=o,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],s=[];for(const t of e)"string"==typeof t?s.push(t):r(t)&&s.push(t.strings.join(""));if(0!==s.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(s.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=s.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,r){if(void 0!==t){if(!(r?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,h(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const r=this[t],s=e.converter?.toAttribute??d.toAttribute,o=this.constructor.__attributeNameForProperty(t,e);if(void 0!==o){this.__reflectingProperty=t;const n=s(r,e.type);null==n?this.removeAttribute(o):this.setAttribute(o,String(n)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&a(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,r){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,r={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...r}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}const u=(function(t,...e){return{_$luxType$:3,strings:t,values:e}})`
+    :host {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        cursor: pointer;
+        vertical-align: middle;
+        user-select: none;
+        -webkit-tap-highlight-color: transparent;
+    }
+
+    :host([disabled]) {
+        opacity: 0.5;
+        pointer-events: none;
+    }
+
+    :host([loading]) {
+        pointer-events: none;
+    }
+
+    .track {
+        position: relative;
+        width: var(--sw-w, 40px);
+        height: var(--sw-h, 22px);
+        background: var(--sw-off-bg, rgb(var(--lux-border, 51 65 85)));
+        border: none;
+        padding: 0;
+        cursor: pointer;
+        transition: background var(--lux-transition, 150ms ease);
+        flex-shrink: 0;
+    }
+
+    :host([checked]) .track {
+        background: var(--sw-on-bg, rgb(var(--lux-primary-500, 99 91 218)));
+    }
+
+    .thumb {
+        position: absolute;
+        top: calc((var(--sw-h, 22px) - var(--sw-thumb, 18px)) / 2);
+        left: calc((var(--sw-h, 22px) - var(--sw-thumb, 18px)) / 2);
+        width: var(--sw-thumb, 18px);
+        height: var(--sw-thumb, 18px);
+        background: var(--sw-thumb-bg, rgb(var(--lux-bg, 255 255 255)));
+        border-radius: inherit;
+        transition: transform var(--lux-transition, 150ms ease);
+        box-shadow: 0 1px 3px rgb(0 0 0 / 20%);
+    }
+
+    :host([checked]) .thumb {
+        transform: translateX(calc(var(--sw-w, 40px) - var(--sw-h, 22px)));
+    }
+
+    .content {
+        font-size: var(--sw-font, 14px);
+        color: var(--sw-off-color, rgb(var(--lux-text, 241 245 249)));
+        transition: color var(--lux-transition, 150ms ease);
+    }
+
+    :host([checked]) .content {
+        color: var(--sw-on-color, rgb(var(--lux-text, 241 245 249)));
+    }
+
+    /* ── Size: sm ── */
+    :host([size='sm']) .track {
+        --sw-w: 32px;
+        --sw-h: 18px;
+        --sw-thumb: 14px;
+        --sw-font: 12px;
+    }
+
+    /* ── Size: md (default) ── */
+    /* uses CSS variables above */
+
+    /* ── Size: lg ── */
+    :host([size='lg']) .track {
+        --sw-w: 52px;
+        --sw-h: 28px;
+        --sw-thumb: 22px;
+        --sw-font: 16px;
+    }
+
+    /* ── Shape: square ── */
+    :host([shape='square']) .track,
+    :host([shape='square']) .thumb {
+        border-radius: 4px;
+    }
+
+    /* ── Shape: round (default) ── */
+    .track {
+        border-radius: 9999px;
+    }
+    .thumb {
+        border-radius: 9999px;
+    }
+
+    /* ── Loading ── */
+    :host([loading]) .thumb::after {
+        content: '';
+        position: absolute;
+        inset: 1px;
+        border: 2px solid rgb(var(--lux-border, 51 65 85) / 0.2);
+        border-top-color: rgb(var(--lux-text, 241 245 249));
+        border-radius: 50%;
+        animation: sw-spin 0.8s linear infinite;
+    }
+    @keyframes sw-spin {
+        to {
+            transform: rotate(360deg);
+        }
+    }
+`;class f extends p{static styles=u;static properties={checked:{type:Boolean,reflect:!0},disabled:{type:Boolean,reflect:!0},loading:{type:Boolean,reflect:!0},size:{type:String,reflect:!0},shape:{type:String,reflect:!0},checkedOnBg:{type:String,attribute:"checked-on-bg",reflect:!0},checkedOnColor:{type:String,attribute:"checked-on-color",reflect:!0},checkedOffBg:{type:String,attribute:"checked-off-bg",reflect:!0},checkedOffColor:{type:String,attribute:"checked-off-color",reflect:!0},toggle:{type:Function,attribute:!1}};constructor(){super(),this.checked=!1,this.disabled=!1,this.loading=!1,this.size="md",this.shape="round"}updated(){const t=this.style;this.checkedOnBg&&t.setProperty("--sw-on-bg",this.checkedOnBg),this.checkedOnColor&&t.setProperty("--sw-on-color",this.checkedOnColor),this.checkedOffBg&&t.setProperty("--sw-off-bg",this.checkedOffBg),this.checkedOffColor&&t.setProperty("--sw-off-color",this.checkedOffColor)}async _toggle(){if(!this.disabled&&!this.loading){if("function"==typeof this.toggle){this.loading=!0;try{!0===await this.toggle()&&(this.checked=!this.checked)}catch{}finally{this.loading=!1}}else this.checked=!this.checked;this.emit("change",{checked:this.checked})}}render(){return e`
+            <div class="track" @click=${()=>this._toggle()}>
+                <div class="thumb"></div>
+            </div>
+            <div class="content"><slot></slot></div>
+        `}}return function(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}("lux-switch",f),f}();

package/dist/components/lux-switch/index.min.js

@@ -0,0 +1,116 @@
+const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function r(t){return t&&void 0!==t._$luxType$}const s=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function o(e,s,o){if(s!==t&&null!=s)if(function(t){return t&&"repeat"===t._type}(s))!function(t,e){const{items:s,keyFn:o,renderFn:n}=e,i=t._repeatState;if(i)for(const t of i.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const c=document.createDocumentFragment(),l=[];for(const t of s){const e=o(t),s=n(t),i=document.createElement("span");i.style.display="contents",r(s)?a(s,i):null!=s&&!1!==s&&i.appendChild(document.createTextNode(String(s))),c.appendChild(i),l.push({key:e,result:s,span:i})}t.appendChild(c),t._repeatState={entries:l}}(e,s);else if(r(s))a(s,e);else if(Array.isArray(s)){n(e);for(const t of s)if(r(t)){const r=document.createElement("span");r.style.display="contents",a(t,r),e.appendChild(r)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(s instanceof Node)return n(e),void e.appendChild(s);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(s):(n(e),e.appendChild(document.createTextNode(String(s))))}else n(e)}function n(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function i(e,r){const{element:s,name:o,prefix:n}=e;switch(n){case"@":{const n=e.committedValue,i=null==r||r===t,a=i&&null!=n||r?.capture!==n?.capture||r?.once!==n?.once||r?.passive!==n?.passive,c=!i&&(null==n||a);if(a&&s.removeEventListener(o,e._handler||n,n),c)if("function"==typeof r){const t=e._host||(e._host={handleEvent(t){const r=e.committedValue;if("function"==typeof r){const e=s.getRootNode().host||s;r.call(e,t)}}});e._handler=t,s.addEventListener(o,t)}else if("object"==typeof r&&r?.handleEvent){const t={handleEvent:t=>r.handleEvent.call(r,t)};e._handler=t,s.addEventListener(o,t,{capture:r.capture,once:r.once,passive:r.passive})}e.committedValue=r;break}case".":s[o]=r===t?void 0:r;break;case"?":s.toggleAttribute(o,!!r);break;case"ref":"function"==typeof r&&r(s);break;case"class":if("string"==typeof r)s.className=r;else if("object"==typeof r&&null!=r){const t=s.className||"",e=t?t.split(/\s+/):[];for(const[t,s]of Object.entries(r))if(s)e.includes(t)||e.push(t);else{const r=e.indexOf(t);-1!==r&&e.splice(r,1)}s.className=e.filter(Boolean).join(" ")}break;default:null==r||!1===r?s.removeAttribute(o):s.setAttribute(o,!0===r?"":String(r))}}function a(t,e,n){if(!r(t))return void(e.textContent=t??"");const{strings:a,values:c}=t;if(e._luxActiveParts&&e._luxStrings===a){for(const t of e._luxActiveParts)t.index<c.length&&("child"===t.type?o(t.span,c[t.index]):i(t,c[t.index]));return}const l=document.createElement("template"),d=function(t){const e=[];let r="";for(let o=0;o<t.length;o++)if(r+=t[o],o<t.length-1){const t=r.match(s);if(t){const s=t[1],n=!!t[2],i=!!t[3];let a="",c="";s?(a=s[0],c=s.slice(1)):n?(a="ref",c="ref"):i&&(a="class",c="class");const l=`lux-attr-${o}`;r=r.slice(0,-t[0].length)+`${l}="${c}" `,e.push({type:"attr",name:c,prefix:a,marker:l,index:o})}else{const t=`lux-${o}`;r+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:o})}}return{html:r,parts:e}}(a);l.innerHTML=d.html;const h=l.content.cloneNode(!0),p=[];for(const t of d.parts)if("child"===t.type){const e=document.createTreeWalker(h,NodeFilter.SHOW_COMMENT);let r;for(;r=e.nextNode();)if(r.data===t.marker){const e=document.createElement("span");e.style.display="contents",r.parentNode.replaceChild(e,r),o(e,c[t.index]),p.push({type:"child",span:e,index:t.index});break}}else{const e=h.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const r={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};i(r,c[t.index]),p.push(r)}}e.textContent="",e.appendChild(h),e._luxActiveParts=p,e._luxStrings=a}const c=new Set;let l=!1;function d(t){var e;c.add(t),l||(l=!0,e=()=>{l=!1;const t=[...c];c.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const h={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class p extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const r of e)this.createProperty(r,t[r])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const r=this.__attributeNameForProperty(t,e);void 0!==r&&this.__attributeToPropertyMap.set(r,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const r=e.attribute;return!1===r?void 0:"string"==typeof r?r:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const r=Symbol(),s=this.getPropertyDescriptor(t,r,e);void 0!==s&&Object.defineProperty(this.prototype,t,s)}}static getPropertyDescriptor(t,e,r){const{type:s,reflect:o,converter:n}=r;return{get(){return this[e]},set(s){const o=this[e];this[e]=s,this.requestUpdate(t,o,r)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,r]of t)if(!r.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,r]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(r);if(e){const s=e.converter?.fromAttribute??h.fromAttribute;this[r]=s(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,r){const s=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==s&&this.__reflectingProperty!==s){const t=this.constructor.elementProperties.get(s);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:h;this.__reflectingProperty=s;const o=e.fromAttribute(r,t.type);this[s]=o,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],s=[];for(const t of e)"string"==typeof t?s.push(t):r(t)&&s.push(t.strings.join(""));if(0!==s.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(s.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=s.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,r){if(void 0!==t){if(!(r?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,d(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const r=this[t],s=e.converter?.toAttribute??h.toAttribute,o=this.constructor.__attributeNameForProperty(t,e);if(void 0!==o){this.__reflectingProperty=t;const n=s(r,e.type);null==n?this.removeAttribute(o):this.setAttribute(o,String(n)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&a(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,r){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,r={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...r}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}const u=(function(t,...e){return{_$luxType$:3,strings:t,values:e}})`
+    :host {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        cursor: pointer;
+        vertical-align: middle;
+        user-select: none;
+        -webkit-tap-highlight-color: transparent;
+    }
+
+    :host([disabled]) {
+        opacity: 0.5;
+        pointer-events: none;
+    }
+
+    :host([loading]) {
+        pointer-events: none;
+    }
+
+    .track {
+        position: relative;
+        width: var(--sw-w, 40px);
+        height: var(--sw-h, 22px);
+        background: var(--sw-off-bg, rgb(var(--lux-border, 51 65 85)));
+        border: none;
+        padding: 0;
+        cursor: pointer;
+        transition: background var(--lux-transition, 150ms ease);
+        flex-shrink: 0;
+    }
+
+    :host([checked]) .track {
+        background: var(--sw-on-bg, rgb(var(--lux-primary-500, 99 91 218)));
+    }
+
+    .thumb {
+        position: absolute;
+        top: calc((var(--sw-h, 22px) - var(--sw-thumb, 18px)) / 2);
+        left: calc((var(--sw-h, 22px) - var(--sw-thumb, 18px)) / 2);
+        width: var(--sw-thumb, 18px);
+        height: var(--sw-thumb, 18px);
+        background: var(--sw-thumb-bg, rgb(var(--lux-bg, 255 255 255)));
+        border-radius: inherit;
+        transition: transform var(--lux-transition, 150ms ease);
+        box-shadow: 0 1px 3px rgb(0 0 0 / 20%);
+    }
+
+    :host([checked]) .thumb {
+        transform: translateX(calc(var(--sw-w, 40px) - var(--sw-h, 22px)));
+    }
+
+    .content {
+        font-size: var(--sw-font, 14px);
+        color: var(--sw-off-color, rgb(var(--lux-text, 241 245 249)));
+        transition: color var(--lux-transition, 150ms ease);
+    }
+
+    :host([checked]) .content {
+        color: var(--sw-on-color, rgb(var(--lux-text, 241 245 249)));
+    }
+
+    /* ── Size: sm ── */
+    :host([size='sm']) .track {
+        --sw-w: 32px;
+        --sw-h: 18px;
+        --sw-thumb: 14px;
+        --sw-font: 12px;
+    }
+
+    /* ── Size: md (default) ── */
+    /* uses CSS variables above */
+
+    /* ── Size: lg ── */
+    :host([size='lg']) .track {
+        --sw-w: 52px;
+        --sw-h: 28px;
+        --sw-thumb: 22px;
+        --sw-font: 16px;
+    }
+
+    /* ── Shape: square ── */
+    :host([shape='square']) .track,
+    :host([shape='square']) .thumb {
+        border-radius: 4px;
+    }
+
+    /* ── Shape: round (default) ── */
+    .track {
+        border-radius: 9999px;
+    }
+    .thumb {
+        border-radius: 9999px;
+    }
+
+    /* ── Loading ── */
+    :host([loading]) .thumb::after {
+        content: '';
+        position: absolute;
+        inset: 1px;
+        border: 2px solid rgb(var(--lux-border, 51 65 85) / 0.2);
+        border-top-color: rgb(var(--lux-text, 241 245 249));
+        border-radius: 50%;
+        animation: sw-spin 0.8s linear infinite;
+    }
+    @keyframes sw-spin {
+        to {
+            transform: rotate(360deg);
+        }
+    }
+`;class f extends p{static styles=u;static properties={checked:{type:Boolean,reflect:!0},disabled:{type:Boolean,reflect:!0},loading:{type:Boolean,reflect:!0},size:{type:String,reflect:!0},shape:{type:String,reflect:!0},checkedOnBg:{type:String,attribute:"checked-on-bg",reflect:!0},checkedOnColor:{type:String,attribute:"checked-on-color",reflect:!0},checkedOffBg:{type:String,attribute:"checked-off-bg",reflect:!0},checkedOffColor:{type:String,attribute:"checked-off-color",reflect:!0},toggle:{type:Function,attribute:!1}};constructor(){super(),this.checked=!1,this.disabled=!1,this.loading=!1,this.size="md",this.shape="round"}updated(){const t=this.style;this.checkedOnBg&&t.setProperty("--sw-on-bg",this.checkedOnBg),this.checkedOnColor&&t.setProperty("--sw-on-color",this.checkedOnColor),this.checkedOffBg&&t.setProperty("--sw-off-bg",this.checkedOffBg),this.checkedOffColor&&t.setProperty("--sw-off-color",this.checkedOffColor)}async _toggle(){if(!this.disabled&&!this.loading){if("function"==typeof this.toggle){this.loading=!0;try{!0===await this.toggle()&&(this.checked=!this.checked)}catch{}finally{this.loading=!1}}else this.checked=!this.checked;this.emit("change",{checked:this.checked})}}render(){return e`
+            <div class="track" @click=${()=>this._toggle()}>
+                <div class="thumb"></div>
+            </div>
+            <div class="content"><slot></slot></div>
+        `}}!function(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}("lux-switch",f);export{f as default};

package/dist/components/lux-table/index.iife.min.js

@@ -0,0 +1,67 @@
+var LuxTable=function(){"use strict";const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function r(t){return t&&void 0!==t._$luxType$}const o=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function s(e,o,s){if(o!==t&&null!=o)if(function(t){return t&&"repeat"===t._type}(o))!function(t,e){const{items:o,keyFn:s,renderFn:n}=e,i=t._repeatState;if(i)for(const t of i.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const l=document.createDocumentFragment(),c=[];for(const t of o){const e=s(t),o=n(t),i=document.createElement("span");i.style.display="contents",r(o)?a(o,i):null!=o&&!1!==o&&i.appendChild(document.createTextNode(String(o))),l.appendChild(i),c.push({key:e,result:o,span:i})}t.appendChild(l),t._repeatState={entries:c}}(e,o);else if(r(o))a(o,e);else if(Array.isArray(o)){n(e);for(const t of o)if(r(t)){const r=document.createElement("span");r.style.display="contents",a(t,r),e.appendChild(r)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(o instanceof Node)return n(e),void e.appendChild(o);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(o):(n(e),e.appendChild(document.createTextNode(String(o))))}else n(e)}function n(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function i(e,r){const{element:o,name:s,prefix:n}=e;switch(n){case"@":{const n=e.committedValue,i=null==r||r===t,a=i&&null!=n||r?.capture!==n?.capture||r?.once!==n?.once||r?.passive!==n?.passive,l=!i&&(null==n||a);if(a&&o.removeEventListener(s,e._handler||n,n),l)if("function"==typeof r){const t=e._host||(e._host={handleEvent(t){const r=e.committedValue;if("function"==typeof r){const e=o.getRootNode().host||o;r.call(e,t)}}});e._handler=t,o.addEventListener(s,t)}else if("object"==typeof r&&r?.handleEvent){const t={handleEvent:t=>r.handleEvent.call(r,t)};e._handler=t,o.addEventListener(s,t,{capture:r.capture,once:r.once,passive:r.passive})}e.committedValue=r;break}case".":o[s]=r===t?void 0:r;break;case"?":o.toggleAttribute(s,!!r);break;case"ref":"function"==typeof r&&r(o);break;case"class":if("string"==typeof r)o.className=r;else if("object"==typeof r&&null!=r){const t=o.className||"",e=t?t.split(/\s+/):[];for(const[t,o]of Object.entries(r))if(o)e.includes(t)||e.push(t);else{const r=e.indexOf(t);-1!==r&&e.splice(r,1)}o.className=e.filter(Boolean).join(" ")}break;default:null==r||!1===r?o.removeAttribute(s):o.setAttribute(s,!0===r?"":String(r))}}function a(t,e,n){if(!r(t))return void(e.textContent=t??"");const{strings:a,values:l}=t;if(e._luxActiveParts&&e._luxStrings===a){for(const t of e._luxActiveParts)t.index<l.length&&("child"===t.type?s(t.span,l[t.index]):i(t,l[t.index]));return}const c=document.createElement("template"),d=function(t){const e=[];let r="";for(let s=0;s<t.length;s++)if(r+=t[s],s<t.length-1){const t=r.match(o);if(t){const o=t[1],n=!!t[2],i=!!t[3];let a="",l="";o?(a=o[0],l=o.slice(1)):n?(a="ref",l="ref"):i&&(a="class",l="class");const c=`lux-attr-${s}`;r=r.slice(0,-t[0].length)+`${c}="${l}" `,e.push({type:"attr",name:l,prefix:a,marker:c,index:s})}else{const t=`lux-${s}`;r+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:s})}}return{html:r,parts:e}}(a);c.innerHTML=d.html;const p=c.content.cloneNode(!0),h=[];for(const t of d.parts)if("child"===t.type){const e=document.createTreeWalker(p,NodeFilter.SHOW_COMMENT);let r;for(;r=e.nextNode();)if(r.data===t.marker){const e=document.createElement("span");e.style.display="contents",r.parentNode.replaceChild(e,r),s(e,l[t.index]),h.push({type:"child",span:e,index:t.index});break}}else{const e=p.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const r={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};i(r,l[t.index]),h.push(r)}}e.textContent="",e.appendChild(p),e._luxActiveParts=h,e._luxStrings=a}const l=new Set;let c=!1;function d(t){var e;l.add(t),c||(c=!0,e=()=>{c=!1;const t=[...l];l.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const p={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class h extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const r of e)this.createProperty(r,t[r])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const r=this.__attributeNameForProperty(t,e);void 0!==r&&this.__attributeToPropertyMap.set(r,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const r=e.attribute;return!1===r?void 0:"string"==typeof r?r:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const r=Symbol(),o=this.getPropertyDescriptor(t,r,e);void 0!==o&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,e,r){const{type:o,reflect:s,converter:n}=r;return{get(){return this[e]},set(o){const s=this[e];this[e]=o,this.requestUpdate(t,s,r)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,r]of t)if(!r.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,r]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(r);if(e){const o=e.converter?.fromAttribute??p.fromAttribute;this[r]=o(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,r){const o=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==o&&this.__reflectingProperty!==o){const t=this.constructor.elementProperties.get(o);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:p;this.__reflectingProperty=o;const s=e.fromAttribute(r,t.type);this[o]=s,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],o=[];for(const t of e)"string"==typeof t?o.push(t):r(t)&&o.push(t.strings.join(""));if(0!==o.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(o.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=o.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,r){if(void 0!==t){if(!(r?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,d(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const r=this[t],o=e.converter?.toAttribute??p.toAttribute,s=this.constructor.__attributeNameForProperty(t,e);if(void 0!==s){this.__reflectingProperty=t;const n=o(r,e.type);null==n?this.removeAttribute(s):this.setAttribute(s,String(n)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&a(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,r){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,r={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...r}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}const u=(function(t,...e){return{_$luxType$:3,strings:t,values:e}})`
+    :host {
+        display: block;
+        width: 100%;
+        margin: 12px 0;
+    }
+    table {
+        width: 100%;
+        border-collapse: collapse;
+        font-size: 14px;
+    }
+    th,
+    td {
+        padding: 10px 16px;
+        text-align: left;
+        vertical-align: top;
+    }
+    th {
+        color: rgb(var(--lux-text-muted, 100 116 139));
+        font-weight: 500;
+        font-size: 12px;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+        background: rgb(var(--lux-bg-alt, 30 41 59));
+    }
+    td {
+        color: rgb(var(--lux-text-secondary, 148 163 184));
+    }
+    code {
+        font-family: 'SF Mono', Consolas, monospace;
+        font-size: 0.88em;
+        background: rgb(var(--lux-bg-alt, 30 41 59));
+        padding: 2px 6px;
+        border-radius: 4px;
+    }
+    :host([size='sm']) table {
+        font-size: 13px;
+    }
+    :host([size='sm']) th,
+    :host([size='sm']) td {
+        padding: 6px 12px;
+    }
+    :host([size='lg']) table {
+        font-size: 15px;
+    }
+    :host([size='lg']) th,
+    :host([size='lg']) td {
+        padding: 14px 20px;
+    }
+    :host([border]) table {
+        border: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([row-border]) th,
+    :host([row-border]) td {
+        border-bottom: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([col-border]) td + td,
+    :host([col-border]) th + th {
+        border-left: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([stripe]) tbody tr:nth-child(even) {
+        background: rgb(var(--lux-hover, 255 255 255 / 3%));
+    }
+    :host([hover]) tbody tr:hover {
+        background: rgb(var(--lux-hover, 255 255 255 / 5%));
+    }
+`;class f extends h{static styles=u;static properties={border:{type:Boolean,reflect:!0},stripe:{type:Boolean,reflect:!0},rowBorder:{type:Boolean,attribute:"row-border",reflect:!0},colBorder:{type:Boolean,attribute:"col-border",reflect:!0},size:{type:String,reflect:!0},hover:{type:Boolean,reflect:!0}};firstUpdated(){const t=this.renderRoot.querySelector("table");if(t)for(;this.firstChild;)t.appendChild(this.firstChild)}render(){return e`<table></table>`}}return function(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}("lux-table",f),f}();

package/dist/components/lux-table/index.min.js

@@ -0,0 +1,67 @@
+const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function r(t){return t&&void 0!==t._$luxType$}const o=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function s(e,o,s){if(o!==t&&null!=o)if(function(t){return t&&"repeat"===t._type}(o))!function(t,e){const{items:o,keyFn:s,renderFn:n}=e,i=t._repeatState;if(i)for(const t of i.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const l=document.createDocumentFragment(),c=[];for(const t of o){const e=s(t),o=n(t),i=document.createElement("span");i.style.display="contents",r(o)?a(o,i):null!=o&&!1!==o&&i.appendChild(document.createTextNode(String(o))),l.appendChild(i),c.push({key:e,result:o,span:i})}t.appendChild(l),t._repeatState={entries:c}}(e,o);else if(r(o))a(o,e);else if(Array.isArray(o)){n(e);for(const t of o)if(r(t)){const r=document.createElement("span");r.style.display="contents",a(t,r),e.appendChild(r)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(o instanceof Node)return n(e),void e.appendChild(o);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(o):(n(e),e.appendChild(document.createTextNode(String(o))))}else n(e)}function n(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function i(e,r){const{element:o,name:s,prefix:n}=e;switch(n){case"@":{const n=e.committedValue,i=null==r||r===t,a=i&&null!=n||r?.capture!==n?.capture||r?.once!==n?.once||r?.passive!==n?.passive,l=!i&&(null==n||a);if(a&&o.removeEventListener(s,e._handler||n,n),l)if("function"==typeof r){const t=e._host||(e._host={handleEvent(t){const r=e.committedValue;if("function"==typeof r){const e=o.getRootNode().host||o;r.call(e,t)}}});e._handler=t,o.addEventListener(s,t)}else if("object"==typeof r&&r?.handleEvent){const t={handleEvent:t=>r.handleEvent.call(r,t)};e._handler=t,o.addEventListener(s,t,{capture:r.capture,once:r.once,passive:r.passive})}e.committedValue=r;break}case".":o[s]=r===t?void 0:r;break;case"?":o.toggleAttribute(s,!!r);break;case"ref":"function"==typeof r&&r(o);break;case"class":if("string"==typeof r)o.className=r;else if("object"==typeof r&&null!=r){const t=o.className||"",e=t?t.split(/\s+/):[];for(const[t,o]of Object.entries(r))if(o)e.includes(t)||e.push(t);else{const r=e.indexOf(t);-1!==r&&e.splice(r,1)}o.className=e.filter(Boolean).join(" ")}break;default:null==r||!1===r?o.removeAttribute(s):o.setAttribute(s,!0===r?"":String(r))}}function a(t,e,n){if(!r(t))return void(e.textContent=t??"");const{strings:a,values:l}=t;if(e._luxActiveParts&&e._luxStrings===a){for(const t of e._luxActiveParts)t.index<l.length&&("child"===t.type?s(t.span,l[t.index]):i(t,l[t.index]));return}const c=document.createElement("template"),d=function(t){const e=[];let r="";for(let s=0;s<t.length;s++)if(r+=t[s],s<t.length-1){const t=r.match(o);if(t){const o=t[1],n=!!t[2],i=!!t[3];let a="",l="";o?(a=o[0],l=o.slice(1)):n?(a="ref",l="ref"):i&&(a="class",l="class");const c=`lux-attr-${s}`;r=r.slice(0,-t[0].length)+`${c}="${l}" `,e.push({type:"attr",name:l,prefix:a,marker:c,index:s})}else{const t=`lux-${s}`;r+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:s})}}return{html:r,parts:e}}(a);c.innerHTML=d.html;const p=c.content.cloneNode(!0),h=[];for(const t of d.parts)if("child"===t.type){const e=document.createTreeWalker(p,NodeFilter.SHOW_COMMENT);let r;for(;r=e.nextNode();)if(r.data===t.marker){const e=document.createElement("span");e.style.display="contents",r.parentNode.replaceChild(e,r),s(e,l[t.index]),h.push({type:"child",span:e,index:t.index});break}}else{const e=p.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const r={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};i(r,l[t.index]),h.push(r)}}e.textContent="",e.appendChild(p),e._luxActiveParts=h,e._luxStrings=a}const l=new Set;let c=!1;function d(t){var e;l.add(t),c||(c=!0,e=()=>{c=!1;const t=[...l];l.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const p={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class h extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const r of e)this.createProperty(r,t[r])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const r=this.__attributeNameForProperty(t,e);void 0!==r&&this.__attributeToPropertyMap.set(r,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const r=e.attribute;return!1===r?void 0:"string"==typeof r?r:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const r=Symbol(),o=this.getPropertyDescriptor(t,r,e);void 0!==o&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,e,r){const{type:o,reflect:s,converter:n}=r;return{get(){return this[e]},set(o){const s=this[e];this[e]=o,this.requestUpdate(t,s,r)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,r]of t)if(!r.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,r]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(r);if(e){const o=e.converter?.fromAttribute??p.fromAttribute;this[r]=o(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,r){const o=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==o&&this.__reflectingProperty!==o){const t=this.constructor.elementProperties.get(o);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:p;this.__reflectingProperty=o;const s=e.fromAttribute(r,t.type);this[o]=s,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],o=[];for(const t of e)"string"==typeof t?o.push(t):r(t)&&o.push(t.strings.join(""));if(0!==o.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(o.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=o.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,r){if(void 0!==t){if(!(r?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,d(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const r=this[t],o=e.converter?.toAttribute??p.toAttribute,s=this.constructor.__attributeNameForProperty(t,e);if(void 0!==s){this.__reflectingProperty=t;const n=o(r,e.type);null==n?this.removeAttribute(s):this.setAttribute(s,String(n)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&a(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,r){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,r={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...r}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}const u=(function(t,...e){return{_$luxType$:3,strings:t,values:e}})`
+    :host {
+        display: block;
+        width: 100%;
+        margin: 12px 0;
+    }
+    table {
+        width: 100%;
+        border-collapse: collapse;
+        font-size: 14px;
+    }
+    th,
+    td {
+        padding: 10px 16px;
+        text-align: left;
+        vertical-align: top;
+    }
+    th {
+        color: rgb(var(--lux-text-muted, 100 116 139));
+        font-weight: 500;
+        font-size: 12px;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+        background: rgb(var(--lux-bg-alt, 30 41 59));
+    }
+    td {
+        color: rgb(var(--lux-text-secondary, 148 163 184));
+    }
+    code {
+        font-family: 'SF Mono', Consolas, monospace;
+        font-size: 0.88em;
+        background: rgb(var(--lux-bg-alt, 30 41 59));
+        padding: 2px 6px;
+        border-radius: 4px;
+    }
+    :host([size='sm']) table {
+        font-size: 13px;
+    }
+    :host([size='sm']) th,
+    :host([size='sm']) td {
+        padding: 6px 12px;
+    }
+    :host([size='lg']) table {
+        font-size: 15px;
+    }
+    :host([size='lg']) th,
+    :host([size='lg']) td {
+        padding: 14px 20px;
+    }
+    :host([border]) table {
+        border: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([row-border]) th,
+    :host([row-border]) td {
+        border-bottom: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([col-border]) td + td,
+    :host([col-border]) th + th {
+        border-left: 1px solid rgb(var(--lux-border, 51 65 85));
+    }
+    :host([stripe]) tbody tr:nth-child(even) {
+        background: rgb(var(--lux-hover, 255 255 255 / 3%));
+    }
+    :host([hover]) tbody tr:hover {
+        background: rgb(var(--lux-hover, 255 255 255 / 5%));
+    }
+`;class f extends h{static styles=u;static properties={border:{type:Boolean,reflect:!0},stripe:{type:Boolean,reflect:!0},rowBorder:{type:Boolean,attribute:"row-border",reflect:!0},colBorder:{type:Boolean,attribute:"col-border",reflect:!0},size:{type:String,reflect:!0},hover:{type:Boolean,reflect:!0}};firstUpdated(){const t=this.renderRoot.querySelector("table");if(t)for(;this.firstChild;)t.appendChild(this.firstChild)}render(){return e`<table></table>`}}!function(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}("lux-table",f);export{f as default};

package/dist/lux.core.min.js

@@ -0,0 +1 @@
+const t=Symbol.for("lux-nothing");function e(t,...e){return{_$luxType$:1,strings:t,values:e}}function r(t,...e){return{_$luxType$:2,strings:t,values:e}}function n(t,...e){return{_$luxType$:3,strings:t,values:e}}function s(t){return t&&void 0!==t._$luxType$}function o(t){if(null==t)return"";const e=String(t);return-1===e.indexOf("<")&&-1===e.indexOf(">")&&-1===e.indexOf("&")?e:e.replace(/[<>&"']/g,t=>({"<":"&lt;",">":"&gt;","&":"&amp;",'"':"&quot;","'":"&#39;"}[t]))}const i=/(?:([@.?][\w-]+)|(ref)|(class))=\s*$/;function a(e,r,n){if(r!==t&&null!=r)if(function(t){return t&&"repeat"===t._type}(r))!function(t,e){const{items:r,keyFn:n,renderFn:o}=e,i=t._repeatState;if(i)for(const t of i.entries)t.span&&t.span.parentNode&&t.span.parentNode.removeChild(t.span);const a=document.createDocumentFragment(),c=[];for(const t of r){const e=n(t),r=o(t),i=document.createElement("span");i.style.display="contents",s(r)?p(r,i):null!=r&&!1!==r&&i.appendChild(document.createTextNode(String(r))),a.appendChild(i),c.push({key:e,result:r,span:i})}t.appendChild(a),t._repeatState={entries:c}}(e,r);else if(s(r))p(r,e);else if(Array.isArray(r)){c(e);for(const t of r)if(s(t)){const r=document.createElement("span");r.style.display="contents",p(t,r),e.appendChild(r)}else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&e.appendChild(document.createTextNode(String(t)))}else{if(r instanceof Node)return c(e),void e.appendChild(r);1===e.childNodes.length&&e.firstChild.nodeType===Node.TEXT_NODE?e.firstChild.textContent=String(r):(c(e),e.appendChild(document.createTextNode(String(r))))}else c(e)}function c(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function l(e,r){const{element:n,name:s,prefix:o}=e;switch(o){case"@":{const o=e.committedValue,i=null==r||r===t,a=i&&null!=o||r?.capture!==o?.capture||r?.once!==o?.once||r?.passive!==o?.passive,c=!i&&(null==o||a);if(a&&n.removeEventListener(s,e._handler||o,o),c)if("function"==typeof r){const t=e._host||(e._host={handleEvent(t){const r=e.committedValue;if("function"==typeof r){const e=n.getRootNode().host||n;r.call(e,t)}}});e._handler=t,n.addEventListener(s,t)}else if("object"==typeof r&&r?.handleEvent){const t={handleEvent:t=>r.handleEvent.call(r,t)};e._handler=t,n.addEventListener(s,t,{capture:r.capture,once:r.once,passive:r.passive})}e.committedValue=r;break}case".":n[s]=r===t?void 0:r;break;case"?":n.toggleAttribute(s,!!r);break;case"ref":"function"==typeof r&&r(n);break;case"class":if("string"==typeof r)n.className=r;else if("object"==typeof r&&null!=r){const t=n.className||"",e=t?t.split(/\s+/):[];for(const[t,n]of Object.entries(r))if(n)e.includes(t)||e.push(t);else{const r=e.indexOf(t);-1!==r&&e.splice(r,1)}n.className=e.filter(Boolean).join(" ")}break;default:null==r||!1===r?n.removeAttribute(s):n.setAttribute(s,!0===r?"":String(r))}}function p(t,e,r){if(!s(t))return void(e.textContent=t??"");const{strings:n,values:o}=t;if(e._luxActiveParts&&e._luxStrings===n){for(const t of e._luxActiveParts)t.index<o.length&&("child"===t.type?a(t.span,o[t.index]):l(t,o[t.index]));return}const c=document.createElement("template"),p=function(t){const e=[];let r="";for(let n=0;n<t.length;n++)if(r+=t[n],n<t.length-1){const t=r.match(i);if(t){const s=t[1],o=!!t[2],i=!!t[3];let a="",c="";s?(a=s[0],c=s.slice(1)):o?(a="ref",c="ref"):i&&(a="class",c="class");const l=`lux-attr-${n}`;r=r.slice(0,-t[0].length)+`${l}="${c}" `,e.push({type:"attr",name:c,prefix:a,marker:l,index:n})}else{const t=`lux-${n}`;r+=`\x3c!--${t}--\x3e`,e.push({type:"child",marker:t,index:n})}}return{html:r,parts:e}}(n);c.innerHTML=p.html;const d=c.content.cloneNode(!0),u=[];for(const t of p.parts)if("child"===t.type){const e=document.createTreeWalker(d,NodeFilter.SHOW_COMMENT);let r;for(;r=e.nextNode();)if(r.data===t.marker){const e=document.createElement("span");e.style.display="contents",r.parentNode.replaceChild(e,r),a(e,o[t.index]),u.push({type:"child",span:e,index:t.index});break}}else{const e=d.querySelector(`[${t.marker}]`);if(e){e.removeAttribute(t.marker);const r={type:"attr",element:e,name:t.name,prefix:t.prefix,index:t.index,committedValue:void 0};l(r,o[t.index]),u.push(r)}}e.textContent="",e.appendChild(d),e._luxActiveParts=u,e._luxStrings=n}function d(t,e,r){return{_type:"repeat",items:t,keyFn:e,renderFn:r}}function u(t,e,r=()=>""){return t?e():r()}function h(t,e=""){return t?e:""}function f(t){return t}function _(t){return t}function m(t,e){return e()}const y=new Set;let g=!1;function b(t){var e;y.add(t),g||(g=!0,e=()=>{g=!1;const t=[...y];y.clear();for(const e of t)e._$performUpdate()},Promise.resolve().then(e))}const P={toAttribute(t,e){switch(e){case Boolean:return t?"":null;case Object:case Array:return null==t?null:JSON.stringify(t);default:return t}},fromAttribute(t,e){switch(e){case Boolean:return null!==t;case Number:return Number(t);case Object:case Array:try{return JSON.parse(t)}catch{return null}default:return t}}};class v extends HTMLElement{static properties={};static styles=void 0;static finalized=!1;static elementProperties=new Map;static __prepare(){if(this.hasOwnProperty("elementProperties"))return;const t=Object.getPrototypeOf(this);t.finalize&&t.finalize(),this.elementProperties=new Map(t.elementProperties)}static get observedAttributes(){return this.finalize(),this.__attributeToPropertyMap?[...this.__attributeToPropertyMap.keys()]:[]}static finalize(){if(!this.hasOwnProperty("finalized")){if(this.finalized=!0,this.__prepare(),this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const r of e)this.createProperty(r,t[r])}this.__attributeToPropertyMap=new Map;for(const[t,e]of this.elementProperties){const r=this.__attributeNameForProperty(t,e);void 0!==r&&this.__attributeToPropertyMap.set(r,t)}this.elementStyles=this.styles}}static __attributeNameForProperty(t,e){const r=e.attribute;return!1===r?void 0:"string"==typeof r?r:"string"==typeof t?t.replace(/([A-Z])/g,"-$1").toLowerCase():void 0}static createProperty(t,e={}){if(this.__prepare(),!this.elementProperties.has(t)&&(e.state&&(e={...e,attribute:!1}),this.elementProperties.set(t,e),!e.noAccessor)){const r=Symbol(),n=this.getPropertyDescriptor(t,r,e);void 0!==n&&Object.defineProperty(this.prototype,t,n)}}static getPropertyDescriptor(t,e,r){const{type:n,reflect:s,converter:o}=r;return{get(){return this[e]},set(n){const s=this[e];this[e]=n,this.requestUpdate(t,s,r)},configurable:!0,enumerable:!0}}static _initializers=[];static addInitializer(t){this._initializers=[...this._initializers||[],t]}static shadowRootOptions={mode:"open"};constructor(){super(),this.__updatePending=!1,this.__hasUpdated=!1,this.__controllers=new Set,this.__reflectingProperty=null,this.constructor.hasOwnProperty("finalized")||this.constructor.finalize(),this.__saveInstanceProperties(),this.requestUpdate();for(const t of this.constructor._initializers||[])t(this)}__saveInstanceProperties(){const t=this.constructor.elementProperties;if(t)for(const[e,r]of t)if(!r.noAccessor&&this.hasOwnProperty(e)){const t=this[e];delete this[e],this.__instancePropertyValues=this.__instancePropertyValues||new Map,this.__instancePropertyValues.set(e,t)}}connectedCallback(){this.__controllers.forEach(t=>t.hostConnected?.()),this.constructor.hasOwnProperty("finalized")||this.constructor.finalize();const t=this.constructor.__attributeToPropertyMap;if(t)for(const[e,r]of t){const t=this.getAttribute(e);if(null!==t){const e=this.constructor.elementProperties.get(r);if(e){const n=e.converter?.fromAttribute??P.fromAttribute;this[r]=n(t,e.type)}}}if(this.__instancePropertyValues){for(const[t,e]of this.__instancePropertyValues)this[t]=e;this.__instancePropertyValues=void 0}this.renderRoot,this.__hasUpdated||this.requestUpdate()}disconnectedCallback(){this.__controllers.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,r){const n=this.constructor.__attributeToPropertyMap?.get(t);if(void 0!==n&&this.__reflectingProperty!==n){const t=this.constructor.elementProperties.get(n);if(t){const e="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:P;this.__reflectingProperty=n;const s=e.fromAttribute(r,t.type);this[n]=s,this.__reflectingProperty=null}}}get renderRoot(){return this._renderRoot||(this._renderRoot=this.createRenderRoot(),this.__adoptStyles()),this._renderRoot}createRenderRoot(){return this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions)}__adoptStyles(){const t=this.constructor.elementStyles;if(!t)return;const e=Array.isArray(t)?t:[t],r=[];for(const t of e)"string"==typeof t?r.push(t):s(t)&&r.push(t.strings.join(""));if(0!==r.length)if(void 0!==this._renderRoot.adoptedStyleSheets){const t=new CSSStyleSheet;t.replaceSync(r.join("\n")),this._renderRoot.adoptedStyleSheets=[...this._renderRoot.adoptedStyleSheets,t]}else{const t=document.createElement("style");t.textContent=r.join("\n"),this._renderRoot.appendChild(t)}}enableUpdating(t){}get updateComplete(){return this.__updateCompletePromise??Promise.resolve()}get hasUpdated(){return this.__hasUpdated}get isUpdatePending(){return this.__updatePending}requestUpdate(t,e,r){if(void 0!==t){if(!(r?.hasChanged??((t,e)=>!Object.is(t,e)))(this[t],e))return}this.__updatePending||(this.__updatePending=!0,b(this))}async performUpdate(){if(this.isUpdatePending){this.__updatePending=!1,this.willUpdate(new Map),this.__controllers.forEach(t=>t.hostUpdate?.()),this.update(new Map),this.__hasUpdated=!0;for(const[t,e]of this.constructor.elementProperties)if(e.reflect){const r=this[t],n=e.converter?.toAttribute??P.toAttribute,s=this.constructor.__attributeNameForProperty(t,e);if(void 0!==s){this.__reflectingProperty=t;const o=n(r,e.type);null==o?this.removeAttribute(s):this.setAttribute(s,String(o)),this.__reflectingProperty=null}}this.__controllers.forEach(t=>t.hostUpdated?.()),this.firstUpdated(new Map),this.updated(new Map)}}_$performUpdate(){this.performUpdate()}shouldUpdate(t){return!0}willUpdate(t){}update(t){const e=this.render();e&&p(e,this.renderRoot)}render(){return e``}firstUpdated(t){}updated(t){}propertyChangedCallback(t,e,r){}addController(t){this.__controllers.add(t),this.isConnected&&t.hostConnected?.()}removeController(t){this.__controllers.delete(t)}emit(t,e,r={}){return this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0,...r}))}$(t){return this.renderRoot.querySelector(t)}$$(t){return this.renderRoot.querySelectorAll(t)}}function x(t,e){if(!t.includes("-"))throw new Error(`Component name must contain a hyphen: ${t}`);customElements.get(t)||customElements.define(t,e)}function C(t,e={}){const{properties:r={}}=e;return class extends v{static properties=r;render(){return t.call(this,this)}}}export{v as LuxElement,f as classMap,C as createComponent,n as css,o as escapeHtml,m as guard,e as html,s as isTemplateResult,t as nothing,x as registerComponent,p as render,d as repeat,h as show,_ as styleMap,r as svg,u as when};