huibo-ui 0.3.0

package/dist/components/hb-tree.js

@@ -0,0 +1,344 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-1407a5e8.js';
+
+const treeCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-tree{background-color:var(--hb-color-bg-container);box-sizing:border-box;color:var(--hb-color-text);font-size:var(--hb-font-size-base)}.hb-tree,.hb-tree__children{list-style:none;margin:0;padding:0}.hb-tree__node{list-style:none;white-space:nowrap}.hb-tree__node-content{align-items:center;border-radius:var(--hb-border-radius-sm);box-sizing:border-box;cursor:pointer;display:flex;gap:var(--hb-spacing-xxs);height:28px;padding-right:var(--hb-spacing-xs);transition:background-color var(--hb-transition-duration,.2s)var(--hb-transition-function,ease)}.hb-tree__node-content:hover{background-color:var(--hb-color-fill-tertiary)}.hb-tree__node-content--selected{background-color:var(--hb-color-primary-bg)}.hb-tree__node--disabled>.hb-tree__node-content{cursor:not-allowed;opacity:.5}.hb-tree__node--disabled>.hb-tree__node-content:hover{background-color:#0000}.hb-tree__switcher{align-items:center;color:var(--hb-color-text-tertiary);display:inline-flex;flex-shrink:0;height:18px;justify-content:center;width:18px}.hb-tree__arrow{display:inline-block;font-size:10px;transition:transform var(--hb-transition-duration,.2s)}.hb-tree__arrow--expanded{transform:rotate(90deg)}.hb-tree--show-line .hb-tree__switcher{color:var(--hb-color-border)}.hb-tree__line-dot{border-bottom:1px solid var(--hb-color-border);border-bottom-left-radius:var(--hb-border-radius-sm);border-left:1px solid var(--hb-color-border);height:6px;width:6px}.hb-tree__checkbox{align-items:center;background-color:var(--hb-color-bg-container);border:1px solid var(--hb-color-border);border-radius:var(--hb-border-radius-xs,2px);color:#fff;display:inline-flex;flex-shrink:0;font-size:11px;height:16px;justify-content:center;line-height:1;transition:all var(--hb-transition-duration,.2s);width:16px}.hb-tree__checkbox:hover:not(.hb-tree__checkbox--disabled){border-color:var(--hb-color-primary)}.hb-tree__checkbox--checked,.hb-tree__checkbox--indeterminate{background-color:var(--hb-color-primary);border-color:var(--hb-color-primary)}.hb-tree__checkbox--disabled{cursor:not-allowed;opacity:.5}.hb-tree__title{flex:1;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}.hb-tree__node-content--selected .hb-tree__title{color:var(--hb-color-primary);font-weight:500}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}";
+const HbTreeStyle0 = treeCss;
+
+const Tree = /*@__PURE__*/ proxyCustomElement(class Tree extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.hbSelect = createEvent(this, "hbSelect", 7);
+        this.hbExpand = createEvent(this, "hbExpand", 7);
+        this.hbCheck = createEvent(this, "hbCheck", 7);
+    }
+    get el() { return this; }
+    /**
+     * 可选项数据源（递归树结构）
+     */
+    data = [];
+    /**
+     * （受控）展开的节点 key 集合
+     */
+    expandedKeys = [];
+    /**
+     * （受控）选中的节点 key 集合
+     */
+    selectedKeys = [];
+    /**
+     * 是否显示 checkbox 复选框
+     * @default false
+     */
+    checkable = false;
+    /**
+     * （受控）勾选的节点 key 集合
+     */
+    checkedKeys = [];
+    /**
+     * 是否默认展开全部节点
+     * @default false
+     */
+    defaultExpandAll = false;
+    /**
+     * 是否显示连接线
+     * @default false
+     */
+    showLine = false;
+    internalExpanded = null;
+    internalSelected = null;
+    internalChecked = null;
+    /**
+     * 选中节点变化事件（detail: 选中节点 key 数组）
+     */
+    hbSelect;
+    /**
+     * 展开节点变化事件（detail: 展开节点 key 数组）
+     */
+    hbExpand;
+    /**
+     * 勾选节点变化事件（detail: 勾选节点 key 数组）
+     */
+    hbCheck;
+    componentWillLoad() {
+        if (this.defaultExpandAll) {
+            const all = [];
+            this.collectExpandableKeys(this.data, all);
+            this.internalExpanded = all;
+        }
+    }
+    /**
+     * data 变化时，若 defaultExpandAll=true，把所有含 children 的节点 key
+     * 合并进 expandedKeys（保留用户已手动展开的节点，不收起任何已展开项）。
+     * 解决「先 mount 再赋 data」时 componentWillLoad 基于空数据计算导致不展开的问题。
+     */
+    handleDataChange() {
+        if (!this.defaultExpandAll) {
+            return;
+        }
+        const current = this.getExpandedKeys();
+        const merged = [...current];
+        this.collectExpandableKeys(this.data, merged);
+        // 去重
+        const deduped = Array.from(new Set(merged));
+        this.internalExpanded = deduped;
+        this.expandedKeys = deduped;
+    }
+    handleExpandedKeysChange() {
+        this.internalExpanded = null;
+    }
+    handleSelectedKeysChange() {
+        this.internalSelected = null;
+    }
+    handleCheckedKeysChange() {
+        this.internalChecked = null;
+    }
+    collectExpandableKeys(nodes, out) {
+        for (const node of nodes) {
+            if (node.children && node.children.length > 0) {
+                out.push(node.key);
+                this.collectExpandableKeys(node.children, out);
+            }
+        }
+    }
+    getExpandedKeys() {
+        return this.internalExpanded !== null ? this.internalExpanded : this.expandedKeys;
+    }
+    getSelectedKeys() {
+        return this.internalSelected !== null ? this.internalSelected : this.selectedKeys;
+    }
+    getCheckedKeys() {
+        return this.internalChecked !== null ? this.internalChecked : this.checkedKeys;
+    }
+    isExpanded = (key) => this.getExpandedKeys().includes(key);
+    isSelected = (key) => this.getSelectedKeys().includes(key);
+    isChecked = (key) => this.getCheckedKeys().includes(key);
+    handleToggleExpand = (node, e) => {
+        e.stopPropagation();
+        if (node.disabled)
+            return;
+        const current = [...this.getExpandedKeys()];
+        const idx = current.indexOf(node.key);
+        if (idx >= 0) {
+            current.splice(idx, 1);
+        }
+        else {
+            current.push(node.key);
+        }
+        this.internalExpanded = current;
+        this.expandedKeys = current;
+        this.hbExpand.emit(current);
+    };
+    handleSelect = (node) => {
+        if (node.disabled)
+            return;
+        const current = [...this.getSelectedKeys()];
+        const idx = current.indexOf(node.key);
+        if (idx >= 0) {
+            current.splice(idx, 1);
+        }
+        else {
+            current.push(node.key);
+        }
+        this.internalSelected = current;
+        this.selectedKeys = current;
+        this.hbSelect.emit(current);
+    };
+    handleCheck = (node, e) => {
+        e.stopPropagation();
+        if (node.disabled)
+            return;
+        const current = [...this.getCheckedKeys()];
+        const wasChecked = current.includes(node.key);
+        // 计算本次操作应进入/移出 checkedKeys 的所有 key 集合（含级联）。
+        // 不可变：始终基于副本计算，绝不原地修改 current。
+        const next = new Set(current);
+        if (wasChecked) {
+            // 取消：取消自身 + 取消所有后代（含禁用后代，因为它们当时是被父级带选的）。
+            this.removeDescendantKeys(node, next);
+            next.delete(node.key);
+        }
+        else {
+            // 勾选：勾选自身 + 勾选所有非禁用后代。
+            next.add(node.key);
+            this.collectCheckableDescendantKeys(node, next);
+        }
+        // 父子联动自底向上修正祖先：所有非禁用子节点全选 → 父加入 checkedKeys；
+        // 子节点部分选/全未选 → 父移出 checkedKeys（部分选体现为 indeterminate，由 detail 暴露）。
+        this.reconcileAncestors(node, next);
+        const result = Array.from(next);
+        this.internalChecked = result;
+        this.checkedKeys = result;
+        this.hbCheck.emit(result);
+    };
+    /**
+     * 从集合中移除某节点所有后代 key（含禁用项），用于取消父级时级联取消。
+     * 不可变：仅修改传入的 Set 副本，不修改树本身。
+     */
+    removeDescendantKeys(node, out) {
+        if (!node.children)
+            return;
+        for (const child of node.children) {
+            out.delete(child.key);
+            this.removeDescendantKeys(child, out);
+        }
+    }
+    /**
+     * 收集某节点所有「可勾选（非禁用）」后代 key，用于勾选父级时级联勾选。
+     * 注意：禁用子节点本身不可手动勾选，但若其下还有非禁用后代，仍应被级联勾选。
+     */
+    collectCheckableDescendantKeys(node, out) {
+        if (!node.children)
+            return;
+        for (const child of node.children) {
+            if (!child.disabled) {
+                out.add(child.key);
+            }
+            // 无论 child 是否禁用，继续向下寻找可勾选后代。
+            this.collectCheckableDescendantKeys(child, out);
+        }
+    }
+    /**
+     * 自底向上修正 checkedKeys 中某节点的所有祖先勾选状态。
+     * 规则：一个祖先节点，当且仅当其所有「非禁用子节点」均被勾选时，自身才被勾选；
+     * 否则移出 checkedKeys（部分选情况由 indeterminate 集合在渲染层暴露，不进入 checkedKeys）。
+     */
+    reconcileAncestors(node, next) {
+        const parents = this.findAncestors(this.data, node.key, []);
+        // parents 为从直接父到根的数组；逐层判断。
+        for (const parent of parents) {
+            if (parent.disabled || !parent.children || parent.children.length === 0)
+                continue;
+            const checkableChildren = parent.children.filter((c) => !c.disabled);
+            if (checkableChildren.length === 0)
+                continue;
+            const allChecked = checkableChildren.every((c) => next.has(c.key));
+            if (allChecked) {
+                next.add(parent.key);
+            }
+            else {
+                next.delete(parent.key);
+            }
+        }
+    }
+    /**
+     * 递归查找某 key 的祖先链（不含自身），返回从直接父到根的数组。
+     * 找不到返回空数组（key 为根节点或不存在时）。
+     */
+    findAncestors(nodes, key, acc) {
+        for (const node of nodes) {
+            if (node.key === key) {
+                return acc;
+            }
+            if (node.children && node.children.length > 0) {
+                const found = this.findAncestors(node.children, key, [node, ...acc]);
+                if (found)
+                    return found;
+            }
+        }
+        return null;
+    }
+    /**
+     * 计算当前 checkedKeys 下处于「部分选中（indeterminate）」的节点 key 集合。
+     * 一个节点为 indeterminate 当：其本身不在 checkedKeys，但其下（递归）存在被勾选的后代。
+     * 用于渲染层暴露三方态（aria-checked="mixed" + class）。
+     */
+    computeIndeterminateKeys() {
+        const checked = this.getCheckedKeys();
+        const result = new Set();
+        const walk = (node) => {
+            if (!node.children || node.children.length === 0) {
+                return { hasCheckedDescendant: false };
+            }
+            let hasCheckedDescendant = false;
+            for (const child of node.children) {
+                const childState = walk(child);
+                if (checked.includes(child.key) || childState.hasCheckedDescendant) {
+                    hasCheckedDescendant = true;
+                }
+            }
+            // 节点本身未勾选，但有被勾选后代 → indeterminate
+            if (hasCheckedDescendant && !checked.includes(node.key)) {
+                result.add(node.key);
+            }
+            return { hasCheckedDescendant };
+        };
+        for (const root of this.data) {
+            walk(root);
+        }
+        return result;
+    }
+    renderNode = (node, level, indeterminateKeys) => {
+        const hasChildren = !!(node.children && node.children.length > 0);
+        const expanded = this.isExpanded(node.key);
+        const selected = this.isSelected(node.key);
+        const checked = this.isChecked(node.key);
+        const indeterminate = indeterminateKeys.has(node.key);
+        const disabled = !!node.disabled;
+        return (h("li", { class: {
+                'hb-tree__node': true,
+                'hb-tree__node--disabled': disabled,
+            }, role: "treeitem", "aria-level": level + 1, "aria-expanded": hasChildren ? String(expanded) : undefined, "aria-selected": selected ? 'true' : 'false', "aria-checked": this.checkable
+                ? indeterminate
+                    ? 'mixed'
+                    : checked
+                        ? 'true'
+                        : 'false'
+                : undefined, "aria-disabled": disabled ? 'true' : undefined, tabindex: selected ? 0 : -1 }, h("div", { class: {
+                'hb-tree__node-content': true,
+                'hb-tree__node-content--selected': selected,
+            }, style: { paddingLeft: `${level * 18 + 8}px` } }, h("span", { class: "hb-tree__switcher", onClick: (e) => hasChildren && this.handleToggleExpand(node, e) }, hasChildren ? (h("span", { class: { 'hb-tree__arrow': true, 'hb-tree__arrow--expanded': expanded } }, "\u25B6")) : this.showLine ? (h("span", { class: "hb-tree__line-dot" })) : null), this.checkable && (h("span", { class: {
+                'hb-tree__checkbox': true,
+                'hb-tree__checkbox--checked': checked,
+                'hb-tree__checkbox--indeterminate': indeterminate,
+                'hb-tree__checkbox--disabled': disabled,
+            }, onClick: (e) => this.handleCheck(node, e) }, checked ? '✓' : indeterminate ? '–' : '')), h("span", { class: "hb-tree__title", onClick: () => this.handleSelect(node) }, node.title)), hasChildren && expanded && (h("ul", { class: "hb-tree__children", role: "group" }, node.children.map((child) => this.renderNode(child, level + 1, indeterminateKeys))))));
+    };
+    render() {
+        const indeterminateKeys = this.checkable ? this.computeIndeterminateKeys() : new Set();
+        return (h("ul", { key: '6e40f05b44667fb23f0b6a74f647553fa518cca4', class: { 'hb-tree': true, 'hb-tree--show-line': this.showLine }, role: "tree" }, this.data.map((node) => this.renderNode(node, 0, indeterminateKeys))));
+    }
+    static get watchers() { return {
+        "data": ["handleDataChange"],
+        "expandedKeys": ["handleExpandedKeysChange"],
+        "selectedKeys": ["handleSelectedKeysChange"],
+        "checkedKeys": ["handleCheckedKeysChange"]
+    }; }
+    static get style() { return HbTreeStyle0; }
+}, [1, "hb-tree", {
+        "data": [16],
+        "expandedKeys": [1040],
+        "selectedKeys": [1040],
+        "checkable": [4],
+        "checkedKeys": [1040],
+        "defaultExpandAll": [4, "default-expand-all"],
+        "showLine": [4, "show-line"],
+        "internalExpanded": [32],
+        "internalSelected": [32],
+        "internalChecked": [32]
+    }, undefined, {
+        "data": ["handleDataChange"],
+        "expandedKeys": ["handleExpandedKeysChange"],
+        "selectedKeys": ["handleSelectedKeysChange"],
+        "checkedKeys": ["handleCheckedKeysChange"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-tree"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-tree":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Tree);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbTree = Tree;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbTree, defineCustomElement };
+
+//# sourceMappingURL=hb-tree.js.map

package/dist/components/hb-tree.js.map

@@ -0,0 +1 @@
+{"file":"hb-tree.js","mappings":"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","names":[],"sources":["src/components/Tree/tree.css?tag=hb-tree&encapsulation=shadow","src/components/Tree/Tree.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hb-tree {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-size: var(--hb-font-size-base);\n  color: var(--hb-color-text);\n  background-color: var(--hb-color-bg-container);\n  box-sizing: border-box;\n}\n\n.hb-tree__children {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.hb-tree__node {\n  list-style: none;\n  white-space: nowrap;\n}\n\n.hb-tree__node-content {\n  display: flex;\n  align-items: center;\n  gap: var(--hb-spacing-xxs);\n  height: 28px;\n  padding-right: var(--hb-spacing-xs);\n  border-radius: var(--hb-border-radius-sm);\n  cursor: pointer;\n  transition: background-color var(--hb-transition-duration, 0.2s) var(--hb-transition-function, ease);\n  box-sizing: border-box;\n}\n\n.hb-tree__node-content:hover {\n  background-color: var(--hb-color-fill-tertiary);\n}\n\n.hb-tree__node-content--selected {\n  background-color: var(--hb-color-primary-bg);\n}\n\n.hb-tree__node--disabled > .hb-tree__node-content {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.hb-tree__node--disabled > .hb-tree__node-content:hover {\n  background-color: transparent;\n}\n\n.hb-tree__switcher {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n  height: 18px;\n  flex-shrink: 0;\n  color: var(--hb-color-text-tertiary);\n}\n\n.hb-tree__arrow {\n  font-size: 10px;\n  display: inline-block;\n  transition: transform var(--hb-transition-duration, 0.2s);\n}\n\n.hb-tree__arrow--expanded {\n  transform: rotate(90deg);\n}\n\n.hb-tree--show-line .hb-tree__switcher {\n  color: var(--hb-color-border);\n}\n\n.hb-tree__line-dot {\n  width: 6px;\n  height: 6px;\n  border-left: 1px solid var(--hb-color-border);\n  border-bottom: 1px solid var(--hb-color-border);\n  border-bottom-left-radius: var(--hb-border-radius-sm);\n}\n\n.hb-tree__checkbox {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  border: 1px solid var(--hb-color-border);\n  border-radius: var(--hb-border-radius-xs, 2px);\n  background-color: var(--hb-color-bg-container);\n  color: #fff;\n  font-size: 11px;\n  line-height: 1;\n  flex-shrink: 0;\n  transition: all var(--hb-transition-duration, 0.2s);\n}\n\n.hb-tree__checkbox:hover:not(.hb-tree__checkbox--disabled) {\n  border-color: var(--hb-color-primary);\n}\n\n.hb-tree__checkbox--checked {\n  background-color: var(--hb-color-primary);\n  border-color: var(--hb-color-primary);\n}\n\n.hb-tree__checkbox--indeterminate {\n  background-color: var(--hb-color-primary);\n  border-color: var(--hb-color-primary);\n}\n\n.hb-tree__checkbox--disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.hb-tree__title {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  user-select: none;\n}\n\n.hb-tree__node-content--selected .hb-tree__title {\n  color: var(--hb-color-primary);\n  font-weight: 500;\n}\n","import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\n\nexport interface TreeNode {\n  /** 节点唯一标识 */\n  key: string;\n  /** 节点标题 */\n  title: string;\n  /** 子节点 */\n  children?: TreeNode[];\n  /** 是否禁用 */\n  disabled?: boolean;\n}\n\n/**\n * Tree 树形组件\n * 文件夹、组织架构、分类导航等层级结构的展示与选择\n */\n@Component({\n  tag: 'hb-tree',\n  styleUrl: 'tree.css',\n  shadow: true,\n})\nexport class Tree {\n  @Element() el: HTMLElement;\n\n  /**\n   * 可选项数据源（递归树结构）\n   */\n  @Prop() data: TreeNode[] = [];\n\n  /**\n   * （受控）展开的节点 key 集合\n   */\n  @Prop({ mutable: true }) expandedKeys: string[] = [];\n\n  /**\n   * （受控）选中的节点 key 集合\n   */\n  @Prop({ mutable: true }) selectedKeys: string[] = [];\n\n  /**\n   * 是否显示 checkbox 复选框\n   * @default false\n   */\n  @Prop() checkable: boolean = false;\n\n  /**\n   * （受控）勾选的节点 key 集合\n   */\n  @Prop({ mutable: true }) checkedKeys: string[] = [];\n\n  /**\n   * 是否默认展开全部节点\n   * @default false\n   */\n  @Prop() defaultExpandAll: boolean = false;\n\n  /**\n   * 是否显示连接线\n   * @default false\n   */\n  @Prop() showLine: boolean = false;\n\n  @State() internalExpanded: string[] | null = null;\n  @State() internalSelected: string[] | null = null;\n  @State() internalChecked: string[] | null = null;\n\n  /**\n   * 选中节点变化事件（detail: 选中节点 key 数组）\n   */\n  @Event() hbSelect: EventEmitter<string[]>;\n\n  /**\n   * 展开节点变化事件（detail: 展开节点 key 数组）\n   */\n  @Event() hbExpand: EventEmitter<string[]>;\n\n  /**\n   * 勾选节点变化事件（detail: 勾选节点 key 数组）\n   */\n  @Event() hbCheck: EventEmitter<string[]>;\n\n  componentWillLoad() {\n    if (this.defaultExpandAll) {\n      const all: string[] = [];\n      this.collectExpandableKeys(this.data, all);\n      this.internalExpanded = all;\n    }\n  }\n\n  /**\n   * data 变化时，若 defaultExpandAll=true，把所有含 children 的节点 key\n   * 合并进 expandedKeys（保留用户已手动展开的节点，不收起任何已展开项）。\n   * 解决「先 mount 再赋 data」时 componentWillLoad 基于空数据计算导致不展开的问题。\n   */\n  @Watch('data')\n  handleDataChange() {\n    if (!this.defaultExpandAll) {\n      return;\n    }\n    const current = this.getExpandedKeys();\n    const merged = [...current];\n    this.collectExpandableKeys(this.data, merged);\n    // 去重\n    const deduped = Array.from(new Set(merged));\n    this.internalExpanded = deduped;\n    this.expandedKeys = deduped;\n  }\n\n  @Watch('expandedKeys')\n  handleExpandedKeysChange() {\n    this.internalExpanded = null;\n  }\n\n  @Watch('selectedKeys')\n  handleSelectedKeysChange() {\n    this.internalSelected = null;\n  }\n\n  @Watch('checkedKeys')\n  handleCheckedKeysChange() {\n    this.internalChecked = null;\n  }\n\n  private collectExpandableKeys(nodes: TreeNode[], out: string[]) {\n    for (const node of nodes) {\n      if (node.children && node.children.length > 0) {\n        out.push(node.key);\n        this.collectExpandableKeys(node.children, out);\n      }\n    }\n  }\n\n  private getExpandedKeys(): string[] {\n    return this.internalExpanded !== null ? this.internalExpanded : this.expandedKeys;\n  }\n\n  private getSelectedKeys(): string[] {\n    return this.internalSelected !== null ? this.internalSelected : this.selectedKeys;\n  }\n\n  private getCheckedKeys(): string[] {\n    return this.internalChecked !== null ? this.internalChecked : this.checkedKeys;\n  }\n\n  private isExpanded = (key: string) => this.getExpandedKeys().includes(key);\n  private isSelected = (key: string) => this.getSelectedKeys().includes(key);\n  private isChecked = (key: string) => this.getCheckedKeys().includes(key);\n\n  private handleToggleExpand = (node: TreeNode, e: Event) => {\n    e.stopPropagation();\n    if (node.disabled) return;\n    const current = [...this.getExpandedKeys()];\n    const idx = current.indexOf(node.key);\n    if (idx >= 0) {\n      current.splice(idx, 1);\n    } else {\n      current.push(node.key);\n    }\n    this.internalExpanded = current;\n    this.expandedKeys = current;\n    this.hbExpand.emit(current);\n  };\n\n  private handleSelect = (node: TreeNode) => {\n    if (node.disabled) return;\n    const current = [...this.getSelectedKeys()];\n    const idx = current.indexOf(node.key);\n    if (idx >= 0) {\n      current.splice(idx, 1);\n    } else {\n      current.push(node.key);\n    }\n    this.internalSelected = current;\n    this.selectedKeys = current;\n    this.hbSelect.emit(current);\n  };\n\n  private handleCheck = (node: TreeNode, e: Event) => {\n    e.stopPropagation();\n    if (node.disabled) return;\n    const current = [...this.getCheckedKeys()];\n    const wasChecked = current.includes(node.key);\n\n    // 计算本次操作应进入/移出 checkedKeys 的所有 key 集合（含级联）。\n    // 不可变：始终基于副本计算，绝不原地修改 current。\n    const next = new Set(current);\n    if (wasChecked) {\n      // 取消：取消自身 + 取消所有后代（含禁用后代，因为它们当时是被父级带选的）。\n      this.removeDescendantKeys(node, next);\n      next.delete(node.key);\n    } else {\n      // 勾选：勾选自身 + 勾选所有非禁用后代。\n      next.add(node.key);\n      this.collectCheckableDescendantKeys(node, next);\n    }\n\n    // 父子联动自底向上修正祖先：所有非禁用子节点全选 → 父加入 checkedKeys；\n    // 子节点部分选/全未选 → 父移出 checkedKeys（部分选体现为 indeterminate，由 detail 暴露）。\n    this.reconcileAncestors(node, next);\n\n    const result = Array.from(next);\n    this.internalChecked = result;\n    this.checkedKeys = result;\n    this.hbCheck.emit(result);\n  };\n\n  /**\n   * 从集合中移除某节点所有后代 key（含禁用项），用于取消父级时级联取消。\n   * 不可变：仅修改传入的 Set 副本，不修改树本身。\n   */\n  private removeDescendantKeys(node: TreeNode, out: Set<string>) {\n    if (!node.children) return;\n    for (const child of node.children) {\n      out.delete(child.key);\n      this.removeDescendantKeys(child, out);\n    }\n  }\n\n  /**\n   * 收集某节点所有「可勾选（非禁用）」后代 key，用于勾选父级时级联勾选。\n   * 注意：禁用子节点本身不可手动勾选，但若其下还有非禁用后代，仍应被级联勾选。\n   */\n  private collectCheckableDescendantKeys(node: TreeNode, out: Set<string>) {\n    if (!node.children) return;\n    for (const child of node.children) {\n      if (!child.disabled) {\n        out.add(child.key);\n      }\n      // 无论 child 是否禁用，继续向下寻找可勾选后代。\n      this.collectCheckableDescendantKeys(child, out);\n    }\n  }\n\n  /**\n   * 自底向上修正 checkedKeys 中某节点的所有祖先勾选状态。\n   * 规则：一个祖先节点，当且仅当其所有「非禁用子节点」均被勾选时，自身才被勾选；\n   * 否则移出 checkedKeys（部分选情况由 indeterminate 集合在渲染层暴露，不进入 checkedKeys）。\n   */\n  private reconcileAncestors(node: TreeNode, next: Set<string>) {\n    const parents = this.findAncestors(this.data, node.key, []);\n    // parents 为从直接父到根的数组；逐层判断。\n    for (const parent of parents) {\n      if (parent.disabled || !parent.children || parent.children.length === 0) continue;\n      const checkableChildren = parent.children.filter((c) => !c.disabled);\n      if (checkableChildren.length === 0) continue;\n      const allChecked = checkableChildren.every((c) => next.has(c.key));\n      if (allChecked) {\n        next.add(parent.key);\n      } else {\n        next.delete(parent.key);\n      }\n    }\n  }\n\n  /**\n   * 递归查找某 key 的祖先链（不含自身），返回从直接父到根的数组。\n   * 找不到返回空数组（key 为根节点或不存在时）。\n   */\n  private findAncestors(nodes: TreeNode[], key: string, acc: TreeNode[]): TreeNode[] | null {\n    for (const node of nodes) {\n      if (node.key === key) {\n        return acc;\n      }\n      if (node.children && node.children.length > 0) {\n        const found = this.findAncestors(node.children, key, [node, ...acc]);\n        if (found) return found;\n      }\n    }\n    return null;\n  }\n\n  /**\n   * 计算当前 checkedKeys 下处于「部分选中（indeterminate）」的节点 key 集合。\n   * 一个节点为 indeterminate 当：其本身不在 checkedKeys，但其下（递归）存在被勾选的后代。\n   * 用于渲染层暴露三方态（aria-checked=\"mixed\" + class）。\n   */\n  private computeIndeterminateKeys(): Set<string> {\n    const checked = this.getCheckedKeys();\n    const result = new Set<string>();\n    const walk = (node: TreeNode): { hasCheckedDescendant: boolean } => {\n      if (!node.children || node.children.length === 0) {\n        return { hasCheckedDescendant: false };\n      }\n      let hasCheckedDescendant = false;\n      for (const child of node.children) {\n        const childState = walk(child);\n        if (checked.includes(child.key) || childState.hasCheckedDescendant) {\n          hasCheckedDescendant = true;\n        }\n      }\n      // 节点本身未勾选，但有被勾选后代 → indeterminate\n      if (hasCheckedDescendant && !checked.includes(node.key)) {\n        result.add(node.key);\n      }\n      return { hasCheckedDescendant };\n    };\n    for (const root of this.data) {\n      walk(root);\n    }\n    return result;\n  }\n\n  private renderNode = (node: TreeNode, level: number, indeterminateKeys: Set<string>): any => {\n    const hasChildren = !!(node.children && node.children.length > 0);\n    const expanded = this.isExpanded(node.key);\n    const selected = this.isSelected(node.key);\n    const checked = this.isChecked(node.key);\n    const indeterminate = indeterminateKeys.has(node.key);\n    const disabled = !!node.disabled;\n\n    return (\n      <li\n        class={{\n          'hb-tree__node': true,\n          'hb-tree__node--disabled': disabled,\n        }}\n        role=\"treeitem\"\n        aria-level={level + 1}\n        aria-expanded={hasChildren ? String(expanded) : undefined}\n        aria-selected={selected ? 'true' : 'false'}\n        aria-checked={\n          this.checkable\n            ? indeterminate\n              ? 'mixed'\n              : checked\n                ? 'true'\n                : 'false'\n            : undefined\n        }\n        aria-disabled={disabled ? 'true' : undefined}\n        tabindex={selected ? 0 : -1}\n      >\n        <div\n          class={{\n            'hb-tree__node-content': true,\n            'hb-tree__node-content--selected': selected,\n          }}\n          style={{ paddingLeft: `${level * 18 + 8}px` }}\n        >\n          <span class=\"hb-tree__switcher\" onClick={(e) => hasChildren && this.handleToggleExpand(node, e)}>\n            {hasChildren ? (\n              <span class={{ 'hb-tree__arrow': true, 'hb-tree__arrow--expanded': expanded }}>▶</span>\n            ) : this.showLine ? (\n              <span class=\"hb-tree__line-dot\" />\n            ) : null}\n          </span>\n\n          {this.checkable && (\n            <span\n              class={{\n                'hb-tree__checkbox': true,\n                'hb-tree__checkbox--checked': checked,\n                'hb-tree__checkbox--indeterminate': indeterminate,\n                'hb-tree__checkbox--disabled': disabled,\n              }}\n              onClick={(e) => this.handleCheck(node, e)}\n            >\n              {checked ? '✓' : indeterminate ? '–' : ''}\n            </span>\n          )}\n\n          <span class=\"hb-tree__title\" onClick={() => this.handleSelect(node)}>\n            {node.title}\n          </span>\n        </div>\n\n        {hasChildren && expanded && (\n          <ul class=\"hb-tree__children\" role=\"group\">\n            {node.children!.map((child) => this.renderNode(child, level + 1, indeterminateKeys))}\n          </ul>\n        )}\n      </li>\n    );\n  };\n\n  render() {\n    const indeterminateKeys = this.checkable ? this.computeIndeterminateKeys() : new Set<string>();\n    return (\n      <ul class={{ 'hb-tree': true, 'hb-tree--show-line': this.showLine }} role=\"tree\">\n        {this.data.map((node) => this.renderNode(node, 0, indeterminateKeys))}\n      </ul>\n    );\n  }\n}\n"],"version":3}

package/dist/components/hb-upload.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface HbUpload extends Components.HbUpload, HTMLElement {}
+export const HbUpload: {
+    prototype: HbUpload;
+    new (): HbUpload;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/hb-upload.js

@@ -0,0 +1,213 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-1407a5e8.js';
+
+const uploadCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.static{position:static}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-upload__trigger--drag{border:1px dashed var(--hb-color-border);border-radius:var(--hb-border-radius-base);color:var(--hb-color-text-secondary);cursor:pointer;padding:var(--hb-spacing-xl);text-align:center;transition:border-color .3s}.hb-upload__trigger--drag:hover,.hb-upload__trigger--dragover{border-color:var(--hb-color-primary);color:var(--hb-color-primary)}.hb-upload__trigger--disabled{cursor:not-allowed;opacity:.5}.hb-upload__btn{background:var(--hb-color-bg);border:1px solid var(--hb-color-border);border-radius:var(--hb-border-radius-sm);cursor:pointer;font-size:var(--hb-font-size-sm);padding:var(--hb-spacing-xs)var(--hb-spacing-md)}.hb-upload__btn:hover{border-color:var(--hb-color-primary);color:var(--hb-color-primary)}.hb-upload__list{list-style:none;margin:var(--hb-spacing-sm)0 0;padding:0}.hb-upload__item{align-items:center;border-bottom:1px solid var(--hb-color-border-secondary);display:flex;font-size:var(--hb-font-size-sm);gap:var(--hb-spacing-xs);padding:var(--hb-spacing-xs)0}.hb-upload__item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hb-upload__item-size{color:var(--hb-color-text-secondary);font-size:var(--hb-font-size-xs)}.hb-upload__item-status{font-size:12px}.hb-upload__item--success .hb-upload__item-status{color:var(--hb-color-success)}.hb-upload__item--error .hb-upload__item-status{color:var(--hb-color-danger)}.hb-upload__item-remove{color:var(--hb-color-text-secondary);cursor:pointer;font-size:16px}.hb-upload__item-remove:hover{color:var(--hb-color-danger)}.hb-upload__item-progress{color:var(--hb-color-primary);font-size:var(--hb-font-size-xs);min-width:34px;text-align:right}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}";
+const HbUploadStyle0 = uploadCss;
+
+const Upload = /*@__PURE__*/ proxyCustomElement(class Upload extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.hbChange = createEvent(this, "hbChange", 7);
+        this.hbSuccess = createEvent(this, "hbSuccess", 7);
+        this.hbError = createEvent(this, "hbError", 7);
+    }
+    /** 上传地址。设置后启用自动上传；未设置时文件以 ready 状态抛出，由消费方自行上传 */
+    action;
+    /** 多选 */
+    multiple = false;
+    /** 接受的文件类型 */
+    accept;
+    /** 是否禁用 */
+    disabled = false;
+    /** 最大上传数量 */
+    limit;
+    /** 是否拖拽上传 */
+    drag = false;
+    /** 上传字段名 */
+    name = 'file';
+    /** 额外的请求头 */
+    headers;
+    /** 额外的表单数据 */
+    data;
+    /** 是否携带凭证（cookie） */
+    withCredentials = false;
+    /** 上传前钩子，返回 false / Promise<false> 则取消上传 */
+    beforeUpload;
+    fileList = [];
+    isDragover = false;
+    hbChange;
+    hbSuccess;
+    hbError;
+    inputRef;
+    handleClick = () => {
+        if (!this.disabled)
+            this.inputRef?.click();
+    };
+    handleChange = (e) => {
+        const target = e.target;
+        if (target.files)
+            this.handleFiles(target.files);
+        target.value = '';
+    };
+    handleFiles = async (files) => {
+        for (let i = 0; i < files.length; i++) {
+            if (this.limit && this.fileList.length >= this.limit)
+                break;
+            const file = files[i];
+            if (this.beforeUpload) {
+                try {
+                    const ok = await this.beforeUpload(file);
+                    if (!ok)
+                        continue;
+                }
+                catch {
+                    continue;
+                }
+            }
+            const uf = {
+                name: file.name,
+                size: file.size,
+                type: file.type,
+                status: this.action ? 'uploading' : 'ready',
+                progress: 0,
+            };
+            this.fileList = [...this.fileList, uf];
+            this.hbChange.emit(this.fileList);
+            if (this.action) {
+                this.realUpload(file, uf);
+            }
+        }
+    };
+    /** 真实上传：FormData + XHR，带进度回调 */
+    realUpload = (file, uf) => {
+        const xhr = new XMLHttpRequest();
+        const formData = new FormData();
+        formData.append(this.name, file);
+        if (this.data) {
+            Object.entries(this.data).forEach(([k, v]) => formData.append(k, v));
+        }
+        xhr.upload.onprogress = (e) => {
+            if (e.lengthComputable) {
+                uf.progress = Math.round((e.loaded / e.total) * 100);
+                this.fileList = [...this.fileList];
+            }
+        };
+        xhr.onload = () => {
+            if (xhr.status >= 200 && xhr.status < 300) {
+                uf.status = 'success';
+                uf.response = this.parseResponse(xhr.response);
+                this.fileList = [...this.fileList];
+                this.hbSuccess.emit(uf);
+            }
+            else {
+                uf.status = 'error';
+                this.fileList = [...this.fileList];
+                this.hbError.emit(uf);
+            }
+        };
+        xhr.onerror = () => {
+            uf.status = 'error';
+            this.fileList = [...this.fileList];
+            this.hbError.emit(uf);
+        };
+        xhr.open('POST', this.action, true);
+        xhr.withCredentials = this.withCredentials;
+        if (this.headers) {
+            Object.entries(this.headers).forEach(([k, v]) => xhr.setRequestHeader(k, v));
+        }
+        xhr.send(formData);
+    };
+    parseResponse(raw) {
+        if (typeof raw !== 'string')
+            return raw;
+        try {
+            return JSON.parse(raw);
+        }
+        catch {
+            return raw;
+        }
+    }
+    handleRemove = (index) => {
+        const next = [...this.fileList];
+        next.splice(index, 1);
+        this.fileList = next;
+        this.hbChange.emit(next);
+    };
+    handleDrop = (e) => {
+        e.preventDefault();
+        this.isDragover = false;
+        if (e.dataTransfer?.files)
+            this.handleFiles(e.dataTransfer.files);
+    };
+    handleDragOver = (e) => {
+        e.preventDefault();
+        this.isDragover = true;
+    };
+    handleDragLeave = () => {
+        this.isDragover = false;
+    };
+    formatSize(bytes) {
+        if (bytes < 1024)
+            return bytes + ' B';
+        if (bytes < 1024 * 1024)
+            return (bytes / 1024).toFixed(1) + ' KB';
+        return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
+    }
+    renderStatus(file) {
+        if (file.status === 'uploading') {
+            return h("span", { class: "hb-upload__item-progress" }, typeof file.progress === 'number' ? `${file.progress}%` : '');
+        }
+        if (file.status === 'success')
+            return h("span", { class: "hb-upload__item-status hb-upload__item-status--success" }, "\u2713");
+        if (file.status === 'error')
+            return h("span", { class: "hb-upload__item-status hb-upload__item-status--error" }, "\u2715");
+        return null;
+    }
+    render() {
+        return (h("div", { key: 'a83f9b8d0fd3a0cc618ff33bea2fd35d96b32071', class: "hb-upload" }, h("div", { key: '42f8ae299086ace94524529980d2acdff0abeb16', class: {
+                'hb-upload__trigger': true,
+                'hb-upload__trigger--drag': this.drag,
+                'hb-upload__trigger--dragover': this.isDragover,
+                'hb-upload__trigger--disabled': this.disabled,
+            }, onClick: this.handleClick, onDrop: this.drag ? this.handleDrop : undefined, onDragOver: this.drag ? this.handleDragOver : undefined, onDragLeave: this.drag ? this.handleDragLeave : undefined }, this.drag ? h("span", null, "\u5C06\u6587\u4EF6\u62D6\u5230\u6B64\u5904\uFF0C\u6216\u70B9\u51FB\u4E0A\u4F20") : h("slot", null, h("button", { type: "button", class: "hb-upload__btn" }, "\u70B9\u51FB\u4E0A\u4F20"))), h("input", { key: '65a98112cda506b0244451b6ca7b00a200306e00', type: "file", ref: (el) => {
+                this.inputRef = el;
+            }, multiple: this.multiple, accept: this.accept, disabled: this.disabled, style: { display: 'none' }, onChange: this.handleChange }), this.fileList.length > 0 && (h("ul", { key: 'e8f768dc92d273dc81a7a62f08eefd1c3f185251', class: "hb-upload__list" }, this.fileList.map((file, i) => (h("li", { class: { 'hb-upload__item': true, [`hb-upload__item--${file.status}`]: true } }, h("span", { class: "hb-upload__item-name" }, file.name), h("span", { class: "hb-upload__item-size" }, this.formatSize(file.size)), this.renderStatus(file), h("span", { class: "hb-upload__item-remove", onClick: () => this.handleRemove(i) }, "\u00D7"))))))));
+    }
+    static get style() { return HbUploadStyle0; }
+}, [1, "hb-upload", {
+        "action": [1],
+        "multiple": [4],
+        "accept": [1],
+        "disabled": [4],
+        "limit": [2],
+        "drag": [4],
+        "name": [1],
+        "headers": [16],
+        "data": [16],
+        "withCredentials": [4, "with-credentials"],
+        "beforeUpload": [16],
+        "fileList": [1040],
+        "isDragover": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-upload"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-upload":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Upload);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbUpload = Upload;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbUpload, defineCustomElement };
+
+//# sourceMappingURL=hb-upload.js.map