huibo-ui 0.4.0 → 0.5.0

package/dist/esm/hb-time-picker.entry.js.map

@@ -1 +1 @@
-{"file":"hb-time-picker.entry.js","mappings":"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","names":[],"sources":["src/components/TimePicker/time-picker.css?tag=hb-time-picker&encapsulation=shadow","src/components/TimePicker/TimePicker.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-time-picker-font-size: 14px;\n  --hb-time-picker-height: 32px;\n  --hb-time-picker-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-time-picker-border-color-hover: var(--hb-color-primary);\n  --hb-time-picker-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-time-picker {\n  display: inline-block;\n  position: relative;\n  width: 200px;\n}\n\n.hb-time-picker__input-wrapper {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  cursor: pointer;\n}\n\n.hb-time-picker__input {\n  display: inline-block;\n  width: 100%;\n  height: var(--hb-time-picker-height);\n  line-height: var(--hb-time-picker-height);\n  padding: 0 30px 0 15px;\n  font-size: var(--hb-time-picker-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  background-color: var(--hb-time-picker-bg-color);\n  border: 1px solid var(--hb-time-picker-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  outline: none;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n\n.hb-time-picker__input:hover:not(:disabled) {\n  border-color: var(--hb-time-picker-border-color-hover);\n}\n\n.hb-time-picker__suffix {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n}\n\n.hb-time-picker__clear {\n  margin-right: 8px;\n  cursor: pointer;\n  font-size: 16px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n}\n\n.hb-time-picker__icon {\n  font-size: 14px;\n}\n\n.hb-time-picker__dropdown {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  margin-top: 4px;\n  background-color: var(--hb-time-picker-bg-color);\n  border: 1px solid var(--hb-time-picker-border-color);\n  border-radius: 4px;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  min-width: 200px;\n  max-height: 300px;\n}\n\n.hb-time-picker__body {\n  display: flex;\n  padding: 8px;\n}\n\n.hb-time-picker__list {\n  flex: 1;\n  max-height: 280px;\n  overflow-y: auto;\n}\n\n.hb-time-picker__list-title {\n  text-align: center;\n  font-size: 12px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  padding: 8px 0;\n  border-bottom: 1px solid var(--hb-border-color-lighter, #e4e7ed);\n}\n\n.hb-time-picker__list-content {\n  padding: 4px 0;\n}\n\n.hb-time-picker__item {\n  padding: 8px 16px;\n  text-align: center;\n  font-size: 13px;\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.hb-time-picker__item:hover {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-time-picker__item--selected {\n  background-color: var(--hb-color-primary-light-9, #ecf5ff);\n  color: var(--hb-color-primary);\n  font-weight: 600;\n}\n\n.hb-time-picker--small {\n  width: 180px;\n}\n\n.hb-time-picker--small .hb-time-picker__input {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n}\n\n.hb-time-picker--large {\n  width: 220px;\n}\n\n.hb-time-picker--large .hb-time-picker__input {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n}\n\n.hb-time-picker--disabled {\n  cursor: not-allowed;\n}\n\n.hb-time-picker--disabled .hb-time-picker__input {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-time-picker-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\nimport { createClickOutsideHandler } from '../../utils/click-outside';\n\n/**\n * TimePicker 时间选择器组件\n * 用于选择或输入时间\n */\n@Component({\n  tag: 'hb-time-picker',\n  styleUrl: 'time-picker.css',\n  shadow: true,\n})\nexport class TimePicker {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue?: string;\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 'HH:mm:ss'\n   */\n  @Prop() format: string = 'HH:mm:ss';\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  @State() isOpen: boolean = false;\n  @State() inputValue: string = '';\n  @State() selectedHour: number = 0;\n  @State() selectedMinute: number = 0;\n  @State() selectedSecond: number = 0;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  private clickOutside = createClickOutsideHandler({\n    host: null as any,\n    isOpen: () => this.isOpen,\n    onClose: () => { this.isOpen = false; },\n  });\n\n  componentDidLoad() {\n    this.clickOutside = createClickOutsideHandler({\n      host: this.el,\n      isOpen: () => this.isOpen,\n      onClose: () => { this.isOpen = false; },\n    });\n    this.clickOutside.connect();\n    this.updateInputValue();\n  }\n\n  disconnectedCallback() {\n    this.clickOutside.disconnect();\n  }\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.updateInputValue();\n  }\n\n  private updateInputValue() {\n    if (!this.modelValue) {\n      this.inputValue = '';\n      return;\n    }\n\n    const parts = this.modelValue.split(':');\n    if (parts.length >= 2) {\n      this.selectedHour = parseInt(parts[0]) || 0;\n      this.selectedMinute = parseInt(parts[1]) || 0;\n      this.selectedSecond = parseInt(parts[2]) || 0;\n      this.inputValue = this.modelValue;\n    }\n  }\n\n  private handleInputClick = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.modelValue = undefined;\n    this.inputValue = '';\n    this.isOpen = false;\n    this.hbChange.emit(undefined);\n  };\n\n  private handleTimeSelect = (hour: number, minute: number, second: number) => {\n    this.selectedHour = hour;\n    this.selectedMinute = minute;\n    this.selectedSecond = second;\n    \n    const timeStr = `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}:${String(second).padStart(2, '0')}`;\n    this.modelValue = timeStr;\n    this.inputValue = timeStr;\n    this.isOpen = false;\n    this.hbChange.emit(timeStr);\n  };\n\n  private generateNumbers(max: number): number[] {\n    return Array.from({ length: max + 1 }, (_, i) => i);\n  }\n\n  render() {\n    const hours = this.generateNumbers(23);\n    const minutes = this.generateNumbers(59);\n    const seconds = this.generateNumbers(59);\n\n    return (\n      <div\n        class={{\n          'hb-time-picker': true,\n          'hb-time-picker--open': this.isOpen,\n          'hb-time-picker--disabled': this.disabled,\n          [`hb-time-picker--${this.size}`]: true,\n        }}\n      >\n        <div class=\"hb-time-picker__input-wrapper\" onClick={this.handleInputClick}>\n          <input\n            type=\"text\"\n            id={this.inputId}\n            name={this.name}\n            class=\"hb-time-picker__input\"\n            placeholder={this.placeholder}\n            value={this.inputValue}\n            disabled={this.disabled}\n            readonly\n          />\n          <span class=\"hb-time-picker__suffix\">\n            {this.clearable && this.modelValue && (\n              <span class=\"hb-time-picker__clear\" onClick={this.handleClear}>\n                ×\n              </span>\n            )}\n            <span class=\"hb-time-picker__icon\">🕐</span>\n          </span>\n        </div>\n        {this.isOpen && (\n          <div class=\"hb-time-picker__dropdown\">\n            <div class=\"hb-time-picker__body\">\n              <div class=\"hb-time-picker__list\">\n                <div class=\"hb-time-picker__list-title\">时</div>\n                <div class=\"hb-time-picker__list-content\">\n                  {hours.map((hour) => (\n                    <div\n                      class={{\n                        'hb-time-picker__item': true,\n                        'hb-time-picker__item--selected': hour === this.selectedHour,\n                      }}\n                      onClick={() => this.handleTimeSelect(hour, this.selectedMinute, this.selectedSecond)}\n                    >\n                      {String(hour).padStart(2, '0')}\n                    </div>\n                  ))}\n                </div>\n              </div>\n              <div class=\"hb-time-picker__list\">\n                <div class=\"hb-time-picker__list-title\">分</div>\n                <div class=\"hb-time-picker__list-content\">\n                  {minutes.map((minute) => (\n                    <div\n                      class={{\n                        'hb-time-picker__item': true,\n                        'hb-time-picker__item--selected': minute === this.selectedMinute,\n                      }}\n                      onClick={() => this.handleTimeSelect(this.selectedHour, minute, this.selectedSecond)}\n                    >\n                      {String(minute).padStart(2, '0')}\n                    </div>\n                  ))}\n                </div>\n              </div>\n              {this.format.includes('ss') && (\n                <div class=\"hb-time-picker__list\">\n                  <div class=\"hb-time-picker__list-title\">秒</div>\n                  <div class=\"hb-time-picker__list-content\">\n                    {seconds.map((second) => (\n                      <div\n                        class={{\n                          'hb-time-picker__item': true,\n                          'hb-time-picker__item--selected': second === this.selectedSecond,\n                        }}\n                        onClick={() => this.handleTimeSelect(this.selectedHour, this.selectedMinute, second)}\n                      >\n                        {String(second).padStart(2, '0')}\n                      </div>\n                    ))}\n                  </div>\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n\n"],"version":3}
+{"file":"hb-time-picker.entry.js","mappings":"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","names":[],"sources":["src/components/TimePicker/time-picker.css?tag=hb-time-picker&encapsulation=shadow","src/components/TimePicker/TimePicker.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-time-picker-font-size: 14px;\n  --hb-time-picker-height: 32px;\n  --hb-time-picker-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-time-picker-border-color-hover: var(--hb-color-primary);\n  --hb-time-picker-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-time-picker {\n  display: inline-block;\n  position: relative;\n  width: 200px;\n}\n\n.hb-time-picker__input-wrapper {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  cursor: pointer;\n}\n\n.hb-time-picker__input {\n  display: inline-block;\n  width: 100%;\n  height: var(--hb-time-picker-height);\n  line-height: var(--hb-time-picker-height);\n  padding: 0 30px 0 15px;\n  font-size: var(--hb-time-picker-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  background-color: var(--hb-time-picker-bg-color);\n  border: 1px solid var(--hb-time-picker-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  outline: none;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n\n.hb-time-picker__input:hover:not(:disabled) {\n  border-color: var(--hb-time-picker-border-color-hover);\n}\n\n.hb-time-picker__suffix {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n}\n\n.hb-time-picker__clear {\n  margin-right: 8px;\n  cursor: pointer;\n  font-size: 16px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n}\n\n.hb-time-picker__icon {\n  font-size: 14px;\n}\n\n.hb-time-picker__dropdown {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  margin-top: 4px;\n  background-color: var(--hb-time-picker-bg-color);\n  border: 1px solid var(--hb-time-picker-border-color);\n  border-radius: 4px;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  min-width: 200px;\n  max-height: 300px;\n}\n\n.hb-time-picker__body {\n  display: flex;\n  padding: 8px;\n}\n\n.hb-time-picker__list {\n  flex: 1;\n  max-height: 280px;\n  overflow-y: auto;\n}\n\n.hb-time-picker__list-title {\n  text-align: center;\n  font-size: 12px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  padding: 8px 0;\n  border-bottom: 1px solid var(--hb-border-color-lighter, #e4e7ed);\n}\n\n.hb-time-picker__list-content {\n  padding: 4px 0;\n}\n\n.hb-time-picker__item {\n  padding: 8px 16px;\n  text-align: center;\n  font-size: 13px;\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.hb-time-picker__item:hover {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-time-picker__item--selected {\n  background-color: var(--hb-color-primary-light-9, #ecf5ff);\n  color: var(--hb-color-primary);\n  font-weight: 600;\n}\n\n.hb-time-picker--small {\n  width: 180px;\n}\n\n.hb-time-picker--small .hb-time-picker__input {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n}\n\n.hb-time-picker--large {\n  width: 220px;\n}\n\n.hb-time-picker--large .hb-time-picker__input {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n}\n\n.hb-time-picker--disabled {\n  cursor: not-allowed;\n}\n\n.hb-time-picker--disabled .hb-time-picker__input {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-time-picker-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\nimport { createClickOutsideHandler } from '../../utils/click-outside';\n\n/**\n * TimePicker 时间选择器组件\n * 用于选择或输入时间\n */\n@Component({\n  tag: 'hb-time-picker',\n  styleUrl: 'time-picker.css',\n  shadow: true,\n})\nexport class TimePicker {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue?: string;\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 'HH:mm:ss'\n   */\n  @Prop() format: string = 'HH:mm:ss';\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  @State() isOpen: boolean = false;\n  @State() inputValue: string = '';\n  @State() selectedHour: number = 0;\n  @State() selectedMinute: number = 0;\n  @State() selectedSecond: number = 0;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  private clickOutside = createClickOutsideHandler({\n    host: null as any,\n    isOpen: () => this.isOpen,\n    onClose: () => {\n      this.isOpen = false;\n    },\n  });\n\n  componentDidLoad() {\n    this.clickOutside = createClickOutsideHandler({\n      host: this.el,\n      isOpen: () => this.isOpen,\n      onClose: () => {\n        this.isOpen = false;\n      },\n    });\n    this.clickOutside.connect();\n    this.updateInputValue();\n  }\n\n  disconnectedCallback() {\n    this.clickOutside.disconnect();\n  }\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.updateInputValue();\n  }\n\n  private updateInputValue() {\n    if (!this.modelValue) {\n      this.inputValue = '';\n      return;\n    }\n\n    const parts = this.modelValue.split(':');\n    if (parts.length >= 2) {\n      // O1：显式传 radix 10（与全库一致），并用 ?? 替代 || 以保留合法的 0。\n      this.selectedHour = Number.isNaN(parseInt(parts[0], 10)) ? 0 : parseInt(parts[0], 10);\n      this.selectedMinute = Number.isNaN(parseInt(parts[1], 10)) ? 0 : parseInt(parts[1], 10);\n      this.selectedSecond = parts.length >= 3 ? (Number.isNaN(parseInt(parts[2], 10)) ? 0 : parseInt(parts[2], 10)) : 0;\n      this.inputValue = this.modelValue;\n    }\n  }\n\n  private handleInputClick = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.modelValue = undefined;\n    this.inputValue = '';\n    this.isOpen = false;\n    this.hbChange.emit(undefined);\n  };\n\n  private handleTimeSelect = (hour: number, minute: number, second: number) => {\n    this.selectedHour = hour;\n    this.selectedMinute = minute;\n    this.selectedSecond = second;\n\n    const timeStr = `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}:${String(second).padStart(2, '0')}`;\n    this.modelValue = timeStr;\n    this.inputValue = timeStr;\n    this.isOpen = false;\n    this.hbChange.emit(timeStr);\n  };\n\n  private generateNumbers(max: number): number[] {\n    return Array.from({ length: max + 1 }, (_, i) => i);\n  }\n\n  render() {\n    const hours = this.generateNumbers(23);\n    const minutes = this.generateNumbers(59);\n    const seconds = this.generateNumbers(59);\n\n    return (\n      <div\n        class={{\n          'hb-time-picker': true,\n          'hb-time-picker--open': this.isOpen,\n          'hb-time-picker--disabled': this.disabled,\n          [`hb-time-picker--${this.size}`]: true,\n        }}\n      >\n        <div class=\"hb-time-picker__input-wrapper\" onClick={this.handleInputClick}>\n          <input\n            type=\"text\"\n            id={this.inputId}\n            name={this.name}\n            class=\"hb-time-picker__input\"\n            placeholder={this.placeholder}\n            value={this.inputValue}\n            disabled={this.disabled}\n            readonly\n          />\n          <span class=\"hb-time-picker__suffix\">\n            {this.clearable && this.modelValue && (\n              <span class=\"hb-time-picker__clear\" onClick={this.handleClear}>\n                ×\n              </span>\n            )}\n            <span class=\"hb-time-picker__icon\">🕐</span>\n          </span>\n        </div>\n        {this.isOpen && (\n          <div class=\"hb-time-picker__dropdown\">\n            <div class=\"hb-time-picker__body\">\n              <div class=\"hb-time-picker__list\">\n                <div class=\"hb-time-picker__list-title\">时</div>\n                <div class=\"hb-time-picker__list-content\">\n                  {hours.map(hour => (\n                    <div\n                      class={{\n                        'hb-time-picker__item': true,\n                        'hb-time-picker__item--selected': hour === this.selectedHour,\n                      }}\n                      onClick={() => this.handleTimeSelect(hour, this.selectedMinute, this.selectedSecond)}\n                    >\n                      {String(hour).padStart(2, '0')}\n                    </div>\n                  ))}\n                </div>\n              </div>\n              <div class=\"hb-time-picker__list\">\n                <div class=\"hb-time-picker__list-title\">分</div>\n                <div class=\"hb-time-picker__list-content\">\n                  {minutes.map(minute => (\n                    <div\n                      class={{\n                        'hb-time-picker__item': true,\n                        'hb-time-picker__item--selected': minute === this.selectedMinute,\n                      }}\n                      onClick={() => this.handleTimeSelect(this.selectedHour, minute, this.selectedSecond)}\n                    >\n                      {String(minute).padStart(2, '0')}\n                    </div>\n                  ))}\n                </div>\n              </div>\n              {this.format.includes('ss') && (\n                <div class=\"hb-time-picker__list\">\n                  <div class=\"hb-time-picker__list-title\">秒</div>\n                  <div class=\"hb-time-picker__list-content\">\n                    {seconds.map(second => (\n                      <div\n                        class={{\n                          'hb-time-picker__item': true,\n                          'hb-time-picker__item--selected': second === this.selectedSecond,\n                        }}\n                        onClick={() => this.handleTimeSelect(this.selectedHour, this.selectedMinute, second)}\n                      >\n                        {String(second).padStart(2, '0')}\n                      </div>\n                    ))}\n                  </div>\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hb-time-select.entry.js

@@ -83,8 +83,17 @@ const TimeSelect = class {
     }
     generateTimeOptions() {
         const options = [];
-        const [startHour, startMinute] = this.start.split(':').map(Number);
-        const [endHour, endMinute] = this.end.split(':').map(Number);
+        // O2：校验 split 长度，避免传 "9" 或 "" 时得 NaN → 空下拉无报错。
+        const startParts = this.start.split(':');
+        const endParts = this.end.split(':');
+        if (startParts.length < 2 || endParts.length < 2)
+            return options;
+        const startHour = Number(startParts[0]);
+        const startMinute = Number(startParts[1]);
+        const endHour = Number(endParts[0]);
+        const endMinute = Number(endParts[1]);
+        if ([startHour, startMinute, endHour, endMinute].some(Number.isNaN))
+            return options;
         const startMinutes = startHour * 60 + startMinute;
         const endMinutes = endHour * 60 + endMinute;
         for (let minutes = startMinutes; minutes <= endMinutes; minutes += this.step) {
@@ -120,12 +129,12 @@ const TimeSelect = class {
     render() {
         const timeOptions = this.generateTimeOptions();
         const showClear = this.clearable && this.modelValue;
-        return (h("div", { key: '80b6173862d1e0951ef347de5193caedcac932fe', class: {
+        return (h("div", { key: '925f796c7bcbb7c9aab0ce4d84605ac1165c3847', class: {
                 'hb-time-select': true,
                 'hb-time-select--open': this.isOpen,
                 'hb-time-select--disabled': this.disabled,
                 [`hb-time-select--${this.size}`]: true,
-            } }, h("div", { key: '1641232ea00cc0867c5b6bc654d803af01883607', class: "hb-time-select__input-wrapper", onClick: this.handleInputClick }, h("input", { key: 'b896fb8c57ad48d448b15b92eeee853c70d168d4', type: "text", class: "hb-time-select__input", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, readonly: true }), h("span", { key: '5056a36aaa17a2d5c2b47db106f6c7ddff0607d0', class: "hb-time-select__suffix" }, showClear && (h("span", { key: '12b24a90b988d6f351547b351b35c03bc277c611', class: "hb-time-select__clear", onClick: this.handleClear }, "\u00D7")), h("span", { key: '2a3f3187510fb01428d429237ec2a8213f3cab2b', class: "hb-time-select__arrow" }, "\u25BC"))), this.isOpen && (h("div", { key: '3f8d01ce99076e93b672642fa0c40eed4df0bf12', class: "hb-time-select__dropdown" }, h("ul", { key: '50c21be3d365710617ce81f8411873ee3cecbc4b', class: "hb-time-select__menu" }, timeOptions.map((time) => (h("li", { class: {
+            } }, h("div", { key: '04c127edd61105261df535e13214ebab8b263c48', class: "hb-time-select__input-wrapper", onClick: this.handleInputClick }, h("input", { key: 'ae6b93c66b415cf8dab94406af62e26e45564aa4', type: "text", class: "hb-time-select__input", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, readonly: true }), h("span", { key: '7ab6337ba0008b186fdc9d421efaed7063e95a7a', class: "hb-time-select__suffix" }, showClear && (h("span", { key: 'd1b322f46ebe8705743d37e159959aa8eb3b5d1c', class: "hb-time-select__clear", onClick: this.handleClear }, "\u00D7")), h("span", { key: '7fb0894ba59f6366af81a90689c6530b78fa5807', class: "hb-time-select__arrow" }, "\u25BC"))), this.isOpen && (h("div", { key: 'ccfa2ea217df443a4f8177f6a65d351f12ad33bc', class: "hb-time-select__dropdown" }, h("ul", { key: 'a5f75285a9c42c782479e0c825208411efbf6048', class: "hb-time-select__menu" }, timeOptions.map(time => (h("li", { class: {
                 'hb-time-select__menu-item': true,
                 'hb-time-select__menu-item--selected': time === this.modelValue,
             }, onClick: () => this.handleSelect(time) }, time))))))));

package/dist/esm/hb-time-select.entry.js.map

@@ -1 +1 @@
-{"file":"hb-time-select.entry.js","mappings":"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","names":[],"sources":["src/components/TimeSelect/time-select.css?tag=hb-time-select&encapsulation=shadow","src/components/TimeSelect/TimeSelect.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-time-select-font-size: 14px;\n  --hb-time-select-height: 32px;\n  --hb-time-select-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-time-select-border-color-hover: var(--hb-color-primary);\n  --hb-time-select-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-time-select {\n  display: inline-block;\n  position: relative;\n  width: 200px;\n}\n\n.hb-time-select__input-wrapper {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  cursor: pointer;\n}\n\n.hb-time-select__input {\n  display: inline-block;\n  width: 100%;\n  height: var(--hb-time-select-height);\n  line-height: var(--hb-time-select-height);\n  padding: 0 30px 0 15px;\n  font-size: var(--hb-time-select-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  background-color: var(--hb-time-select-bg-color);\n  border: 1px solid var(--hb-time-select-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  outline: none;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n\n.hb-time-select__input:hover:not(:disabled) {\n  border-color: var(--hb-time-select-border-color-hover);\n}\n\n.hb-time-select__suffix {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n}\n\n.hb-time-select__clear {\n  margin-right: 8px;\n  cursor: pointer;\n  font-size: 16px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n}\n\n.hb-time-select__arrow {\n  font-size: 12px;\n  transition: transform 0.3s;\n}\n\n.hb-time-select--open .hb-time-select__arrow {\n  transform: rotate(180deg);\n}\n\n.hb-time-select__dropdown {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  margin-top: 4px;\n  background-color: var(--hb-time-select-bg-color);\n  border: 1px solid var(--hb-time-select-border-color);\n  border-radius: 4px;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  min-width: 100%;\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.hb-time-select__menu {\n  margin: 0;\n  padding: 6px 0;\n  list-style: none;\n}\n\n.hb-time-select__menu-item {\n  padding: 8px 20px;\n  font-size: var(--hb-time-select-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.hb-time-select__menu-item:hover {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-time-select__menu-item--selected {\n  color: var(--hb-color-primary);\n  font-weight: 600;\n  background-color: var(--hb-color-primary-light-9, #ecf5ff);\n}\n\n.hb-time-select--small {\n  width: 180px;\n}\n\n.hb-time-select--small .hb-time-select__input {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n}\n\n.hb-time-select--large {\n  width: 220px;\n}\n\n.hb-time-select--large .hb-time-select__input {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n}\n\n.hb-time-select--disabled {\n  cursor: not-allowed;\n}\n\n.hb-time-select--disabled .hb-time-select__input {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-time-select-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\n\n/**\n * TimeSelect 时间选择组件\n * 可用于时间选择\n */\n@Component({\n  tag: 'hb-time-select',\n  styleUrl: 'time-select.css',\n  shadow: true,\n})\nexport class TimeSelect {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue?: string;\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 '09:00'\n   */\n  @Prop() start: string = '09:00';\n\n  /**\n   * 结束时间\n   * @default '18:00'\n   */\n  @Prop() end: string = '18:00';\n\n  /**\n   * 间隔时间\n   * @default 60\n   */\n  @Prop() step: number = 60;\n\n  /**\n   * 最小时间\n   */\n  @Prop() minTime?: string;\n\n  /**\n   * 最大时间\n   */\n  @Prop() maxTime?: string;\n\n  @State() isOpen: boolean = false;\n  @State() inputValue: string = '';\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  componentDidLoad() {\n    this.updateInputValue();\n    document.addEventListener('click', this.handleDocumentClick);\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('click', this.handleDocumentClick);\n  }\n\n  private handleDocumentClick = (e: MouseEvent) => {\n    if (!this.isOpen) return;\n    const target = e.target as HTMLElement;\n    if (!this.el.contains(target)) {\n      this.isOpen = false;\n    }\n  };\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.updateInputValue();\n  }\n\n  private updateInputValue() {\n    this.inputValue = this.modelValue || '';\n  }\n\n  private generateTimeOptions(): string[] {\n    const options: string[] = [];\n    const [startHour, startMinute] = this.start.split(':').map(Number);\n    const [endHour, endMinute] = this.end.split(':').map(Number);\n    \n    const startMinutes = startHour * 60 + startMinute;\n    const endMinutes = endHour * 60 + endMinute;\n    \n    for (let minutes = startMinutes; minutes <= endMinutes; minutes += this.step) {\n      const hour = Math.floor(minutes / 60);\n      const minute = minutes % 60;\n      const timeStr = `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}`;\n      \n      if (this.minTime && timeStr < this.minTime) continue;\n      if (this.maxTime && timeStr > this.maxTime) continue;\n      \n      options.push(timeStr);\n    }\n    \n    return options;\n  }\n\n  private handleInputClick = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.modelValue = undefined;\n    this.inputValue = '';\n    this.isOpen = false;\n    this.hbChange.emit(undefined);\n  };\n\n  private handleSelect = (time: string) => {\n    this.modelValue = time;\n    this.inputValue = time;\n    this.isOpen = false;\n    this.hbChange.emit(time);\n  };\n\n  render() {\n    const timeOptions = this.generateTimeOptions();\n    const showClear = this.clearable && this.modelValue;\n\n    return (\n      <div\n        class={{\n          'hb-time-select': true,\n          'hb-time-select--open': this.isOpen,\n          'hb-time-select--disabled': this.disabled,\n          [`hb-time-select--${this.size}`]: true,\n        }}\n      >\n        <div class=\"hb-time-select__input-wrapper\" onClick={this.handleInputClick}>\n          <input\n            type=\"text\"\n            class=\"hb-time-select__input\"\n            placeholder={this.placeholder}\n            value={this.inputValue}\n            disabled={this.disabled}\n            readonly\n          />\n          <span class=\"hb-time-select__suffix\">\n            {showClear && (\n              <span class=\"hb-time-select__clear\" onClick={this.handleClear}>\n                ×\n              </span>\n            )}\n            <span class=\"hb-time-select__arrow\">▼</span>\n          </span>\n        </div>\n        {this.isOpen && (\n          <div class=\"hb-time-select__dropdown\">\n            <ul class=\"hb-time-select__menu\">\n              {timeOptions.map((time) => (\n                <li\n                  class={{\n                    'hb-time-select__menu-item': true,\n                    'hb-time-select__menu-item--selected': time === this.modelValue,\n                  }}\n                  onClick={() => this.handleSelect(time)}\n                >\n                  {time}\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n\n"],"version":3}
+{"file":"hb-time-select.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,orQAAorQ,CAAC;AAC3sQ,2BAAe,aAAa;;MCUf,UAAU;;;;;;;;;IAMI,UAAU,CAAU;;;;IAKrC,WAAW,GAAW,OAAO,CAAC;;;;;IAM9B,QAAQ,GAAY,KAAK,CAAC;;;;IAK1B,IAAI,GAAkC,SAAS,CAAC;;;;;IAMhD,SAAS,GAAY,KAAK,CAAC;;;;;IAM3B,KAAK,GAAW,OAAO,CAAC;;;;;IAMxB,GAAG,GAAW,OAAO,CAAC;;;;;IAMtB,IAAI,GAAW,EAAE,CAAC;;;;IAKlB,OAAO,CAAU;;;;IAKjB,OAAO,CAAU;IAEhB,MAAM,GAAY,KAAK,CAAC;IACxB,UAAU,GAAW,EAAE,CAAC;;;;IAKxB,QAAQ,CAAuB;IAExC,gBAAgB;QACd,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;KAC9D;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;KACjE;IAEO,mBAAmB,GAAG,CAAC,CAAa;QAC1C,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,OAAO;QACzB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QACvC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;YAC7B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;SACrB;KACF,CAAC;IAGF,iBAAiB;QACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;KACzB;IAEO,gBAAgB;QACtB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAC;KACzC;IAEO,mBAAmB;QACzB,MAAM,OAAO,GAAa,EAAE,CAAC;;QAE7B,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACzC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACrC,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE,OAAO,OAAO,CAAC;QACjE,MAAM,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;QACxC,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1C,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QACpC,MAAM,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QACtC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;YAAE,OAAO,OAAO,CAAC;QAEpF,MAAM,YAAY,GAAG,SAAS,GAAG,EAAE,GAAG,WAAW,CAAC;QAClD,MAAM,UAAU,GAAG,OAAO,GAAG,EAAE,GAAG,SAAS,CAAC;QAE5C,KAAK,IAAI,OAAO,GAAG,YAAY,EAAE,OAAO,IAAI,UAAU,EAAE,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE;YAC5E,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;YACtC,MAAM,MAAM,GAAG,OAAO,GAAG,EAAE,CAAC;YAC5B,MAAM,OAAO,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC;YAEtF,IAAI,IAAI,CAAC,OAAO,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO;gBAAE,SAAS;YACrD,IAAI,IAAI,CAAC,OAAO,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO;gBAAE,SAAS;YAErD,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACvB;QAED,OAAO,OAAO,CAAC;KAChB;IAEO,gBAAgB,GAAG;QACzB,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;KAC5B,CAAC;IAEM,WAAW,GAAG,CAAC,CAAQ;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAC5B,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACrB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;KAC/B,CAAC;IAEM,YAAY,GAAG,CAAC,IAAY;QAClC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC1B,CAAC;IAEF,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,UAAU,CAAC;QAEpD,QACE,4DACE,KAAK,EAAE;gBACL,gBAAgB,EAAE,IAAI;gBACtB,sBAAsB,EAAE,IAAI,CAAC,MAAM;gBACnC,0BAA0B,EAAE,IAAI,CAAC,QAAQ;gBACzC,CAAC,mBAAmB,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;aACvC,IAED,4DAAK,KAAK,EAAC,+BAA+B,EAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,IACvE,8DAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,uBAAuB,EAAC,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,SAAG,EAC5I,6DAAM,KAAK,EAAC,wBAAwB,IACjC,SAAS,KACR,6DAAM,KAAK,EAAC,uBAAuB,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,aAEtD,CACR,EACD,6DAAM,KAAK,EAAC,uBAAuB,aAAS,CACvC,CACH,EACL,IAAI,CAAC,MAAM,KACV,4DAAK,KAAK,EAAC,0BAA0B,IACnC,2DAAI,KAAK,EAAC,sBAAsB,IAC7B,WAAW,CAAC,GAAG,CAAC,IAAI,KACnB,UACE,KAAK,EAAE;gBACL,2BAA2B,EAAE,IAAI;gBACjC,qCAAqC,EAAE,IAAI,KAAK,IAAI,CAAC,UAAU;aAChE,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAErC,IAAI,CACF,CACN,CAAC,CACC,CACD,CACP,CACG,EACN;KACH;;;;;;;;;","names":[],"sources":["src/components/TimeSelect/time-select.css?tag=hb-time-select&encapsulation=shadow","src/components/TimeSelect/TimeSelect.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-time-select-font-size: 14px;\n  --hb-time-select-height: 32px;\n  --hb-time-select-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-time-select-border-color-hover: var(--hb-color-primary);\n  --hb-time-select-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-time-select {\n  display: inline-block;\n  position: relative;\n  width: 200px;\n}\n\n.hb-time-select__input-wrapper {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  cursor: pointer;\n}\n\n.hb-time-select__input {\n  display: inline-block;\n  width: 100%;\n  height: var(--hb-time-select-height);\n  line-height: var(--hb-time-select-height);\n  padding: 0 30px 0 15px;\n  font-size: var(--hb-time-select-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  background-color: var(--hb-time-select-bg-color);\n  border: 1px solid var(--hb-time-select-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  outline: none;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n\n.hb-time-select__input:hover:not(:disabled) {\n  border-color: var(--hb-time-select-border-color-hover);\n}\n\n.hb-time-select__suffix {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n}\n\n.hb-time-select__clear {\n  margin-right: 8px;\n  cursor: pointer;\n  font-size: 16px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n}\n\n.hb-time-select__arrow {\n  font-size: 12px;\n  transition: transform 0.3s;\n}\n\n.hb-time-select--open .hb-time-select__arrow {\n  transform: rotate(180deg);\n}\n\n.hb-time-select__dropdown {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  margin-top: 4px;\n  background-color: var(--hb-time-select-bg-color);\n  border: 1px solid var(--hb-time-select-border-color);\n  border-radius: 4px;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  min-width: 100%;\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.hb-time-select__menu {\n  margin: 0;\n  padding: 6px 0;\n  list-style: none;\n}\n\n.hb-time-select__menu-item {\n  padding: 8px 20px;\n  font-size: var(--hb-time-select-font-size);\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.hb-time-select__menu-item:hover {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-time-select__menu-item--selected {\n  color: var(--hb-color-primary);\n  font-weight: 600;\n  background-color: var(--hb-color-primary-light-9, #ecf5ff);\n}\n\n.hb-time-select--small {\n  width: 180px;\n}\n\n.hb-time-select--small .hb-time-select__input {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n}\n\n.hb-time-select--large {\n  width: 220px;\n}\n\n.hb-time-select--large .hb-time-select__input {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n}\n\n.hb-time-select--disabled {\n  cursor: not-allowed;\n}\n\n.hb-time-select--disabled .hb-time-select__input {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-time-select-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Element, Watch } from '@stencil/core';\n\n/**\n * TimeSelect 时间选择组件\n * 可用于时间选择\n */\n@Component({\n  tag: 'hb-time-select',\n  styleUrl: 'time-select.css',\n  shadow: true,\n})\nexport class TimeSelect {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue?: string;\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 '09:00'\n   */\n  @Prop() start: string = '09:00';\n\n  /**\n   * 结束时间\n   * @default '18:00'\n   */\n  @Prop() end: string = '18:00';\n\n  /**\n   * 间隔时间\n   * @default 60\n   */\n  @Prop() step: number = 60;\n\n  /**\n   * 最小时间\n   */\n  @Prop() minTime?: string;\n\n  /**\n   * 最大时间\n   */\n  @Prop() maxTime?: string;\n\n  @State() isOpen: boolean = false;\n  @State() inputValue: string = '';\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  componentDidLoad() {\n    this.updateInputValue();\n    document.addEventListener('click', this.handleDocumentClick);\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('click', this.handleDocumentClick);\n  }\n\n  private handleDocumentClick = (e: MouseEvent) => {\n    if (!this.isOpen) return;\n    const target = e.target as HTMLElement;\n    if (!this.el.contains(target)) {\n      this.isOpen = false;\n    }\n  };\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.updateInputValue();\n  }\n\n  private updateInputValue() {\n    this.inputValue = this.modelValue || '';\n  }\n\n  private generateTimeOptions(): string[] {\n    const options: string[] = [];\n    // O2：校验 split 长度，避免传 \"9\" 或 \"\" 时得 NaN → 空下拉无报错。\n    const startParts = this.start.split(':');\n    const endParts = this.end.split(':');\n    if (startParts.length < 2 || endParts.length < 2) return options;\n    const startHour = Number(startParts[0]);\n    const startMinute = Number(startParts[1]);\n    const endHour = Number(endParts[0]);\n    const endMinute = Number(endParts[1]);\n    if ([startHour, startMinute, endHour, endMinute].some(Number.isNaN)) return options;\n\n    const startMinutes = startHour * 60 + startMinute;\n    const endMinutes = endHour * 60 + endMinute;\n\n    for (let minutes = startMinutes; minutes <= endMinutes; minutes += this.step) {\n      const hour = Math.floor(minutes / 60);\n      const minute = minutes % 60;\n      const timeStr = `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}`;\n\n      if (this.minTime && timeStr < this.minTime) continue;\n      if (this.maxTime && timeStr > this.maxTime) continue;\n\n      options.push(timeStr);\n    }\n\n    return options;\n  }\n\n  private handleInputClick = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.modelValue = undefined;\n    this.inputValue = '';\n    this.isOpen = false;\n    this.hbChange.emit(undefined);\n  };\n\n  private handleSelect = (time: string) => {\n    this.modelValue = time;\n    this.inputValue = time;\n    this.isOpen = false;\n    this.hbChange.emit(time);\n  };\n\n  render() {\n    const timeOptions = this.generateTimeOptions();\n    const showClear = this.clearable && this.modelValue;\n\n    return (\n      <div\n        class={{\n          'hb-time-select': true,\n          'hb-time-select--open': this.isOpen,\n          'hb-time-select--disabled': this.disabled,\n          [`hb-time-select--${this.size}`]: true,\n        }}\n      >\n        <div class=\"hb-time-select__input-wrapper\" onClick={this.handleInputClick}>\n          <input type=\"text\" class=\"hb-time-select__input\" placeholder={this.placeholder} value={this.inputValue} disabled={this.disabled} readonly />\n          <span class=\"hb-time-select__suffix\">\n            {showClear && (\n              <span class=\"hb-time-select__clear\" onClick={this.handleClear}>\n                ×\n              </span>\n            )}\n            <span class=\"hb-time-select__arrow\">▼</span>\n          </span>\n        </div>\n        {this.isOpen && (\n          <div class=\"hb-time-select__dropdown\">\n            <ul class=\"hb-time-select__menu\">\n              {timeOptions.map(time => (\n                <li\n                  class={{\n                    'hb-time-select__menu-item': true,\n                    'hb-time-select__menu-item--selected': time === this.modelValue,\n                  }}\n                  onClick={() => this.handleSelect(time)}\n                >\n                  {time}\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hb-tooltip.entry.js

@@ -1,8 +1,9 @@
 import { r as registerInstance, g as getElement, h } from './index-fdf7135e.js';
 import { c as computePosition, g as getNextZIndex } from './popup-manager-128cc685.js';
-import { i as isActivationKey } from './a11y-f9ab2964.js';
+import { i as isActivationKey } from './a11y-e4cde5b0.js';
+import { c as createLeaveScheduler } from './transition-4295d789.js';
 
-const tooltipCss = "/*! 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{.visible{visibility:visible}.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;.hb-tooltip__trigger,:host{display:inline-block}.hb-tooltip__popup{background-color:var(--hb-p-gray-800);border-radius:var(--hb-border-radius-sm);box-shadow:var(--hb-box-shadow);color:#fff;font-size:var(--hb-font-size-sm);pointer-events:auto;word-wrap:break-word;animation:hb-tooltip-fade-in .15s ease-out;line-height:1.4;max-width:300px;padding:6px 12px;position:fixed}.hb-tooltip__arrow{background-color:var(--hb-p-gray-800);height:8px;position:absolute;transform:rotate(45deg);width:8px}.hb-tooltip__content{position:relative;z-index:1}@keyframes hb-tooltip-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@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 tooltipCss = "/*! 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{.visible{visibility:visible}.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;.hb-tooltip__trigger,:host{display:inline-block}.hb-tooltip__popup{background-color:var(--hb-p-gray-800);border-radius:var(--hb-border-radius-sm);box-shadow:var(--hb-box-shadow);color:#fff;font-size:var(--hb-font-size-sm);pointer-events:auto;word-wrap:break-word;animation:hb-tooltip-fade-in .15s ease-out;line-height:1.4;max-width:300px;padding:6px 12px;position:fixed}.hb-tooltip__arrow{background-color:var(--hb-p-gray-800);height:8px;position:absolute;transform:rotate(45deg);width:8px}.hb-tooltip__content{position:relative;z-index:1}@keyframes hb-tooltip-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.hb-tooltip__popup--leaving{animation:hb-tooltip-fade-out .15s ease-in forwards}@keyframes hb-tooltip-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@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 HbTooltipStyle0 = tooltipCss;
 
 const Tooltip = class {
@@ -21,19 +22,25 @@ const Tooltip = class {
     /** 是否显示箭头 */
     showArrow = true;
     visible = false;
+    leaving = false;
     popupStyle = {};
     triggerRef;
     popupRef;
     hideTimer;
+    leave = createLeaveScheduler(() => this.leaving, v => (this.leaving = v), 150);
     show = () => {
         if (this.disabled)
             return;
         clearTimeout(this.hideTimer);
+        this.leave.cancel(); // 中途又打开：取消挂起的离场
         this.visible = true;
         requestAnimationFrame(() => this.updatePosition());
     };
     hide = () => {
-        this.hideTimer = setTimeout(() => { this.visible = false; }, 100);
+        this.hideTimer = setTimeout(() => {
+            this.visible = false;
+            this.leave.start();
+        }, 100);
     };
     toggle = () => {
         if (this.disabled)
@@ -45,13 +52,18 @@ const Tooltip = class {
             this.show();
         }
     };
+    disconnectedCallback() {
+        // L6：清掉挂起的 hideTimer，避免卸载后 100ms 内触发 detached 实例
+        clearTimeout(this.hideTimer);
+        this.leave.dispose();
+    }
     /** 键盘：Esc 关闭；click 模式 Enter/Space 切换 */
     handleKeydown = (e) => {
-        if (e.key === 'Escape' && this.visible) {
+        if (e.key === 'Escape' && (this.visible || this.leaving)) {
             e.preventDefault();
-            // 立即关（不等延迟）
             clearTimeout(this.hideTimer);
             this.visible = false;
+            this.leave.start();
             return;
         }
         if (this.trigger === 'click' && isActivationKey(e.key)) {
@@ -71,13 +83,21 @@ const Tooltip = class {
             zIndex: String(getNextZIndex()),
         };
     }
+    get shouldRender() {
+        return this.visible || this.leaving;
+    }
     render() {
-        const triggerEvents = this.trigger === 'hover'
-            ? { onMouseEnter: this.show, onMouseLeave: this.hide }
-            : { onClick: this.toggle };
-        return (h("div", { key: 'a3a485a0fc8b99e61ef0c4fd30208ac6f42af2e2', class: "hb-tooltip", ...triggerEvents, onKeyDown: this.handleKeydown }, h("div", { key: '24e68cfd99dc409e5a1f3a396b506fc97827da5f', ref: (el) => { this.triggerRef = el; }, class: "hb-tooltip__trigger", tabindex: this.disabled ? -1 : 0, "aria-describedby": this.visible ? 'hb-tooltip__popup' : undefined,
+        const triggerEvents = this.trigger === 'hover' ? { onMouseEnter: this.show, onMouseLeave: this.hide } : { onClick: this.toggle };
+        return (h("div", { key: '27f941dba6404552eae2a84e231e5549d5542863', class: "hb-tooltip", ...triggerEvents, onKeyDown: this.handleKeydown }, h("div", { key: '3705c79e383098b8d44360d178de43e89612857e', ref: (el) => {
+                this.triggerRef = el;
+            }, class: "hb-tooltip__trigger", tabindex: this.disabled ? -1 : 0, "aria-describedby": this.shouldRender ? 'hb-tooltip__popup' : undefined,
             // hover 触发：focus 展开让键盘用户也能读到提示（对齐 antd 行为）
-            onFocus: this.trigger === 'hover' ? this.show : undefined, onBlur: this.trigger === 'hover' ? this.hide : undefined }, h("slot", { key: 'd947c801efabae564e012cbe7a19c938e2ae2f7c' })), this.visible && (h("div", { key: 'e88b4aad5403c495b0484aff6a2fcb56c32efb4c', id: "hb-tooltip__popup", ref: (el) => { this.popupRef = el; }, class: "hb-tooltip__popup", style: this.popupStyle, role: "tooltip", onMouseEnter: () => this.trigger === 'hover' && this.show(), onMouseLeave: () => this.trigger === 'hover' && this.hide() }, this.showArrow && h("div", { key: 'b16d5c23542c60f2ad398eb055c33cc995af89f7', class: "hb-tooltip__arrow" }), h("div", { key: '600a64459740e735a5d7b9487debd1e8ca590ea3', class: "hb-tooltip__content" }, this.content)))));
+            onFocus: this.trigger === 'hover' ? this.show : undefined, onBlur: this.trigger === 'hover' ? this.hide : undefined }, h("slot", { key: 'ba8916663ed4866bd59747eab9c00300282df193' })), this.shouldRender && (h("div", { key: '8b6510eb948a19352c67fa7996d37e010e9c7b6b', id: "hb-tooltip__popup", ref: (el) => {
+                this.popupRef = el;
+            }, class: {
+                'hb-tooltip__popup': true,
+                'hb-tooltip__popup--leaving': this.leaving,
+            }, style: this.popupStyle, role: "tooltip", onMouseEnter: () => this.trigger === 'hover' && this.show(), onMouseLeave: () => this.trigger === 'hover' && this.hide() }, this.showArrow && h("div", { key: '6e26a2e2ce3e7d89c8c918c32aab375b12ac9351', class: "hb-tooltip__arrow" }), h("div", { key: '68b39d002a53094a34c8583137a74bd27edd4e23', class: "hb-tooltip__content" }, this.content)))));
     }
 };
 Tooltip.style = HbTooltipStyle0;

package/dist/esm/hb-tooltip.entry.js.map

@@ -1 +1 @@
-{"file":"hb-tooltip.entry.js","mappings":"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","names":[],"sources":["src/components/Tooltip/tooltip.css?tag=hb-tooltip&encapsulation=shadow","src/components/Tooltip/Tooltip.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\n.hb-tooltip__trigger {\n  display: inline-block;\n}\n\n.hb-tooltip__popup {\n  position: fixed;\n  padding: 6px 12px;\n  border-radius: var(--hb-border-radius-sm);\n  background-color: var(--hb-p-gray-800);\n  color: #fff;\n  font-size: var(--hb-font-size-sm);\n  line-height: 1.4;\n  pointer-events: auto;\n  box-shadow: var(--hb-box-shadow);\n  animation: hb-tooltip-fade-in 0.15s ease-out;\n  max-width: 300px;\n  word-wrap: break-word;\n}\n\n.hb-tooltip__arrow {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background-color: var(--hb-p-gray-800);\n  transform: rotate(45deg);\n}\n\n.hb-tooltip__content {\n  position: relative;\n  z-index: 1;\n}\n\n@keyframes hb-tooltip-fade-in {\n  from { opacity: 0; transform: scale(0.95); }\n  to   { opacity: 1; transform: scale(1); }\n}\n","import { Component, h, Prop, State, Element } from '@stencil/core';\nimport { computePosition, getNextZIndex, Placement } from '../../utils/popup-manager';\nimport { isActivationKey } from '../../utils/a11y';\n\n/**\n * Tooltip 文字提示组件\n * 鼠标悬停或点击时显示提示文字。\n *\n * 无障碍（对齐 antd / WAI-ARIA）：\n * - 触发器 aria-describedby 关联浮层 id（屏幕阅读器读出 content）\n * - 浮层 role=tooltip\n * - hover 触发时：focus 也显示（键盘用户可见，关键修复）\n * - click 触发时：Enter/Space 切换；任意模式 Esc 关闭\n */\n@Component({\n  tag: 'hb-tooltip',\n  styleUrl: 'tooltip.css',\n  shadow: true,\n})\nexport class Tooltip {\n  @Element() el: HTMLElement;\n\n  /** 提示文字 */\n  @Prop() content: string = '';\n\n  /** 弹出位置 */\n  @Prop() placement: Placement = 'top';\n\n  /** 触发方式 */\n  @Prop() trigger: 'hover' | 'click' = 'hover';\n\n  /** 是否禁用 */\n  @Prop() disabled: boolean = false;\n\n  /** 是否显示箭头 */\n  @Prop() showArrow: boolean = true;\n\n  @State() visible: boolean = false;\n  @State() popupStyle: Record<string, string> = {};\n\n  private triggerRef?: HTMLElement;\n  private popupRef?: HTMLDivElement;\n  private hideTimer?: ReturnType<typeof setTimeout>;\n\n  private show = () => {\n    if (this.disabled) return;\n    clearTimeout(this.hideTimer);\n    this.visible = true;\n    requestAnimationFrame(() => this.updatePosition());\n  };\n\n  private hide = () => {\n    this.hideTimer = setTimeout(() => { this.visible = false; }, 100);\n  };\n\n  private toggle = () => {\n    if (this.disabled) return;\n    if (this.visible) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  };\n\n  /** 键盘：Esc 关闭；click 模式 Enter/Space 切换 */\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (e.key === 'Escape' && this.visible) {\n      e.preventDefault();\n      // 立即关（不等延迟）\n      clearTimeout(this.hideTimer);\n      this.visible = false;\n      return;\n    }\n    if (this.trigger === 'click' && isActivationKey(e.key)) {\n      e.preventDefault();\n      this.toggle();\n    }\n  };\n\n  private updatePosition() {\n    if (!this.triggerRef || !this.popupRef) return;\n    const triggerRect = this.triggerRef.getBoundingClientRect();\n    const { width, height } = this.popupRef.getBoundingClientRect();\n    const pos = computePosition(triggerRect, width, height, this.placement, 8);\n    this.popupStyle = {\n      top: `${pos.top}px`,\n      left: `${pos.left}px`,\n      zIndex: String(getNextZIndex()),\n    };\n  }\n\n  render() {\n    const triggerEvents = this.trigger === 'hover'\n      ? { onMouseEnter: this.show, onMouseLeave: this.hide }\n      : { onClick: this.toggle };\n\n    return (\n      <div class=\"hb-tooltip\" {...triggerEvents} onKeyDown={this.handleKeydown}>\n        <div\n          ref={(el: any) => { this.triggerRef = el; }}\n          class=\"hb-tooltip__trigger\"\n          tabindex={this.disabled ? -1 : 0}\n          aria-describedby={this.visible ? 'hb-tooltip__popup' : undefined}\n          // hover 触发：focus 展开让键盘用户也能读到提示（对齐 antd 行为）\n          onFocus={this.trigger === 'hover' ? this.show : undefined}\n          onBlur={this.trigger === 'hover' ? this.hide : undefined}\n        >\n          <slot />\n        </div>\n        {this.visible && (\n          <div\n            id=\"hb-tooltip__popup\"\n            ref={(el: any) => { this.popupRef = el; }}\n            class=\"hb-tooltip__popup\"\n            style={this.popupStyle}\n            role=\"tooltip\"\n            onMouseEnter={() => this.trigger === 'hover' && this.show()}\n            onMouseLeave={() => this.trigger === 'hover' && this.hide()}\n          >\n            {this.showArrow && <div class=\"hb-tooltip__arrow\" />}\n            <div class=\"hb-tooltip__content\">{this.content}</div>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"hb-tooltip.entry.js","mappings":"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","names":[],"sources":["src/components/Tooltip/tooltip.css?tag=hb-tooltip&encapsulation=shadow","src/components/Tooltip/Tooltip.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\n.hb-tooltip__trigger {\n  display: inline-block;\n}\n\n.hb-tooltip__popup {\n  position: fixed;\n  padding: 6px 12px;\n  border-radius: var(--hb-border-radius-sm);\n  background-color: var(--hb-p-gray-800);\n  color: #fff;\n  font-size: var(--hb-font-size-sm);\n  line-height: 1.4;\n  pointer-events: auto;\n  box-shadow: var(--hb-box-shadow);\n  animation: hb-tooltip-fade-in 0.15s ease-out;\n  max-width: 300px;\n  word-wrap: break-word;\n}\n\n.hb-tooltip__arrow {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background-color: var(--hb-p-gray-800);\n  transform: rotate(45deg);\n}\n\n.hb-tooltip__content {\n  position: relative;\n  z-index: 1;\n}\n\n@keyframes hb-tooltip-fade-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n/* 离场动画：leaving class 触发 fade-out，播完后由 shouldRender=false 卸载 */\n.hb-tooltip__popup--leaving {\n  animation: hb-tooltip-fade-out 0.15s ease-in forwards;\n}\n\n@keyframes hb-tooltip-fade-out {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n}\n","import { Component, h, Prop, State, Element } from '@stencil/core';\nimport { computePosition, getNextZIndex, Placement } from '../../utils/popup-manager';\nimport { isActivationKey } from '../../utils/a11y';\nimport { createLeaveScheduler } from '../../utils/transition';\n\n/**\n * Tooltip 文字提示组件\n * 鼠标悬停或点击时显示提示文字。\n *\n * 无障碍（对齐 antd / WAI-ARIA）：\n * - 触发器 aria-describedby 关联浮层 id（屏幕阅读器读出 content）\n * - 浮层 role=tooltip\n * - hover 触发时：focus 也显示（键盘用户可见，关键修复）\n * - click 触发时：Enter/Space 切换；任意模式 Esc 关闭\n *\n * 进出场动画：用 leaving state 延迟卸载，让 fade-out 有机会播放。\n */\n@Component({\n  tag: 'hb-tooltip',\n  styleUrl: 'tooltip.css',\n  shadow: true,\n})\nexport class Tooltip {\n  @Element() el: HTMLElement;\n\n  /** 提示文字 */\n  @Prop() content: string = '';\n\n  /** 弹出位置 */\n  @Prop() placement: Placement = 'top';\n\n  /** 触发方式 */\n  @Prop() trigger: 'hover' | 'click' = 'hover';\n\n  /** 是否禁用 */\n  @Prop() disabled: boolean = false;\n\n  /** 是否显示箭头 */\n  @Prop() showArrow: boolean = true;\n\n  @State() visible: boolean = false;\n  @State() leaving: boolean = false;\n  @State() popupStyle: Record<string, string> = {};\n\n  private triggerRef?: HTMLElement;\n  private popupRef?: HTMLDivElement;\n  private hideTimer?: ReturnType<typeof setTimeout>;\n  private leave = createLeaveScheduler(\n    () => this.leaving,\n    v => (this.leaving = v),\n    150,\n  );\n\n  private show = () => {\n    if (this.disabled) return;\n    clearTimeout(this.hideTimer);\n    this.leave.cancel(); // 中途又打开：取消挂起的离场\n    this.visible = true;\n    requestAnimationFrame(() => this.updatePosition());\n  };\n\n  private hide = () => {\n    this.hideTimer = setTimeout(() => {\n      this.visible = false;\n      this.leave.start();\n    }, 100);\n  };\n\n  private toggle = () => {\n    if (this.disabled) return;\n    if (this.visible) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  };\n\n  disconnectedCallback() {\n    // L6：清掉挂起的 hideTimer，避免卸载后 100ms 内触发 detached 实例\n    clearTimeout(this.hideTimer);\n    this.leave.dispose();\n  }\n\n  /** 键盘：Esc 关闭；click 模式 Enter/Space 切换 */\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (e.key === 'Escape' && (this.visible || this.leaving)) {\n      e.preventDefault();\n      clearTimeout(this.hideTimer);\n      this.visible = false;\n      this.leave.start();\n      return;\n    }\n    if (this.trigger === 'click' && isActivationKey(e.key)) {\n      e.preventDefault();\n      this.toggle();\n    }\n  };\n\n  private updatePosition() {\n    if (!this.triggerRef || !this.popupRef) return;\n    const triggerRect = this.triggerRef.getBoundingClientRect();\n    const { width, height } = this.popupRef.getBoundingClientRect();\n    const pos = computePosition(triggerRect, width, height, this.placement, 8);\n    this.popupStyle = {\n      top: `${pos.top}px`,\n      left: `${pos.left}px`,\n      zIndex: String(getNextZIndex()),\n    };\n  }\n\n  private get shouldRender(): boolean {\n    return this.visible || this.leaving;\n  }\n\n  render() {\n    const triggerEvents = this.trigger === 'hover' ? { onMouseEnter: this.show, onMouseLeave: this.hide } : { onClick: this.toggle };\n\n    return (\n      <div class=\"hb-tooltip\" {...triggerEvents} onKeyDown={this.handleKeydown}>\n        <div\n          ref={(el: any) => {\n            this.triggerRef = el;\n          }}\n          class=\"hb-tooltip__trigger\"\n          tabindex={this.disabled ? -1 : 0}\n          aria-describedby={this.shouldRender ? 'hb-tooltip__popup' : undefined}\n          // hover 触发：focus 展开让键盘用户也能读到提示（对齐 antd 行为）\n          onFocus={this.trigger === 'hover' ? this.show : undefined}\n          onBlur={this.trigger === 'hover' ? this.hide : undefined}\n        >\n          <slot />\n        </div>\n        {this.shouldRender && (\n          <div\n            id=\"hb-tooltip__popup\"\n            ref={(el: any) => {\n              this.popupRef = el;\n            }}\n            class={{\n              'hb-tooltip__popup': true,\n              'hb-tooltip__popup--leaving': this.leaving,\n            }}\n            style={this.popupStyle}\n            role=\"tooltip\"\n            onMouseEnter={() => this.trigger === 'hover' && this.show()}\n            onMouseLeave={() => this.trigger === 'hover' && this.hide()}\n          >\n            {this.showArrow && <div class=\"hb-tooltip__arrow\" />}\n            <div class=\"hb-tooltip__content\">{this.content}</div>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hb-tree-select.entry.js

@@ -1,5 +1,6 @@
 import { r as registerInstance, c as createEvent, g as getElement, h } from './index-fdf7135e.js';
 import { c as createClickOutsideHandler } from './click-outside-291294f9.js';
+import { a as activationClickHandler } from './a11y-e4cde5b0.js';
 
 const treeSelectCss = "/*! 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-select{box-sizing:border-box;color:var(--hb-color-text);font-size:var(--hb-font-size-base);position:relative;width:100%}.hb-tree-select__input-wrapper{align-items:center;background-color:var(--hb-color-bg-container);border:1px solid var(--hb-input-border-color,var(--hb-color-border));border-radius:var(--hb-input-radius,var(--hb-border-radius-sm));box-sizing:border-box;cursor:pointer;display:flex;height:var(--hb-size-default,32px);padding:0 var(--hb-spacing-sm);transition:border-color var(--hb-transition-duration,.2s)}.hb-tree-select__input-wrapper:hover{border-color:var(--hb-input-hover-border-color,var(--hb-color-primary))}.hb-tree-select--open .hb-tree-select__input-wrapper{border-color:var(--hb-input-focus-border-color,var(--hb-color-primary))}.hb-tree-select--disabled .hb-tree-select__input-wrapper{background-color:var(--hb-color-fill-tertiary);cursor:not-allowed;opacity:.6}.hb-tree-select__display{flex:1;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;white-space:nowrap}.hb-tree-select__display--placeholder{color:var(--hb-input-placeholder-color,var(--hb-color-text-placeholder))}.hb-tree-select__suffix{gap:var(--hb-spacing-xxs)}.hb-tree-select__clear,.hb-tree-select__suffix{align-items:center;color:var(--hb-color-text-tertiary);display:inline-flex}.hb-tree-select__clear{background-color:var(--hb-color-fill);border-radius:50%;cursor:pointer;height:16px;justify-content:center;width:16px}.hb-tree-select__clear svg{height:10px;width:10px}.hb-tree-select__clear:hover{color:var(--hb-color-text-secondary)}.hb-tree-select__arrow-icon{align-items:center;color:var(--hb-color-text-tertiary);display:inline-flex;height:12px;transition:transform var(--hb-transition-duration,.2s);width:12px}.hb-tree-select__arrow-icon svg{height:100%;width:100%}.hb-tree-select__arrow-icon--open{transform:rotate(180deg)}.hb-tree-select__dropdown{background-color:var(--hb-color-bg-elevated);border:1px solid var(--hb-color-border-secondary);border-radius:var(--hb-border-radius-sm);box-shadow:0 6px 16px #00000014;box-sizing:border-box;left:0;max-height:280px;overflow-y:auto;padding:var(--hb-spacing-xxs);position:absolute;top:calc(100% + 4px);width:100%;z-index:1050}.hb-tree-select__empty{color:var(--hb-color-text-tertiary);font-size:var(--hb-font-size-sm);padding:var(--hb-spacing-md);text-align:center}.hb-tree-select__children,.hb-tree-select__tree{list-style:none;margin:0;padding:0}.hb-tree-select__node{list-style:none;white-space:nowrap}.hb-tree-select__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)}.hb-tree-select__node-content:hover{background-color:var(--hb-color-fill-tertiary)}.hb-tree-select__node-content--selected{color:var(--hb-color-primary);font-weight:500}.hb-tree-select__node-content--checked,.hb-tree-select__node-content--selected{background-color:var(--hb-color-primary-bg)}.hb-tree-select__node--disabled>.hb-tree-select__node-content{cursor:not-allowed;opacity:.5}.hb-tree-select__node--disabled>.hb-tree-select__node-content:hover{background-color:#0000}.hb-tree-select__switcher{flex-shrink:0;height:18px;width:18px}.hb-tree-select__arrow,.hb-tree-select__switcher{align-items:center;color:var(--hb-color-text-tertiary);display:inline-flex;justify-content:center}.hb-tree-select__arrow{height:12px;transition:transform var(--hb-transition-duration,.2s);width:12px}.hb-tree-select__arrow svg{height:100%;width:100%}.hb-tree-select__arrow--expanded{transform:rotate(90deg)}.hb-tree-select__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;height:16px;justify-content:center;transition:all var(--hb-transition-duration,.2s);width:16px}.hb-tree-select__checkbox svg{height:12px;width:12px}.hb-tree-select__checkbox-dash{background-color:#fff;border-radius:1px;display:block;height:2px;width:10px}.hb-tree-select__checkbox:hover:not(.hb-tree-select__checkbox--disabled){border-color:var(--hb-color-primary)}.hb-tree-select__checkbox--checked,.hb-tree-select__checkbox--indeterminate{background-color:var(--hb-color-primary);border-color:var(--hb-color-primary)}.hb-tree-select__checkbox--disabled{cursor:not-allowed}.hb-tree-select__title{flex:1;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}@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 HbTreeSelectStyle0 = treeSelectCss;
@@ -48,6 +49,8 @@ const TreeSelect = class {
     internalExpanded = [];
     internalSelected = [];
     internalChecked = [];
+    /** 键盘焦点节点 key（A2：roving tabindex，与选中态解耦） */
+    focusKey = null;
     /**
      * 值变化事件（单选为 string，多选为 string[]）
      */
@@ -69,6 +72,13 @@ const TreeSelect = class {
             this.internalExpanded = all;
         }
     }
+    /**
+     * 受控同步：父组件后续修改 modelValue 时，重算 internalSelected/internalChecked。
+     * 修复 B4——修复前仅 componentWillLoad 同步一次，受控改值后选中/勾选状态不更新。
+     */
+    handleModelValueChange() {
+        this.syncFromModelValue();
+    }
     componentDidLoad() {
         this.clickOutside = createClickOutsideHandler({
             host: this.el,
@@ -92,6 +102,106 @@ const TreeSelect = class {
             this.internalChecked = single ? [single] : [];
         }
     }
+    /**
+     * 构建当前可见节点的扁平列表（仅含已展开父节点的后代），用于键盘线性导航（A2）。
+     */
+    getFlattenedVisibleNodes() {
+        const out = [];
+        const walk = (nodes, level, parentKey) => {
+            for (const node of nodes) {
+                out.push({ node, level, parentKey });
+                if (node.children && node.children.length > 0 && this.internalExpanded.includes(node.key)) {
+                    walk(node.children, level + 1, node.key);
+                }
+            }
+        };
+        walk(this.data, 0, null);
+        return out;
+    }
+    /**
+     * Tree 键盘导航（WAI-ARIA Tree View 模式，A2 修复）：
+     * ↑↓ 线性移动、→ 展开/进子、← 折叠/回父、Enter/Space 选中、Home/End 跳首尾。
+     * 焦点（focusKey）与选中态（internalSelected/internalChecked）解耦。
+     */
+    handleTreeKeydown = (e) => {
+        const flat = this.getFlattenedVisibleNodes();
+        if (flat.length === 0)
+            return;
+        let focusKey = this.focusKey;
+        if (!focusKey && this.internalSelected.length > 0)
+            focusKey = this.internalSelected[this.internalSelected.length - 1];
+        let focusIdx = focusKey ? flat.findIndex(x => x.node.key === focusKey) : -1;
+        if (focusIdx < 0 || flat[focusIdx].node.disabled) {
+            focusIdx = flat.findIndex(x => !x.node.disabled);
+            if (focusIdx < 0)
+                return;
+        }
+        const enabledFlatIndices = flat
+            .map((x, i) => ({ x, i }))
+            .filter(o => !o.x.node.disabled)
+            .map(o => o.i);
+        const posInEnabled = enabledFlatIndices.indexOf(focusIdx);
+        const current = flat[focusIdx];
+        const isLeaf = !(current.node.children && current.node.children.length > 0);
+        const expanded = !isLeaf && this.internalExpanded.includes(current.node.key);
+        switch (e.key) {
+            case 'ArrowDown': {
+                e.preventDefault();
+                this.focusKey = flat[enabledFlatIndices[(posInEnabled + 1) % enabledFlatIndices.length]].node.key;
+                break;
+            }
+            case 'ArrowUp': {
+                e.preventDefault();
+                const n = enabledFlatIndices.length;
+                this.focusKey = flat[enabledFlatIndices[(posInEnabled - 1 + n) % n]].node.key;
+                break;
+            }
+            case 'ArrowRight': {
+                e.preventDefault();
+                if (isLeaf)
+                    return;
+                if (!expanded) {
+                    this.handleToggleExpand(current.node, { stopPropagation: () => { } });
+                }
+                else {
+                    const firstChildIdx = flat.findIndex((x, i) => i > focusIdx && x.parentKey === current.node.key && !x.node.disabled);
+                    if (firstChildIdx >= 0)
+                        this.focusKey = flat[firstChildIdx].node.key;
+                }
+                break;
+            }
+            case 'ArrowLeft': {
+                e.preventDefault();
+                if (!isLeaf && expanded) {
+                    this.handleToggleExpand(current.node, { stopPropagation: () => { } });
+                }
+                else if (current.parentKey && !flat.find(x => x.node.key === current.parentKey).node.disabled) {
+                    this.focusKey = current.parentKey;
+                }
+                break;
+            }
+            case 'Home':
+                e.preventDefault();
+                this.focusKey = flat[enabledFlatIndices[0]].node.key;
+                break;
+            case 'End':
+                e.preventDefault();
+                this.focusKey = flat[enabledFlatIndices[enabledFlatIndices.length - 1]].node.key;
+                break;
+            case 'Enter':
+            case ' ':
+            case 'Spacebar': {
+                e.preventDefault();
+                if (this.checkable)
+                    this.handleNodeCheck(current.node);
+                else
+                    this.handleNodeSelect(current.node.key);
+                break;
+            }
+            default:
+                return;
+        }
+    };
     collectExpandableKeys(nodes, out) {
         for (const node of nodes) {
             if (node.children && node.children.length > 0) {
@@ -117,7 +227,7 @@ const TreeSelect = class {
             const arr = Array.isArray(this.modelValue) ? this.modelValue : [];
             if (arr.length === 0)
                 return '';
-            const titles = arr.map((k) => this.findTitle(this.data, k) || k);
+            const titles = arr.map(k => this.findTitle(this.data, k) || k);
             return titles.join(' / ');
         }
         const single = typeof this.modelValue === 'string' ? this.modelValue : '';
@@ -274,33 +384,38 @@ const TreeSelect = class {
         const checked = this.internalChecked.includes(node.key);
         const indeterminate = indeterminateKeys.has(node.key);
         const disabled = !!node.disabled;
-        return (h("li", { class: { 'hb-tree-select__node': true, 'hb-tree-select__node--disabled': disabled }, role: "treeitem" }, h("div", { class: {
+        // A2：roving tabindex 跟随 focusKey；无键盘焦点时回退到选中项
+        const fallbackFocus = this.internalSelected.length > 0 ? this.internalSelected[this.internalSelected.length - 1] : null;
+        const effectiveFocus = this.focusKey ?? fallbackFocus;
+        const isFocused = effectiveFocus === node.key;
+        return (h("li", { class: { 'hb-tree-select__node': true, 'hb-tree-select__node--disabled': disabled }, "data-tree-key": node.key, role: "treeitem", "aria-level": level + 1, "aria-expanded": hasChildren ? String(expanded) : undefined, "aria-selected": selected ? 'true' : 'false', "aria-disabled": disabled ? 'true' : undefined, tabindex: isFocused ? 0 : -1 }, h("div", { class: {
                 'hb-tree-select__node-content': true,
                 'hb-tree-select__node-content--selected': selected,
                 'hb-tree-select__node-content--checked': checked,
-            }, style: { paddingLeft: `${level * 18 + 8}px` } }, h("span", { class: "hb-tree-select__switcher", onClick: (e) => hasChildren && this.handleToggleExpand(node, e) }, hasChildren ? (h("span", { class: { 'hb-tree-select__arrow': true, 'hb-tree-select__arrow--expanded': expanded }, "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M9 6l6 6-6 6" })))) : null), this.checkable && (h("span", { class: {
+            }, style: { paddingLeft: `${level * 18 + 8}px` } }, h("span", { class: "hb-tree-select__switcher", onClick: e => hasChildren && this.handleToggleExpand(node, e) }, hasChildren ? (h("span", { class: { 'hb-tree-select__arrow': true, 'hb-tree-select__arrow--expanded': expanded }, "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M9 6l6 6-6 6" })))) : null), this.checkable && (h("span", { class: {
                 'hb-tree-select__checkbox': true,
                 'hb-tree-select__checkbox--checked': checked,
                 'hb-tree-select__checkbox--indeterminate': indeterminate,
                 'hb-tree-select__checkbox--disabled': disabled,
-            }, role: "checkbox", "aria-checked": indeterminate ? 'mixed' : checked ? 'true' : 'false', onClick: () => !disabled && this.handleNodeCheck(node) }, checked ? (h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 3, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M5 12l5 5L20 7" }))) : indeterminate ? (h("span", { class: "hb-tree-select__checkbox-dash" })) : null)), h("span", { class: "hb-tree-select__title", onClick: () => !disabled && this.handleNodeSelect(node.key) }, node.title)), hasChildren && expanded && (h("ul", { class: "hb-tree-select__children", role: "group" }, node.children.map((child) => this.renderNode(child, level + 1, indeterminateKeys))))));
+            }, role: "checkbox", "aria-checked": indeterminate ? 'mixed' : checked ? 'true' : 'false', onClick: () => !disabled && this.handleNodeCheck(node) }, checked ? (h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 3, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M5 12l5 5L20 7" }))) : indeterminate ? (h("span", { class: "hb-tree-select__checkbox-dash" })) : null)), h("span", { class: "hb-tree-select__title", onClick: () => !disabled && this.handleNodeSelect(node.key) }, node.title)), hasChildren && expanded && (h("ul", { class: "hb-tree-select__children", role: "group" }, node.children.map(child => this.renderNode(child, level + 1, indeterminateKeys))))));
     };
     render() {
         const displayText = this.getDisplayText();
-        const hasValue = this.multiple
-            ? Array.isArray(this.modelValue) && this.modelValue.length > 0
-            : typeof this.modelValue === 'string' && this.modelValue !== '';
+        const hasValue = this.multiple ? Array.isArray(this.modelValue) && this.modelValue.length > 0 : typeof this.modelValue === 'string' && this.modelValue !== '';
         const indeterminateKeys = this.checkable ? this.computeIndeterminateKeys() : new Set();
-        return (h("div", { key: 'f79d67b1bb02e0d51a9fe2b35a36a156801e9584', class: {
+        return (h("div", { key: '46d75f2c1014766b178e35a6f1684ea311f080df', class: {
                 'hb-tree-select': true,
                 'hb-tree-select--open': this.isOpen,
                 'hb-tree-select--disabled': this.disabled,
                 'hb-tree-select--multiple': this.multiple,
-            } }, h("div", { key: '59355a67c4316c98a682df3c27cd19387a8d4742', class: "hb-tree-select__input-wrapper", onClick: this.toggleDropdown }, h("span", { key: '7b4fd7b9a4c15193f687f1f579eb2e8268b975df', class: {
+            } }, h("div", { key: '9921be6e6ce72570f8b3b9fcd5921219ec8c77e7', class: "hb-tree-select__input-wrapper", onClick: this.toggleDropdown }, h("span", { key: '503b5691f216ae8bba1bff142ad0c0d62a28c19c', class: {
                 'hb-tree-select__display': true,
                 'hb-tree-select__display--placeholder': !hasValue,
-            } }, hasValue ? displayText : this.placeholder), h("span", { key: '1640eacb50af399e02785b14d72c547afe8fcfcf', class: "hb-tree-select__suffix" }, hasValue && (h("span", { key: 'c16d5a458d3738bccb3c70cc985df43dcacb4220', class: "hb-tree-select__clear", onClick: this.handleClear, role: "button", "aria-label": "\u6E05\u7A7A" }, h("svg", { key: '757db41a4651d25df357d2c975810bbfdddcca22', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: 'a72adce81b2900cdf11faa663f92dbaa7053921e', d: "M6 6l12 12M18 6L6 18" })))), h("span", { key: '0b40c484fe2f7e23b04cfb26cb0018f050522fec', class: { 'hb-tree-select__arrow-icon': true, 'hb-tree-select__arrow-icon--open': this.isOpen }, "aria-hidden": "true" }, h("svg", { key: '30523c9183feaab984ff557e8c735b7a04423f0c', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: '15eae62246639d6e05071123e89ad31c82ea576a', d: "M6 9l6 6 6-6" }))))), this.isOpen && (h("div", { key: 'e6eb7b145fe8b71b09511e8e0c3a3a9073508397', class: "hb-tree-select__dropdown" }, this.data.length === 0 ? (h("div", { class: "hb-tree-select__empty" }, "\u6682\u65E0\u6570\u636E")) : (h("ul", { class: "hb-tree-select__tree", role: "tree" }, this.data.map((node) => this.renderNode(node, 0, indeterminateKeys))))))));
+            } }, hasValue ? displayText : this.placeholder), h("span", { key: 'dd879d7ab4bc3cdff8fda6e5555e445fd2353b08', class: "hb-tree-select__suffix" }, hasValue && (h("span", { key: '7891ba744427d27eebdf077eca94555e6252b79d', class: "hb-tree-select__clear", onClick: this.handleClear, role: "button", "aria-label": "\u6E05\u7A7A", tabIndex: 0, onKeyDown: activationClickHandler }, h("svg", { key: '39de157416b682136d7fd17f034af52467812086', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: '06556664f1fdd4f2e497abb4ffd3fe4b478ee2db', d: "M6 6l12 12M18 6L6 18" })))), h("span", { key: '2f3ad915c327519223f73fed8e4fe51b291a2647', class: { 'hb-tree-select__arrow-icon': true, 'hb-tree-select__arrow-icon--open': this.isOpen }, "aria-hidden": "true" }, h("svg", { key: 'bed9693364d571477d6540250e3c93a4bfcea2cd', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: '830a03a1f977a0a577e03728c471dd8d2cd85c6d', d: "M6 9l6 6 6-6" }))))), this.isOpen && (h("div", { key: '25754f9eeaea710c0f7facc4d57213db0e0755d3', class: "hb-tree-select__dropdown" }, this.data.length === 0 ? (h("div", { class: "hb-tree-select__empty" }, "\u6682\u65E0\u6570\u636E")) : (h("ul", { class: "hb-tree-select__tree", role: "tree", tabindex: -1, onKeyDown: this.handleTreeKeydown }, this.data.map(node => this.renderNode(node, 0, indeterminateKeys))))))));
     }
+    static get watchers() { return {
+        "modelValue": ["handleModelValueChange"]
+    }; }
 };
 TreeSelect.style = HbTreeSelectStyle0;