snice 3.1.0 → 3.3.0

package/dist/components/tree/snice-tree-item.js

@@ -0,0 +1,301 @@
+import { __esDecorate, __runInitializers } from 'tslib';
+import { element, property, dispatch, render, styles, unsafeHTML, html, css } from 'snice';
+import '../checkbox/snice-checkbox.js';
+
+var cssContent = ":host{display:block}.tree-item{position:relative;user-select:none}.tree-item__content{display:flex;align-items:center;gap:var(--spacing-xs,.5rem);padding:var(--spacing-xs,.5rem) var(--spacing-sm,.75rem);padding-left:calc(var(--tree-level,0) * var(--spacing-xl,1.5rem) + var(--spacing-sm,.75rem));cursor:pointer;border-radius:var(--border-radius-sm,.25rem);transition:background-color .2s;position:relative}.tree-item__content:hover{background-color:var(--color-neutral-100,#f5f5f5)}.tree-item__content:focus{outline:2px solid var(--color-primary-500,#3b82f6);outline-offset:-2px}.tree-item__content--selected{background-color:var(--color-primary-100,#dbeafe);color:var(--color-primary-700,#1d4ed8)}.tree-item__content--selected:hover{background-color:var(--color-primary-200,#bfdbfe)}.tree-item__content--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.tree-item__expander{width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s;cursor:pointer}.tree-item__expander--expanded{transform:rotate(90deg)}.tree-item__expander--hidden{visibility:hidden}.tree-item__expander svg{width:1rem;height:1rem;fill:currentColor}.tree-item__checkbox{flex-shrink:0}.tree-item__icon{flex-shrink:0;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center}.tree-item__icon-image{width:100%;height:100%;object-fit:contain}.tree-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-item__children{display:none}.tree-item__children--expanded{display:block}";
+
+let SniceTreeItem = (() => {
+    let _classDecorators = [element('snice-tree-item')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _instanceExtraInitializers = [];
+    let __version_decorators;
+    let __version_initializers = [];
+    let __version_extraInitializers = [];
+    let _expanded_decorators;
+    let _expanded_initializers = [];
+    let _expanded_extraInitializers = [];
+    let _selected_decorators;
+    let _selected_initializers = [];
+    let _selected_extraInitializers = [];
+    let _checked_decorators;
+    let _checked_initializers = [];
+    let _checked_extraInitializers = [];
+    let _showCheckbox_decorators;
+    let _showCheckbox_initializers = [];
+    let _showCheckbox_extraInitializers = [];
+    let _showIcon_decorators;
+    let _showIcon_initializers = [];
+    let _showIcon_extraInitializers = [];
+    let _dispatchToggleEvent_decorators;
+    let _dispatchSelectEvent_decorators;
+    let _dispatchCheckEvent_decorators;
+    let _dispatchLazyLoadEvent_decorators;
+    let _render_decorators;
+    let _styles_decorators;
+    (class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __version_decorators = [property({ type: Number })];
+            _expanded_decorators = [property({ type: Boolean })];
+            _selected_decorators = [property({ type: Boolean })];
+            _checked_decorators = [property({ type: Boolean })];
+            _showCheckbox_decorators = [property({ type: Boolean, attribute: 'show-checkbox' })];
+            _showIcon_decorators = [property({ type: Boolean, attribute: 'show-icon' })];
+            _dispatchToggleEvent_decorators = [dispatch('tree-item-toggle', { bubbles: true, composed: true })];
+            _dispatchSelectEvent_decorators = [dispatch('tree-item-select', { bubbles: true, composed: true })];
+            _dispatchCheckEvent_decorators = [dispatch('tree-item-check', { bubbles: true, composed: true })];
+            _dispatchLazyLoadEvent_decorators = [dispatch('tree-item-lazy-load', { bubbles: true, composed: true })];
+            _render_decorators = [render()];
+            _styles_decorators = [styles()];
+            __esDecorate(this, null, _dispatchToggleEvent_decorators, { kind: "method", name: "dispatchToggleEvent", static: false, private: false, access: { has: obj => "dispatchToggleEvent" in obj, get: obj => obj.dispatchToggleEvent }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _dispatchSelectEvent_decorators, { kind: "method", name: "dispatchSelectEvent", static: false, private: false, access: { has: obj => "dispatchSelectEvent" in obj, get: obj => obj.dispatchSelectEvent }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _dispatchCheckEvent_decorators, { kind: "method", name: "dispatchCheckEvent", static: false, private: false, access: { has: obj => "dispatchCheckEvent" in obj, get: obj => obj.dispatchCheckEvent }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _dispatchLazyLoadEvent_decorators, { kind: "method", name: "dispatchLazyLoadEvent", static: false, private: false, access: { has: obj => "dispatchLazyLoadEvent" in obj, get: obj => obj.dispatchLazyLoadEvent }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _render_decorators, { kind: "method", name: "render", static: false, private: false, access: { has: obj => "render" in obj, get: obj => obj.render }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _styles_decorators, { kind: "method", name: "styles", static: false, private: false, access: { has: obj => "styles" in obj, get: obj => obj.styles }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(null, null, __version_decorators, { kind: "field", name: "_version", static: false, private: false, access: { has: obj => "_version" in obj, get: obj => obj._version, set: (obj, value) => { obj._version = value; } }, metadata: _metadata }, __version_initializers, __version_extraInitializers);
+            __esDecorate(null, null, _expanded_decorators, { kind: "field", name: "expanded", static: false, private: false, access: { has: obj => "expanded" in obj, get: obj => obj.expanded, set: (obj, value) => { obj.expanded = value; } }, metadata: _metadata }, _expanded_initializers, _expanded_extraInitializers);
+            __esDecorate(null, null, _selected_decorators, { kind: "field", name: "selected", static: false, private: false, access: { has: obj => "selected" in obj, get: obj => obj.selected, set: (obj, value) => { obj.selected = value; } }, metadata: _metadata }, _selected_initializers, _selected_extraInitializers);
+            __esDecorate(null, null, _checked_decorators, { kind: "field", name: "checked", static: false, private: false, access: { has: obj => "checked" in obj, get: obj => obj.checked, set: (obj, value) => { obj.checked = value; } }, metadata: _metadata }, _checked_initializers, _checked_extraInitializers);
+            __esDecorate(null, null, _showCheckbox_decorators, { kind: "field", name: "showCheckbox", static: false, private: false, access: { has: obj => "showCheckbox" in obj, get: obj => obj.showCheckbox, set: (obj, value) => { obj.showCheckbox = value; } }, metadata: _metadata }, _showCheckbox_initializers, _showCheckbox_extraInitializers);
+            __esDecorate(null, null, _showIcon_decorators, { kind: "field", name: "showIcon", static: false, private: false, access: { has: obj => "showIcon" in obj, get: obj => obj.showIcon, set: (obj, value) => { obj.showIcon = value; } }, metadata: _metadata }, _showIcon_initializers, _showIcon_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        get node() {
+            return this._node;
+        }
+        get level() {
+            return this._level;
+        }
+        get hasChildren() {
+            return !!(this._node.children && this._node.children.length > 0);
+        }
+        setNode(node, level) {
+            this._node = node;
+            this._level = level;
+            // Sync internal state
+            if (node.expanded !== undefined) {
+                this.expanded = node.expanded;
+            }
+            if (node.selected !== undefined) {
+                this.selected = node.selected;
+            }
+            if (node.checked !== undefined) {
+                this.checked = node.checked;
+            }
+            // Trigger re-render by updating reactive property
+            this._version++;
+            // Update child tree items after render completes
+            requestAnimationFrame(() => {
+                requestAnimationFrame(() => {
+                    this.updateChildTreeItems();
+                });
+            });
+        }
+        updateChildTreeItems() {
+            if (!this.shadowRoot || !this.hasChildren)
+                return;
+            const childItems = this.shadowRoot.querySelectorAll('.tree-item__children > snice-tree-item');
+            this.node.children?.forEach((child, index) => {
+                if (childItems[index] && childItems[index].setNode) {
+                    childItems[index].setNode(child, this.level + 1);
+                }
+            });
+        }
+        dispatchToggleEvent() {
+            return { nodeId: this.node.id, expanded: this.expanded };
+        }
+        dispatchSelectEvent() {
+            return { nodeId: this.node.id, selected: this.selected };
+        }
+        dispatchCheckEvent() {
+            return { nodeId: this.node.id, checked: this.checked };
+        }
+        dispatchLazyLoadEvent() {
+            return { nodeId: this.node.id, node: this.node };
+        }
+        render() {
+            const contentClasses = [
+                'tree-item__content',
+                this.selected ? 'tree-item__content--selected' : '',
+                this.node.disabled ? 'tree-item__content--disabled' : ''
+            ].filter(Boolean).join(' ');
+            const expanderClasses = [
+                'tree-item__expander',
+                this.expanded ? 'tree-item__expander--expanded' : '',
+                !this.hasChildren ? 'tree-item__expander--hidden' : ''
+            ].filter(Boolean).join(' ');
+            const childrenClasses = [
+                'tree-item__children',
+                this.expanded ? 'tree-item__children--expanded' : ''
+            ].filter(Boolean).join(' ');
+            const chevronIcon = `<svg viewBox="0 0 24 24"><path d="M9 6l6 6-6 6"/></svg>`;
+            return html `
+      <div class="tree-item" style="--tree-level: ${this.level}">
+        <div
+          class="${contentClasses}"
+          part="content"
+          role="treeitem"
+          tabindex="${this.node.disabled ? -1 : 0}"
+          aria-selected="${this.selected}"
+          aria-expanded="${this.hasChildren ? this.expanded : undefined}"
+          aria-disabled="${this.node.disabled || false}"
+          @click="${(e) => this.handleContentClick(e)}"
+          @keydown="${(e) => this.handleKeydown(e)}">
+
+          <div
+            class="${expanderClasses}"
+            part="expander"
+            @click="${(e) => this.handleExpanderClick(e)}">
+            ${unsafeHTML(chevronIcon)}
+          </div>
+
+          <if ${this.showCheckbox}>
+            <div class="tree-item__checkbox" part="checkbox">
+              <snice-checkbox
+                .checked=${this.checked}
+                .disabled=${this.node.disabled || false}
+                size="small"
+                @change=${(e) => this.handleCheckboxChange(e)}>
+              </snice-checkbox>
+            </div>
+          </if>
+
+          <if ${this.showIcon && (this.node.icon || this.node.iconImage)}>
+            <div class="tree-item__icon" part="icon">
+              <if ${this.node.iconImage}>
+                <img
+                  class="tree-item__icon-image"
+                  src="${this.node.iconImage}"
+                  alt=""
+                  part="icon-image" />
+              </if>
+              <if ${!this.node.iconImage && this.node.icon}>
+                <span part="icon-text">${this.node.icon}</span>
+              </if>
+            </div>
+          </if>
+
+          <div class="tree-item__label" part="label">${this.node.label}</div>
+        </div>
+
+        <if ${this.hasChildren}>
+          <div class="${childrenClasses}" part="children" role="group">
+            ${this.node.children?.map(child => html `
+              <snice-tree-item
+                ?show-checkbox=${this.showCheckbox}
+                ?show-icon=${this.showIcon}>
+              </snice-tree-item>
+            `)}
+          </div>
+        </if>
+      </div>
+    `;
+        }
+        styles() {
+            return css /*css*/ `${cssContent}`;
+        }
+        handleExpanderClick(e) {
+            e.stopPropagation();
+            this.toggle();
+        }
+        handleContentClick(e) {
+            if (this.node.disabled)
+                return;
+            this.select();
+        }
+        handleKeydown(e) {
+            if (this.node.disabled)
+                return;
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                this.select();
+            }
+            else if (e.key === 'ArrowRight') {
+                e.preventDefault();
+                if (this.hasChildren && !this.expanded) {
+                    this.expand();
+                }
+            }
+            else if (e.key === 'ArrowLeft') {
+                e.preventDefault();
+                if (this.hasChildren && this.expanded) {
+                    this.collapse();
+                }
+            }
+        }
+        handleCheckboxChange(e) {
+            e.stopPropagation();
+            this.checked = e.detail.checked;
+            this.dispatchCheckEvent();
+        }
+        // Public API
+        expand() {
+            if (!this.hasChildren || this.expanded)
+                return;
+            // If lazy load, dispatch event before expanding
+            if (this.node.lazy && (!this.node.children || this.node.children.length === 0)) {
+                this.dispatchLazyLoadEvent();
+            }
+            this.expanded = true;
+            this.dispatchToggleEvent();
+        }
+        collapse() {
+            if (!this.hasChildren || !this.expanded)
+                return;
+            this.expanded = false;
+            this.dispatchToggleEvent();
+        }
+        toggle() {
+            if (this.expanded) {
+                this.collapse();
+            }
+            else {
+                this.expand();
+            }
+        }
+        select() {
+            if (this.node.disabled)
+                return;
+            this.selected = true;
+            this.dispatchSelectEvent();
+        }
+        deselect() {
+            this.selected = false;
+            this.dispatchSelectEvent();
+        }
+        check() {
+            if (this.node.disabled)
+                return;
+            this.checked = true;
+            this.dispatchCheckEvent();
+        }
+        uncheck() {
+            this.checked = false;
+            this.dispatchCheckEvent();
+        }
+        constructor() {
+            super(...arguments);
+            this._node = (__runInitializers(this, _instanceExtraInitializers), { id: '', label: '' });
+            this._level = 0;
+            this._version = __runInitializers(this, __version_initializers, 0);
+            this.expanded = (__runInitializers(this, __version_extraInitializers), __runInitializers(this, _expanded_initializers, false));
+            this.selected = (__runInitializers(this, _expanded_extraInitializers), __runInitializers(this, _selected_initializers, false));
+            this.checked = (__runInitializers(this, _selected_extraInitializers), __runInitializers(this, _checked_initializers, false));
+            this.showCheckbox = (__runInitializers(this, _checked_extraInitializers), __runInitializers(this, _showCheckbox_initializers, false));
+            this.showIcon = (__runInitializers(this, _showCheckbox_extraInitializers), __runInitializers(this, _showIcon_initializers, true));
+            __runInitializers(this, _showIcon_extraInitializers);
+        }
+    });
+    return _classThis;
+})();
+
+export { SniceTreeItem };
+//# sourceMappingURL=snice-tree-item.js.map

package/dist/components/tree/snice-tree-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snice-tree-item.js","sources":["../../../components/tree/snice-tree-item.css?inline","../../../../components/tree/snice-tree-item.ts"],"sourcesContent":["export default \":host{display:block}.tree-item{position:relative;user-select:none}.tree-item__content{display:flex;align-items:center;gap:var(--spacing-xs,.5rem);padding:var(--spacing-xs,.5rem) var(--spacing-sm,.75rem);padding-left:calc(var(--tree-level,0) * var(--spacing-xl,1.5rem) + var(--spacing-sm,.75rem));cursor:pointer;border-radius:var(--border-radius-sm,.25rem);transition:background-color .2s;position:relative}.tree-item__content:hover{background-color:var(--color-neutral-100,#f5f5f5)}.tree-item__content:focus{outline:2px solid var(--color-primary-500,#3b82f6);outline-offset:-2px}.tree-item__content--selected{background-color:var(--color-primary-100,#dbeafe);color:var(--color-primary-700,#1d4ed8)}.tree-item__content--selected:hover{background-color:var(--color-primary-200,#bfdbfe)}.tree-item__content--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.tree-item__expander{width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s;cursor:pointer}.tree-item__expander--expanded{transform:rotate(90deg)}.tree-item__expander--hidden{visibility:hidden}.tree-item__expander svg{width:1rem;height:1rem;fill:currentColor}.tree-item__checkbox{flex-shrink:0}.tree-item__icon{flex-shrink:0;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center}.tree-item__icon-image{width:100%;height:100%;object-fit:contain}.tree-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-item__children{display:none}.tree-item__children--expanded{display:block}\";",null],"names":[],"mappings":"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"}

package/dist/components/tree/snice-tree-item.types.d.ts

@@ -0,0 +1,30 @@
+import type { TreeNode } from './snice-tree.types';
+export interface SniceTreeItemElement extends HTMLElement {
+    node: TreeNode;
+    level: number;
+    expanded: boolean;
+    selected: boolean;
+    checked: boolean;
+    showCheckbox: boolean;
+    showIcon: boolean;
+    hasChildren: boolean;
+    expand(): void;
+    collapse(): void;
+    toggle(): void;
+    select(): void;
+    deselect(): void;
+    check(): void;
+    uncheck(): void;
+}
+export interface TreeItemToggleDetail {
+    nodeId: string;
+    expanded: boolean;
+}
+export interface TreeItemSelectDetail {
+    nodeId: string;
+    selected: boolean;
+}
+export interface TreeItemCheckDetail {
+    nodeId: string;
+    checked: boolean;
+}

package/dist/components/tree/snice-tree.d.ts

@@ -0,0 +1,45 @@
+import type { TreeNode, TreeSelectionMode, SniceTreeElement } from './snice-tree.types';
+import './snice-tree-item';
+export declare class SniceTree extends HTMLElement implements SniceTreeElement {
+    selectionMode: TreeSelectionMode;
+    showCheckboxes: boolean;
+    showIcons: boolean;
+    expandOnClick: boolean;
+    nodes: TreeNode[];
+    selectedNodes: string[];
+    checkedNodes: string[];
+    private nodeMap;
+    treeItems: NodeListOf<HTMLElement>;
+    init(): void;
+    handleNodesChange(): void;
+    private updateTreeItems;
+    handleSelectedNodesChange(): void;
+    handleCheckedNodesChange(): void;
+    private buildNodeMap;
+    private syncNodeStates;
+    private handleItemToggle;
+    private handleItemSelect;
+    private handleItemCheck;
+    private handleLazyLoad;
+    private dispatchExpandEvent;
+    private dispatchCollapseEvent;
+    private dispatchSelectEvent;
+    private dispatchCheckEvent;
+    private dispatchLazyLoadEvent;
+    render(): import("snice").TemplateResult;
+    styles(): import("snice").CSSResult;
+    expandNode(id: string): void;
+    collapseNode(id: string): void;
+    toggleNode(id: string): void;
+    expandAll(): void;
+    collapseAll(): void;
+    selectNode(id: string): void;
+    deselectNode(id: string): void;
+    toggleSelection(id: string): void;
+    checkNode(id: string): void;
+    uncheckNode(id: string): void;
+    toggleCheck(id: string): void;
+    getNode(id: string): TreeNode | undefined;
+    getSelectedNodes(): TreeNode[];
+    getCheckedNodes(): TreeNode[];
+}