@krumio/trailhand-ui 1.4.1

package/dist/action-menu.js

@@ -0,0 +1,321 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, css } from 'lit';
+import { property, state } from 'lit/decorators.js';
+/**
+ * A dropdown action menu component for displaying contextual actions.
+ * Typically used in table rows or cards to provide action options.
+ */
+export class ActionMenu extends LitElement {
+    constructor() {
+        super();
+        this.actions = [];
+        this.resource = {};
+        this.disabled = false;
+        this._isOpen = false;
+        this._boundHandleClickOutside = this._handleClickOutside.bind(this);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        document.addEventListener('click', this._boundHandleClickOutside);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener('click', this._boundHandleClickOutside);
+    }
+    /**
+     * Handle clicks outside the menu to close it
+     * @param e - The click event
+     * @private
+     */
+    _handleClickOutside(e) {
+        const target = e.target;
+        if (this._isOpen && !this.contains(target)) {
+            this._isOpen = false;
+        }
+    }
+    /**
+     * Toggle the dropdown menu open/closed
+     * @param e - The click event
+     * @private
+     */
+    _toggleMenu(e) {
+        e.stopPropagation();
+        if (!this.disabled) {
+            this._isOpen = !this._isOpen;
+        }
+    }
+    /**
+     * Handle action click
+     * @param e - The click event
+     * @param action - The action object
+     * @private
+     */
+    _handleActionClick(e, action) {
+        e.stopPropagation();
+        if (this._isActionEnabled(action)) {
+            this._isOpen = false;
+            // Dispatch custom event
+            this.dispatchEvent(new CustomEvent('action-click', {
+                bubbles: true,
+                composed: true,
+                detail: { action, resource: this.resource }
+            }));
+            // Call action handler if provided
+            if (action.action && typeof action.action === 'function') {
+                action.action(this.resource);
+            }
+        }
+    }
+    /**
+     * Check if an action is enabled
+     * @param action - The action object
+     * @returns boolean
+     * @private
+     */
+    _isActionEnabled(action) {
+        if (!action.enabled)
+            return true;
+        if (typeof action.enabled === 'function') {
+            return action.enabled(this.resource);
+        }
+        return action.enabled;
+    }
+    /**
+     * Render the three-dots icon
+     * @returns TemplateResult
+     * @private
+     */
+    _renderIcon() {
+        return html `
+      <svg class="action-menu__icon" viewBox="0 0 16 16" fill="currentColor">
+        <circle cx="2" cy="8" r="1.5" />
+        <circle cx="8" cy="8" r="1.5" />
+        <circle cx="14" cy="8" r="1.5" />
+      </svg>
+    `;
+    }
+    /**
+     * Get actions to display
+     * @returns Array of actions
+     * @private
+     */
+    _getActions() {
+        // If actions are provided explicitly, use them
+        if (this.actions && this.actions.length > 0) {
+            return this.actions;
+        }
+        // Otherwise, try to get from resource.availableActions
+        if (this.resource && typeof this.resource.availableActions !== 'undefined') {
+            return this.resource.availableActions || [];
+        }
+        return [];
+    }
+    /**
+     * Render the component
+     * @returns TemplateResult
+     */
+    render() {
+        const allActions = this._getActions();
+        // Filter by visibility and enabled status
+        let visibleActions = allActions.filter(action => {
+            // Skip dividers in visibility check
+            if (action.divider)
+                return true;
+            // Check visible property
+            if (action.visible !== undefined) {
+                if (typeof action.visible === 'function') {
+                    return action.visible(this.resource);
+                }
+                return action.visible;
+            }
+            // If no visible property, check enabled (hide if explicitly false)
+            if (action.enabled !== undefined && action.enabled === false) {
+                return false;
+            }
+            return true;
+        });
+        // Remove consecutive dividers and trailing/leading dividers
+        visibleActions = visibleActions.filter((action, index, arr) => {
+            if (!action.divider)
+                return true;
+            // Remove if first or last
+            if (index === 0 || index === arr.length - 1)
+                return false;
+            // Remove if next to another divider
+            if (arr[index - 1]?.divider || arr[index + 1]?.divider)
+                return false;
+            return true;
+        });
+        return html `
+      <button
+        class="action-menu__button"
+        ?disabled=${this.disabled}
+        @click=${this._toggleMenu}
+        aria-haspopup="true"
+        aria-expanded=${this._isOpen}
+      >
+        ${this._renderIcon()}
+      </button>
+
+      <div class="action-menu__dropdown ${this._isOpen ? 'action-menu__dropdown--open' : ''}">
+        ${visibleActions.length === 0 ? html `
+          <div class="action-menu__empty">No actions available</div>
+        ` : html `
+          <ul class="action-menu__list" role="menu">
+            ${visibleActions.map((action) => html `
+              ${action.divider ? html `
+                <li class="action-menu__divider" role="separator"></li>
+              ` : html `
+                <li class="action-menu__item" role="none">
+                  <button
+                    class="action-menu__action ${action.danger ? 'action-menu__action--danger' : ''}"
+                    ?disabled=${!this._isActionEnabled(action)}
+                    @click=${(e) => this._handleActionClick(e, action)}
+                    role="menuitem"
+                  >
+                    ${action.label}
+                  </button>
+                </li>
+              `}
+            `)}
+          </ul>
+        `}
+      </div>
+    `;
+    }
+}
+ActionMenu.styles = css `
+    :host {
+      display: inline-block;
+      position: relative;
+    }
+
+    .action-menu__button {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 32px;
+      height: 32px;
+      padding: 0;
+      border: 1px solid var(--border, #ddd);
+      border-radius: 4px;
+      background-color: var(--body-bg, #fff);
+      color: var(--body-text, #333);
+      cursor: pointer;
+      transition: all 0.2s;
+    }
+
+    .action-menu__button:hover:not(:disabled) {
+      background-color: var(--sortable-table-row-hover-bg, #f5f5f5);
+      border-color: var(--link, #007bff);
+    }
+
+    .action-menu__button:disabled {
+      opacity: 0.4;
+      cursor: not-allowed;
+    }
+
+    .action-menu__icon {
+      width: 16px;
+      height: 16px;
+    }
+
+    .action-menu__dropdown {
+      position: absolute;
+      right: 0;
+      top: 100%;
+      margin-top: 4px;
+      min-width: 180px;
+      background-color: var(--body-bg, #fff);
+      border: 1px solid var(--border, #ddd);
+      border-radius: 4px;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+      z-index: 1000;
+      opacity: 0;
+      visibility: hidden;
+      transform: translateY(-10px);
+      transition: all 0.2s ease-in-out;
+    }
+
+    .action-menu__dropdown--open {
+      opacity: 1;
+      visibility: visible;
+      transform: translateY(0);
+    }
+
+    .action-menu__list {
+      list-style: none;
+      margin: 0;
+      padding: 0.5rem 0;
+    }
+
+    .action-menu__item {
+      margin: 0;
+      padding: 0;
+    }
+
+    .action-menu__action {
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+      width: 100%;
+      padding: 0.5rem 1rem;
+      border: none;
+      background: none;
+      color: var(--body-text, #333);
+      font-size: 14px;
+      text-align: left;
+      cursor: pointer;
+      transition: background-color 0.15s;
+    }
+
+    .action-menu__action:hover:not(:disabled) {
+      background-color: var(--sortable-table-row-hover-bg, #f5f5f5);
+    }
+
+    .action-menu__action:disabled {
+      opacity: 0.4;
+      cursor: not-allowed;
+    }
+
+    .action-menu__action--danger {
+      color: var(--error, #dc3545);
+    }
+
+    .action-menu__action--danger:hover:not(:disabled) {
+      background-color: rgba(220, 53, 69, 0.1);
+    }
+
+    .action-menu__divider {
+      height: 1px;
+      margin: 0.5rem 0;
+      background-color: var(--border, #ddd);
+    }
+
+    .action-menu__empty {
+      padding: 1rem;
+      text-align: center;
+      color: var(--muted, #999);
+      font-size: 13px;
+    }
+  `;
+__decorate([
+    property({ type: Array })
+], ActionMenu.prototype, "actions", void 0);
+__decorate([
+    property({ type: Object })
+], ActionMenu.prototype, "resource", void 0);
+__decorate([
+    property({ type: Boolean })
+], ActionMenu.prototype, "disabled", void 0);
+__decorate([
+    state()
+], ActionMenu.prototype, "_isOpen", void 0);
+// Register the element
+customElements.define('action-menu', ActionMenu);
+//# sourceMappingURL=action-menu.js.map

