huibo-ui 0.3.0

package/dist/collection/components/Select/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\nimport { createClickOutsideHandler } from '../../utils/click-outside';\nimport { handleListKeyboard } from '../../utils/a11y';\n\nexport interface SelectOption {\n  value: string | number;\n  label: string;\n  disabled?: boolean;\n  divided?: boolean;\n}\n\n/**\n * Select 选择器组件\n * 当选项过多时，使用下拉菜单展示并选择内容\n */\n@Component({\n  tag: 'hb-select',\n  styleUrl: 'select.css',\n  shadow: true,\n})\nexport class Select {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue?: string | number | (string | number)[];\n\n  /**\n   * 可选项数据源\n   */\n  @Prop() options: SelectOption[] = [];\n\n  /**\n   * 输入框占位文本\n   */\n  @Prop() placeholder: string = '请选择';\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 输入框尺寸\n   */\n  @Prop() size: 'large' | 'default' | 'small' = 'default';\n\n  /**\n   * 是否可清空\n   * @default false\n   */\n  @Prop() clearable: boolean = false;\n\n  /**\n   * 是否多选\n   * @default false\n   */\n  @Prop() multiple: boolean = false;\n\n  /**\n   * 是否可搜索\n   * @default false\n   */\n  @Prop() filterable: boolean = false;\n\n  /**\n   * 自定义过滤方法\n   */\n  @Prop() filterMethod?: (query: string) => void;\n\n  /**\n   * 是否默认展开\n   * @default false\n   */\n  @Prop() defaultFirstOption: boolean = false;\n\n  /**\n   * 是否允许创建新条目\n   * @default false\n   */\n  @Prop() allowCreate: boolean = false;\n\n  /**\n   * 多选时是否将选中值按文字的形式展示\n   * @default false\n   */\n  @Prop() collapseTags: boolean = false;\n\n  /**\n   * 多选时最多显示多少个tag\n   */\n  @Prop() maxCollapseTags?: number;\n\n  @State() isOpen: boolean = false;\n  @State() inputValue: string = '';\n  @State() searchValue: string = '';\n  @State() filteredOptions: SelectOption[] = [];\n  /** 键盘高亮的选项索引（-1 表示无） */\n  @State() activeOptionIndex: number = -1;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string | number | (string | number)[]>;\n\n  /**\n   * 下拉框出现/隐藏时触发\n   */\n  @Event() hbVisibleChange: EventEmitter<boolean>;\n\n  private clickOutside = createClickOutsideHandler({\n    host: null as any,\n    isOpen: () => this.isOpen,\n    onClose: () => { this.isOpen = false; this.hbVisibleChange.emit(false); },\n  });\n\n  componentDidLoad() {\n    this.clickOutside = createClickOutsideHandler({\n      host: this.el,\n      isOpen: () => this.isOpen,\n      onClose: () => { this.isOpen = false; this.hbVisibleChange.emit(false); },\n    });\n    this.clickOutside.connect();\n    this.updateInputValue();\n    if (this.filterable) {\n      this.filteredOptions = this.options;\n    }\n  }\n\n  disconnectedCallback() {\n    this.clickOutside.disconnect();\n  }\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.updateInputValue();\n  }\n\n  @Watch('options')\n  handleOptionsChange() {\n    if (this.filterable) {\n      this.filteredOptions = this.options;\n    }\n  }\n\n  private updateInputValue() {\n    if (!this.modelValue) {\n      this.inputValue = '';\n      return;\n    }\n\n    if (this.multiple && Array.isArray(this.modelValue)) {\n      const labels = this.modelValue.map(val => {\n        const option = this.options.find(opt => opt.value === val);\n        return option ? option.label : String(val);\n      });\n      this.inputValue = labels.join(', ');\n    } else {\n      const option = this.options.find(opt => opt.value === this.modelValue);\n      this.inputValue = option ? option.label : String(this.modelValue);\n    }\n  }\n\n  private handleInputClick = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n    if (this.isOpen) this.activeOptionIndex = -1;\n    this.hbVisibleChange.emit(this.isOpen);\n  };\n\n  private handleWrapperKeydown = (e: KeyboardEvent) => {\n    if (this.disabled) return;\n    const displayOptions = this.filterable ? this.filteredOptions : this.options;\n\n    if (!this.isOpen) {\n      // 关闭态：Enter / Space / 方向键 展开\n      if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar' ||\n        e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n        e.preventDefault();\n        this.isOpen = true;\n        this.activeOptionIndex = -1;\n        this.hbVisibleChange.emit(true);\n      }\n      return;\n    }\n\n    const action = handleListKeyboard(e, {\n      activeIndex: this.activeOptionIndex,\n      itemCount: displayOptions.length,\n      loop: true,\n    });\n    switch (action.type) {\n      case 'navigate':\n        e.preventDefault();\n        this.activeOptionIndex = action.index;\n        break;\n      case 'select': {\n        e.preventDefault();\n        const opt = displayOptions[action.index];\n        if (opt && !opt.disabled) this.handleSelect(opt);\n        break;\n      }\n      case 'close':\n        e.preventDefault();\n        this.isOpen = false;\n        this.hbVisibleChange.emit(false);\n        break;\n      default:\n        break;\n    }\n  };\n\n  private handleSelect = (option: SelectOption) => {\n    if (option.disabled) return;\n\n    if (this.multiple) {\n      const currentValue = (this.modelValue as (string | number)[]) || [];\n      const index = currentValue.indexOf(option.value);\n      \n      if (index > -1) {\n        currentValue.splice(index, 1);\n      } else {\n        currentValue.push(option.value);\n      }\n      \n      this.modelValue = [...currentValue];\n    } else {\n      this.modelValue = option.value;\n      this.isOpen = false;\n      this.hbVisibleChange.emit(false);\n    }\n    \n    this.updateInputValue();\n    this.hbChange.emit(this.modelValue);\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.modelValue = this.multiple ? [] : undefined;\n    this.inputValue = '';\n    this.isOpen = false;\n    this.hbChange.emit(this.modelValue);\n    this.hbVisibleChange.emit(false);\n  };\n\n  private handleSearch = (e: Event) => {\n    const target = e.target as HTMLInputElement;\n    this.searchValue = target.value;\n    \n    if (this.filterMethod) {\n      this.filterMethod(target.value);\n    } else {\n      this.filteredOptions = this.options.filter(opt =>\n        opt.label.toLowerCase().includes(target.value.toLowerCase())\n      );\n    }\n  };\n\n  private isSelected(option: SelectOption): boolean {\n    if (this.multiple && Array.isArray(this.modelValue)) {\n      return this.modelValue.includes(option.value);\n    }\n    return this.modelValue === option.value;\n  }\n\n  render() {\n    const displayOptions = this.filterable ? this.filteredOptions : this.options;\n    const showClear = this.clearable && this.modelValue !== undefined &&\n      (this.multiple ? (this.modelValue as any[]).length > 0 : true);\n\n    return (\n      <div\n        class={{\n          'hb-select': true,\n          'hb-select--open': this.isOpen,\n          'hb-select--disabled': this.disabled,\n          [`hb-select--${this.size}`]: true,\n        }}\n        aria-haspopup=\"listbox\"\n        aria-expanded={this.isOpen ? 'true' : 'false'}\n      >\n        <div class=\"hb-select__input-wrapper\" onClick={this.handleInputClick} onKeyDown={this.handleWrapperKeydown}>\n          {this.multiple && Array.isArray(this.modelValue) && this.modelValue.length > 0 ? (\n            <div class=\"hb-select__tags\">\n              {this.modelValue.slice(0, this.collapseTags && this.maxCollapseTags ? this.maxCollapseTags : undefined).map((val) => {\n                const option = this.options.find(opt => opt.value === val);\n                return (\n                  <span class=\"hb-select__tag\">\n                    <span class=\"hb-select__tag-text\">{option ? option.label : val}</span>\n                    <span class=\"hb-select__tag-close\" role=\"button\" aria-label=\"移除标签\" onClick={(e) => {\n                      e.stopPropagation();\n                      this.handleSelect(option || { value: val, label: String(val) });\n                    }}>×</span>\n                  </span>\n                );\n              })}\n              {this.collapseTags && this.maxCollapseTags && this.modelValue.length > this.maxCollapseTags && (\n                <span class=\"hb-select__tag\">\n                  <span class=\"hb-select__tag-text\">+{this.modelValue.length - this.maxCollapseTags}</span>\n                </span>\n              )}\n            </div>\n          ) : (\n            <input\n              type=\"text\"\n              class=\"hb-select__input\"\n              placeholder={this.placeholder}\n              value={this.filterable && this.isOpen ? this.searchValue : this.inputValue}\n              disabled={this.disabled}\n              readonly={!this.filterable || !this.isOpen}\n              onInput={this.handleSearch}\n              aria-haspopup=\"listbox\"\n              aria-expanded={this.isOpen ? 'true' : 'false'}\n              role=\"combobox\"\n            />\n          )}\n          <span class=\"hb-select__suffix\">\n            {showClear && (\n              <span class=\"hb-select__clear\" role=\"button\" aria-label=\"清空\" onClick={this.handleClear}>\n                ×\n              </span>\n            )}\n            <span class=\"hb-select__arrow\">▼</span>\n          </span>\n        </div>\n        {this.isOpen && (\n          <div class=\"hb-select__dropdown\">\n            <ul class=\"hb-select__menu\" role=\"listbox\">\n              {displayOptions.length === 0 ? (\n                <li class=\"hb-select__menu-item hb-select__menu-item--empty\" aria-disabled=\"true\">无数据</li>\n              ) : (\n                displayOptions.map((option, index) => (\n                  <li\n                    class={{\n                      'hb-select__menu-item': true,\n                      'hb-select__menu-item--selected': this.isSelected(option),\n                      'hb-select__menu-item--disabled': option.disabled,\n                      'hb-select__menu-item--divided': option.divided,\n                      'hb-select__menu-item--active': index === this.activeOptionIndex,\n                    }}\n                    role=\"option\"\n                    aria-selected={this.isSelected(option) ? 'true' : 'false'}\n                    aria-disabled={option.disabled ? 'true' : undefined}\n                    onClick={() => this.handleSelect(option)}\n                  >\n                    {this.multiple && (\n                      <span class=\"hb-select__menu-item-checkbox\">\n                        {this.isSelected(option) ? '✓' : ''}\n                      </span>\n                    )}\n                    <span class=\"hb-select__menu-item-label\">{option.label}</span>\n                  </li>\n                ))\n              )}\n            </ul>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/Select/select.css

@@ -0,0 +1,223 @@
+:host {
+  display: inline-block;
+  position: relative;
+  --hb-select-font-size: 14px;
+  --hb-select-height: 32px;
+  --hb-select-border-color: var(--hb-border-color, #dcdfe6);
+  --hb-select-border-color-hover: var(--hb-color-primary);
+  --hb-select-bg-color: var(--hb-color-white, #ffffff);
+  --hb-select-text-color: var(--hb-color-text-regular, #606266);
+  --hb-select-placeholder-color: var(--hb-color-text-placeholder, #c0c4cc);
+}
+
+.hb-select {
+  display: inline-block;
+  position: relative;
+  width: 240px;
+}
+
+.hb-select__input-wrapper {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  cursor: pointer;
+}
+
+.hb-select__input {
+  display: inline-block;
+  width: 100%;
+  height: var(--hb-select-height);
+  line-height: var(--hb-select-height);
+  padding: 0 30px 0 15px;
+  font-size: var(--hb-select-font-size);
+  color: var(--hb-select-text-color);
+  background-color: var(--hb-select-bg-color);
+  border: 1px solid var(--hb-select-border-color);
+  border-radius: 4px;
+  box-sizing: border-box;
+  cursor: pointer;
+  outline: none;
+  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.hb-select__input::placeholder {
+  color: var(--hb-select-placeholder-color);
+}
+
+.hb-select__input:hover:not(:disabled) {
+  border-color: var(--hb-select-border-color-hover);
+}
+
+.hb-select__input:focus {
+  border-color: var(--hb-select-border-color-hover);
+}
+
+.hb-select__tags {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  padding: 0 30px 0 5px;
+  min-height: var(--hb-select-height);
+  border: 1px solid var(--hb-select-border-color);
+  border-radius: 4px;
+  background-color: var(--hb-select-bg-color);
+}
+
+.hb-select__tag {
+  display: inline-flex;
+  align-items: center;
+  height: 24px;
+  padding: 0 8px;
+  margin: 2px 0 2px 6px;
+  background-color: var(--hb-fill-color-light, #f0f2f5);
+  border: 1px solid var(--hb-border-color-lighter, #e4e7ed);
+  border-radius: 4px;
+  font-size: 12px;
+  color: var(--hb-color-text-regular, #606266);
+}
+
+.hb-select__tag-text {
+  margin-right: 4px;
+}
+
+.hb-select__tag-close {
+  cursor: pointer;
+  font-size: 14px;
+  color: var(--hb-color-text-placeholder, #c0c4cc);
+  transition: color 0.2s;
+}
+
+.hb-select__tag-close:hover {
+  color: var(--hb-color-text-regular, #606266);
+}
+
+.hb-select__suffix {
+  position: absolute;
+  right: 8px;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  align-items: center;
+  color: var(--hb-select-text-color);
+}
+
+.hb-select__clear {
+  margin-right: 8px;
+  cursor: pointer;
+  font-size: 16px;
+  color: var(--hb-select-placeholder-color);
+  transition: color 0.2s;
+}
+
+.hb-select__clear:hover {
+  color: var(--hb-select-text-color);
+}
+
+.hb-select__arrow {
+  font-size: 12px;
+  transition: transform 0.3s;
+}
+
+.hb-select--open .hb-select__arrow {
+  transform: rotate(180deg);
+}
+
+.hb-select__dropdown {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  margin-top: 4px;
+  background-color: var(--hb-select-bg-color);
+  border: 1px solid var(--hb-select-border-color);
+  border-radius: 4px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+  min-width: 100%;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.hb-select__menu {
+  margin: 0;
+  padding: 6px 0;
+  list-style: none;
+}
+
+.hb-select__menu-item {
+  display: flex;
+  align-items: center;
+  padding: 8px 20px;
+  font-size: var(--hb-select-font-size);
+  color: var(--hb-select-text-color);
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.hb-select__menu-item:hover:not(.hb-select__menu-item--disabled):not(.hb-select__menu-item--divided) {
+  background-color: var(--hb-fill-color-light, #f5f7fa);
+}
+
+.hb-select__menu-item--selected {
+  color: var(--hb-color-primary);
+  font-weight: 600;
+}
+
+.hb-select__menu-item--disabled {
+  color: var(--hb-color-text-disabled, #c0c4cc);
+  cursor: not-allowed;
+}
+
+.hb-select__menu-item--divided {
+  border-top: 1px solid var(--hb-border-color-lighter, #e4e7ed);
+  margin-top: 6px;
+  padding-top: 6px;
+}
+
+.hb-select__menu-item--empty {
+  color: var(--hb-select-placeholder-color);
+  cursor: default;
+}
+
+.hb-select__menu-item-checkbox {
+  margin-right: 8px;
+  width: 14px;
+  text-align: center;
+}
+
+.hb-select__menu-item-label {
+  flex: 1;
+}
+
+.hb-select--small {
+  font-size: 12px;
+}
+
+.hb-select--small .hb-select__input {
+  height: 24px;
+  line-height: 24px;
+  font-size: 12px;
+  padding: 0 25px 0 12px;
+}
+
+.hb-select--large {
+  font-size: 16px;
+}
+
+.hb-select--large .hb-select__input {
+  height: 40px;
+  line-height: 40px;
+  font-size: 16px;
+  padding: 0 35px 0 18px;
+}
+
+.hb-select--disabled {
+  cursor: not-allowed;
+}
+
+.hb-select--disabled .hb-select__input {
+  background-color: var(--hb-fill-color-light, #f5f7fa);
+  border-color: var(--hb-select-border-color);
+  color: var(--hb-color-text-disabled, #c0c4cc);
+  cursor: not-allowed;
+}
+

package/dist/collection/components/Skeleton/Skeleton.js

@@ -0,0 +1,178 @@
+import { h } from "@stencil/core";
+/**
+ * Skeleton 骨架屏组件
+ * 在需要等待加载数据的内容位置提供一个占位图形组合
+ */
+export class Skeleton {
+    /** 是否展示动画效果 */
+    active = false;
+    /** 占位段落行数 */
+    rows = 3;
+    /** 为 true 时显示骨架，为 false 时直接渲染子内容 */
+    loading = true;
+    /** 是否显示头像占位图 */
+    avatar = false;
+    /** 是否显示标题占位图 */
+    showTitle = true;
+    /** 是否显示段落占位图 */
+    paragraph = true;
+    renderAvatar() {
+        return h("div", { class: "hb-skeleton__avatar" });
+    }
+    renderTitle() {
+        return h("div", { class: "hb-skeleton__title" });
+    }
+    renderParagraph() {
+        const count = Math.max(1, this.rows);
+        const rowsArr = Array.from({ length: count }, (_, i) => i);
+        return (h("ul", { class: "hb-skeleton__paragraph" }, rowsArr.map((i) => {
+            // 最后一行宽度收窄，更贴近真实段落排版
+            const isLast = i === count - 1;
+            return h("li", { class: { 'hb-skeleton__row': true, 'hb-skeleton__row--short': isLast } });
+        })));
+    }
+    render() {
+        // loading=false 时直接透传子内容
+        if (!this.loading) {
+            return (h("div", { class: "hb-skeleton" }, h("slot", null)));
+        }
+        return (h("div", { class: { 'hb-skeleton': true, 'hb-skeleton--active': this.active } }, this.avatar && h("div", { class: "hb-skeleton__header" }, this.renderAvatar()), h("div", { class: "hb-skeleton__content" }, this.showTitle && this.renderTitle(), this.paragraph && this.renderParagraph())));
+    }
+    static get is() { return "hb-skeleton"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["skeleton.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["skeleton.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "active": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5C55\u793A\u52A8\u753B\u6548\u679C"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "active",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "rows": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u5360\u4F4D\u6BB5\u843D\u884C\u6570"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "rows",
+                "reflect": false,
+                "defaultValue": "3"
+            },
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u4E3A true \u65F6\u663E\u793A\u9AA8\u67B6\uFF0C\u4E3A false \u65F6\u76F4\u63A5\u6E32\u67D3\u5B50\u5185\u5BB9"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "loading",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "avatar": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u663E\u793A\u5934\u50CF\u5360\u4F4D\u56FE"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "avatar",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "showTitle": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u663E\u793A\u6807\u9898\u5360\u4F4D\u56FE"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "show-title",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "paragraph": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u663E\u793A\u6BB5\u843D\u5360\u4F4D\u56FE"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "paragraph",
+                "reflect": false,
+                "defaultValue": "true"
+            }
+        };
+    }
+}
+//# sourceMappingURL=Skeleton.js.map

package/dist/collection/components/Skeleton/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../src/components/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;GAGG;AAMH,MAAM,OAAO,QAAQ;IACnB,eAAe;IACP,MAAM,GAAY,KAAK,CAAC;IAEhC,aAAa;IACL,IAAI,GAAW,CAAC,CAAC;IAEzB,oCAAoC;IAC5B,OAAO,GAAY,IAAI,CAAC;IAEhC,gBAAgB;IACR,MAAM,GAAY,KAAK,CAAC;IAEhC,gBAAgB;IACR,SAAS,GAAY,IAAI,CAAC;IAElC,gBAAgB;IACR,SAAS,GAAY,IAAI,CAAC;IAE1B,YAAY;QAClB,OAAO,WAAK,KAAK,EAAC,qBAAqB,GAAO,CAAC;IACjD,CAAC;IAEO,WAAW;QACjB,OAAO,WAAK,KAAK,EAAC,oBAAoB,GAAO,CAAC;IAChD,CAAC;IAEO,eAAe;QACrB,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;QACrC,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3D,OAAO,CACL,UAAI,KAAK,EAAC,wBAAwB,IAC/B,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;YACjB,qBAAqB;YACrB,MAAM,MAAM,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,CAAC;YAC/B,OAAO,UAAI,KAAK,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE,yBAAyB,EAAE,MAAM,EAAE,GAAO,CAAC;QAC3F,CAAC,CAAC,CACC,CACN,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,yBAAyB;QACzB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO,CACL,WAAK,KAAK,EAAC,aAAa;gBACtB,eAAQ,CACJ,CACP,CAAC;QACJ,CAAC;QAED,OAAO,CACL,WAAK,KAAK,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE,qBAAqB,EAAE,IAAI,CAAC,MAAM,EAAE;YACpE,IAAI,CAAC,MAAM,IAAI,WAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,YAAY,EAAE,CAAO;YAC5E,WAAK,KAAK,EAAC,sBAAsB;gBAC9B,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,eAAe,EAAE,CACrC,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Skeleton 骨架屏组件\n * 在需要等待加载数据的内容位置提供一个占位图形组合\n */\n@Component({\n  tag: 'hb-skeleton',\n  styleUrl: 'skeleton.css',\n  shadow: true,\n})\nexport class Skeleton {\n  /** 是否展示动画效果 */\n  @Prop() active: boolean = false;\n\n  /** 占位段落行数 */\n  @Prop() rows: number = 3;\n\n  /** 为 true 时显示骨架，为 false 时直接渲染子内容 */\n  @Prop() loading: boolean = true;\n\n  /** 是否显示头像占位图 */\n  @Prop() avatar: boolean = false;\n\n  /** 是否显示标题占位图 */\n  @Prop() showTitle: boolean = true;\n\n  /** 是否显示段落占位图 */\n  @Prop() paragraph: boolean = true;\n\n  private renderAvatar() {\n    return <div class=\"hb-skeleton__avatar\"></div>;\n  }\n\n  private renderTitle() {\n    return <div class=\"hb-skeleton__title\"></div>;\n  }\n\n  private renderParagraph() {\n    const count = Math.max(1, this.rows);\n    const rowsArr = Array.from({ length: count }, (_, i) => i);\n    return (\n      <ul class=\"hb-skeleton__paragraph\">\n        {rowsArr.map((i) => {\n          // 最后一行宽度收窄，更贴近真实段落排版\n          const isLast = i === count - 1;\n          return <li class={{ 'hb-skeleton__row': true, 'hb-skeleton__row--short': isLast }}></li>;\n        })}\n      </ul>\n    );\n  }\n\n  render() {\n    // loading=false 时直接透传子内容\n    if (!this.loading) {\n      return (\n        <div class=\"hb-skeleton\">\n          <slot />\n        </div>\n      );\n    }\n\n    return (\n      <div class={{ 'hb-skeleton': true, 'hb-skeleton--active': this.active }}>\n        {this.avatar && <div class=\"hb-skeleton__header\">{this.renderAvatar()}</div>}\n        <div class=\"hb-skeleton__content\">\n          {this.showTitle && this.renderTitle()}\n          {this.paragraph && this.renderParagraph()}\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/Skeleton/skeleton.css

@@ -0,0 +1,59 @@
+:host { display: block; }
+
+.hb-skeleton { display: flex; width: 100%; }
+
+.hb-skeleton__header { padding-right: var(--hb-spacing-md); }
+
+.hb-skeleton__content { flex: 1; }
+
+/* 头像占位 */
+.hb-skeleton__avatar {
+  display: inline-block;
+  width: 32px;
+  height: 32px;
+  line-height: 32px;
+  background: var(--hb-color-fill-secondary);
+  border-radius: var(--hb-border-radius-round);
+  vertical-align: top;
+}
+
+/* 标题占位 */
+.hb-skeleton__title {
+  width: 28%;
+  height: 16px;
+  margin-top: var(--hb-spacing-md);
+  background: var(--hb-color-fill-secondary);
+  border-radius: var(--hb-border-radius-sm);
+}
+
+/* 段落占位 */
+.hb-skeleton__paragraph { padding: 0; margin: var(--hb-spacing-md) 0 0 0; list-style: none; }
+.hb-skeleton__row {
+  width: 100%;
+  height: 16px;
+  margin-bottom: var(--hb-spacing-md);
+  background: var(--hb-color-fill-secondary);
+  border-radius: var(--hb-border-radius-sm);
+  list-style: none;
+}
+.hb-skeleton__row:last-child { margin-bottom: 0; }
+.hb-skeleton__row--short { width: 61%; }
+
+/* 动画状态：对每个占位块应用 shimmer */
+.hb-skeleton--active .hb-skeleton__avatar,
+.hb-skeleton--active .hb-skeleton__title,
+.hb-skeleton--active .hb-skeleton__row {
+  background: linear-gradient(
+    90deg,
+    var(--hb-color-fill-secondary) 25%,
+    var(--hb-color-fill) 37%,
+    var(--hb-color-fill-secondary) 63%
+  );
+  background-size: 400% 100%;
+  animation: hb-skeleton-loading 1.4s ease infinite;
+}
+
+@keyframes hb-skeleton-loading {
+  0% { background-position: 100% 50%; }
+  100% { background-position: 0 50%; }
+}