package/dist/action-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-menu.js","sourceRoot":"","sources":["../Components/action-menu.ts"],"names":[],"mappings":"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"}

package/dist/assets/index-B7q5L5KS.js

@@ -0,0 +1,91 @@
+(function(){const e=document.createElement("link").relList;if(e&&e.supports&&e.supports("modulepreload"))return;for(const s of document.querySelectorAll('link[rel="modulepreload"]'))i(s);new MutationObserver(s=>{for(const n of s)if(n.type==="childList")for(const o of n.addedNodes)o.tagName==="LINK"&&o.rel==="modulepreload"&&i(o)}).observe(document,{childList:!0,subtree:!0});function t(s){const n={};return s.integrity&&(n.integrity=s.integrity),s.referrerPolicy&&(n.referrerPolicy=s.referrerPolicy),s.crossOrigin==="use-credentials"?n.credentials="include":s.crossOrigin==="anonymous"?n.credentials="omit":n.credentials="same-origin",n}function i(s){if(s.ep)return;s.ep=!0;const n=t(s);fetch(s.href,n)}})();/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const N=globalThis,K=N.ShadowRoot&&(N.ShadyCSS===void 0||N.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,V=Symbol(),Z=new WeakMap;let oe=class{constructor(e,t,i){if(this._$cssResult$=!0,i!==V)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o;const t=this.t;if(K&&e===void 0){const i=t!==void 0&&t.length===1;i&&(e=Z.get(t)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),i&&Z.set(t,e))}return e}toString(){return this.cssText}};const pe=r=>new oe(typeof r=="string"?r:r+"",void 0,V),ue=(r,...e)=>{const t=r.length===1?r[0]:e.reduce(((i,s,n)=>i+(o=>{if(o._$cssResult$===!0)return o.cssText;if(typeof o=="number")return o;throw Error("Value passed to 'css' function must be a 'css' function result: "+o+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+r[n+1]),r[0]);return new oe(t,r,V)},fe=(r,e)=>{if(K)r.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const t of e){const i=document.createElement("style"),s=N.litNonce;s!==void 0&&i.setAttribute("nonce",s),i.textContent=t.cssText,r.appendChild(i)}},X=K?r=>r:r=>r instanceof CSSStyleSheet?(e=>{let t="";for(const i of e.cssRules)t+=i.cssText;return pe(t)})(r):r;/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const{is:$e,defineProperty:ge,getOwnPropertyDescriptor:me,getOwnPropertyNames:_e,getOwnPropertySymbols:ye,getPrototypeOf:Ae}=Object,g=globalThis,G=g.trustedTypes,be=G?G.emptyScript:"",j=g.reactiveElementPolyfillSupport,C=(r,e)=>r,R={toAttribute(r,e){switch(e){case Boolean:r=r?be:null;break;case Object:case Array:r=r==null?r:JSON.stringify(r)}return r},fromAttribute(r,e){let t=r;switch(e){case Boolean:t=r!==null;break;case Number:t=r===null?null:Number(r);break;case Object:case Array:try{t=JSON.parse(r)}catch{t=null}}return t}},W=(r,e)=>!$e(r,e),Q={attribute:!0,type:String,converter:R,reflect:!1,useDefault:!1,hasChanged:W};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),g.litPropertyMetadata??(g.litPropertyMetadata=new WeakMap);let v=class extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??(this.l=[])).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=Q){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){const i=Symbol(),s=this.getPropertyDescriptor(e,i,t);s!==void 0&&ge(this.prototype,e,s)}}static getPropertyDescriptor(e,t,i){const{get:s,set:n}=me(this.prototype,e)??{get(){return this[t]},set(o){this[t]=o}};return{get:s,set(o){const a=s==null?void 0:s.call(this);n==null||n.call(this,o),this.requestUpdate(e,a,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??Q}static _$Ei(){if(this.hasOwnProperty(C("elementProperties")))return;const e=Ae(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(C("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(C("properties"))){const t=this.properties,i=[..._e(t),...ye(t)];for(const s of i)this.createProperty(s,t[s])}const e=this[Symbol.metadata];if(e!==null){const t=litPropertyMetadata.get(e);if(t!==void 0)for(const[i,s]of t)this.elementProperties.set(i,s)}this._$Eh=new Map;for(const[t,i]of this.elementProperties){const s=this._$Eu(t,i);s!==void 0&&this._$Eh.set(s,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const t=[];if(Array.isArray(e)){const i=new Set(e.flat(1/0).reverse());for(const s of i)t.unshift(X(s))}else e!==void 0&&t.push(X(e));return t}static _$Eu(e,t){const i=t.attribute;return i===!1?void 0:typeof i=="string"?i:typeof e=="string"?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var e;this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),(e=this.constructor.l)==null||e.forEach((t=>t(this)))}addController(e){var t;(this._$EO??(this._$EO=new Set)).add(e),this.renderRoot!==void 0&&this.isConnected&&((t=e.hostConnected)==null||t.call(e))}removeController(e){var t;(t=this._$EO)==null||t.delete(e)}_$E_(){const e=new Map,t=this.constructor.elementProperties;for(const i of t.keys())this.hasOwnProperty(i)&&(e.set(i,this[i]),delete this[i]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return fe(e,this.constructor.elementStyles),e}connectedCallback(){var e;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(e=this._$EO)==null||e.forEach((t=>{var i;return(i=t.hostConnected)==null?void 0:i.call(t)}))}enableUpdating(e){}disconnectedCallback(){var e;(e=this._$EO)==null||e.forEach((t=>{var i;return(i=t.hostDisconnected)==null?void 0:i.call(t)}))}attributeChangedCallback(e,t,i){this._$AK(e,i)}_$ET(e,t){var n;const i=this.constructor.elementProperties.get(e),s=this.constructor._$Eu(e,i);if(s!==void 0&&i.reflect===!0){const o=(((n=i.converter)==null?void 0:n.toAttribute)!==void 0?i.converter:R).toAttribute(t,i.type);this._$Em=e,o==null?this.removeAttribute(s):this.setAttribute(s,o),this._$Em=null}}_$AK(e,t){var n,o;const i=this.constructor,s=i._$Eh.get(e);if(s!==void 0&&this._$Em!==s){const a=i.getPropertyOptions(s),h=typeof a.converter=="function"?{fromAttribute:a.converter}:((n=a.converter)==null?void 0:n.fromAttribute)!==void 0?a.converter:R;this._$Em=s;const c=h.fromAttribute(t,a.type);this[s]=c??((o=this._$Ej)==null?void 0:o.get(s))??c,this._$Em=null}}requestUpdate(e,t,i){var s;if(e!==void 0){const n=this.constructor,o=this[e];if(i??(i=n.getPropertyOptions(e)),!((i.hasChanged??W)(o,t)||i.useDefault&&i.reflect&&o===((s=this._$Ej)==null?void 0:s.get(e))&&!this.hasAttribute(n._$Eu(e,i))))return;this.C(e,t,i)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(e,t,{useDefault:i,reflect:s,wrapped:n},o){i&&!(this._$Ej??(this._$Ej=new Map)).has(e)&&(this._$Ej.set(e,o??t??this[e]),n!==!0||o!==void 0)||(this._$AL.has(e)||(this.hasUpdated||i||(t=void 0),this._$AL.set(e,t)),s===!0&&this._$Em!==e&&(this._$Eq??(this._$Eq=new Set)).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var i;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[n,o]of this._$Ep)this[n]=o;this._$Ep=void 0}const s=this.constructor.elementProperties;if(s.size>0)for(const[n,o]of s){const{wrapped:a}=o,h=this[n];a!==!0||this._$AL.has(n)||h===void 0||this.C(n,void 0,o,h)}}let e=!1;const t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),(i=this._$EO)==null||i.forEach((s=>{var n;return(n=s.hostUpdate)==null?void 0:n.call(s)})),this.update(t)):this._$EM()}catch(s){throw e=!1,this._$EM(),s}e&&this._$AE(t)}willUpdate(e){}_$AE(e){var t;(t=this._$EO)==null||t.forEach((i=>{var s;return(s=i.hostUpdated)==null?void 0:s.call(i)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&(this._$Eq=this._$Eq.forEach((t=>this._$ET(t,this[t])))),this._$EM()}updated(e){}firstUpdated(e){}};v.elementStyles=[],v.shadowRootOptions={mode:"open"},v[C("elementProperties")]=new Map,v[C("finalized")]=new Map,j==null||j({ReactiveElement:v}),(g.reactiveElementVersions??(g.reactiveElementVersions=[])).push("2.1.1");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const x=globalThis,D=x.trustedTypes,Y=D?D.createPolicy("lit-html",{createHTML:r=>r}):void 0,he="$lit$",$=`lit$${Math.random().toFixed(9).slice(2)}$`,ae="?"+$,ve=`<${ae}>`,b=document,O=()=>b.createComment(""),k=r=>r===null||typeof r!="object"&&typeof r!="function",F=Array.isArray,Ee=r=>F(r)||typeof(r==null?void 0:r[Symbol.iterator])=="function",z=`[ 	
+\f\r]`,w=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,ee=/-->/g,te=/>/g,_=RegExp(`>|${z}(?:([^\\s"'>=/]+)(${z}*=${z}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`,"g"),se=/'/g,ie=/"/g,le=/^(?:script|style|textarea|title)$/i,Se=r=>(e,...t)=>({_$litType$:r,strings:e,values:t}),we=Se(1),E=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),re=new WeakMap,y=b.createTreeWalker(b,129);function ce(r,e){if(!F(r)||!r.hasOwnProperty("raw"))throw Error("invalid template strings array");return Y!==void 0?Y.createHTML(e):e}const Ce=(r,e)=>{const t=r.length-1,i=[];let s,n=e===2?"<svg>":e===3?"<math>":"",o=w;for(let a=0;a<t;a++){const h=r[a];let c,p,l=-1,u=0;for(;u<h.length&&(o.lastIndex=u,p=o.exec(h),p!==null);)u=o.lastIndex,o===w?p[1]==="!--"?o=ee:p[1]!==void 0?o=te:p[2]!==void 0?(le.test(p[2])&&(s=RegExp("</"+p[2],"g")),o=_):p[3]!==void 0&&(o=_):o===_?p[0]===">"?(o=s??w,l=-1):p[1]===void 0?l=-2:(l=o.lastIndex-p[2].length,c=p[1],o=p[3]===void 0?_:p[3]==='"'?ie:se):o===ie||o===se?o=_:o===ee||o===te?o=w:(o=_,s=void 0);const f=o===_&&r[a+1].startsWith("/>")?" ":"";n+=o===w?h+ve:l>=0?(i.push(c),h.slice(0,l)+he+h.slice(l)+$+f):h+$+(l===-2?a:f)}return[ce(r,n+(r[t]||"<?>")+(e===2?"</svg>":e===3?"</math>":"")),i]};class U{constructor({strings:e,_$litType$:t},i){let s;this.parts=[];let n=0,o=0;const a=e.length-1,h=this.parts,[c,p]=Ce(e,t);if(this.el=U.createElement(c,i),y.currentNode=this.el.content,t===2||t===3){const l=this.el.content.firstChild;l.replaceWith(...l.childNodes)}for(;(s=y.nextNode())!==null&&h.length<a;){if(s.nodeType===1){if(s.hasAttributes())for(const l of s.getAttributeNames())if(l.endsWith(he)){const u=p[o++],f=s.getAttribute(l).split($),L=/([.?@])?(.*)/.exec(u);h.push({type:1,index:n,name:L[2],strings:f,ctor:L[1]==="."?Pe:L[1]==="?"?Oe:L[1]==="@"?ke:I}),s.removeAttribute(l)}else l.startsWith($)&&(h.push({type:6,index:n}),s.removeAttribute(l));if(le.test(s.tagName)){const l=s.textContent.split($),u=l.length-1;if(u>0){s.textContent=D?D.emptyScript:"";for(let f=0;f<u;f++)s.append(l[f],O()),y.nextNode(),h.push({type:2,index:++n});s.append(l[u],O())}}}else if(s.nodeType===8)if(s.data===ae)h.push({type:2,index:n});else{let l=-1;for(;(l=s.data.indexOf($,l+1))!==-1;)h.push({type:7,index:n}),l+=$.length-1}n++}}static createElement(e,t){const i=b.createElement("template");return i.innerHTML=e,i}}function S(r,e,t=r,i){var o,a;if(e===E)return e;let s=i!==void 0?(o=t._$Co)==null?void 0:o[i]:t._$Cl;const n=k(e)?void 0:e._$litDirective$;return(s==null?void 0:s.constructor)!==n&&((a=s==null?void 0:s._$AO)==null||a.call(s,!1),n===void 0?s=void 0:(s=new n(r),s._$AT(r,t,i)),i!==void 0?(t._$Co??(t._$Co=[]))[i]=s:t._$Cl=s),s!==void 0&&(e=S(r,s._$AS(r,e.values),s,i)),e}class xe{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:t},parts:i}=this._$AD,s=((e==null?void 0:e.creationScope)??b).importNode(t,!0);y.currentNode=s;let n=y.nextNode(),o=0,a=0,h=i[0];for(;h!==void 0;){if(o===h.index){let c;h.type===2?c=new T(n,n.nextSibling,this,e):h.type===1?c=new h.ctor(n,h.name,h.strings,this,e):h.type===6&&(c=new Ue(n,this,e)),this._$AV.push(c),h=i[++a]}o!==(h==null?void 0:h.index)&&(n=y.nextNode(),o++)}return y.currentNode=b,s}p(e){let t=0;for(const i of this._$AV)i!==void 0&&(i.strings!==void 0?(i._$AI(e,i,t),t+=i.strings.length-2):i._$AI(e[t])),t++}}class T{get _$AU(){var e;return((e=this._$AM)==null?void 0:e._$AU)??this._$Cv}constructor(e,t,i,s){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=i,this.options=s,this._$Cv=(s==null?void 0:s.isConnected)??!0}get parentNode(){let e=this._$AA.parentNode;const t=this._$AM;return t!==void 0&&(e==null?void 0:e.nodeType)===11&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=S(this,e,t),k(e)?e===d||e==null||e===""?(this._$AH!==d&&this._$AR(),this._$AH=d):e!==this._$AH&&e!==E&&this._(e):e._$litType$!==void 0?this.$(e):e.nodeType!==void 0?this.T(e):Ee(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==d&&k(this._$AH)?this._$AA.nextSibling.data=e:this.T(b.createTextNode(e)),this._$AH=e}$(e){var n;const{values:t,_$litType$:i}=e,s=typeof i=="number"?this._$AC(e):(i.el===void 0&&(i.el=U.createElement(ce(i.h,i.h[0]),this.options)),i);if(((n=this._$AH)==null?void 0:n._$AD)===s)this._$AH.p(t);else{const o=new xe(s,this),a=o.u(this.options);o.p(t),this.T(a),this._$AH=o}}_$AC(e){let t=re.get(e.strings);return t===void 0&&re.set(e.strings,t=new U(e)),t}k(e){F(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let i,s=0;for(const n of e)s===t.length?t.push(i=new T(this.O(O()),this.O(O()),this,this.options)):i=t[s],i._$AI(n),s++;s<t.length&&(this._$AR(i&&i._$AB.nextSibling,s),t.length=s)}_$AR(e=this._$AA.nextSibling,t){var i;for((i=this._$AP)==null?void 0:i.call(this,!1,!0,t);e!==this._$AB;){const s=e.nextSibling;e.remove(),e=s}}setConnected(e){var t;this._$AM===void 0&&(this._$Cv=e,(t=this._$AP)==null||t.call(this,e))}}class I{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,i,s,n){this.type=1,this._$AH=d,this._$AN=void 0,this.element=e,this.name=t,this._$AM=s,this.options=n,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=d}_$AI(e,t=this,i,s){const n=this.strings;let o=!1;if(n===void 0)e=S(this,e,t,0),o=!k(e)||e!==this._$AH&&e!==E,o&&(this._$AH=e);else{const a=e;let h,c;for(e=n[0],h=0;h<n.length-1;h++)c=S(this,a[i+h],t,h),c===E&&(c=this._$AH[h]),o||(o=!k(c)||c!==this._$AH[h]),c===d?e=d:e!==d&&(e+=(c??"")+n[h+1]),this._$AH[h]=c}o&&!s&&this.j(e)}j(e){e===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class Pe extends I{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===d?void 0:e}}class Oe extends I{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==d)}}class ke extends I{constructor(e,t,i,s,n){super(e,t,i,s,n),this.type=5}_$AI(e,t=this){if((e=S(this,e,t,0)??d)===E)return;const i=this._$AH,s=e===d&&i!==d||e.capture!==i.capture||e.once!==i.once||e.passive!==i.passive,n=e!==d&&(i===d||s);s&&this.element.removeEventListener(this.name,this,i),n&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){var t;typeof this._$AH=="function"?this._$AH.call(((t=this.options)==null?void 0:t.host)??this.element,e):this._$AH.handleEvent(e)}}class Ue{constructor(e,t,i){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(e){S(this,e)}}const B=x.litHtmlPolyfillSupport;B==null||B(U,T),(x.litHtmlVersions??(x.litHtmlVersions=[])).push("3.3.1");const Te=(r,e,t)=>{const i=(t==null?void 0:t.renderBefore)??e;let s=i._$litPart$;if(s===void 0){const n=(t==null?void 0:t.renderBefore)??null;i._$litPart$=s=new T(e.insertBefore(O(),n),n,void 0,t??{})}return s._$AI(r),s};/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const A=globalThis;class P extends v{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t;const e=super.createRenderRoot();return(t=this.renderOptions).renderBefore??(t.renderBefore=e.firstChild),e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=Te(t,this.renderRoot,this.renderOptions)}connectedCallback(){var e;super.connectedCallback(),(e=this._$Do)==null||e.setConnected(!0)}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this._$Do)==null||e.setConnected(!1)}render(){return E}}var ne;P._$litElement$=!0,P.finalized=!0,(ne=A.litElementHydrateSupport)==null||ne.call(A,{LitElement:P});const q=A.litElementPolyfillSupport;q==null||q({LitElement:P});(A.litElementVersions??(A.litElementVersions=[])).push("4.2.1");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const He={attribute:!0,type:String,converter:R,reflect:!1,hasChanged:W},Me=(r=He,e,t)=>{const{kind:i,metadata:s}=t;let n=globalThis.litPropertyMetadata.get(s);if(n===void 0&&globalThis.litPropertyMetadata.set(s,n=new Map),i==="setter"&&((r=Object.create(r)).wrapped=!0),n.set(t.name,r),i==="accessor"){const{name:o}=t;return{set(a){const h=e.get.call(this);e.set.call(this,a),this.requestUpdate(o,h,r)},init(a){return a!==void 0&&this.C(o,void 0,r,a),a}}}if(i==="setter"){const{name:o}=t;return function(a){const h=this[o];e.call(this,a),this.requestUpdate(o,h,r)}}throw Error("Unsupported decorator location: "+i)};function H(r){return(e,t)=>typeof t=="object"?Me(r,e,t):((i,s,n)=>{const o=s.hasOwnProperty(n);return s.constructor.createProperty(n,i),o?Object.getOwnPropertyDescriptor(s,n):void 0})(r,e,t)}var Le=Object.defineProperty,M=(r,e,t,i)=>{for(var s=void 0,n=r.length-1,o;n>=0;n--)(o=r[n])&&(s=o(e,t,s)||s);return s&&Le(e,t,s),s};const J=class J extends P{constructor(){super(),this.checked=!1,this.onLabel="On",this.offLabel="Off",this.storageKey=null,this.name="",this.boundHandleExternalChange=this.handleExternalChange.bind(this),window.addEventListener("toggle-changed",this.boundHandleExternalChange)}connectedCallback(){if(super.connectedCallback(),this.storageKey){const e=localStorage.getItem(this.storageKey);e!==null&&(this.checked=e==="true")}}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("toggle-changed",this.boundHandleExternalChange)}handleExternalChange(e){const t=e;this.name&&t.detail.name===this.name&&(this.checked=t.detail.checked)}dispatchChangeEvent(e){const t=new CustomEvent("toggle-change",{bubbles:!0,composed:!0,detail:{checked:e,name:this.name}});this.dispatchEvent(t),this.name&&window.dispatchEvent(new CustomEvent("toggle-changed",{detail:{checked:e,name:this.name}}))}handleToggleChange(e){const t=e.target;this.checked=t.checked,this.storageKey&&localStorage.setItem(this.storageKey,this.checked.toString()),this.dispatchChangeEvent(this.checked)}render(){return we`
+      <span class="label">${this.offLabel}</span>
+      <label class="toggle-switch">
+        <input
+          type="checkbox"
+          .checked=${this.checked}
+          @change=${this.handleToggleChange}
+        >
+        <span class="slider"></span>
+      </label>
+      <span class="label">${this.onLabel}</span>
+    `}};J.styles=ue`
+    :host {
+      display: flex;
+      align-items: center;
+      margin-right: 10px;
+    }
+
+    .toggle-switch {
+      position: relative;
+      display: inline-block;
+      width: 44px;
+      height: 24px;
+      margin: 0 8px;
+    }
+
+    .toggle-switch input {
+      opacity: 0;
+      width: 0;
+      height: 0;
+    }
+
+    .slider {
+      position: absolute;
+      cursor: pointer;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      background-color: #4a5568;
+      transition: .3s;
+      border-radius: 24px;
+    }
+
+    .slider:before {
+      position: absolute;
+      content: "";
+      height: 18px;
+      width: 18px;
+      left: 3px;
+      bottom: 3px;
+      background-color: white;
+      transition: .3s;
+      border-radius: 50%;
+    }
+
+    input:checked + .slider {
+      background-color: #3b82f6;
+    }
+
+    input:checked + .slider:before {
+      transform: translateX(20px);
+    }
+
+    .label {
+      font-size: 14px;
+      user-select: none;
+    }
+  `;let m=J;M([H({type:Boolean})],m.prototype,"checked");M([H({type:String,attribute:"on-label"})],m.prototype,"onLabel");M([H({type:String,attribute:"off-label"})],m.prototype,"offLabel");M([H({type:String,attribute:"storage-key"})],m.prototype,"storageKey");M([H({type:String})],m.prototype,"name");customElements.define("toggle-switch",m);const Ne=()=>{const r=localStorage.getItem("user-theme-preference");return r==="dark"||r==="light"?(de(r),r==="dark"):window.matchMedia("(prefers-color-scheme: dark)").matches},de=r=>{document.body.classList.remove("theme-dark","theme-light"),document.body.classList.add(`theme-${r}`)};customElements.whenDefined("toggle-switch").then(()=>{const r=document.querySelectorAll("toggle-switch"),e=Ne();r.forEach(t=>{t.checked=e}),r.forEach(t=>{t.addEventListener("toggle-change",i=>{const s=i.detail.checked?"dark":"light";localStorage.setItem("user-theme-preference",s),de(s)})})});customElements.whenDefined("toggle-switch").then(()=>{const r=document.querySelector("header toggle-switch");r.onLabel="🌙 Dark",r.offLabel="☀️ Light"});customElements.whenDefined("toggle-switch").then(()=>{const r=document.getElementById("sync1");r.onLabel="🌙",r.offLabel="☀️"});

package/dist/data-table.d.ts

@@ -0,0 +1,191 @@
+import { LitElement, TemplateResult } from 'lit';
+import './action-menu';
+import 'iconify-icon';
+/**
+ * Type definition for formatter functions
+ */
+type FormatterFunction = (value: any) => string;
+/**
+ * Type definition for sort functions
+ */
+type SortFunction = (a: RowData, b: RowData, direction: 'asc' | 'desc') => number;
+/**
+ * Type definition for link functions
+ */
+type LinkFunction = (row: RowData) => string;
+/**
+ * Type definition for row data
+ */
+interface RowData {
+    [key: string]: any;
+}
+/**
+ * Type definition for column configuration
+ */
+export interface DataTableColumn {
+    field: string;
+    label: string;
+    width?: string;
+    sortable?: boolean;
+    searchable?: boolean;
+    formatter?: string | ((value: any, row: RowData) => any);
+    sortFn?: SortFunction;
+    link?: string | LinkFunction;
+    linkTarget?: '_self' | '_blank' | '_parent' | '_top';
+}
+/**
+ * Data table formatters for common column types
+ */
+export declare const dataTableFormatters: Record<string, FormatterFunction>;
+/**
+ * A feature-rich data table component with sorting, filtering, and pagination.
+ * Supports custom cell rendering, row actions, and various formatters.
+ */
+export declare class DataTable extends LitElement {
+    columns: DataTableColumn[];
+    rows: RowData[];
+    rowsPerPage: number;
+    searchable: boolean;
+    sortable: boolean;
+    paginated: boolean;
+    loading: boolean;
+    keyField: string;
+    rowActions: boolean;
+    rowActionsWidth: number;
+    emptyMessage: string;
+    noResultsMessage: string;
+    private _searchQuery;
+    private _currentPage;
+    private _sortColumn;
+    private _sortDirection;
+    static styles: import("lit").CSSResult;
+    /**
+     * Get nested value from object using dot notation
+     * @param obj - The object to extract value from
+     * @param path - The path (e.g., 'user.name')
+     * @returns The value at the path
+     * @private
+     */
+    private _getNestedValue;
+    /**
+     * Format a cell value using column formatter
+     * @param row - The row data
+     * @param column - The column definition
+     * @returns The formatted value
+     * @private
+     */
+    private _formatValue;
+    /**
+     * Get link URL for a cell if column has link property
+     * @param row - The row data
+     * @param column - The column definition
+     * @returns The link URL or null
+     * @private
+     */
+    private _getLinkUrl;
+    /**
+     * Render cell content with optional link
+     * @param row - The row data
+     * @param column - The column definition
+     * @returns The rendered cell content
+     * @private
+     */
+    private _renderCellContent;
+    /**
+     * Handle link click - emit navigation event instead of following link
+     * @param event - The click event
+     * @param url - The URL to navigate to
+     * @param row - The row data
+     * @private
+     */
+    private _handleLinkClick;
+    /**
+     * Get filtered rows based on search query
+     * @returns Filtered rows
+     * @private
+     */
+    private get _filteredRows();
+    /**
+     * Get sorted rows
+     * @returns Sorted rows
+     * @private
+     */
+    private get _sortedRows();
+    /**
+     * Get paginated rows
+     * @returns Paginated rows
+     * @private
+     */
+    private get _paginatedRows();
+    /**
+     * Get total number of pages
+     * @returns Total pages
+     * @private
+     */
+    private get _totalPages();
+    /**
+     * Get pagination info
+     * @returns Pagination info
+     * @private
+     */
+    private get _paginationInfo();
+    /**
+     * Handle search input
+     * @param e - The input event
+     * @private
+     */
+    private _handleSearch;
+    /**
+     * Handle column sort
+     * @param columnField - The column field to sort by
+     * @private
+     */
+    private _handleSort;
+    /**
+     * Navigate to a specific page
+     * @param page - The page number
+     */
+    goToPage(page: number): void;
+    /**
+     * Navigate to the next page
+     */
+    nextPage(): void;
+    /**
+     * Navigate to the previous page
+     */
+    prevPage(): void;
+    /**
+     * Reset search query
+     */
+    resetSearch(): void;
+    /**
+     * Reset sort to default state
+     */
+    resetSort(): void;
+    /**
+     * Render sort icon
+     * @param column - The column definition
+     * @returns TemplateResult
+     * @private
+     */
+    private _renderSortIcon;
+    /**
+     * Render chevron left icon
+     * @returns TemplateResult
+     * @private
+     */
+    private _renderChevronLeft;
+    /**
+     * Render chevron right icon
+     * @returns TemplateResult
+     * @private
+     */
+    private _renderChevronRight;
+    /**
+     * Render the component
+     * @returns TemplateResult
+     */
+    render(): TemplateResult;
+}
+export {};
+//# sourceMappingURL=data-table.d.ts.map

package/dist/data-table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../Components/data-table.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAE5D,OAAO,eAAe,CAAC;AACvB,OAAO,cAAc,CAAC;AAatB;;GAEG;AACH,KAAK,iBAAiB,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,MAAM,CAAC;AAEhD;;GAEG;AACH,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,MAAM,CAAC;AAElF;;GAEG;AACH,KAAK,YAAY,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK,MAAM,CAAC;AAE7C;;GAEG;AACH,UAAU,OAAO;IACf,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,OAAO,KAAK,GAAG,CAAC,CAAC;IACzD,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;CACtD;AAED;;GAEG;AACH,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CA8DjE,CAAC;AAEF;;;GAGG;AACH,qBAAa,SAAU,SAAQ,UAAU;IAEvC,OAAO,EAAE,eAAe,EAAE,CAAM;IAGhC,IAAI,EAAE,OAAO,EAAE,CAAM;IAGrB,WAAW,SAAM;IAGjB,UAAU,UAAQ;IAGlB,QAAQ,UAAQ;IAGhB,SAAS,UAAQ;IAGjB,OAAO,UAAS;IAGhB,QAAQ,SAAQ;IAGhB,UAAU,UAAQ;IAGlB,eAAe,SAAM;IAGrB,YAAY,SAAuB;IAGnC,gBAAgB,SAAsB;IAItC,OAAO,CAAC,YAAY,CAAM;IAG1B,OAAO,CAAC,YAAY,CAAK;IAGzB,OAAO,CAAC,WAAW,CAAuB;IAG1C,OAAO,CAAC,cAAc,CAAyB;IAE/C,OAAgB,MAAM,0BA6NpB;IAEF;;;;;;OAMG;IACH,OAAO,CAAC,eAAe;IAIvB;;;;;;OAMG;IACH,OAAO,CAAC,YAAY;IAmBpB;;;;;;OAMG;IACH,OAAO,CAAC,WAAW;IAgBnB;;;;;;OAMG;IACH,OAAO,CAAC,kBAAkB;IAuB1B;;;;;;OAMG;IACH,OAAO,CAAC,gBAAgB;IAWxB;;;;OAIG;IACH,OAAO,KAAK,aAAa,GAexB;IAED;;;;OAIG;IACH,OAAO,KAAK,WAAW,GA6BtB;IAED;;;;OAIG;IACH,OAAO,KAAK,cAAc,GAQzB;IAED;;;;OAIG;IACH,OAAO,KAAK,WAAW,GAKtB;IAED;;;;OAIG;IACH,OAAO,KAAK,eAAe,GAQ1B;IAED;;;;OAIG;IACH,OAAO,CAAC,aAAa;IAMrB;;;;OAIG;IACH,OAAO,CAAC,WAAW;IAiBnB;;;OAGG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAM5B;;OAEG;IACH,QAAQ,IAAI,IAAI;IAIhB;;OAEG;IACH,QAAQ,IAAI,IAAI;IAIhB;;OAEG;IACH,WAAW,IAAI,IAAI;IAInB;;OAEG;IACH,SAAS,IAAI,IAAI;IAMjB;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IAwBvB;;;;OAIG;IACH,OAAO,CAAC,kBAAkB;IAM1B;;;;OAIG;IACH,OAAO,CAAC,mBAAmB;IAM3B;;;OAGG;IACM,MAAM,IAAI,cAAc;CA+GlC"}