huibo-ui 0.4.0 → 0.5.0

package/dist/cjs/hb-input-number.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"hb-input-number.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/InputNumber/input-number.css?tag=hb-input-number&encapsulation=shadow","src/components/InputNumber/InputNumber.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-input-number-font-size: 14px;\n  --hb-input-number-height: 32px;\n  --hb-input-number-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-input-number-border-color-hover: var(--hb-color-primary);\n  --hb-input-number-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-input-number {\n  position: relative;\n  display: inline-block;\n  width: 180px;\n  line-height: var(--hb-input-number-height);\n}\n\n.hb-input-number__inner {\n  -webkit-appearance: none;\n  background-color: var(--hb-input-number-bg-color);\n  border: 1px solid var(--hb-input-number-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  color: var(--hb-color-text-regular, #606266);\n  display: block;\n  font-size: inherit;\n  height: var(--hb-input-number-height);\n  line-height: var(--hb-input-number-height);\n  outline: none;\n  padding: 0 50px 0 15px;\n  text-align: left;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n  width: 100%;\n}\n\n.hb-input-number--without-controls .hb-input-number__inner {\n  padding: 0 15px;\n}\n\n.hb-input-number--controls-right .hb-input-number__inner {\n  padding: 0 15px 0 50px;\n}\n\n.hb-input-number__inner:hover:not(:disabled) {\n  border-color: var(--hb-input-number-border-color-hover);\n}\n\n.hb-input-number__inner:focus {\n  border-color: var(--hb-input-number-border-color-hover);\n}\n\n.hb-input-number__inner:disabled {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-input-number-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n.hb-input-number__increase,\n.hb-input-number__decrease {\n  position: absolute;\n  z-index: 1;\n  top: 1px;\n  width: 35px;\n  height: calc(100% - 2px);\n  text-align: center;\n  background: var(--hb-fill-color-light, #f5f7fa);\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  font-size: 13px;\n  user-select: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.2s;\n}\n\n.hb-input-number__increase:hover:not(.hb-input-number__increase--disabled),\n.hb-input-number__decrease:hover:not(.hb-input-number__decrease--disabled) {\n  color: var(--hb-color-primary);\n}\n\n.hb-input-number__increase--disabled,\n.hb-input-number__decrease--disabled {\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n.hb-input-number__increase {\n  right: 1px;\n  border-radius: 0 4px 4px 0;\n  border-left: 1px solid var(--hb-input-number-border-color);\n}\n\n.hb-input-number__decrease {\n  right: 36px;\n  border-radius: 0;\n  border-left: 1px solid var(--hb-input-number-border-color);\n}\n\n.hb-input-number--controls-right .hb-input-number__increase {\n  right: 1px;\n  border-radius: 0 4px 4px 0;\n}\n\n.hb-input-number--controls-right .hb-input-number__decrease {\n  right: 36px;\n  border-radius: 0;\n}\n\n.hb-input-number__controls {\n  position: absolute;\n  right: 1px;\n  top: 1px;\n  width: 35px;\n  height: calc(100% - 2px);\n  border-left: 1px solid var(--hb-input-number-border-color);\n  border-radius: 0 4px 4px 0;\n  background: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-input-number--controls-right .hb-input-number__controls {\n  left: 1px;\n  right: auto;\n  border-left: none;\n  border-right: 1px solid var(--hb-input-number-border-color);\n  border-radius: 4px 0 0 4px;\n}\n\n.hb-input-number--controls-right .hb-input-number__controls .hb-input-number__increase {\n  position: static;\n  border: none;\n  border-bottom: 1px solid var(--hb-input-number-border-color);\n  border-radius: 0;\n}\n\n.hb-input-number--controls-right .hb-input-number__controls .hb-input-number__decrease {\n  position: static;\n  border: none;\n  border-radius: 0 0 0 4px;\n}\n\n.hb-input-number--small {\n  width: 150px;\n}\n\n.hb-input-number--small .hb-input-number__inner {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n  padding: 0 40px 0 12px;\n}\n\n.hb-input-number--large {\n  width: 200px;\n}\n\n.hb-input-number--large .hb-input-number__inner {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n  padding: 0 55px 0 18px;\n}\n\n.hb-input-number--disabled {\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\n\n/**\n * InputNumber 数字输入框组件\n * 仅允许输入标准的数字值，可定义范围\n */\n@Component({\n  tag: 'hb-input-number',\n  styleUrl: 'input-number.css',\n  shadow: true,\n})\nexport class InputNumber {\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue: number = 0;\n\n  /**\n   * 计数器尺寸\n   */\n  @Prop() size: 'large' | 'default' | 'small' = 'default';\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 是否只读\n   * @default false\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * 最小值\n   * @default -Infinity\n   */\n  @Prop() min: number = -Infinity;\n\n  /**\n   * 最大值\n   * @default Infinity\n   */\n  @Prop() max: number = Infinity;\n\n  /**\n   * 计数器步长\n   * @default 1\n   */\n  @Prop() step: number = 1;\n\n  /**\n   * 精度\n   */\n  @Prop() precision?: number;\n\n  /**\n   * 是否只能输入 step 的倍数\n   * @default false\n   */\n  @Prop() stepStrictly: boolean = false;\n\n  /**\n   * 是否使用控制按钮\n   * @default true\n   */\n  @Prop() controls: boolean = true;\n\n  /**\n   * 控制按钮位置\n   */\n  @Prop() controlsPosition: '' | 'right' = '';\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  /**\n   * 原生 placeholder 属性\n   */\n  @Prop() placeholder?: string;\n\n  @State() currentValue: number = 0;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<number>;\n\n  /**\n   * 输入事件\n   */\n  @Event() hbInput: EventEmitter<number>;\n\n  componentDidLoad() {\n    this.currentValue = this.modelValue;\n  }\n\n  /** 受控模式：外部修改 modelValue 时同步内部 currentValue，保证 UI 与值一致 */\n  @Watch('modelValue')\n  handleModelValueChange() {\n    this.currentValue = this.modelValue;\n  }\n\n  private formatValue(value: number): number {\n    if (this.precision !== undefined) {\n      return Number(value.toFixed(this.precision));\n    }\n    return value;\n  }\n\n  private clampValue(value: number): number {\n    let clamped = Math.max(this.min, Math.min(this.max, value));\n    \n    if (this.stepStrictly) {\n      const step = this.step;\n      clamped = Math.round(clamped / step) * step;\n    }\n    \n    return this.formatValue(clamped);\n  }\n\n  private handleInput = (e: Event) => {\n    const target = e.target as HTMLInputElement;\n    const value = parseFloat(target.value);\n    \n    if (isNaN(value)) {\n      this.currentValue = this.min;\n    } else {\n      this.currentValue = this.clampValue(value);\n    }\n    \n    this.modelValue = this.currentValue;\n    this.hbInput.emit(this.currentValue);\n  };\n\n  private handleChange = () => {\n    this.hbChange.emit(this.currentValue);\n  };\n\n  private increase = () => {\n    if (this.disabled || this.readonly) return;\n    const newValue = this.clampValue(this.currentValue + this.step);\n    this.currentValue = newValue;\n    this.modelValue = newValue;\n    this.hbChange.emit(newValue);\n  };\n\n  private decrease = () => {\n    if (this.disabled || this.readonly) return;\n    const newValue = this.clampValue(this.currentValue - this.step);\n    this.currentValue = newValue;\n    this.modelValue = newValue;\n    this.hbChange.emit(newValue);\n  };\n\n  render() {\n    return (\n      <div\n        class={{\n          'hb-input-number': true,\n          [`hb-input-number--${this.size}`]: true,\n          'hb-input-number--disabled': this.disabled,\n          'hb-input-number--controls-right': this.controlsPosition === 'right',\n          'hb-input-number--without-controls': !this.controls,\n        }}\n      >\n        {this.controls && this.controlsPosition !== 'right' && (\n          <span\n            class={{\n              'hb-input-number__decrease': true,\n              'hb-input-number__decrease--disabled': this.currentValue <= this.min,\n            }}\n            onClick={this.decrease}\n          >\n            −\n          </span>\n        )}\n        <input\n          type=\"number\"\n          id={this.inputId}\n          name={this.name}\n          class=\"hb-input-number__inner\"\n          value={this.currentValue}\n          disabled={this.disabled}\n          readonly={this.readonly}\n          placeholder={this.placeholder}\n          min={this.min}\n          max={this.max}\n          step={this.step}\n          onInput={this.handleInput}\n          onChange={this.handleChange}\n        />\n        {this.controls && this.controlsPosition === 'right' && (\n          <span class=\"hb-input-number__controls\">\n            <span\n              class={{\n                'hb-input-number__increase': true,\n                'hb-input-number__increase--disabled': this.currentValue >= this.max,\n              }}\n              onClick={this.increase}\n            >\n              +\n            </span>\n            <span\n              class={{\n                'hb-input-number__decrease': true,\n                'hb-input-number__decrease--disabled': this.currentValue <= this.min,\n              }}\n              onClick={this.decrease}\n            >\n              −\n            </span>\n          </span>\n        )}\n        {this.controls && this.controlsPosition !== 'right' && (\n          <span\n            class={{\n              'hb-input-number__increase': true,\n              'hb-input-number__increase--disabled': this.currentValue >= this.max,\n            }}\n            onClick={this.increase}\n          >\n            +\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\n"],"version":3}
+{"file":"hb-input-number.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/InputNumber/input-number.css?tag=hb-input-number&encapsulation=shadow","src/components/InputNumber/InputNumber.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --hb-input-number-font-size: 14px;\n  --hb-input-number-height: 32px;\n  --hb-input-number-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-input-number-border-color-hover: var(--hb-color-primary);\n  --hb-input-number-bg-color: var(--hb-color-white, #ffffff);\n}\n\n.hb-input-number {\n  position: relative;\n  display: inline-block;\n  width: 180px;\n  line-height: var(--hb-input-number-height);\n}\n\n.hb-input-number__inner {\n  -webkit-appearance: none;\n  background-color: var(--hb-input-number-bg-color);\n  border: 1px solid var(--hb-input-number-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  color: var(--hb-color-text-regular, #606266);\n  display: block;\n  font-size: inherit;\n  height: var(--hb-input-number-height);\n  line-height: var(--hb-input-number-height);\n  outline: none;\n  padding: 0 50px 0 15px;\n  text-align: left;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n  width: 100%;\n}\n\n.hb-input-number--without-controls .hb-input-number__inner {\n  padding: 0 15px;\n}\n\n.hb-input-number--controls-right .hb-input-number__inner {\n  padding: 0 15px 0 50px;\n}\n\n.hb-input-number__inner:hover:not(:disabled) {\n  border-color: var(--hb-input-number-border-color-hover);\n}\n\n.hb-input-number__inner:focus {\n  border-color: var(--hb-input-number-border-color-hover);\n}\n\n.hb-input-number__inner:disabled {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n  border-color: var(--hb-input-number-border-color);\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n.hb-input-number__increase,\n.hb-input-number__decrease {\n  position: absolute;\n  z-index: 1;\n  top: 1px;\n  width: 35px;\n  height: calc(100% - 2px);\n  text-align: center;\n  background: var(--hb-fill-color-light, #f5f7fa);\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  font-size: 13px;\n  user-select: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.2s;\n  /* button 默认样式重置（A1：从 span 改为 button 后需要） */\n  padding: 0;\n  border: none;\n  font-family: inherit;\n  line-height: 1;\n}\n\n.hb-input-number__increase:focus-visible,\n.hb-input-number__decrease:focus-visible {\n  outline: 2px solid var(--hb-color-primary, #409eff);\n  outline-offset: -2px;\n}\n\n.hb-input-number__increase:hover:not(.hb-input-number__increase--disabled),\n.hb-input-number__decrease:hover:not(.hb-input-number__decrease--disabled) {\n  color: var(--hb-color-primary);\n}\n\n.hb-input-number__increase--disabled,\n.hb-input-number__decrease--disabled {\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n.hb-input-number__increase {\n  right: 1px;\n  border-radius: 0 4px 4px 0;\n  border-left: 1px solid var(--hb-input-number-border-color);\n}\n\n.hb-input-number__decrease {\n  right: 36px;\n  border-radius: 0;\n  border-left: 1px solid var(--hb-input-number-border-color);\n}\n\n.hb-input-number--controls-right .hb-input-number__increase {\n  right: 1px;\n  border-radius: 0 4px 4px 0;\n}\n\n.hb-input-number--controls-right .hb-input-number__decrease {\n  right: 36px;\n  border-radius: 0;\n}\n\n.hb-input-number__controls {\n  position: absolute;\n  right: 1px;\n  top: 1px;\n  width: 35px;\n  height: calc(100% - 2px);\n  border-left: 1px solid var(--hb-input-number-border-color);\n  border-radius: 0 4px 4px 0;\n  background: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-input-number--controls-right .hb-input-number__controls {\n  left: 1px;\n  right: auto;\n  border-left: none;\n  border-right: 1px solid var(--hb-input-number-border-color);\n  border-radius: 4px 0 0 4px;\n}\n\n.hb-input-number--controls-right .hb-input-number__controls .hb-input-number__increase {\n  position: static;\n  border: none;\n  border-bottom: 1px solid var(--hb-input-number-border-color);\n  border-radius: 0;\n}\n\n.hb-input-number--controls-right .hb-input-number__controls .hb-input-number__decrease {\n  position: static;\n  border: none;\n  border-radius: 0 0 0 4px;\n}\n\n.hb-input-number--small {\n  width: 150px;\n}\n\n.hb-input-number--small .hb-input-number__inner {\n  height: 24px;\n  line-height: 24px;\n  font-size: 12px;\n  padding: 0 40px 0 12px;\n}\n\n.hb-input-number--large {\n  width: 200px;\n}\n\n.hb-input-number--large .hb-input-number__inner {\n  height: 40px;\n  line-height: 40px;\n  font-size: 16px;\n  padding: 0 55px 0 18px;\n}\n\n.hb-input-number--disabled {\n  cursor: not-allowed;\n}\n","import { Component, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\n\n/**\n * InputNumber 数字输入框组件\n * 仅允许输入标准的数字值，可定义范围\n */\n@Component({\n  tag: 'hb-input-number',\n  styleUrl: 'input-number.css',\n  shadow: true,\n})\nexport class InputNumber {\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue: number = 0;\n\n  /**\n   * 计数器尺寸\n   */\n  @Prop() size: 'large' | 'default' | 'small' = 'default';\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 是否只读\n   * @default false\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * 最小值\n   * @default -Infinity\n   */\n  @Prop() min: number = -Infinity;\n\n  /**\n   * 最大值\n   * @default Infinity\n   */\n  @Prop() max: number = Infinity;\n\n  /**\n   * 计数器步长\n   * @default 1\n   */\n  @Prop() step: number = 1;\n\n  /**\n   * 精度\n   */\n  @Prop() precision?: number;\n\n  /**\n   * 是否只能输入 step 的倍数\n   * @default false\n   */\n  @Prop() stepStrictly: boolean = false;\n\n  /**\n   * 是否使用控制按钮\n   * @default true\n   */\n  @Prop() controls: boolean = true;\n\n  /**\n   * 控制按钮位置\n   */\n  @Prop() controlsPosition: '' | 'right' = '';\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  /**\n   * 原生 placeholder 属性\n   */\n  @Prop() placeholder?: string;\n\n  @State() currentValue: number = 0;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<number>;\n\n  /**\n   * 输入事件\n   */\n  @Event() hbInput: EventEmitter<number>;\n\n  componentDidLoad() {\n    this.currentValue = this.modelValue;\n  }\n\n  /** 受控模式：外部修改 modelValue 时同步内部 currentValue，保证 UI 与值一致 */\n  @Watch('modelValue')\n  handleModelValueChange() {\n    this.currentValue = this.modelValue;\n  }\n\n  private formatValue(value: number): number {\n    if (this.precision !== undefined) {\n      return Number(value.toFixed(this.precision));\n    }\n    return value;\n  }\n\n  private clampValue(value: number): number {\n    let clamped = Math.max(this.min, Math.min(this.max, value));\n\n    if (this.stepStrictly) {\n      const step = this.step;\n      clamped = Math.round(clamped / step) * step;\n    }\n\n    return this.formatValue(clamped);\n  }\n\n  private handleInput = (e: Event) => {\n    const target = e.target as HTMLInputElement;\n    const value = parseFloat(target.value);\n\n    if (isNaN(value)) {\n      this.currentValue = this.min;\n    } else {\n      this.currentValue = this.clampValue(value);\n    }\n\n    this.modelValue = this.currentValue;\n    this.hbInput.emit(this.currentValue);\n  };\n\n  private handleChange = () => {\n    this.hbChange.emit(this.currentValue);\n  };\n\n  private increase = () => {\n    if (this.disabled || this.readonly) return;\n    const newValue = this.clampValue(this.currentValue + this.step);\n    this.currentValue = newValue;\n    this.modelValue = newValue;\n    this.hbChange.emit(newValue);\n  };\n\n  private decrease = () => {\n    if (this.disabled || this.readonly) return;\n    const newValue = this.clampValue(this.currentValue - this.step);\n    this.currentValue = newValue;\n    this.modelValue = newValue;\n    this.hbChange.emit(newValue);\n  };\n\n  render() {\n    return (\n      <div\n        class={{\n          'hb-input-number': true,\n          [`hb-input-number--${this.size}`]: true,\n          'hb-input-number--disabled': this.disabled,\n          'hb-input-number--controls-right': this.controlsPosition === 'right',\n          'hb-input-number--without-controls': !this.controls,\n        }}\n      >\n        {this.controls && this.controlsPosition !== 'right' && (\n          <button\n            type=\"button\"\n            class={{\n              'hb-input-number__decrease': true,\n              'hb-input-number__decrease--disabled': this.currentValue <= this.min,\n            }}\n            aria-label=\"减少\"\n            aria-disabled={this.currentValue <= this.min || this.disabled}\n            disabled={this.currentValue <= this.min || this.disabled}\n            onClick={this.decrease}\n          >\n            −\n          </button>\n        )}\n        <input\n          type=\"number\"\n          id={this.inputId}\n          name={this.name}\n          class=\"hb-input-number__inner\"\n          value={this.currentValue}\n          disabled={this.disabled}\n          readonly={this.readonly}\n          placeholder={this.placeholder}\n          min={this.min}\n          max={this.max}\n          step={this.step}\n          onInput={this.handleInput}\n          onChange={this.handleChange}\n        />\n        {this.controls && this.controlsPosition === 'right' && (\n          <span class=\"hb-input-number__controls\">\n            <button\n              type=\"button\"\n              class={{\n                'hb-input-number__increase': true,\n                'hb-input-number__increase--disabled': this.currentValue >= this.max,\n              }}\n              aria-label=\"增加\"\n              aria-disabled={this.currentValue >= this.max || this.disabled}\n              disabled={this.currentValue >= this.max || this.disabled}\n              onClick={this.increase}\n            >\n              +\n            </button>\n            <button\n              type=\"button\"\n              class={{\n                'hb-input-number__decrease': true,\n                'hb-input-number__decrease--disabled': this.currentValue <= this.min,\n              }}\n              aria-label=\"减少\"\n              aria-disabled={this.currentValue <= this.min || this.disabled}\n              disabled={this.currentValue <= this.min || this.disabled}\n              onClick={this.decrease}\n            >\n              −\n            </button>\n          </span>\n        )}\n        {this.controls && this.controlsPosition !== 'right' && (\n          <button\n            type=\"button\"\n            class={{\n              'hb-input-number__increase': true,\n              'hb-input-number__increase--disabled': this.currentValue >= this.max,\n            }}\n            aria-label=\"增加\"\n            aria-disabled={this.currentValue >= this.max || this.disabled}\n            disabled={this.currentValue >= this.max || this.disabled}\n            onClick={this.increase}\n          >\n            +\n          </button>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/hb-input-tag.cjs.entry.js

@@ -127,7 +127,7 @@ const InputTag = class {
         this.hbChange.emit([]);
     };
     render() {
-        return (index.h("div", { key: '8ce158419ad7a38a870ec04ff67b97fc68884bb3', class: {
+        return (index.h("div", { key: 'eb9c7afe898b95d3b08c068921f50b4848d78ada', class: {
                 'hb-input-tag': true,
                 [`hb-input-tag--${this.size}`]: true,
                 'hb-input-tag--disabled': this.disabled,
@@ -135,7 +135,7 @@ const InputTag = class {
             }, style: this.width ? { width: this.width } : undefined }, this.modelValue.map((tag) => (index.h("span", { class: {
                 'hb-input-tag__tag': true,
                 [`hb-input-tag__tag--${this.type}`]: !!this.type,
-            } }, index.h("span", { class: "hb-input-tag__tag-text" }, tag), this.closable && (index.h("span", { class: "hb-input-tag__tag-close", onClick: () => this.removeTag(tag) }, "\u00D7"))))), this.inputVisible && (!this.max || this.modelValue.length < this.max) && (index.h("input", { key: '8f52afba7e2271936afcd89bfcafd0319eb765bc', ref: (el) => (this.inputRef = el), type: "text", class: "hb-input-tag__input", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, maxlength: this.maxlength, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur })), this.clearable && this.modelValue.length > 0 && !this.disabled && (index.h("span", { key: '5c37d7a9db6c535de62498b4f0a0be1a70846c46', class: "hb-input-tag__clear", onClick: this.handleClearAll }, "\u00D7"))));
+            } }, index.h("span", { class: "hb-input-tag__tag-text" }, tag), this.closable && (index.h("span", { class: "hb-input-tag__tag-close", onClick: () => this.removeTag(tag) }, "\u00D7"))))), this.inputVisible && (!this.max || this.modelValue.length < this.max) && (index.h("input", { key: '4f26ff131300b6afbb6278a8066e33c16197990f', ref: (el) => (this.inputRef = el), type: "text", class: "hb-input-tag__input", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, maxlength: this.maxlength, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur })), this.clearable && this.modelValue.length > 0 && !this.disabled && (index.h("span", { key: '2d0156cd68a9d9a11e1e8b78160edfa271bcb188', class: "hb-input-tag__clear", onClick: this.handleClearAll }, "\u00D7"))));
     }
 };
 InputTag.style = HbInputTagStyle0;

package/dist/cjs/hb-input.cjs.entry.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5aa5c817.js');
+const a11y = require('./a11y-4385c871.js');
 
 /**
  * 表单输入组件共享基础
@@ -271,11 +272,11 @@ const Input = class {
     render() {
         const isTextarea = this.type === 'textarea';
         const InputTag = isTextarea ? 'textarea' : 'input';
-        return (index.h("div", { key: '200ae1b7d9257131fa15c06e950962559eaf6509', class: {
+        return (index.h("div", { key: '541681cbcc3f5bc9f0d6ed4e8b5d5d41e498f2a1', class: {
                 ...sizeClassMap('hb-input', this.size),
                 'hb-input--disabled': this.disabled,
                 'hb-input--focused': this.isFocused,
-            } }, this.prefixIcon && (index.h("span", { key: '1ba978d8de430fe70864b1daf5781e925cc35b5c', class: "hb-input__prefix" }, index.h("i", { key: '72abd536835d18ad5e7f75a09f896ebe41ca75d4', class: this.prefixIcon }))), index.h(InputTag, { key: '80049f50544c8118c73e545223450e5aecfc97ab', ref: (el) => (this.inputRef = el), type: isTextarea ? undefined : this.getInputType(), id: this.inputId, name: this.name, class: "hb-input__inner", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, readonly: this.readonly, autocomplete: this.autocomplete, autofocus: this.autofocus, maxlength: this.maxlength, minlength: this.minlength, rows: isTextarea ? this.rows : undefined, style: isTextarea ? { resize: this.autosize ? 'none' : (this.resize || 'none') } : undefined, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }), (this.showClear || this.suffixIcon || (this.type === 'password' && this.showPassword)) && (index.h("span", { key: '9ef7d5b2592fbb890f2915c97c5ecb6a5790ef97', class: "hb-input__suffix" }, this.showClear && (index.h("span", { key: 'c727eb595e73882d7c8c0d74cb65464062724377', class: "hb-input__suffix-inner hb-input__clear", role: "button", "aria-label": "\u6E05\u7A7A", onClick: this.handleClear }, index.h("svg", { key: '49060a94eba1105ffe4a97a48be513919586737d', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { key: '49c82790d5035f47c3f722b2d714f230394b2dda', d: "M6 6l12 12M18 6L6 18" })))), this.type === 'password' && this.showPassword && (index.h("span", { key: '209212e83bc6c4c0939c6ace984648212c320312', class: "hb-input__suffix-inner hb-input__password", role: "button", "aria-label": this.passwordVisible ? '隐藏密码' : '显示密码', onClick: this.togglePasswordVisible }, this.passwordVisible ? (index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { d: "M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z" }), index.h("circle", { cx: "12", cy: "12", r: "3" }))) : (index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { d: "M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.6 10.6 0 0 1 12 5c6.5 0 10 7 10 7a17.8 17.8 0 0 1-2.2 3.2M6.1 6.1A17.7 17.7 0 0 0 2 12s3.5 7 10 7a10.5 10.5 0 0 0 4-.8" }))))), this.suffixIcon && (index.h("span", { key: '661c50477f3a7d99feb22d71920493a184d66beb', class: "hb-input__suffix-inner" }, index.h("i", { key: 'f626ef9a8e095ee15ed0b8d3c903635c66d160c1', class: this.suffixIcon }))))), this.showWordLimit && this.maxlength && (index.h("span", { key: '47eba0fd638cbf8c510f0a94ee1dac808e3bba78', class: "hb-input__count" }, index.h("span", { key: '2d73a2813633592d8462b9decb3fb3f81fa3abde', class: "hb-input__count-inner" }, this.inputValue.length, " / ", this.maxlength)))));
+            } }, this.prefixIcon && (index.h("span", { key: '5dc6ad6f39d472528e900654de37e13e42e7ea19', class: "hb-input__prefix" }, index.h("i", { key: '2f28864c2a8d60281eacbfe7c8d65b72e75744f9', class: this.prefixIcon }))), index.h(InputTag, { key: '2945de32bd65b0eb22849338aa0f4f966ccd0ad5', ref: el => (this.inputRef = el), type: isTextarea ? undefined : this.getInputType(), id: this.inputId, name: this.name, class: "hb-input__inner", placeholder: this.placeholder, value: this.inputValue, disabled: this.disabled, readonly: this.readonly, autocomplete: this.autocomplete, autofocus: this.autofocus, maxlength: this.maxlength, minlength: this.minlength, rows: isTextarea ? this.rows : undefined, style: isTextarea ? { resize: this.autosize ? 'none' : this.resize || 'none' } : undefined, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }), (this.showClear || this.suffixIcon || (this.type === 'password' && this.showPassword)) && (index.h("span", { key: '0b416f3f55c1b195bcfc7584eb96de3a47373b49', class: "hb-input__suffix" }, this.showClear && (index.h("span", { key: '4bd40fa20686602e0049f46bfe3a4ba1eedd704c', class: "hb-input__suffix-inner hb-input__clear", role: "button", "aria-label": "\u6E05\u7A7A", tabIndex: 0, onClick: this.handleClear, onKeyDown: a11y.activationClickHandler }, index.h("svg", { key: 'b4494db539d933d0686fad6744589955669ec402', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { key: '02fde0709695629e71d90104f58d2926ae77ce8b', d: "M6 6l12 12M18 6L6 18" })))), this.type === 'password' && this.showPassword && (index.h("span", { key: 'fed9e94f2f0491d97a06b2ca4faeb86d4d0b4d79', class: "hb-input__suffix-inner hb-input__password", role: "button", "aria-label": this.passwordVisible ? '隐藏密码' : '显示密码', tabIndex: 0, onClick: this.togglePasswordVisible, onKeyDown: a11y.activationClickHandler }, this.passwordVisible ? (index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { d: "M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z" }), index.h("circle", { cx: "12", cy: "12", r: "3" }))) : (index.h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, index.h("path", { d: "M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.6 10.6 0 0 1 12 5c6.5 0 10 7 10 7a17.8 17.8 0 0 1-2.2 3.2M6.1 6.1A17.7 17.7 0 0 0 2 12s3.5 7 10 7a10.5 10.5 0 0 0 4-.8" }))))), this.suffixIcon && (index.h("span", { key: 'b7c39885d1c3528746855cd852fed3274d055b0f', class: "hb-input__suffix-inner" }, index.h("i", { key: 'e6952c4362150d3140feffaa51d9c0ac7f00a4b8', class: this.suffixIcon }))))), this.showWordLimit && this.maxlength && (index.h("span", { key: 'a6d207cc284a30911e3d17cd44bac5e061c20fac', class: "hb-input__count" }, index.h("span", { key: '52fa6d789528a8079d34fc4082b0532f52ce43ef', class: "hb-input__count-inner" }, this.inputValue.length, " / ", this.maxlength)))));
     }
     static get watchers() { return {
         "modelValue": ["handleValueChange"]

package/dist/cjs/hb-input.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"hb-input.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/utils/form-input-base.ts","src/components/Input/input.css?tag=hb-input&encapsulation=shadow","src/components/Input/Input.tsx"],"sourcesContent":["/**\n * 表单输入组件共享基础\n * 统一 size / disabled / clearable / modelValue 这一组在 Input / Select / Cascader /\n * DatePicker / InputNumber / TimePicker 等组件中重复出现的包装模式。\n *\n * 设计原则：纯函数 + 类型导出，不引入基类继承，避免 Stencil 装饰器在继承链上的隐式行为。\n * 组件按需 import 对应工具，渲染时调用即可。\n */\n\n/** 组件尺寸（与 Ant Design 对齐，便于迁移） */\nexport type ComponentSize = 'large' | 'default' | 'small';\n\n/** 全部合法尺寸，用于运行期校验 */\nexport const COMPONENT_SIZES: readonly ComponentSize[] = ['large', 'default', 'small'] as const;\n\n/**\n * 表单输入组件共享的 prop 契约。\n * 跨框架消费方（React / Vue / 原生）可据此推断任一表单输入组件的通用能力，\n * 各组件在此基础上扩展自身特有 prop。\n */\nexport interface FormInputProps {\n  /** 绑定值（双向，配合 hbChange 事件） */\n  modelValue: unknown;\n  /** 尺寸 */\n  size?: ComponentSize;\n  /** 是否禁用 */\n  disabled?: boolean;\n  /** 是否只读 */\n  readonly?: boolean;\n  /** 是否可清空 */\n  clearable?: boolean;\n  /** 占位文本 */\n  placeholder?: string;\n}\n\n/**\n * 生成尺寸 class 名：buildSizeClass('hb-input', 'large') -> 'hb-input--large'\n * 用于替代各组件 render 中重复的 `[`hb-input--${this.size}`]: true` 模板字面量。\n */\nexport function buildSizeClass(base: string, size: ComponentSize | undefined): string {\n  const normalized = size && COMPONENT_SIZES.includes(size) ? size : 'default';\n  return `${base}--${normalized}`;\n}\n\n/** 清空按钮可见性判定参数 */\nexport interface ClearVisibleOptions {\n  /** 是否声明了 clearable */\n  clearable: boolean;\n  /** 是否禁用（禁用时不显示） */\n  disabled?: boolean;\n  /** 是否只读（只读时不显示） */\n  readonly?: boolean;\n  /** 当前是否有值（无值时不显示） */\n  hasValue: boolean;\n}\n\n/**\n * 判定清空按钮是否应显示。\n * 抽取自 Input/Select/Cascader 中重复的 `clearable && !disabled && !readonly && hasValue`。\n */\nexport function isClearVisible(options: ClearVisibleOptions): boolean {\n  return Boolean(options.clearable && !options.disabled && !options.readonly && options.hasValue);\n}\n\n/**\n * 判定一个值是否「非空」（用于清空按钮显隐）。\n * 兼容字符串、数字、数组（多选）。\n */\nexport function hasInputValue(value: unknown): boolean {\n  if (value === null || value === undefined) return false;\n  if (typeof value === 'string') return value.length > 0;\n  if (typeof value === 'number') return !Number.isNaN(value);\n  if (Array.isArray(value)) return value.length > 0;\n  return true;\n}\n\n/**\n * 尺寸 class 集合生成器：返回包含 base 与 size class 的对象，可直接展开进 JSX class 绑定。\n * 例：sizeClassMap('hb-input', 'large', this.size) -> { 'hb-input': true, 'hb-input--large': true }\n */\nexport function sizeClassMap(base: string, size: ComponentSize | undefined): Record<string, boolean> {\n  return { [base]: true, [buildSizeClass(base, size)]: true };\n}\n",":host {\n  display: inline-block;\n  position: relative;\n  --hb-input-font-size: 14px;\n  --hb-input-font-size-large: 16px;\n  --hb-input-font-size-small: 12px;\n  --hb-input-height: 32px;\n  --hb-input-height-large: 40px;\n  --hb-input-height-small: 24px;\n  --hb-input-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-input-border-color-hover: var(--hb-color-primary);\n  --hb-input-bg-color: var(--hb-color-white, #ffffff);\n  --hb-input-text-color: var(--hb-color-text-regular, #606266);\n  --hb-input-placeholder-color: var(--hb-color-text-placeholder, #c0c4cc);\n  --hb-input-disabled-color: var(--hb-color-text-disabled, #c0c4cc);\n  --hb-input-disabled-bg-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-input {\n  position: relative;\n  font-size: var(--hb-input-font-size);\n  display: inline-block;\n  width: 100%;\n}\n\n.hb-input__inner {\n  -webkit-appearance: none;\n  background-color: var(--hb-input-bg-color);\n  background-image: none;\n  border-radius: 4px;\n  border: 1px solid var(--hb-input-border-color);\n  box-sizing: border-box;\n  color: var(--hb-input-text-color);\n  display: inline-block;\n  font-size: inherit;\n  height: var(--hb-input-height);\n  line-height: var(--hb-input-height);\n  outline: none;\n  padding: 0 15px;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n  width: 100%;\n}\n\n.hb-input__inner::placeholder {\n  color: var(--hb-input-placeholder-color);\n}\n\n.hb-input__inner:hover:not(:disabled) {\n  border-color: var(--hb-input-border-color-hover);\n}\n\n.hb-input__inner:focus {\n  border-color: var(--hb-input-border-color-hover);\n}\n\n.hb-input__inner:disabled {\n  background-color: var(--hb-input-disabled-bg-color);\n  border-color: var(--hb-input-border-color);\n  color: var(--hb-input-disabled-color);\n  cursor: not-allowed;\n}\n\n.hb-input__inner[readonly] {\n  background-color: var(--hb-input-disabled-bg-color);\n  cursor: default;\n}\n\n.hb-input--small .hb-input__inner {\n  height: var(--hb-input-height-small);\n  line-height: var(--hb-input-height-small);\n  font-size: var(--hb-input-font-size-small);\n  padding: 0 12px;\n}\n\n.hb-input--large .hb-input__inner {\n  height: var(--hb-input-height-large);\n  line-height: var(--hb-input-height-large);\n  font-size: var(--hb-input-font-size-large);\n  padding: 0 18px;\n}\n\n.hb-input__prefix,\n.hb-input__suffix {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  text-align: center;\n  color: var(--hb-input-placeholder-color);\n  transition: all 0.3s;\n  display: flex;\n  align-items: center;\n}\n\n.hb-input__prefix {\n  left: 5px;\n}\n\n.hb-input__suffix {\n  right: 5px;\n}\n\n.hb-input__suffix-inner {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n}\n\n.hb-input__clear {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  color: var(--hb-input-placeholder-color);\n  transition: color 0.2s;\n}\n\n.hb-input__clear svg {\n  width: 100%;\n  height: 100%;\n}\n\n.hb-input__clear:hover {\n  color: var(--hb-input-text-color);\n}\n\n.hb-input__password {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  color: var(--hb-input-text-color);\n  cursor: pointer;\n}\n\n.hb-input__password svg {\n  width: 100%;\n  height: 100%;\n}\n\n.hb-input__inner[type=\"textarea\"] {\n  min-height: 60px;\n  padding: 5px 15px;\n  line-height: 1.5;\n  vertical-align: bottom;\n  resize: vertical;\n}\n\n.hb-input__count {\n  position: absolute;\n  bottom: 5px;\n  right: 10px;\n  font-size: 12px;\n  color: var(--hb-input-placeholder-color);\n}\n\n.hb-input__count-inner {\n  background-color: var(--hb-input-bg-color);\n  padding: 0 4px;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Watch, Element } from '@stencil/core';\nimport { ComponentSize, hasInputValue, isClearVisible, sizeClassMap } from '../../utils/form-input-base';\n\n/**\n * Input 输入框组件\n * 通过鼠标或键盘输入字符\n */\n@Component({\n  tag: 'hb-input',\n  styleUrl: 'input.css',\n  shadow: true,\n})\nexport class Input {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue: string = '';\n\n  /**\n   * 输入框类型\n   */\n  @Prop() type: string = 'text';\n\n  /**\n   * 输入框尺寸\n   */\n  @Prop() size: ComponentSize = 'default';\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 是否只读\n   * @default false\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * 输入框占位文本\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * 是否可清空\n   * @default false\n   */\n  @Prop() clearable: boolean = false;\n\n  /**\n   * 是否显示密码可见性切换\n   * @default false\n   */\n  @Prop() showPassword: boolean = false;\n\n  /**\n   * 是否显示字数统计\n   * @default false\n   */\n  @Prop() showWordLimit: boolean = false;\n\n  /**\n   * 最大输入长度\n   */\n  @Prop() maxlength?: number;\n\n  /**\n   * 最小输入长度\n   */\n  @Prop() minlength?: number;\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  /**\n   * 原生 autocomplete 属性\n   */\n  @Prop() autocomplete?: string;\n\n  /**\n   * 原生 autofocus 属性\n   */\n  @Prop() autofocus: boolean = false;\n\n  /**\n   * 输入框头部图标\n   */\n  @Prop() prefixIcon?: string;\n\n  /**\n   * 输入框尾部图标\n   */\n  @Prop() suffixIcon?: string;\n\n  /**\n   * 输入框行数，仅 type 为 'textarea' 时有效\n   */\n  @Prop() rows: number = 2;\n\n  /**\n   * 是否自适应内容高度，仅 type 为 'textarea' 时有效\n   */\n  @Prop() autosize: boolean | { minRows?: number; maxRows?: number } = false;\n\n  /**\n   * 是否调整 textarea 大小\n   */\n  @Prop() resize?: 'none' | 'both' | 'horizontal' | 'vertical';\n\n  @State() isFocused: boolean = false;\n  @State() showClear: boolean = false;\n  @State() passwordVisible: boolean = false;\n  @State() inputValue: string = '';\n\n  private inputRef?: HTMLInputElement | HTMLTextAreaElement;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  /**\n   * 输入事件\n   */\n  @Event() hbInput: EventEmitter<string>;\n\n  /**\n   * 聚焦事件\n   */\n  @Event() hbFocus: EventEmitter<FocusEvent>;\n\n  /**\n   * 失焦事件\n   */\n  @Event() hbBlur: EventEmitter<FocusEvent>;\n\n  /**\n   * 清空事件\n   */\n  @Event() hbClear: EventEmitter<void>;\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.inputValue = this.modelValue;\n    this.updateClearVisible();\n    // textarea autosize：外部改值也要重算高度\n    this.resizeTextarea();\n  }\n\n  componentDidLoad() {\n    this.inputValue = this.modelValue;\n    this.updateClearVisible();\n    this.resizeTextarea();\n  }\n\n  private updateClearVisible() {\n    this.showClear = isClearVisible({\n      clearable: this.clearable,\n      disabled: this.disabled,\n      readonly: this.readonly,\n      hasValue: hasInputValue(this.inputValue),\n    });\n  }\n\n  /**\n   * textarea 自适应高度（autosize）。\n   * - autosize=false 或非 textarea：跳过。\n   * - autosize=true：按内容自适应。\n   * - autosize={minRows,maxRows}：在最小/最大行数间夹取。\n   * 算法：先把 height 置 auto 让浏览器按内容重排，再读 scrollHeight，\n   *      减去 padding 后按行高换算成行数，最后按 min/max 夹取并写回 height。\n   */\n  private resizeTextarea() {\n    if (this.type !== 'textarea' || !this.autosize) return;\n    const ta = this.inputRef as HTMLTextAreaElement | undefined;\n    if (!ta) return;\n\n    // 行高：优先取计算样式，兜底 22px\n    const computed = typeof window !== 'undefined' ? window.getComputedStyle(ta) : null;\n    const lineHeight = computed && parseFloat(computed.lineHeight) ? parseFloat(computed.lineHeight) : 22;\n    const paddingTop = computed ? parseFloat(computed.paddingTop) || 0 : 0;\n    const paddingBottom = computed ? parseFloat(computed.paddingBottom) || 0 : 0;\n\n    const opts = typeof this.autosize === 'object' ? this.autosize : {};\n    const minRows = opts.minRows ?? 1;\n    const maxRows = opts.maxRows ?? Infinity;\n\n    const minH = minRows * lineHeight + paddingTop + paddingBottom;\n    const maxH = maxRows === Infinity ? Infinity : maxRows * lineHeight + paddingTop + paddingBottom;\n\n    // 先 reset 高度以读取真实内容高度\n    ta.style.height = 'auto';\n    const scrollH = ta.scrollHeight;\n    const clamped = Math.max(minH, Math.min(scrollH, maxH === Infinity ? scrollH : maxH));\n    ta.style.height = `${clamped}px`;\n    // overflow：能滚动时才显示滚动条\n    ta.style.overflowY = scrollH > clamped ? 'auto' : 'hidden';\n  }\n\n  private handleInput = (e: Event) => {\n    const target = e.target as HTMLInputElement | HTMLTextAreaElement;\n    this.inputValue = target.value;\n    this.modelValue = target.value;\n    this.updateClearVisible();\n    this.hbInput.emit(target.value);\n    this.resizeTextarea();\n  };\n\n  private handleChange = (e: Event) => {\n    const target = e.target as HTMLInputElement | HTMLTextAreaElement;\n    this.hbChange.emit(target.value);\n  };\n\n  private handleFocus = (e: FocusEvent) => {\n    this.isFocused = true;\n    this.updateClearVisible();\n    this.hbFocus.emit(e);\n  };\n\n  private handleBlur = (e: FocusEvent) => {\n    this.isFocused = false;\n    this.updateClearVisible();\n    this.hbBlur.emit(e);\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.inputValue = '';\n    this.modelValue = '';\n    this.updateClearVisible();\n    this.hbClear.emit();\n    this.hbChange.emit('');\n    if (this.inputRef) {\n      this.inputRef.focus();\n    }\n  };\n\n  private togglePasswordVisible = () => {\n    this.passwordVisible = !this.passwordVisible;\n  };\n\n  private getInputType(): string {\n    if (this.type === 'password' && this.showPassword) {\n      return this.passwordVisible ? 'text' : 'password';\n    }\n    return this.type;\n  }\n\n  render() {\n    const isTextarea = this.type === 'textarea';\n    const InputTag = isTextarea ? 'textarea' : 'input';\n\n    return (\n      <div\n        class={{\n          ...sizeClassMap('hb-input', this.size),\n          'hb-input--disabled': this.disabled,\n          'hb-input--focused': this.isFocused,\n        }}\n      >\n        {this.prefixIcon && (\n          <span class=\"hb-input__prefix\">\n            <i class={this.prefixIcon}></i>\n          </span>\n        )}\n        <InputTag\n          ref={(el) => (this.inputRef = el)}\n          type={isTextarea ? undefined : this.getInputType()}\n          id={this.inputId}\n          name={this.name}\n          class=\"hb-input__inner\"\n          placeholder={this.placeholder}\n          value={this.inputValue}\n          disabled={this.disabled}\n          readonly={this.readonly}\n          autocomplete={this.autocomplete}\n          autofocus={this.autofocus}\n          maxlength={this.maxlength}\n          minlength={this.minlength}\n          rows={isTextarea ? this.rows : undefined}\n          style={isTextarea ? { resize: this.autosize ? 'none' : (this.resize || 'none') } : undefined}\n          onInput={this.handleInput}\n          onChange={this.handleChange}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n        />\n        {(this.showClear || this.suffixIcon || (this.type === 'password' && this.showPassword)) && (\n          <span class=\"hb-input__suffix\">\n            {this.showClear && (\n              <span class=\"hb-input__suffix-inner hb-input__clear\" role=\"button\" aria-label=\"清空\" onClick={this.handleClear}>\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                  <path d=\"M6 6l12 12M18 6L6 18\" />\n                </svg>\n              </span>\n            )}\n            {this.type === 'password' && this.showPassword && (\n              <span\n                class=\"hb-input__suffix-inner hb-input__password\"\n                role=\"button\"\n                aria-label={this.passwordVisible ? '隐藏密码' : '显示密码'}\n                onClick={this.togglePasswordVisible}\n              >\n                {this.passwordVisible ? (\n                  <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z\" />\n                    <circle cx=\"12\" cy=\"12\" r=\"3\" />\n                  </svg>\n                ) : (\n                  <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.6 10.6 0 0 1 12 5c6.5 0 10 7 10 7a17.8 17.8 0 0 1-2.2 3.2M6.1 6.1A17.7 17.7 0 0 0 2 12s3.5 7 10 7a10.5 10.5 0 0 0 4-.8\" />\n                  </svg>\n                )}\n              </span>\n            )}\n            {this.suffixIcon && (\n              <span class=\"hb-input__suffix-inner\">\n                <i class={this.suffixIcon}></i>\n              </span>\n            )}\n          </span>\n        )}\n        {this.showWordLimit && this.maxlength && (\n          <span class=\"hb-input__count\">\n            <span class=\"hb-input__count-inner\">\n              {this.inputValue.length} / {this.maxlength}\n            </span>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\n"],"version":3}
+{"file":"hb-input.entry.cjs.js","mappings":"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","names":["h","activationClickHandler"],"sources":["src/utils/form-input-base.ts","src/components/Input/input.css?tag=hb-input&encapsulation=shadow","src/components/Input/Input.tsx"],"sourcesContent":["/**\n * 表单输入组件共享基础\n * 统一 size / disabled / clearable / modelValue 这一组在 Input / Select / Cascader /\n * DatePicker / InputNumber / TimePicker 等组件中重复出现的包装模式。\n *\n * 设计原则：纯函数 + 类型导出，不引入基类继承，避免 Stencil 装饰器在继承链上的隐式行为。\n * 组件按需 import 对应工具，渲染时调用即可。\n */\n\n/** 组件尺寸（与 Ant Design 对齐，便于迁移） */\nexport type ComponentSize = 'large' | 'default' | 'small';\n\n/** 全部合法尺寸，用于运行期校验 */\nexport const COMPONENT_SIZES: readonly ComponentSize[] = ['large', 'default', 'small'] as const;\n\n/**\n * 表单输入组件共享的 prop 契约。\n * 跨框架消费方（React / Vue / 原生）可据此推断任一表单输入组件的通用能力，\n * 各组件在此基础上扩展自身特有 prop。\n */\nexport interface FormInputProps {\n  /** 绑定值（双向，配合 hbChange 事件） */\n  modelValue: unknown;\n  /** 尺寸 */\n  size?: ComponentSize;\n  /** 是否禁用 */\n  disabled?: boolean;\n  /** 是否只读 */\n  readonly?: boolean;\n  /** 是否可清空 */\n  clearable?: boolean;\n  /** 占位文本 */\n  placeholder?: string;\n}\n\n/**\n * 生成尺寸 class 名：buildSizeClass('hb-input', 'large') -> 'hb-input--large'\n * 用于替代各组件 render 中重复的 `[`hb-input--${this.size}`]: true` 模板字面量。\n */\nexport function buildSizeClass(base: string, size: ComponentSize | undefined): string {\n  const normalized = size && COMPONENT_SIZES.includes(size) ? size : 'default';\n  return `${base}--${normalized}`;\n}\n\n/** 清空按钮可见性判定参数 */\nexport interface ClearVisibleOptions {\n  /** 是否声明了 clearable */\n  clearable: boolean;\n  /** 是否禁用（禁用时不显示） */\n  disabled?: boolean;\n  /** 是否只读（只读时不显示） */\n  readonly?: boolean;\n  /** 当前是否有值（无值时不显示） */\n  hasValue: boolean;\n}\n\n/**\n * 判定清空按钮是否应显示。\n * 抽取自 Input/Select/Cascader 中重复的 `clearable && !disabled && !readonly && hasValue`。\n */\nexport function isClearVisible(options: ClearVisibleOptions): boolean {\n  return Boolean(options.clearable && !options.disabled && !options.readonly && options.hasValue);\n}\n\n/**\n * 判定一个值是否「非空」（用于清空按钮显隐）。\n * 兼容字符串、数字、数组（多选）。\n */\nexport function hasInputValue(value: unknown): boolean {\n  if (value === null || value === undefined) return false;\n  if (typeof value === 'string') return value.length > 0;\n  if (typeof value === 'number') return !Number.isNaN(value);\n  if (Array.isArray(value)) return value.length > 0;\n  return true;\n}\n\n/**\n * 尺寸 class 集合生成器：返回包含 base 与 size class 的对象，可直接展开进 JSX class 绑定。\n * 例：sizeClassMap('hb-input', 'large', this.size) -> { 'hb-input': true, 'hb-input--large': true }\n */\nexport function sizeClassMap(base: string, size: ComponentSize | undefined): Record<string, boolean> {\n  return { [base]: true, [buildSizeClass(base, size)]: true };\n}\n",":host {\n  display: inline-block;\n  position: relative;\n  --hb-input-font-size: 14px;\n  --hb-input-font-size-large: 16px;\n  --hb-input-font-size-small: 12px;\n  --hb-input-height: 32px;\n  --hb-input-height-large: 40px;\n  --hb-input-height-small: 24px;\n  --hb-input-border-color: var(--hb-border-color, #dcdfe6);\n  --hb-input-border-color-hover: var(--hb-color-primary);\n  --hb-input-bg-color: var(--hb-color-white, #ffffff);\n  --hb-input-text-color: var(--hb-color-text-regular, #606266);\n  --hb-input-placeholder-color: var(--hb-color-text-placeholder, #c0c4cc);\n  --hb-input-disabled-color: var(--hb-color-text-disabled, #c0c4cc);\n  --hb-input-disabled-bg-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-input {\n  position: relative;\n  font-size: var(--hb-input-font-size);\n  display: inline-block;\n  width: 100%;\n}\n\n.hb-input__inner {\n  -webkit-appearance: none;\n  background-color: var(--hb-input-bg-color);\n  background-image: none;\n  border-radius: 4px;\n  border: 1px solid var(--hb-input-border-color);\n  box-sizing: border-box;\n  color: var(--hb-input-text-color);\n  display: inline-block;\n  font-size: inherit;\n  height: var(--hb-input-height);\n  line-height: var(--hb-input-height);\n  outline: none;\n  padding: 0 15px;\n  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n  width: 100%;\n}\n\n.hb-input__inner::placeholder {\n  color: var(--hb-input-placeholder-color);\n}\n\n.hb-input__inner:hover:not(:disabled) {\n  border-color: var(--hb-input-border-color-hover);\n}\n\n.hb-input__inner:focus {\n  border-color: var(--hb-input-border-color-hover);\n}\n\n.hb-input__inner:disabled {\n  background-color: var(--hb-input-disabled-bg-color);\n  border-color: var(--hb-input-border-color);\n  color: var(--hb-input-disabled-color);\n  cursor: not-allowed;\n}\n\n.hb-input__inner[readonly] {\n  background-color: var(--hb-input-disabled-bg-color);\n  cursor: default;\n}\n\n.hb-input--small .hb-input__inner {\n  height: var(--hb-input-height-small);\n  line-height: var(--hb-input-height-small);\n  font-size: var(--hb-input-font-size-small);\n  padding: 0 12px;\n}\n\n.hb-input--large .hb-input__inner {\n  height: var(--hb-input-height-large);\n  line-height: var(--hb-input-height-large);\n  font-size: var(--hb-input-font-size-large);\n  padding: 0 18px;\n}\n\n.hb-input__prefix,\n.hb-input__suffix {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  text-align: center;\n  color: var(--hb-input-placeholder-color);\n  transition: all 0.3s;\n  display: flex;\n  align-items: center;\n}\n\n.hb-input__prefix {\n  left: 5px;\n}\n\n.hb-input__suffix {\n  right: 5px;\n}\n\n.hb-input__suffix-inner {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  user-select: none;\n}\n\n.hb-input__clear {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  color: var(--hb-input-placeholder-color);\n  transition: color 0.2s;\n}\n\n.hb-input__clear svg {\n  width: 100%;\n  height: 100%;\n}\n\n.hb-input__clear:hover {\n  color: var(--hb-input-text-color);\n}\n\n.hb-input__password {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  color: var(--hb-input-text-color);\n  cursor: pointer;\n}\n\n.hb-input__password svg {\n  width: 100%;\n  height: 100%;\n}\n\n.hb-input__inner[type='textarea'] {\n  min-height: 60px;\n  padding: 5px 15px;\n  line-height: 1.5;\n  vertical-align: bottom;\n  resize: vertical;\n}\n\n.hb-input__count {\n  position: absolute;\n  bottom: 5px;\n  right: 10px;\n  font-size: 12px;\n  color: var(--hb-input-placeholder-color);\n}\n\n.hb-input__count-inner {\n  background-color: var(--hb-input-bg-color);\n  padding: 0 4px;\n}\n","import { Component, h, Prop, Event, EventEmitter, State, Watch, Element } from '@stencil/core';\nimport { ComponentSize, hasInputValue, isClearVisible, sizeClassMap } from '../../utils/form-input-base';\nimport { activationClickHandler } from '../../utils/a11y';\n\n/**\n * Input 输入框组件\n * 通过鼠标或键盘输入字符\n */\n@Component({\n  tag: 'hb-input',\n  styleUrl: 'input.css',\n  shadow: true,\n})\nexport class Input {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue: string = '';\n\n  /**\n   * 输入框类型\n   */\n  @Prop() type: string = 'text';\n\n  /**\n   * 输入框尺寸\n   */\n  @Prop() size: ComponentSize = 'default';\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 是否只读\n   * @default false\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * 输入框占位文本\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * 是否可清空\n   * @default false\n   */\n  @Prop() clearable: boolean = false;\n\n  /**\n   * 是否显示密码可见性切换\n   * @default false\n   */\n  @Prop() showPassword: boolean = false;\n\n  /**\n   * 是否显示字数统计\n   * @default false\n   */\n  @Prop() showWordLimit: boolean = false;\n\n  /**\n   * 最大输入长度\n   */\n  @Prop() maxlength?: number;\n\n  /**\n   * 最小输入长度\n   */\n  @Prop() minlength?: number;\n\n  /**\n   * 原生 name 属性\n   */\n  @Prop() name?: string;\n\n  /**\n   * 原生 id 属性\n   */\n  @Prop() inputId?: string;\n\n  /**\n   * 原生 autocomplete 属性\n   */\n  @Prop() autocomplete?: string;\n\n  /**\n   * 原生 autofocus 属性\n   */\n  @Prop() autofocus: boolean = false;\n\n  /**\n   * 输入框头部图标\n   */\n  @Prop() prefixIcon?: string;\n\n  /**\n   * 输入框尾部图标\n   */\n  @Prop() suffixIcon?: string;\n\n  /**\n   * 输入框行数，仅 type 为 'textarea' 时有效\n   */\n  @Prop() rows: number = 2;\n\n  /**\n   * 是否自适应内容高度，仅 type 为 'textarea' 时有效\n   */\n  @Prop() autosize: boolean | { minRows?: number; maxRows?: number } = false;\n\n  /**\n   * 是否调整 textarea 大小\n   */\n  @Prop() resize?: 'none' | 'both' | 'horizontal' | 'vertical';\n\n  @State() isFocused: boolean = false;\n  @State() showClear: boolean = false;\n  @State() passwordVisible: boolean = false;\n  @State() inputValue: string = '';\n\n  private inputRef?: HTMLInputElement | HTMLTextAreaElement;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  /**\n   * 输入事件\n   */\n  @Event() hbInput: EventEmitter<string>;\n\n  /**\n   * 聚焦事件\n   */\n  @Event() hbFocus: EventEmitter<FocusEvent>;\n\n  /**\n   * 失焦事件\n   */\n  @Event() hbBlur: EventEmitter<FocusEvent>;\n\n  /**\n   * 清空事件\n   */\n  @Event() hbClear: EventEmitter<void>;\n\n  @Watch('modelValue')\n  handleValueChange() {\n    this.inputValue = this.modelValue;\n    this.updateClearVisible();\n    // textarea autosize：外部改值也要重算高度\n    this.resizeTextarea();\n  }\n\n  componentDidLoad() {\n    this.inputValue = this.modelValue;\n    this.updateClearVisible();\n    this.resizeTextarea();\n  }\n\n  private updateClearVisible() {\n    this.showClear = isClearVisible({\n      clearable: this.clearable,\n      disabled: this.disabled,\n      readonly: this.readonly,\n      hasValue: hasInputValue(this.inputValue),\n    });\n  }\n\n  /**\n   * textarea 自适应高度（autosize）。\n   * - autosize=false 或非 textarea：跳过。\n   * - autosize=true：按内容自适应。\n   * - autosize={minRows,maxRows}：在最小/最大行数间夹取。\n   * 算法：先把 height 置 auto 让浏览器按内容重排，再读 scrollHeight，\n   *      减去 padding 后按行高换算成行数，最后按 min/max 夹取并写回 height。\n   */\n  private resizeTextarea() {\n    if (this.type !== 'textarea' || !this.autosize) return;\n    const ta = this.inputRef as HTMLTextAreaElement | undefined;\n    if (!ta) return;\n\n    // 行高：优先取计算样式，兜底 22px\n    const computed = typeof window !== 'undefined' ? window.getComputedStyle(ta) : null;\n    const lineHeight = computed && parseFloat(computed.lineHeight) ? parseFloat(computed.lineHeight) : 22;\n    const paddingTop = computed ? parseFloat(computed.paddingTop) || 0 : 0;\n    const paddingBottom = computed ? parseFloat(computed.paddingBottom) || 0 : 0;\n\n    const opts = typeof this.autosize === 'object' ? this.autosize : {};\n    const minRows = opts.minRows ?? 1;\n    const maxRows = opts.maxRows ?? Infinity;\n\n    const minH = minRows * lineHeight + paddingTop + paddingBottom;\n    const maxH = maxRows === Infinity ? Infinity : maxRows * lineHeight + paddingTop + paddingBottom;\n\n    // 先 reset 高度以读取真实内容高度\n    ta.style.height = 'auto';\n    const scrollH = ta.scrollHeight;\n    const clamped = Math.max(minH, Math.min(scrollH, maxH === Infinity ? scrollH : maxH));\n    ta.style.height = `${clamped}px`;\n    // overflow：能滚动时才显示滚动条\n    ta.style.overflowY = scrollH > clamped ? 'auto' : 'hidden';\n  }\n\n  private handleInput = (e: Event) => {\n    const target = e.target as HTMLInputElement | HTMLTextAreaElement;\n    this.inputValue = target.value;\n    this.modelValue = target.value;\n    this.updateClearVisible();\n    this.hbInput.emit(target.value);\n    this.resizeTextarea();\n  };\n\n  private handleChange = (e: Event) => {\n    const target = e.target as HTMLInputElement | HTMLTextAreaElement;\n    this.hbChange.emit(target.value);\n  };\n\n  private handleFocus = (e: FocusEvent) => {\n    this.isFocused = true;\n    this.updateClearVisible();\n    this.hbFocus.emit(e);\n  };\n\n  private handleBlur = (e: FocusEvent) => {\n    this.isFocused = false;\n    this.updateClearVisible();\n    this.hbBlur.emit(e);\n  };\n\n  private handleClear = (e: Event) => {\n    e.stopPropagation();\n    this.inputValue = '';\n    this.modelValue = '';\n    this.updateClearVisible();\n    this.hbClear.emit();\n    this.hbChange.emit('');\n    if (this.inputRef) {\n      this.inputRef.focus();\n    }\n  };\n\n  private togglePasswordVisible = () => {\n    this.passwordVisible = !this.passwordVisible;\n  };\n\n  private getInputType(): string {\n    if (this.type === 'password' && this.showPassword) {\n      return this.passwordVisible ? 'text' : 'password';\n    }\n    return this.type;\n  }\n\n  render() {\n    const isTextarea = this.type === 'textarea';\n    const InputTag = isTextarea ? 'textarea' : 'input';\n\n    return (\n      <div\n        class={{\n          ...sizeClassMap('hb-input', this.size),\n          'hb-input--disabled': this.disabled,\n          'hb-input--focused': this.isFocused,\n        }}\n      >\n        {this.prefixIcon && (\n          <span class=\"hb-input__prefix\">\n            <i class={this.prefixIcon}></i>\n          </span>\n        )}\n        <InputTag\n          ref={el => (this.inputRef = el)}\n          type={isTextarea ? undefined : this.getInputType()}\n          id={this.inputId}\n          name={this.name}\n          class=\"hb-input__inner\"\n          placeholder={this.placeholder}\n          value={this.inputValue}\n          disabled={this.disabled}\n          readonly={this.readonly}\n          autocomplete={this.autocomplete}\n          autofocus={this.autofocus}\n          maxlength={this.maxlength}\n          minlength={this.minlength}\n          rows={isTextarea ? this.rows : undefined}\n          style={isTextarea ? { resize: this.autosize ? 'none' : this.resize || 'none' } : undefined}\n          onInput={this.handleInput}\n          onChange={this.handleChange}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n        />\n        {(this.showClear || this.suffixIcon || (this.type === 'password' && this.showPassword)) && (\n          <span class=\"hb-input__suffix\">\n            {this.showClear && (\n              <span class=\"hb-input__suffix-inner hb-input__clear\" role=\"button\" aria-label=\"清空\" tabIndex={0} onClick={this.handleClear} onKeyDown={activationClickHandler}>\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                  <path d=\"M6 6l12 12M18 6L6 18\" />\n                </svg>\n              </span>\n            )}\n            {this.type === 'password' && this.showPassword && (\n              <span\n                class=\"hb-input__suffix-inner hb-input__password\"\n                role=\"button\"\n                aria-label={this.passwordVisible ? '隐藏密码' : '显示密码'}\n                tabIndex={0}\n                onClick={this.togglePasswordVisible}\n                onKeyDown={activationClickHandler}\n              >\n                {this.passwordVisible ? (\n                  <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z\" />\n                    <circle cx=\"12\" cy=\"12\" r=\"3\" />\n                  </svg>\n                ) : (\n                  <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width={2} stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.6 10.6 0 0 1 12 5c6.5 0 10 7 10 7a17.8 17.8 0 0 1-2.2 3.2M6.1 6.1A17.7 17.7 0 0 0 2 12s3.5 7 10 7a10.5 10.5 0 0 0 4-.8\" />\n                  </svg>\n                )}\n              </span>\n            )}\n            {this.suffixIcon && (\n              <span class=\"hb-input__suffix-inner\">\n                <i class={this.suffixIcon}></i>\n              </span>\n            )}\n          </span>\n        )}\n        {this.showWordLimit && this.maxlength && (\n          <span class=\"hb-input__count\">\n            <span class=\"hb-input__count-inner\">\n              {this.inputValue.length} / {this.maxlength}\n            </span>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/hb-layout.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"hb-layout.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,k0vBAAk0vB,CAAC;AACr1vB,uBAAe,SAAS;;MCmBX,MAAM;;;;;;;;IAKT,IAAI,GAAW,EAAE,CAAC;;;;;IAMlB,MAAM,GAAW,CAAC,CAAC;;;;;IAMnB,IAAI,GAAW,CAAC,CAAC;;;;;IAMjB,IAAI,GAAW,CAAC,CAAC;;;;IAKjB,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;IAG5B,mBAAmB,CAAC,KAAyC;QACnE,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,EAAE,CAAC;QACrD,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;QACtD,OAAO,KAAK,CAAC;KACd;IAEO,WAAW;QACjB,MAAM,OAAO,GAAa,CAAC,QAAQ,CAAC,CAAC;;QAGrC,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QACnD,IAAI,IAAI,CAAC,MAAM;YAAE,OAAO,CAAC,IAAI,CAAC,iBAAiB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC9D,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QACxD,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;;;QAIxD,MAAM,GAAG,GAA4C,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;QACpF,KAAK,MAAM,EAAE,IAAI,GAAG,EAAE;YACpB,MAAM,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;YACnB,IAAI,CAAC,KAAK,SAAS;gBAAE,SAAS;YAC9B,MAAM,CAAC,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC;YACtC,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;YACjE,IAAI,CAAC,CAAC,MAAM,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;YAC5E,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;YACtE,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;SACvE;QAED,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC1B;IAED,MAAM;QACJ,QACEA,kEAAK,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,IAC5BA,oEAAa,CACT,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/Layout/layout.css?tag=hb-layout&encapsulation=shadow","src/components/Layout/Layout.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hb-col {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Generate col classes for span 1-24 */\n.hb-col-1 { width: 4.16666667%; }\n.hb-col-2 { width: 8.33333333%; }\n.hb-col-3 { width: 12.5%; }\n.hb-col-4 { width: 16.66666667%; }\n.hb-col-5 { width: 20.83333333%; }\n.hb-col-6 { width: 25%; }\n.hb-col-7 { width: 29.16666667%; }\n.hb-col-8 { width: 33.33333333%; }\n.hb-col-9 { width: 37.5%; }\n.hb-col-10 { width: 41.66666667%; }\n.hb-col-11 { width: 45.83333333%; }\n.hb-col-12 { width: 50%; }\n.hb-col-13 { width: 54.16666667%; }\n.hb-col-14 { width: 58.33333333%; }\n.hb-col-15 { width: 62.5%; }\n.hb-col-16 { width: 66.66666667%; }\n.hb-col-17 { width: 70.83333333%; }\n.hb-col-18 { width: 75%; }\n.hb-col-19 { width: 79.16666667%; }\n.hb-col-20 { width: 83.33333333%; }\n.hb-col-21 { width: 87.5%; }\n.hb-col-22 { width: 91.66666667%; }\n.hb-col-23 { width: 95.83333333%; }\n.hb-col-24 { width: 100%; }\n\n/* Offset classes */\n.hb-col-offset-1 { margin-left: 4.16666667%; }\n.hb-col-offset-2 { margin-left: 8.33333333%; }\n.hb-col-offset-3 { margin-left: 12.5%; }\n.hb-col-offset-4 { margin-left: 16.66666667%; }\n.hb-col-offset-5 { margin-left: 20.83333333%; }\n.hb-col-offset-6 { margin-left: 25%; }\n.hb-col-offset-7 { margin-left: 29.16666667%; }\n.hb-col-offset-8 { margin-left: 33.33333333%; }\n.hb-col-offset-9 { margin-left: 37.5%; }\n.hb-col-offset-10 { margin-left: 41.66666667%; }\n.hb-col-offset-11 { margin-left: 45.83333333%; }\n.hb-col-offset-12 { margin-left: 50%; }\n.hb-col-offset-13 { margin-left: 54.16666667%; }\n.hb-col-offset-14 { margin-left: 58.33333333%; }\n.hb-col-offset-15 { margin-left: 62.5%; }\n.hb-col-offset-16 { margin-left: 66.66666667%; }\n.hb-col-offset-17 { margin-left: 70.83333333%; }\n.hb-col-offset-18 { margin-left: 75%; }\n.hb-col-offset-19 { margin-left: 79.16666667%; }\n.hb-col-offset-20 { margin-left: 83.33333333%; }\n.hb-col-offset-21 { margin-left: 87.5%; }\n.hb-col-offset-22 { margin-left: 91.66666667%; }\n.hb-col-offset-23 { margin-left: 95.83333333%; }\n\n/* Push classes */\n.hb-col-push-1 { left: 4.16666667%; }\n.hb-col-push-2 { left: 8.33333333%; }\n.hb-col-push-3 { left: 12.5%; }\n.hb-col-push-4 { left: 16.66666667%; }\n.hb-col-push-5 { left: 20.83333333%; }\n.hb-col-push-6 { left: 25%; }\n.hb-col-push-7 { left: 29.16666667%; }\n.hb-col-push-8 { left: 33.33333333%; }\n.hb-col-push-9 { left: 37.5%; }\n.hb-col-push-10 { left: 41.66666667%; }\n.hb-col-push-11 { left: 45.83333333%; }\n.hb-col-push-12 { left: 50%; }\n\n/* Pull classes */\n.hb-col-pull-1 { right: 4.16666667%; }\n.hb-col-pull-2 { right: 8.33333333%; }\n.hb-col-pull-3 { right: 12.5%; }\n.hb-col-pull-4 { right: 16.66666667%; }\n.hb-col-pull-5 { right: 20.83333333%; }\n.hb-col-pull-6 { right: 25%; }\n.hb-col-pull-7 { right: 29.16666667%; }\n.hb-col-pull-8 { right: 33.33333333%; }\n.hb-col-pull-9 { right: 37.5%; }\n.hb-col-pull-10 { right: 41.66666667%; }\n.hb-col-pull-11 { right: 45.83333333%; }\n.hb-col-pull-12 { right: 50%; }\n\n\n/* ============================================================\n * 响应式栅格（xs/sm/md/lg/xl）—— 由 Layout.tsx 输出对应 class，\n * 这里按断点用 @media 应用宽度/偏移/推拉。\n * xs 无 @media（移动端默认）；sm/md/lg/xl 用 min-width 渐进增强。\n * 对齐 antd Grid 断点：576 / 768 / 992 / 1200\n * ============================================================ */\n\n.hb-col-xs-0 { display: none; }\n.hb-col-xs-1 { width: 4.16666667%; }\n.hb-col-xs-2 { width: 8.33333333%; }\n.hb-col-xs-3 { width: 12.5%; }\n.hb-col-xs-4 { width: 16.66666667%; }\n.hb-col-xs-5 { width: 20.83333333%; }\n.hb-col-xs-6 { width: 25%; }\n.hb-col-xs-7 { width: 29.16666667%; }\n.hb-col-xs-8 { width: 33.33333333%; }\n.hb-col-xs-9 { width: 37.5%; }\n.hb-col-xs-10 { width: 41.66666667%; }\n.hb-col-xs-11 { width: 45.83333333%; }\n.hb-col-xs-12 { width: 50%; }\n.hb-col-xs-13 { width: 54.16666667%; }\n.hb-col-xs-14 { width: 58.33333333%; }\n.hb-col-xs-15 { width: 62.5%; }\n.hb-col-xs-16 { width: 66.66666667%; }\n.hb-col-xs-17 { width: 70.83333333%; }\n.hb-col-xs-18 { width: 75%; }\n.hb-col-xs-19 { width: 79.16666667%; }\n.hb-col-xs-20 { width: 83.33333333%; }\n.hb-col-xs-21 { width: 87.5%; }\n.hb-col-xs-22 { width: 91.66666667%; }\n.hb-col-xs-23 { width: 95.83333333%; }\n.hb-col-xs-24 { width: 100%; }\n.hb-col-xs-offset-0 { margin-left: 0; }\n.hb-col-xs-offset-1 { margin-left: 4.16666667%; }\n.hb-col-xs-offset-2 { margin-left: 8.33333333%; }\n.hb-col-xs-offset-3 { margin-left: 12.5%; }\n.hb-col-xs-offset-4 { margin-left: 16.66666667%; }\n.hb-col-xs-offset-5 { margin-left: 20.83333333%; }\n.hb-col-xs-offset-6 { margin-left: 25%; }\n.hb-col-xs-offset-7 { margin-left: 29.16666667%; }\n.hb-col-xs-offset-8 { margin-left: 33.33333333%; }\n.hb-col-xs-offset-9 { margin-left: 37.5%; }\n.hb-col-xs-offset-10 { margin-left: 41.66666667%; }\n.hb-col-xs-offset-11 { margin-left: 45.83333333%; }\n.hb-col-xs-offset-12 { margin-left: 50%; }\n.hb-col-xs-offset-13 { margin-left: 54.16666667%; }\n.hb-col-xs-offset-14 { margin-left: 58.33333333%; }\n.hb-col-xs-offset-15 { margin-left: 62.5%; }\n.hb-col-xs-offset-16 { margin-left: 66.66666667%; }\n.hb-col-xs-offset-17 { margin-left: 70.83333333%; }\n.hb-col-xs-offset-18 { margin-left: 75%; }\n.hb-col-xs-offset-19 { margin-left: 79.16666667%; }\n.hb-col-xs-offset-20 { margin-left: 83.33333333%; }\n.hb-col-xs-offset-21 { margin-left: 87.5%; }\n.hb-col-xs-offset-22 { margin-left: 91.66666667%; }\n.hb-col-xs-offset-23 { margin-left: 95.83333333%; }\n.hb-col-xs-offset-24 { margin-left: 100%; }\n.hb-col-xs-push-0 { left: 0; }\n.hb-col-xs-push-1 { left: 4.16666667%; }\n.hb-col-xs-push-2 { left: 8.33333333%; }\n.hb-col-xs-push-3 { left: 12.5%; }\n.hb-col-xs-push-4 { left: 16.66666667%; }\n.hb-col-xs-push-5 { left: 20.83333333%; }\n.hb-col-xs-push-6 { left: 25%; }\n.hb-col-xs-push-7 { left: 29.16666667%; }\n.hb-col-xs-push-8 { left: 33.33333333%; }\n.hb-col-xs-push-9 { left: 37.5%; }\n.hb-col-xs-push-10 { left: 41.66666667%; }\n.hb-col-xs-push-11 { left: 45.83333333%; }\n.hb-col-xs-push-12 { left: 50%; }\n.hb-col-xs-push-13 { left: 54.16666667%; }\n.hb-col-xs-push-14 { left: 58.33333333%; }\n.hb-col-xs-push-15 { left: 62.5%; }\n.hb-col-xs-push-16 { left: 66.66666667%; }\n.hb-col-xs-push-17 { left: 70.83333333%; }\n.hb-col-xs-push-18 { left: 75%; }\n.hb-col-xs-push-19 { left: 79.16666667%; }\n.hb-col-xs-push-20 { left: 83.33333333%; }\n.hb-col-xs-push-21 { left: 87.5%; }\n.hb-col-xs-push-22 { left: 91.66666667%; }\n.hb-col-xs-push-23 { left: 95.83333333%; }\n.hb-col-xs-push-24 { left: 100%; }\n.hb-col-xs-pull-0 { right: 0; }\n.hb-col-xs-pull-1 { right: 4.16666667%; }\n.hb-col-xs-pull-2 { right: 8.33333333%; }\n.hb-col-xs-pull-3 { right: 12.5%; }\n.hb-col-xs-pull-4 { right: 16.66666667%; }\n.hb-col-xs-pull-5 { right: 20.83333333%; }\n.hb-col-xs-pull-6 { right: 25%; }\n.hb-col-xs-pull-7 { right: 29.16666667%; }\n.hb-col-xs-pull-8 { right: 33.33333333%; }\n.hb-col-xs-pull-9 { right: 37.5%; }\n.hb-col-xs-pull-10 { right: 41.66666667%; }\n.hb-col-xs-pull-11 { right: 45.83333333%; }\n.hb-col-xs-pull-12 { right: 50%; }\n.hb-col-xs-pull-13 { right: 54.16666667%; }\n.hb-col-xs-pull-14 { right: 58.33333333%; }\n.hb-col-xs-pull-15 { right: 62.5%; }\n.hb-col-xs-pull-16 { right: 66.66666667%; }\n.hb-col-xs-pull-17 { right: 70.83333333%; }\n.hb-col-xs-pull-18 { right: 75%; }\n.hb-col-xs-pull-19 { right: 79.16666667%; }\n.hb-col-xs-pull-20 { right: 83.33333333%; }\n.hb-col-xs-pull-21 { right: 87.5%; }\n.hb-col-xs-pull-22 { right: 91.66666667%; }\n.hb-col-xs-pull-23 { right: 95.83333333%; }\n.hb-col-xs-pull-24 { right: 100%; }\n\n@media (min-width: 576px) {\n\n.hb-col-sm-0 { display: none; }\n.hb-col-sm-1 { width: 4.16666667%; }\n.hb-col-sm-2 { width: 8.33333333%; }\n.hb-col-sm-3 { width: 12.5%; }\n.hb-col-sm-4 { width: 16.66666667%; }\n.hb-col-sm-5 { width: 20.83333333%; }\n.hb-col-sm-6 { width: 25%; }\n.hb-col-sm-7 { width: 29.16666667%; }\n.hb-col-sm-8 { width: 33.33333333%; }\n.hb-col-sm-9 { width: 37.5%; }\n.hb-col-sm-10 { width: 41.66666667%; }\n.hb-col-sm-11 { width: 45.83333333%; }\n.hb-col-sm-12 { width: 50%; }\n.hb-col-sm-13 { width: 54.16666667%; }\n.hb-col-sm-14 { width: 58.33333333%; }\n.hb-col-sm-15 { width: 62.5%; }\n.hb-col-sm-16 { width: 66.66666667%; }\n.hb-col-sm-17 { width: 70.83333333%; }\n.hb-col-sm-18 { width: 75%; }\n.hb-col-sm-19 { width: 79.16666667%; }\n.hb-col-sm-20 { width: 83.33333333%; }\n.hb-col-sm-21 { width: 87.5%; }\n.hb-col-sm-22 { width: 91.66666667%; }\n.hb-col-sm-23 { width: 95.83333333%; }\n.hb-col-sm-24 { width: 100%; }\n.hb-col-sm-offset-0 { margin-left: 0; }\n.hb-col-sm-offset-1 { margin-left: 4.16666667%; }\n.hb-col-sm-offset-2 { margin-left: 8.33333333%; }\n.hb-col-sm-offset-3 { margin-left: 12.5%; }\n.hb-col-sm-offset-4 { margin-left: 16.66666667%; }\n.hb-col-sm-offset-5 { margin-left: 20.83333333%; }\n.hb-col-sm-offset-6 { margin-left: 25%; }\n.hb-col-sm-offset-7 { margin-left: 29.16666667%; }\n.hb-col-sm-offset-8 { margin-left: 33.33333333%; }\n.hb-col-sm-offset-9 { margin-left: 37.5%; }\n.hb-col-sm-offset-10 { margin-left: 41.66666667%; }\n.hb-col-sm-offset-11 { margin-left: 45.83333333%; }\n.hb-col-sm-offset-12 { margin-left: 50%; }\n.hb-col-sm-offset-13 { margin-left: 54.16666667%; }\n.hb-col-sm-offset-14 { margin-left: 58.33333333%; }\n.hb-col-sm-offset-15 { margin-left: 62.5%; }\n.hb-col-sm-offset-16 { margin-left: 66.66666667%; }\n.hb-col-sm-offset-17 { margin-left: 70.83333333%; }\n.hb-col-sm-offset-18 { margin-left: 75%; }\n.hb-col-sm-offset-19 { margin-left: 79.16666667%; }\n.hb-col-sm-offset-20 { margin-left: 83.33333333%; }\n.hb-col-sm-offset-21 { margin-left: 87.5%; }\n.hb-col-sm-offset-22 { margin-left: 91.66666667%; }\n.hb-col-sm-offset-23 { margin-left: 95.83333333%; }\n.hb-col-sm-offset-24 { margin-left: 100%; }\n.hb-col-sm-push-0 { left: 0; }\n.hb-col-sm-push-1 { left: 4.16666667%; }\n.hb-col-sm-push-2 { left: 8.33333333%; }\n.hb-col-sm-push-3 { left: 12.5%; }\n.hb-col-sm-push-4 { left: 16.66666667%; }\n.hb-col-sm-push-5 { left: 20.83333333%; }\n.hb-col-sm-push-6 { left: 25%; }\n.hb-col-sm-push-7 { left: 29.16666667%; }\n.hb-col-sm-push-8 { left: 33.33333333%; }\n.hb-col-sm-push-9 { left: 37.5%; }\n.hb-col-sm-push-10 { left: 41.66666667%; }\n.hb-col-sm-push-11 { left: 45.83333333%; }\n.hb-col-sm-push-12 { left: 50%; }\n.hb-col-sm-push-13 { left: 54.16666667%; }\n.hb-col-sm-push-14 { left: 58.33333333%; }\n.hb-col-sm-push-15 { left: 62.5%; }\n.hb-col-sm-push-16 { left: 66.66666667%; }\n.hb-col-sm-push-17 { left: 70.83333333%; }\n.hb-col-sm-push-18 { left: 75%; }\n.hb-col-sm-push-19 { left: 79.16666667%; }\n.hb-col-sm-push-20 { left: 83.33333333%; }\n.hb-col-sm-push-21 { left: 87.5%; }\n.hb-col-sm-push-22 { left: 91.66666667%; }\n.hb-col-sm-push-23 { left: 95.83333333%; }\n.hb-col-sm-push-24 { left: 100%; }\n.hb-col-sm-pull-0 { right: 0; }\n.hb-col-sm-pull-1 { right: 4.16666667%; }\n.hb-col-sm-pull-2 { right: 8.33333333%; }\n.hb-col-sm-pull-3 { right: 12.5%; }\n.hb-col-sm-pull-4 { right: 16.66666667%; }\n.hb-col-sm-pull-5 { right: 20.83333333%; }\n.hb-col-sm-pull-6 { right: 25%; }\n.hb-col-sm-pull-7 { right: 29.16666667%; }\n.hb-col-sm-pull-8 { right: 33.33333333%; }\n.hb-col-sm-pull-9 { right: 37.5%; }\n.hb-col-sm-pull-10 { right: 41.66666667%; }\n.hb-col-sm-pull-11 { right: 45.83333333%; }\n.hb-col-sm-pull-12 { right: 50%; }\n.hb-col-sm-pull-13 { right: 54.16666667%; }\n.hb-col-sm-pull-14 { right: 58.33333333%; }\n.hb-col-sm-pull-15 { right: 62.5%; }\n.hb-col-sm-pull-16 { right: 66.66666667%; }\n.hb-col-sm-pull-17 { right: 70.83333333%; }\n.hb-col-sm-pull-18 { right: 75%; }\n.hb-col-sm-pull-19 { right: 79.16666667%; }\n.hb-col-sm-pull-20 { right: 83.33333333%; }\n.hb-col-sm-pull-21 { right: 87.5%; }\n.hb-col-sm-pull-22 { right: 91.66666667%; }\n.hb-col-sm-pull-23 { right: 95.83333333%; }\n.hb-col-sm-pull-24 { right: 100%; }\n}\n\n@media (min-width: 768px) {\n\n.hb-col-md-0 { display: none; }\n.hb-col-md-1 { width: 4.16666667%; }\n.hb-col-md-2 { width: 8.33333333%; }\n.hb-col-md-3 { width: 12.5%; }\n.hb-col-md-4 { width: 16.66666667%; }\n.hb-col-md-5 { width: 20.83333333%; }\n.hb-col-md-6 { width: 25%; }\n.hb-col-md-7 { width: 29.16666667%; }\n.hb-col-md-8 { width: 33.33333333%; }\n.hb-col-md-9 { width: 37.5%; }\n.hb-col-md-10 { width: 41.66666667%; }\n.hb-col-md-11 { width: 45.83333333%; }\n.hb-col-md-12 { width: 50%; }\n.hb-col-md-13 { width: 54.16666667%; }\n.hb-col-md-14 { width: 58.33333333%; }\n.hb-col-md-15 { width: 62.5%; }\n.hb-col-md-16 { width: 66.66666667%; }\n.hb-col-md-17 { width: 70.83333333%; }\n.hb-col-md-18 { width: 75%; }\n.hb-col-md-19 { width: 79.16666667%; }\n.hb-col-md-20 { width: 83.33333333%; }\n.hb-col-md-21 { width: 87.5%; }\n.hb-col-md-22 { width: 91.66666667%; }\n.hb-col-md-23 { width: 95.83333333%; }\n.hb-col-md-24 { width: 100%; }\n.hb-col-md-offset-0 { margin-left: 0; }\n.hb-col-md-offset-1 { margin-left: 4.16666667%; }\n.hb-col-md-offset-2 { margin-left: 8.33333333%; }\n.hb-col-md-offset-3 { margin-left: 12.5%; }\n.hb-col-md-offset-4 { margin-left: 16.66666667%; }\n.hb-col-md-offset-5 { margin-left: 20.83333333%; }\n.hb-col-md-offset-6 { margin-left: 25%; }\n.hb-col-md-offset-7 { margin-left: 29.16666667%; }\n.hb-col-md-offset-8 { margin-left: 33.33333333%; }\n.hb-col-md-offset-9 { margin-left: 37.5%; }\n.hb-col-md-offset-10 { margin-left: 41.66666667%; }\n.hb-col-md-offset-11 { margin-left: 45.83333333%; }\n.hb-col-md-offset-12 { margin-left: 50%; }\n.hb-col-md-offset-13 { margin-left: 54.16666667%; }\n.hb-col-md-offset-14 { margin-left: 58.33333333%; }\n.hb-col-md-offset-15 { margin-left: 62.5%; }\n.hb-col-md-offset-16 { margin-left: 66.66666667%; }\n.hb-col-md-offset-17 { margin-left: 70.83333333%; }\n.hb-col-md-offset-18 { margin-left: 75%; }\n.hb-col-md-offset-19 { margin-left: 79.16666667%; }\n.hb-col-md-offset-20 { margin-left: 83.33333333%; }\n.hb-col-md-offset-21 { margin-left: 87.5%; }\n.hb-col-md-offset-22 { margin-left: 91.66666667%; }\n.hb-col-md-offset-23 { margin-left: 95.83333333%; }\n.hb-col-md-offset-24 { margin-left: 100%; }\n.hb-col-md-push-0 { left: 0; }\n.hb-col-md-push-1 { left: 4.16666667%; }\n.hb-col-md-push-2 { left: 8.33333333%; }\n.hb-col-md-push-3 { left: 12.5%; }\n.hb-col-md-push-4 { left: 16.66666667%; }\n.hb-col-md-push-5 { left: 20.83333333%; }\n.hb-col-md-push-6 { left: 25%; }\n.hb-col-md-push-7 { left: 29.16666667%; }\n.hb-col-md-push-8 { left: 33.33333333%; }\n.hb-col-md-push-9 { left: 37.5%; }\n.hb-col-md-push-10 { left: 41.66666667%; }\n.hb-col-md-push-11 { left: 45.83333333%; }\n.hb-col-md-push-12 { left: 50%; }\n.hb-col-md-push-13 { left: 54.16666667%; }\n.hb-col-md-push-14 { left: 58.33333333%; }\n.hb-col-md-push-15 { left: 62.5%; }\n.hb-col-md-push-16 { left: 66.66666667%; }\n.hb-col-md-push-17 { left: 70.83333333%; }\n.hb-col-md-push-18 { left: 75%; }\n.hb-col-md-push-19 { left: 79.16666667%; }\n.hb-col-md-push-20 { left: 83.33333333%; }\n.hb-col-md-push-21 { left: 87.5%; }\n.hb-col-md-push-22 { left: 91.66666667%; }\n.hb-col-md-push-23 { left: 95.83333333%; }\n.hb-col-md-push-24 { left: 100%; }\n.hb-col-md-pull-0 { right: 0; }\n.hb-col-md-pull-1 { right: 4.16666667%; }\n.hb-col-md-pull-2 { right: 8.33333333%; }\n.hb-col-md-pull-3 { right: 12.5%; }\n.hb-col-md-pull-4 { right: 16.66666667%; }\n.hb-col-md-pull-5 { right: 20.83333333%; }\n.hb-col-md-pull-6 { right: 25%; }\n.hb-col-md-pull-7 { right: 29.16666667%; }\n.hb-col-md-pull-8 { right: 33.33333333%; }\n.hb-col-md-pull-9 { right: 37.5%; }\n.hb-col-md-pull-10 { right: 41.66666667%; }\n.hb-col-md-pull-11 { right: 45.83333333%; }\n.hb-col-md-pull-12 { right: 50%; }\n.hb-col-md-pull-13 { right: 54.16666667%; }\n.hb-col-md-pull-14 { right: 58.33333333%; }\n.hb-col-md-pull-15 { right: 62.5%; }\n.hb-col-md-pull-16 { right: 66.66666667%; }\n.hb-col-md-pull-17 { right: 70.83333333%; }\n.hb-col-md-pull-18 { right: 75%; }\n.hb-col-md-pull-19 { right: 79.16666667%; }\n.hb-col-md-pull-20 { right: 83.33333333%; }\n.hb-col-md-pull-21 { right: 87.5%; }\n.hb-col-md-pull-22 { right: 91.66666667%; }\n.hb-col-md-pull-23 { right: 95.83333333%; }\n.hb-col-md-pull-24 { right: 100%; }\n}\n\n@media (min-width: 992px) {\n\n.hb-col-lg-0 { display: none; }\n.hb-col-lg-1 { width: 4.16666667%; }\n.hb-col-lg-2 { width: 8.33333333%; }\n.hb-col-lg-3 { width: 12.5%; }\n.hb-col-lg-4 { width: 16.66666667%; }\n.hb-col-lg-5 { width: 20.83333333%; }\n.hb-col-lg-6 { width: 25%; }\n.hb-col-lg-7 { width: 29.16666667%; }\n.hb-col-lg-8 { width: 33.33333333%; }\n.hb-col-lg-9 { width: 37.5%; }\n.hb-col-lg-10 { width: 41.66666667%; }\n.hb-col-lg-11 { width: 45.83333333%; }\n.hb-col-lg-12 { width: 50%; }\n.hb-col-lg-13 { width: 54.16666667%; }\n.hb-col-lg-14 { width: 58.33333333%; }\n.hb-col-lg-15 { width: 62.5%; }\n.hb-col-lg-16 { width: 66.66666667%; }\n.hb-col-lg-17 { width: 70.83333333%; }\n.hb-col-lg-18 { width: 75%; }\n.hb-col-lg-19 { width: 79.16666667%; }\n.hb-col-lg-20 { width: 83.33333333%; }\n.hb-col-lg-21 { width: 87.5%; }\n.hb-col-lg-22 { width: 91.66666667%; }\n.hb-col-lg-23 { width: 95.83333333%; }\n.hb-col-lg-24 { width: 100%; }\n.hb-col-lg-offset-0 { margin-left: 0; }\n.hb-col-lg-offset-1 { margin-left: 4.16666667%; }\n.hb-col-lg-offset-2 { margin-left: 8.33333333%; }\n.hb-col-lg-offset-3 { margin-left: 12.5%; }\n.hb-col-lg-offset-4 { margin-left: 16.66666667%; }\n.hb-col-lg-offset-5 { margin-left: 20.83333333%; }\n.hb-col-lg-offset-6 { margin-left: 25%; }\n.hb-col-lg-offset-7 { margin-left: 29.16666667%; }\n.hb-col-lg-offset-8 { margin-left: 33.33333333%; }\n.hb-col-lg-offset-9 { margin-left: 37.5%; }\n.hb-col-lg-offset-10 { margin-left: 41.66666667%; }\n.hb-col-lg-offset-11 { margin-left: 45.83333333%; }\n.hb-col-lg-offset-12 { margin-left: 50%; }\n.hb-col-lg-offset-13 { margin-left: 54.16666667%; }\n.hb-col-lg-offset-14 { margin-left: 58.33333333%; }\n.hb-col-lg-offset-15 { margin-left: 62.5%; }\n.hb-col-lg-offset-16 { margin-left: 66.66666667%; }\n.hb-col-lg-offset-17 { margin-left: 70.83333333%; }\n.hb-col-lg-offset-18 { margin-left: 75%; }\n.hb-col-lg-offset-19 { margin-left: 79.16666667%; }\n.hb-col-lg-offset-20 { margin-left: 83.33333333%; }\n.hb-col-lg-offset-21 { margin-left: 87.5%; }\n.hb-col-lg-offset-22 { margin-left: 91.66666667%; }\n.hb-col-lg-offset-23 { margin-left: 95.83333333%; }\n.hb-col-lg-offset-24 { margin-left: 100%; }\n.hb-col-lg-push-0 { left: 0; }\n.hb-col-lg-push-1 { left: 4.16666667%; }\n.hb-col-lg-push-2 { left: 8.33333333%; }\n.hb-col-lg-push-3 { left: 12.5%; }\n.hb-col-lg-push-4 { left: 16.66666667%; }\n.hb-col-lg-push-5 { left: 20.83333333%; }\n.hb-col-lg-push-6 { left: 25%; }\n.hb-col-lg-push-7 { left: 29.16666667%; }\n.hb-col-lg-push-8 { left: 33.33333333%; }\n.hb-col-lg-push-9 { left: 37.5%; }\n.hb-col-lg-push-10 { left: 41.66666667%; }\n.hb-col-lg-push-11 { left: 45.83333333%; }\n.hb-col-lg-push-12 { left: 50%; }\n.hb-col-lg-push-13 { left: 54.16666667%; }\n.hb-col-lg-push-14 { left: 58.33333333%; }\n.hb-col-lg-push-15 { left: 62.5%; }\n.hb-col-lg-push-16 { left: 66.66666667%; }\n.hb-col-lg-push-17 { left: 70.83333333%; }\n.hb-col-lg-push-18 { left: 75%; }\n.hb-col-lg-push-19 { left: 79.16666667%; }\n.hb-col-lg-push-20 { left: 83.33333333%; }\n.hb-col-lg-push-21 { left: 87.5%; }\n.hb-col-lg-push-22 { left: 91.66666667%; }\n.hb-col-lg-push-23 { left: 95.83333333%; }\n.hb-col-lg-push-24 { left: 100%; }\n.hb-col-lg-pull-0 { right: 0; }\n.hb-col-lg-pull-1 { right: 4.16666667%; }\n.hb-col-lg-pull-2 { right: 8.33333333%; }\n.hb-col-lg-pull-3 { right: 12.5%; }\n.hb-col-lg-pull-4 { right: 16.66666667%; }\n.hb-col-lg-pull-5 { right: 20.83333333%; }\n.hb-col-lg-pull-6 { right: 25%; }\n.hb-col-lg-pull-7 { right: 29.16666667%; }\n.hb-col-lg-pull-8 { right: 33.33333333%; }\n.hb-col-lg-pull-9 { right: 37.5%; }\n.hb-col-lg-pull-10 { right: 41.66666667%; }\n.hb-col-lg-pull-11 { right: 45.83333333%; }\n.hb-col-lg-pull-12 { right: 50%; }\n.hb-col-lg-pull-13 { right: 54.16666667%; }\n.hb-col-lg-pull-14 { right: 58.33333333%; }\n.hb-col-lg-pull-15 { right: 62.5%; }\n.hb-col-lg-pull-16 { right: 66.66666667%; }\n.hb-col-lg-pull-17 { right: 70.83333333%; }\n.hb-col-lg-pull-18 { right: 75%; }\n.hb-col-lg-pull-19 { right: 79.16666667%; }\n.hb-col-lg-pull-20 { right: 83.33333333%; }\n.hb-col-lg-pull-21 { right: 87.5%; }\n.hb-col-lg-pull-22 { right: 91.66666667%; }\n.hb-col-lg-pull-23 { right: 95.83333333%; }\n.hb-col-lg-pull-24 { right: 100%; }\n}\n\n@media (min-width: 1200px) {\n\n.hb-col-xl-0 { display: none; }\n.hb-col-xl-1 { width: 4.16666667%; }\n.hb-col-xl-2 { width: 8.33333333%; }\n.hb-col-xl-3 { width: 12.5%; }\n.hb-col-xl-4 { width: 16.66666667%; }\n.hb-col-xl-5 { width: 20.83333333%; }\n.hb-col-xl-6 { width: 25%; }\n.hb-col-xl-7 { width: 29.16666667%; }\n.hb-col-xl-8 { width: 33.33333333%; }\n.hb-col-xl-9 { width: 37.5%; }\n.hb-col-xl-10 { width: 41.66666667%; }\n.hb-col-xl-11 { width: 45.83333333%; }\n.hb-col-xl-12 { width: 50%; }\n.hb-col-xl-13 { width: 54.16666667%; }\n.hb-col-xl-14 { width: 58.33333333%; }\n.hb-col-xl-15 { width: 62.5%; }\n.hb-col-xl-16 { width: 66.66666667%; }\n.hb-col-xl-17 { width: 70.83333333%; }\n.hb-col-xl-18 { width: 75%; }\n.hb-col-xl-19 { width: 79.16666667%; }\n.hb-col-xl-20 { width: 83.33333333%; }\n.hb-col-xl-21 { width: 87.5%; }\n.hb-col-xl-22 { width: 91.66666667%; }\n.hb-col-xl-23 { width: 95.83333333%; }\n.hb-col-xl-24 { width: 100%; }\n.hb-col-xl-offset-0 { margin-left: 0; }\n.hb-col-xl-offset-1 { margin-left: 4.16666667%; }\n.hb-col-xl-offset-2 { margin-left: 8.33333333%; }\n.hb-col-xl-offset-3 { margin-left: 12.5%; }\n.hb-col-xl-offset-4 { margin-left: 16.66666667%; }\n.hb-col-xl-offset-5 { margin-left: 20.83333333%; }\n.hb-col-xl-offset-6 { margin-left: 25%; }\n.hb-col-xl-offset-7 { margin-left: 29.16666667%; }\n.hb-col-xl-offset-8 { margin-left: 33.33333333%; }\n.hb-col-xl-offset-9 { margin-left: 37.5%; }\n.hb-col-xl-offset-10 { margin-left: 41.66666667%; }\n.hb-col-xl-offset-11 { margin-left: 45.83333333%; }\n.hb-col-xl-offset-12 { margin-left: 50%; }\n.hb-col-xl-offset-13 { margin-left: 54.16666667%; }\n.hb-col-xl-offset-14 { margin-left: 58.33333333%; }\n.hb-col-xl-offset-15 { margin-left: 62.5%; }\n.hb-col-xl-offset-16 { margin-left: 66.66666667%; }\n.hb-col-xl-offset-17 { margin-left: 70.83333333%; }\n.hb-col-xl-offset-18 { margin-left: 75%; }\n.hb-col-xl-offset-19 { margin-left: 79.16666667%; }\n.hb-col-xl-offset-20 { margin-left: 83.33333333%; }\n.hb-col-xl-offset-21 { margin-left: 87.5%; }\n.hb-col-xl-offset-22 { margin-left: 91.66666667%; }\n.hb-col-xl-offset-23 { margin-left: 95.83333333%; }\n.hb-col-xl-offset-24 { margin-left: 100%; }\n.hb-col-xl-push-0 { left: 0; }\n.hb-col-xl-push-1 { left: 4.16666667%; }\n.hb-col-xl-push-2 { left: 8.33333333%; }\n.hb-col-xl-push-3 { left: 12.5%; }\n.hb-col-xl-push-4 { left: 16.66666667%; }\n.hb-col-xl-push-5 { left: 20.83333333%; }\n.hb-col-xl-push-6 { left: 25%; }\n.hb-col-xl-push-7 { left: 29.16666667%; }\n.hb-col-xl-push-8 { left: 33.33333333%; }\n.hb-col-xl-push-9 { left: 37.5%; }\n.hb-col-xl-push-10 { left: 41.66666667%; }\n.hb-col-xl-push-11 { left: 45.83333333%; }\n.hb-col-xl-push-12 { left: 50%; }\n.hb-col-xl-push-13 { left: 54.16666667%; }\n.hb-col-xl-push-14 { left: 58.33333333%; }\n.hb-col-xl-push-15 { left: 62.5%; }\n.hb-col-xl-push-16 { left: 66.66666667%; }\n.hb-col-xl-push-17 { left: 70.83333333%; }\n.hb-col-xl-push-18 { left: 75%; }\n.hb-col-xl-push-19 { left: 79.16666667%; }\n.hb-col-xl-push-20 { left: 83.33333333%; }\n.hb-col-xl-push-21 { left: 87.5%; }\n.hb-col-xl-push-22 { left: 91.66666667%; }\n.hb-col-xl-push-23 { left: 95.83333333%; }\n.hb-col-xl-push-24 { left: 100%; }\n.hb-col-xl-pull-0 { right: 0; }\n.hb-col-xl-pull-1 { right: 4.16666667%; }\n.hb-col-xl-pull-2 { right: 8.33333333%; }\n.hb-col-xl-pull-3 { right: 12.5%; }\n.hb-col-xl-pull-4 { right: 16.66666667%; }\n.hb-col-xl-pull-5 { right: 20.83333333%; }\n.hb-col-xl-pull-6 { right: 25%; }\n.hb-col-xl-pull-7 { right: 29.16666667%; }\n.hb-col-xl-pull-8 { right: 33.33333333%; }\n.hb-col-xl-pull-9 { right: 37.5%; }\n.hb-col-xl-pull-10 { right: 41.66666667%; }\n.hb-col-xl-pull-11 { right: 45.83333333%; }\n.hb-col-xl-pull-12 { right: 50%; }\n.hb-col-xl-pull-13 { right: 54.16666667%; }\n.hb-col-xl-pull-14 { right: 58.33333333%; }\n.hb-col-xl-pull-15 { right: 62.5%; }\n.hb-col-xl-pull-16 { right: 66.66666667%; }\n.hb-col-xl-pull-17 { right: 70.83333333%; }\n.hb-col-xl-pull-18 { right: 75%; }\n.hb-col-xl-pull-19 { right: 79.16666667%; }\n.hb-col-xl-pull-20 { right: 83.33333333%; }\n.hb-col-xl-pull-21 { right: 87.5%; }\n.hb-col-xl-pull-22 { right: 91.66666667%; }\n.hb-col-xl-pull-23 { right: 95.83333333%; }\n.hb-col-xl-pull-24 { right: 100%; }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/** 响应式栅格配置（对齐 antd：可传 number 或 {span,offset,push,pull}） */\nexport interface ColResponsive {\n  span?: number;\n  offset?: number;\n  push?: number;\n  pull?: number;\n}\n\n/**\n * Layout 布局组件\n * 通过基础的 24 分栏，迅速简便地创建布局。\n * 支持响应式：xs/sm/md/lg/xl 在对应断点应用各自的 span/offset/push/pull。\n */\n@Component({\n  tag: 'hb-layout',\n  styleUrl: 'layout.css',\n  shadow: true,\n})\nexport class Layout {\n  /**\n   * 栅格占据的列数\n   * @default 24\n   */\n  @Prop() span: number = 24;\n\n  /**\n   * 栅格左侧的间隔格数\n   * @default 0\n   */\n  @Prop() offset: number = 0;\n\n  /**\n   * 栅格向右移动格数\n   * @default 0\n   */\n  @Prop() push: number = 0;\n\n  /**\n   * 栅格向左移动格数\n   * @default 0\n   */\n  @Prop() pull: number = 0;\n\n  /**\n   * <576px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() xs?: number | ColResponsive;\n\n  /**\n   * ≥576px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() sm?: number | ColResponsive;\n\n  /**\n   * ≥768px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() md?: number | ColResponsive;\n\n  /**\n   * ≥992px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() lg?: number | ColResponsive;\n\n  /**\n   * ≥1200px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() xl?: number | ColResponsive;\n\n  /** 把响应式 prop（number 或对象）规范化为 {span,offset,push,pull} */\n  private normalizeResponsive(value: number | ColResponsive | undefined): ColResponsive {\n    if (value === undefined || value === null) return {};\n    if (typeof value === 'number') return { span: value };\n    return value;\n  }\n\n  private getColClass() {\n    const classes: string[] = ['hb-col'];\n\n    // 基础（无断点）span/offset/push/pull —— 仅在没有 xs 时作为 xs 默认（antd 行为）\n    if (this.span) classes.push(`hb-col-${this.span}`);\n    if (this.offset) classes.push(`hb-col-offset-${this.offset}`);\n    if (this.push) classes.push(`hb-col-push-${this.push}`);\n    if (this.pull) classes.push(`hb-col-pull-${this.pull}`);\n\n    // 响应式断点：生成 hb-col-{bp}-{span} / hb-col-{bp}-offset-{n} 等 class，\n    // CSS 用 @media 在对应断点应用（覆盖基础值）。\n    const bps: Array<'xs' | 'sm' | 'md' | 'lg' | 'xl'> = ['xs', 'sm', 'md', 'lg', 'xl'];\n    for (const bp of bps) {\n      const v = this[bp];\n      if (v === undefined) continue;\n      const r = this.normalizeResponsive(v);\n      if (r.span !== undefined) classes.push(`hb-col-${bp}-${r.span}`);\n      if (r.offset !== undefined) classes.push(`hb-col-${bp}-offset-${r.offset}`);\n      if (r.push !== undefined) classes.push(`hb-col-${bp}-push-${r.push}`);\n      if (r.pull !== undefined) classes.push(`hb-col-${bp}-pull-${r.pull}`);\n    }\n\n    return classes.join(' ');\n  }\n\n  render() {\n    return (\n      <div class={this.getColClass()}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n\n"],"version":3}
+{"file":"hb-layout.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,k0vBAAk0vB,CAAC;AACr1vB,uBAAe,SAAS;;MCmBX,MAAM;;;;;;;;IAKT,IAAI,GAAW,EAAE,CAAC;;;;;IAMlB,MAAM,GAAW,CAAC,CAAC;;;;;IAMnB,IAAI,GAAW,CAAC,CAAC;;;;;IAMjB,IAAI,GAAW,CAAC,CAAC;;;;IAKjB,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;;;IAK5B,EAAE,CAA0B;;IAG5B,mBAAmB,CAAC,KAAyC;QACnE,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,EAAE,CAAC;QACrD,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;QACtD,OAAO,KAAK,CAAC;KACd;IAEO,WAAW;QACjB,MAAM,OAAO,GAAa,CAAC,QAAQ,CAAC,CAAC;;QAGrC,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QACnD,IAAI,IAAI,CAAC,MAAM;YAAE,OAAO,CAAC,IAAI,CAAC,iBAAiB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC9D,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QACxD,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;;;QAIxD,MAAM,GAAG,GAA4C,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;QACpF,KAAK,MAAM,EAAE,IAAI,GAAG,EAAE;YACpB,MAAM,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;YACnB,IAAI,CAAC,KAAK,SAAS;gBAAE,SAAS;YAC9B,MAAM,CAAC,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC;YACtC,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;YACjE,IAAI,CAAC,CAAC,MAAM,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;YAC5E,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;YACtE,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;SACvE;QAED,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC1B;IAED,MAAM;QACJ,QACEA,kEAAK,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,IAC5BA,oEAAa,CACT,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/Layout/layout.css?tag=hb-layout&encapsulation=shadow","src/components/Layout/Layout.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hb-col {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Generate col classes for span 1-24 */\n.hb-col-1 {\n  width: 4.16666667%;\n}\n.hb-col-2 {\n  width: 8.33333333%;\n}\n.hb-col-3 {\n  width: 12.5%;\n}\n.hb-col-4 {\n  width: 16.66666667%;\n}\n.hb-col-5 {\n  width: 20.83333333%;\n}\n.hb-col-6 {\n  width: 25%;\n}\n.hb-col-7 {\n  width: 29.16666667%;\n}\n.hb-col-8 {\n  width: 33.33333333%;\n}\n.hb-col-9 {\n  width: 37.5%;\n}\n.hb-col-10 {\n  width: 41.66666667%;\n}\n.hb-col-11 {\n  width: 45.83333333%;\n}\n.hb-col-12 {\n  width: 50%;\n}\n.hb-col-13 {\n  width: 54.16666667%;\n}\n.hb-col-14 {\n  width: 58.33333333%;\n}\n.hb-col-15 {\n  width: 62.5%;\n}\n.hb-col-16 {\n  width: 66.66666667%;\n}\n.hb-col-17 {\n  width: 70.83333333%;\n}\n.hb-col-18 {\n  width: 75%;\n}\n.hb-col-19 {\n  width: 79.16666667%;\n}\n.hb-col-20 {\n  width: 83.33333333%;\n}\n.hb-col-21 {\n  width: 87.5%;\n}\n.hb-col-22 {\n  width: 91.66666667%;\n}\n.hb-col-23 {\n  width: 95.83333333%;\n}\n.hb-col-24 {\n  width: 100%;\n}\n\n/* Offset classes */\n.hb-col-offset-1 {\n  margin-left: 4.16666667%;\n}\n.hb-col-offset-2 {\n  margin-left: 8.33333333%;\n}\n.hb-col-offset-3 {\n  margin-left: 12.5%;\n}\n.hb-col-offset-4 {\n  margin-left: 16.66666667%;\n}\n.hb-col-offset-5 {\n  margin-left: 20.83333333%;\n}\n.hb-col-offset-6 {\n  margin-left: 25%;\n}\n.hb-col-offset-7 {\n  margin-left: 29.16666667%;\n}\n.hb-col-offset-8 {\n  margin-left: 33.33333333%;\n}\n.hb-col-offset-9 {\n  margin-left: 37.5%;\n}\n.hb-col-offset-10 {\n  margin-left: 41.66666667%;\n}\n.hb-col-offset-11 {\n  margin-left: 45.83333333%;\n}\n.hb-col-offset-12 {\n  margin-left: 50%;\n}\n.hb-col-offset-13 {\n  margin-left: 54.16666667%;\n}\n.hb-col-offset-14 {\n  margin-left: 58.33333333%;\n}\n.hb-col-offset-15 {\n  margin-left: 62.5%;\n}\n.hb-col-offset-16 {\n  margin-left: 66.66666667%;\n}\n.hb-col-offset-17 {\n  margin-left: 70.83333333%;\n}\n.hb-col-offset-18 {\n  margin-left: 75%;\n}\n.hb-col-offset-19 {\n  margin-left: 79.16666667%;\n}\n.hb-col-offset-20 {\n  margin-left: 83.33333333%;\n}\n.hb-col-offset-21 {\n  margin-left: 87.5%;\n}\n.hb-col-offset-22 {\n  margin-left: 91.66666667%;\n}\n.hb-col-offset-23 {\n  margin-left: 95.83333333%;\n}\n\n/* Push classes */\n.hb-col-push-1 {\n  left: 4.16666667%;\n}\n.hb-col-push-2 {\n  left: 8.33333333%;\n}\n.hb-col-push-3 {\n  left: 12.5%;\n}\n.hb-col-push-4 {\n  left: 16.66666667%;\n}\n.hb-col-push-5 {\n  left: 20.83333333%;\n}\n.hb-col-push-6 {\n  left: 25%;\n}\n.hb-col-push-7 {\n  left: 29.16666667%;\n}\n.hb-col-push-8 {\n  left: 33.33333333%;\n}\n.hb-col-push-9 {\n  left: 37.5%;\n}\n.hb-col-push-10 {\n  left: 41.66666667%;\n}\n.hb-col-push-11 {\n  left: 45.83333333%;\n}\n.hb-col-push-12 {\n  left: 50%;\n}\n\n/* Pull classes */\n.hb-col-pull-1 {\n  right: 4.16666667%;\n}\n.hb-col-pull-2 {\n  right: 8.33333333%;\n}\n.hb-col-pull-3 {\n  right: 12.5%;\n}\n.hb-col-pull-4 {\n  right: 16.66666667%;\n}\n.hb-col-pull-5 {\n  right: 20.83333333%;\n}\n.hb-col-pull-6 {\n  right: 25%;\n}\n.hb-col-pull-7 {\n  right: 29.16666667%;\n}\n.hb-col-pull-8 {\n  right: 33.33333333%;\n}\n.hb-col-pull-9 {\n  right: 37.5%;\n}\n.hb-col-pull-10 {\n  right: 41.66666667%;\n}\n.hb-col-pull-11 {\n  right: 45.83333333%;\n}\n.hb-col-pull-12 {\n  right: 50%;\n}\n\n/* ============================================================\n * 响应式栅格（xs/sm/md/lg/xl）—— 由 Layout.tsx 输出对应 class，\n * 这里按断点用 @media 应用宽度/偏移/推拉。\n * xs 无 @media（移动端默认）；sm/md/lg/xl 用 min-width 渐进增强。\n * 对齐 antd Grid 断点：576 / 768 / 992 / 1200\n * ============================================================ */\n\n.hb-col-xs-0 {\n  display: none;\n}\n.hb-col-xs-1 {\n  width: 4.16666667%;\n}\n.hb-col-xs-2 {\n  width: 8.33333333%;\n}\n.hb-col-xs-3 {\n  width: 12.5%;\n}\n.hb-col-xs-4 {\n  width: 16.66666667%;\n}\n.hb-col-xs-5 {\n  width: 20.83333333%;\n}\n.hb-col-xs-6 {\n  width: 25%;\n}\n.hb-col-xs-7 {\n  width: 29.16666667%;\n}\n.hb-col-xs-8 {\n  width: 33.33333333%;\n}\n.hb-col-xs-9 {\n  width: 37.5%;\n}\n.hb-col-xs-10 {\n  width: 41.66666667%;\n}\n.hb-col-xs-11 {\n  width: 45.83333333%;\n}\n.hb-col-xs-12 {\n  width: 50%;\n}\n.hb-col-xs-13 {\n  width: 54.16666667%;\n}\n.hb-col-xs-14 {\n  width: 58.33333333%;\n}\n.hb-col-xs-15 {\n  width: 62.5%;\n}\n.hb-col-xs-16 {\n  width: 66.66666667%;\n}\n.hb-col-xs-17 {\n  width: 70.83333333%;\n}\n.hb-col-xs-18 {\n  width: 75%;\n}\n.hb-col-xs-19 {\n  width: 79.16666667%;\n}\n.hb-col-xs-20 {\n  width: 83.33333333%;\n}\n.hb-col-xs-21 {\n  width: 87.5%;\n}\n.hb-col-xs-22 {\n  width: 91.66666667%;\n}\n.hb-col-xs-23 {\n  width: 95.83333333%;\n}\n.hb-col-xs-24 {\n  width: 100%;\n}\n.hb-col-xs-offset-0 {\n  margin-left: 0;\n}\n.hb-col-xs-offset-1 {\n  margin-left: 4.16666667%;\n}\n.hb-col-xs-offset-2 {\n  margin-left: 8.33333333%;\n}\n.hb-col-xs-offset-3 {\n  margin-left: 12.5%;\n}\n.hb-col-xs-offset-4 {\n  margin-left: 16.66666667%;\n}\n.hb-col-xs-offset-5 {\n  margin-left: 20.83333333%;\n}\n.hb-col-xs-offset-6 {\n  margin-left: 25%;\n}\n.hb-col-xs-offset-7 {\n  margin-left: 29.16666667%;\n}\n.hb-col-xs-offset-8 {\n  margin-left: 33.33333333%;\n}\n.hb-col-xs-offset-9 {\n  margin-left: 37.5%;\n}\n.hb-col-xs-offset-10 {\n  margin-left: 41.66666667%;\n}\n.hb-col-xs-offset-11 {\n  margin-left: 45.83333333%;\n}\n.hb-col-xs-offset-12 {\n  margin-left: 50%;\n}\n.hb-col-xs-offset-13 {\n  margin-left: 54.16666667%;\n}\n.hb-col-xs-offset-14 {\n  margin-left: 58.33333333%;\n}\n.hb-col-xs-offset-15 {\n  margin-left: 62.5%;\n}\n.hb-col-xs-offset-16 {\n  margin-left: 66.66666667%;\n}\n.hb-col-xs-offset-17 {\n  margin-left: 70.83333333%;\n}\n.hb-col-xs-offset-18 {\n  margin-left: 75%;\n}\n.hb-col-xs-offset-19 {\n  margin-left: 79.16666667%;\n}\n.hb-col-xs-offset-20 {\n  margin-left: 83.33333333%;\n}\n.hb-col-xs-offset-21 {\n  margin-left: 87.5%;\n}\n.hb-col-xs-offset-22 {\n  margin-left: 91.66666667%;\n}\n.hb-col-xs-offset-23 {\n  margin-left: 95.83333333%;\n}\n.hb-col-xs-offset-24 {\n  margin-left: 100%;\n}\n.hb-col-xs-push-0 {\n  left: 0;\n}\n.hb-col-xs-push-1 {\n  left: 4.16666667%;\n}\n.hb-col-xs-push-2 {\n  left: 8.33333333%;\n}\n.hb-col-xs-push-3 {\n  left: 12.5%;\n}\n.hb-col-xs-push-4 {\n  left: 16.66666667%;\n}\n.hb-col-xs-push-5 {\n  left: 20.83333333%;\n}\n.hb-col-xs-push-6 {\n  left: 25%;\n}\n.hb-col-xs-push-7 {\n  left: 29.16666667%;\n}\n.hb-col-xs-push-8 {\n  left: 33.33333333%;\n}\n.hb-col-xs-push-9 {\n  left: 37.5%;\n}\n.hb-col-xs-push-10 {\n  left: 41.66666667%;\n}\n.hb-col-xs-push-11 {\n  left: 45.83333333%;\n}\n.hb-col-xs-push-12 {\n  left: 50%;\n}\n.hb-col-xs-push-13 {\n  left: 54.16666667%;\n}\n.hb-col-xs-push-14 {\n  left: 58.33333333%;\n}\n.hb-col-xs-push-15 {\n  left: 62.5%;\n}\n.hb-col-xs-push-16 {\n  left: 66.66666667%;\n}\n.hb-col-xs-push-17 {\n  left: 70.83333333%;\n}\n.hb-col-xs-push-18 {\n  left: 75%;\n}\n.hb-col-xs-push-19 {\n  left: 79.16666667%;\n}\n.hb-col-xs-push-20 {\n  left: 83.33333333%;\n}\n.hb-col-xs-push-21 {\n  left: 87.5%;\n}\n.hb-col-xs-push-22 {\n  left: 91.66666667%;\n}\n.hb-col-xs-push-23 {\n  left: 95.83333333%;\n}\n.hb-col-xs-push-24 {\n  left: 100%;\n}\n.hb-col-xs-pull-0 {\n  right: 0;\n}\n.hb-col-xs-pull-1 {\n  right: 4.16666667%;\n}\n.hb-col-xs-pull-2 {\n  right: 8.33333333%;\n}\n.hb-col-xs-pull-3 {\n  right: 12.5%;\n}\n.hb-col-xs-pull-4 {\n  right: 16.66666667%;\n}\n.hb-col-xs-pull-5 {\n  right: 20.83333333%;\n}\n.hb-col-xs-pull-6 {\n  right: 25%;\n}\n.hb-col-xs-pull-7 {\n  right: 29.16666667%;\n}\n.hb-col-xs-pull-8 {\n  right: 33.33333333%;\n}\n.hb-col-xs-pull-9 {\n  right: 37.5%;\n}\n.hb-col-xs-pull-10 {\n  right: 41.66666667%;\n}\n.hb-col-xs-pull-11 {\n  right: 45.83333333%;\n}\n.hb-col-xs-pull-12 {\n  right: 50%;\n}\n.hb-col-xs-pull-13 {\n  right: 54.16666667%;\n}\n.hb-col-xs-pull-14 {\n  right: 58.33333333%;\n}\n.hb-col-xs-pull-15 {\n  right: 62.5%;\n}\n.hb-col-xs-pull-16 {\n  right: 66.66666667%;\n}\n.hb-col-xs-pull-17 {\n  right: 70.83333333%;\n}\n.hb-col-xs-pull-18 {\n  right: 75%;\n}\n.hb-col-xs-pull-19 {\n  right: 79.16666667%;\n}\n.hb-col-xs-pull-20 {\n  right: 83.33333333%;\n}\n.hb-col-xs-pull-21 {\n  right: 87.5%;\n}\n.hb-col-xs-pull-22 {\n  right: 91.66666667%;\n}\n.hb-col-xs-pull-23 {\n  right: 95.83333333%;\n}\n.hb-col-xs-pull-24 {\n  right: 100%;\n}\n\n@media (min-width: 576px) {\n  .hb-col-sm-0 {\n    display: none;\n  }\n  .hb-col-sm-1 {\n    width: 4.16666667%;\n  }\n  .hb-col-sm-2 {\n    width: 8.33333333%;\n  }\n  .hb-col-sm-3 {\n    width: 12.5%;\n  }\n  .hb-col-sm-4 {\n    width: 16.66666667%;\n  }\n  .hb-col-sm-5 {\n    width: 20.83333333%;\n  }\n  .hb-col-sm-6 {\n    width: 25%;\n  }\n  .hb-col-sm-7 {\n    width: 29.16666667%;\n  }\n  .hb-col-sm-8 {\n    width: 33.33333333%;\n  }\n  .hb-col-sm-9 {\n    width: 37.5%;\n  }\n  .hb-col-sm-10 {\n    width: 41.66666667%;\n  }\n  .hb-col-sm-11 {\n    width: 45.83333333%;\n  }\n  .hb-col-sm-12 {\n    width: 50%;\n  }\n  .hb-col-sm-13 {\n    width: 54.16666667%;\n  }\n  .hb-col-sm-14 {\n    width: 58.33333333%;\n  }\n  .hb-col-sm-15 {\n    width: 62.5%;\n  }\n  .hb-col-sm-16 {\n    width: 66.66666667%;\n  }\n  .hb-col-sm-17 {\n    width: 70.83333333%;\n  }\n  .hb-col-sm-18 {\n    width: 75%;\n  }\n  .hb-col-sm-19 {\n    width: 79.16666667%;\n  }\n  .hb-col-sm-20 {\n    width: 83.33333333%;\n  }\n  .hb-col-sm-21 {\n    width: 87.5%;\n  }\n  .hb-col-sm-22 {\n    width: 91.66666667%;\n  }\n  .hb-col-sm-23 {\n    width: 95.83333333%;\n  }\n  .hb-col-sm-24 {\n    width: 100%;\n  }\n  .hb-col-sm-offset-0 {\n    margin-left: 0;\n  }\n  .hb-col-sm-offset-1 {\n    margin-left: 4.16666667%;\n  }\n  .hb-col-sm-offset-2 {\n    margin-left: 8.33333333%;\n  }\n  .hb-col-sm-offset-3 {\n    margin-left: 12.5%;\n  }\n  .hb-col-sm-offset-4 {\n    margin-left: 16.66666667%;\n  }\n  .hb-col-sm-offset-5 {\n    margin-left: 20.83333333%;\n  }\n  .hb-col-sm-offset-6 {\n    margin-left: 25%;\n  }\n  .hb-col-sm-offset-7 {\n    margin-left: 29.16666667%;\n  }\n  .hb-col-sm-offset-8 {\n    margin-left: 33.33333333%;\n  }\n  .hb-col-sm-offset-9 {\n    margin-left: 37.5%;\n  }\n  .hb-col-sm-offset-10 {\n    margin-left: 41.66666667%;\n  }\n  .hb-col-sm-offset-11 {\n    margin-left: 45.83333333%;\n  }\n  .hb-col-sm-offset-12 {\n    margin-left: 50%;\n  }\n  .hb-col-sm-offset-13 {\n    margin-left: 54.16666667%;\n  }\n  .hb-col-sm-offset-14 {\n    margin-left: 58.33333333%;\n  }\n  .hb-col-sm-offset-15 {\n    margin-left: 62.5%;\n  }\n  .hb-col-sm-offset-16 {\n    margin-left: 66.66666667%;\n  }\n  .hb-col-sm-offset-17 {\n    margin-left: 70.83333333%;\n  }\n  .hb-col-sm-offset-18 {\n    margin-left: 75%;\n  }\n  .hb-col-sm-offset-19 {\n    margin-left: 79.16666667%;\n  }\n  .hb-col-sm-offset-20 {\n    margin-left: 83.33333333%;\n  }\n  .hb-col-sm-offset-21 {\n    margin-left: 87.5%;\n  }\n  .hb-col-sm-offset-22 {\n    margin-left: 91.66666667%;\n  }\n  .hb-col-sm-offset-23 {\n    margin-left: 95.83333333%;\n  }\n  .hb-col-sm-offset-24 {\n    margin-left: 100%;\n  }\n  .hb-col-sm-push-0 {\n    left: 0;\n  }\n  .hb-col-sm-push-1 {\n    left: 4.16666667%;\n  }\n  .hb-col-sm-push-2 {\n    left: 8.33333333%;\n  }\n  .hb-col-sm-push-3 {\n    left: 12.5%;\n  }\n  .hb-col-sm-push-4 {\n    left: 16.66666667%;\n  }\n  .hb-col-sm-push-5 {\n    left: 20.83333333%;\n  }\n  .hb-col-sm-push-6 {\n    left: 25%;\n  }\n  .hb-col-sm-push-7 {\n    left: 29.16666667%;\n  }\n  .hb-col-sm-push-8 {\n    left: 33.33333333%;\n  }\n  .hb-col-sm-push-9 {\n    left: 37.5%;\n  }\n  .hb-col-sm-push-10 {\n    left: 41.66666667%;\n  }\n  .hb-col-sm-push-11 {\n    left: 45.83333333%;\n  }\n  .hb-col-sm-push-12 {\n    left: 50%;\n  }\n  .hb-col-sm-push-13 {\n    left: 54.16666667%;\n  }\n  .hb-col-sm-push-14 {\n    left: 58.33333333%;\n  }\n  .hb-col-sm-push-15 {\n    left: 62.5%;\n  }\n  .hb-col-sm-push-16 {\n    left: 66.66666667%;\n  }\n  .hb-col-sm-push-17 {\n    left: 70.83333333%;\n  }\n  .hb-col-sm-push-18 {\n    left: 75%;\n  }\n  .hb-col-sm-push-19 {\n    left: 79.16666667%;\n  }\n  .hb-col-sm-push-20 {\n    left: 83.33333333%;\n  }\n  .hb-col-sm-push-21 {\n    left: 87.5%;\n  }\n  .hb-col-sm-push-22 {\n    left: 91.66666667%;\n  }\n  .hb-col-sm-push-23 {\n    left: 95.83333333%;\n  }\n  .hb-col-sm-push-24 {\n    left: 100%;\n  }\n  .hb-col-sm-pull-0 {\n    right: 0;\n  }\n  .hb-col-sm-pull-1 {\n    right: 4.16666667%;\n  }\n  .hb-col-sm-pull-2 {\n    right: 8.33333333%;\n  }\n  .hb-col-sm-pull-3 {\n    right: 12.5%;\n  }\n  .hb-col-sm-pull-4 {\n    right: 16.66666667%;\n  }\n  .hb-col-sm-pull-5 {\n    right: 20.83333333%;\n  }\n  .hb-col-sm-pull-6 {\n    right: 25%;\n  }\n  .hb-col-sm-pull-7 {\n    right: 29.16666667%;\n  }\n  .hb-col-sm-pull-8 {\n    right: 33.33333333%;\n  }\n  .hb-col-sm-pull-9 {\n    right: 37.5%;\n  }\n  .hb-col-sm-pull-10 {\n    right: 41.66666667%;\n  }\n  .hb-col-sm-pull-11 {\n    right: 45.83333333%;\n  }\n  .hb-col-sm-pull-12 {\n    right: 50%;\n  }\n  .hb-col-sm-pull-13 {\n    right: 54.16666667%;\n  }\n  .hb-col-sm-pull-14 {\n    right: 58.33333333%;\n  }\n  .hb-col-sm-pull-15 {\n    right: 62.5%;\n  }\n  .hb-col-sm-pull-16 {\n    right: 66.66666667%;\n  }\n  .hb-col-sm-pull-17 {\n    right: 70.83333333%;\n  }\n  .hb-col-sm-pull-18 {\n    right: 75%;\n  }\n  .hb-col-sm-pull-19 {\n    right: 79.16666667%;\n  }\n  .hb-col-sm-pull-20 {\n    right: 83.33333333%;\n  }\n  .hb-col-sm-pull-21 {\n    right: 87.5%;\n  }\n  .hb-col-sm-pull-22 {\n    right: 91.66666667%;\n  }\n  .hb-col-sm-pull-23 {\n    right: 95.83333333%;\n  }\n  .hb-col-sm-pull-24 {\n    right: 100%;\n  }\n}\n\n@media (min-width: 768px) {\n  .hb-col-md-0 {\n    display: none;\n  }\n  .hb-col-md-1 {\n    width: 4.16666667%;\n  }\n  .hb-col-md-2 {\n    width: 8.33333333%;\n  }\n  .hb-col-md-3 {\n    width: 12.5%;\n  }\n  .hb-col-md-4 {\n    width: 16.66666667%;\n  }\n  .hb-col-md-5 {\n    width: 20.83333333%;\n  }\n  .hb-col-md-6 {\n    width: 25%;\n  }\n  .hb-col-md-7 {\n    width: 29.16666667%;\n  }\n  .hb-col-md-8 {\n    width: 33.33333333%;\n  }\n  .hb-col-md-9 {\n    width: 37.5%;\n  }\n  .hb-col-md-10 {\n    width: 41.66666667%;\n  }\n  .hb-col-md-11 {\n    width: 45.83333333%;\n  }\n  .hb-col-md-12 {\n    width: 50%;\n  }\n  .hb-col-md-13 {\n    width: 54.16666667%;\n  }\n  .hb-col-md-14 {\n    width: 58.33333333%;\n  }\n  .hb-col-md-15 {\n    width: 62.5%;\n  }\n  .hb-col-md-16 {\n    width: 66.66666667%;\n  }\n  .hb-col-md-17 {\n    width: 70.83333333%;\n  }\n  .hb-col-md-18 {\n    width: 75%;\n  }\n  .hb-col-md-19 {\n    width: 79.16666667%;\n  }\n  .hb-col-md-20 {\n    width: 83.33333333%;\n  }\n  .hb-col-md-21 {\n    width: 87.5%;\n  }\n  .hb-col-md-22 {\n    width: 91.66666667%;\n  }\n  .hb-col-md-23 {\n    width: 95.83333333%;\n  }\n  .hb-col-md-24 {\n    width: 100%;\n  }\n  .hb-col-md-offset-0 {\n    margin-left: 0;\n  }\n  .hb-col-md-offset-1 {\n    margin-left: 4.16666667%;\n  }\n  .hb-col-md-offset-2 {\n    margin-left: 8.33333333%;\n  }\n  .hb-col-md-offset-3 {\n    margin-left: 12.5%;\n  }\n  .hb-col-md-offset-4 {\n    margin-left: 16.66666667%;\n  }\n  .hb-col-md-offset-5 {\n    margin-left: 20.83333333%;\n  }\n  .hb-col-md-offset-6 {\n    margin-left: 25%;\n  }\n  .hb-col-md-offset-7 {\n    margin-left: 29.16666667%;\n  }\n  .hb-col-md-offset-8 {\n    margin-left: 33.33333333%;\n  }\n  .hb-col-md-offset-9 {\n    margin-left: 37.5%;\n  }\n  .hb-col-md-offset-10 {\n    margin-left: 41.66666667%;\n  }\n  .hb-col-md-offset-11 {\n    margin-left: 45.83333333%;\n  }\n  .hb-col-md-offset-12 {\n    margin-left: 50%;\n  }\n  .hb-col-md-offset-13 {\n    margin-left: 54.16666667%;\n  }\n  .hb-col-md-offset-14 {\n    margin-left: 58.33333333%;\n  }\n  .hb-col-md-offset-15 {\n    margin-left: 62.5%;\n  }\n  .hb-col-md-offset-16 {\n    margin-left: 66.66666667%;\n  }\n  .hb-col-md-offset-17 {\n    margin-left: 70.83333333%;\n  }\n  .hb-col-md-offset-18 {\n    margin-left: 75%;\n  }\n  .hb-col-md-offset-19 {\n    margin-left: 79.16666667%;\n  }\n  .hb-col-md-offset-20 {\n    margin-left: 83.33333333%;\n  }\n  .hb-col-md-offset-21 {\n    margin-left: 87.5%;\n  }\n  .hb-col-md-offset-22 {\n    margin-left: 91.66666667%;\n  }\n  .hb-col-md-offset-23 {\n    margin-left: 95.83333333%;\n  }\n  .hb-col-md-offset-24 {\n    margin-left: 100%;\n  }\n  .hb-col-md-push-0 {\n    left: 0;\n  }\n  .hb-col-md-push-1 {\n    left: 4.16666667%;\n  }\n  .hb-col-md-push-2 {\n    left: 8.33333333%;\n  }\n  .hb-col-md-push-3 {\n    left: 12.5%;\n  }\n  .hb-col-md-push-4 {\n    left: 16.66666667%;\n  }\n  .hb-col-md-push-5 {\n    left: 20.83333333%;\n  }\n  .hb-col-md-push-6 {\n    left: 25%;\n  }\n  .hb-col-md-push-7 {\n    left: 29.16666667%;\n  }\n  .hb-col-md-push-8 {\n    left: 33.33333333%;\n  }\n  .hb-col-md-push-9 {\n    left: 37.5%;\n  }\n  .hb-col-md-push-10 {\n    left: 41.66666667%;\n  }\n  .hb-col-md-push-11 {\n    left: 45.83333333%;\n  }\n  .hb-col-md-push-12 {\n    left: 50%;\n  }\n  .hb-col-md-push-13 {\n    left: 54.16666667%;\n  }\n  .hb-col-md-push-14 {\n    left: 58.33333333%;\n  }\n  .hb-col-md-push-15 {\n    left: 62.5%;\n  }\n  .hb-col-md-push-16 {\n    left: 66.66666667%;\n  }\n  .hb-col-md-push-17 {\n    left: 70.83333333%;\n  }\n  .hb-col-md-push-18 {\n    left: 75%;\n  }\n  .hb-col-md-push-19 {\n    left: 79.16666667%;\n  }\n  .hb-col-md-push-20 {\n    left: 83.33333333%;\n  }\n  .hb-col-md-push-21 {\n    left: 87.5%;\n  }\n  .hb-col-md-push-22 {\n    left: 91.66666667%;\n  }\n  .hb-col-md-push-23 {\n    left: 95.83333333%;\n  }\n  .hb-col-md-push-24 {\n    left: 100%;\n  }\n  .hb-col-md-pull-0 {\n    right: 0;\n  }\n  .hb-col-md-pull-1 {\n    right: 4.16666667%;\n  }\n  .hb-col-md-pull-2 {\n    right: 8.33333333%;\n  }\n  .hb-col-md-pull-3 {\n    right: 12.5%;\n  }\n  .hb-col-md-pull-4 {\n    right: 16.66666667%;\n  }\n  .hb-col-md-pull-5 {\n    right: 20.83333333%;\n  }\n  .hb-col-md-pull-6 {\n    right: 25%;\n  }\n  .hb-col-md-pull-7 {\n    right: 29.16666667%;\n  }\n  .hb-col-md-pull-8 {\n    right: 33.33333333%;\n  }\n  .hb-col-md-pull-9 {\n    right: 37.5%;\n  }\n  .hb-col-md-pull-10 {\n    right: 41.66666667%;\n  }\n  .hb-col-md-pull-11 {\n    right: 45.83333333%;\n  }\n  .hb-col-md-pull-12 {\n    right: 50%;\n  }\n  .hb-col-md-pull-13 {\n    right: 54.16666667%;\n  }\n  .hb-col-md-pull-14 {\n    right: 58.33333333%;\n  }\n  .hb-col-md-pull-15 {\n    right: 62.5%;\n  }\n  .hb-col-md-pull-16 {\n    right: 66.66666667%;\n  }\n  .hb-col-md-pull-17 {\n    right: 70.83333333%;\n  }\n  .hb-col-md-pull-18 {\n    right: 75%;\n  }\n  .hb-col-md-pull-19 {\n    right: 79.16666667%;\n  }\n  .hb-col-md-pull-20 {\n    right: 83.33333333%;\n  }\n  .hb-col-md-pull-21 {\n    right: 87.5%;\n  }\n  .hb-col-md-pull-22 {\n    right: 91.66666667%;\n  }\n  .hb-col-md-pull-23 {\n    right: 95.83333333%;\n  }\n  .hb-col-md-pull-24 {\n    right: 100%;\n  }\n}\n\n@media (min-width: 992px) {\n  .hb-col-lg-0 {\n    display: none;\n  }\n  .hb-col-lg-1 {\n    width: 4.16666667%;\n  }\n  .hb-col-lg-2 {\n    width: 8.33333333%;\n  }\n  .hb-col-lg-3 {\n    width: 12.5%;\n  }\n  .hb-col-lg-4 {\n    width: 16.66666667%;\n  }\n  .hb-col-lg-5 {\n    width: 20.83333333%;\n  }\n  .hb-col-lg-6 {\n    width: 25%;\n  }\n  .hb-col-lg-7 {\n    width: 29.16666667%;\n  }\n  .hb-col-lg-8 {\n    width: 33.33333333%;\n  }\n  .hb-col-lg-9 {\n    width: 37.5%;\n  }\n  .hb-col-lg-10 {\n    width: 41.66666667%;\n  }\n  .hb-col-lg-11 {\n    width: 45.83333333%;\n  }\n  .hb-col-lg-12 {\n    width: 50%;\n  }\n  .hb-col-lg-13 {\n    width: 54.16666667%;\n  }\n  .hb-col-lg-14 {\n    width: 58.33333333%;\n  }\n  .hb-col-lg-15 {\n    width: 62.5%;\n  }\n  .hb-col-lg-16 {\n    width: 66.66666667%;\n  }\n  .hb-col-lg-17 {\n    width: 70.83333333%;\n  }\n  .hb-col-lg-18 {\n    width: 75%;\n  }\n  .hb-col-lg-19 {\n    width: 79.16666667%;\n  }\n  .hb-col-lg-20 {\n    width: 83.33333333%;\n  }\n  .hb-col-lg-21 {\n    width: 87.5%;\n  }\n  .hb-col-lg-22 {\n    width: 91.66666667%;\n  }\n  .hb-col-lg-23 {\n    width: 95.83333333%;\n  }\n  .hb-col-lg-24 {\n    width: 100%;\n  }\n  .hb-col-lg-offset-0 {\n    margin-left: 0;\n  }\n  .hb-col-lg-offset-1 {\n    margin-left: 4.16666667%;\n  }\n  .hb-col-lg-offset-2 {\n    margin-left: 8.33333333%;\n  }\n  .hb-col-lg-offset-3 {\n    margin-left: 12.5%;\n  }\n  .hb-col-lg-offset-4 {\n    margin-left: 16.66666667%;\n  }\n  .hb-col-lg-offset-5 {\n    margin-left: 20.83333333%;\n  }\n  .hb-col-lg-offset-6 {\n    margin-left: 25%;\n  }\n  .hb-col-lg-offset-7 {\n    margin-left: 29.16666667%;\n  }\n  .hb-col-lg-offset-8 {\n    margin-left: 33.33333333%;\n  }\n  .hb-col-lg-offset-9 {\n    margin-left: 37.5%;\n  }\n  .hb-col-lg-offset-10 {\n    margin-left: 41.66666667%;\n  }\n  .hb-col-lg-offset-11 {\n    margin-left: 45.83333333%;\n  }\n  .hb-col-lg-offset-12 {\n    margin-left: 50%;\n  }\n  .hb-col-lg-offset-13 {\n    margin-left: 54.16666667%;\n  }\n  .hb-col-lg-offset-14 {\n    margin-left: 58.33333333%;\n  }\n  .hb-col-lg-offset-15 {\n    margin-left: 62.5%;\n  }\n  .hb-col-lg-offset-16 {\n    margin-left: 66.66666667%;\n  }\n  .hb-col-lg-offset-17 {\n    margin-left: 70.83333333%;\n  }\n  .hb-col-lg-offset-18 {\n    margin-left: 75%;\n  }\n  .hb-col-lg-offset-19 {\n    margin-left: 79.16666667%;\n  }\n  .hb-col-lg-offset-20 {\n    margin-left: 83.33333333%;\n  }\n  .hb-col-lg-offset-21 {\n    margin-left: 87.5%;\n  }\n  .hb-col-lg-offset-22 {\n    margin-left: 91.66666667%;\n  }\n  .hb-col-lg-offset-23 {\n    margin-left: 95.83333333%;\n  }\n  .hb-col-lg-offset-24 {\n    margin-left: 100%;\n  }\n  .hb-col-lg-push-0 {\n    left: 0;\n  }\n  .hb-col-lg-push-1 {\n    left: 4.16666667%;\n  }\n  .hb-col-lg-push-2 {\n    left: 8.33333333%;\n  }\n  .hb-col-lg-push-3 {\n    left: 12.5%;\n  }\n  .hb-col-lg-push-4 {\n    left: 16.66666667%;\n  }\n  .hb-col-lg-push-5 {\n    left: 20.83333333%;\n  }\n  .hb-col-lg-push-6 {\n    left: 25%;\n  }\n  .hb-col-lg-push-7 {\n    left: 29.16666667%;\n  }\n  .hb-col-lg-push-8 {\n    left: 33.33333333%;\n  }\n  .hb-col-lg-push-9 {\n    left: 37.5%;\n  }\n  .hb-col-lg-push-10 {\n    left: 41.66666667%;\n  }\n  .hb-col-lg-push-11 {\n    left: 45.83333333%;\n  }\n  .hb-col-lg-push-12 {\n    left: 50%;\n  }\n  .hb-col-lg-push-13 {\n    left: 54.16666667%;\n  }\n  .hb-col-lg-push-14 {\n    left: 58.33333333%;\n  }\n  .hb-col-lg-push-15 {\n    left: 62.5%;\n  }\n  .hb-col-lg-push-16 {\n    left: 66.66666667%;\n  }\n  .hb-col-lg-push-17 {\n    left: 70.83333333%;\n  }\n  .hb-col-lg-push-18 {\n    left: 75%;\n  }\n  .hb-col-lg-push-19 {\n    left: 79.16666667%;\n  }\n  .hb-col-lg-push-20 {\n    left: 83.33333333%;\n  }\n  .hb-col-lg-push-21 {\n    left: 87.5%;\n  }\n  .hb-col-lg-push-22 {\n    left: 91.66666667%;\n  }\n  .hb-col-lg-push-23 {\n    left: 95.83333333%;\n  }\n  .hb-col-lg-push-24 {\n    left: 100%;\n  }\n  .hb-col-lg-pull-0 {\n    right: 0;\n  }\n  .hb-col-lg-pull-1 {\n    right: 4.16666667%;\n  }\n  .hb-col-lg-pull-2 {\n    right: 8.33333333%;\n  }\n  .hb-col-lg-pull-3 {\n    right: 12.5%;\n  }\n  .hb-col-lg-pull-4 {\n    right: 16.66666667%;\n  }\n  .hb-col-lg-pull-5 {\n    right: 20.83333333%;\n  }\n  .hb-col-lg-pull-6 {\n    right: 25%;\n  }\n  .hb-col-lg-pull-7 {\n    right: 29.16666667%;\n  }\n  .hb-col-lg-pull-8 {\n    right: 33.33333333%;\n  }\n  .hb-col-lg-pull-9 {\n    right: 37.5%;\n  }\n  .hb-col-lg-pull-10 {\n    right: 41.66666667%;\n  }\n  .hb-col-lg-pull-11 {\n    right: 45.83333333%;\n  }\n  .hb-col-lg-pull-12 {\n    right: 50%;\n  }\n  .hb-col-lg-pull-13 {\n    right: 54.16666667%;\n  }\n  .hb-col-lg-pull-14 {\n    right: 58.33333333%;\n  }\n  .hb-col-lg-pull-15 {\n    right: 62.5%;\n  }\n  .hb-col-lg-pull-16 {\n    right: 66.66666667%;\n  }\n  .hb-col-lg-pull-17 {\n    right: 70.83333333%;\n  }\n  .hb-col-lg-pull-18 {\n    right: 75%;\n  }\n  .hb-col-lg-pull-19 {\n    right: 79.16666667%;\n  }\n  .hb-col-lg-pull-20 {\n    right: 83.33333333%;\n  }\n  .hb-col-lg-pull-21 {\n    right: 87.5%;\n  }\n  .hb-col-lg-pull-22 {\n    right: 91.66666667%;\n  }\n  .hb-col-lg-pull-23 {\n    right: 95.83333333%;\n  }\n  .hb-col-lg-pull-24 {\n    right: 100%;\n  }\n}\n\n@media (min-width: 1200px) {\n  .hb-col-xl-0 {\n    display: none;\n  }\n  .hb-col-xl-1 {\n    width: 4.16666667%;\n  }\n  .hb-col-xl-2 {\n    width: 8.33333333%;\n  }\n  .hb-col-xl-3 {\n    width: 12.5%;\n  }\n  .hb-col-xl-4 {\n    width: 16.66666667%;\n  }\n  .hb-col-xl-5 {\n    width: 20.83333333%;\n  }\n  .hb-col-xl-6 {\n    width: 25%;\n  }\n  .hb-col-xl-7 {\n    width: 29.16666667%;\n  }\n  .hb-col-xl-8 {\n    width: 33.33333333%;\n  }\n  .hb-col-xl-9 {\n    width: 37.5%;\n  }\n  .hb-col-xl-10 {\n    width: 41.66666667%;\n  }\n  .hb-col-xl-11 {\n    width: 45.83333333%;\n  }\n  .hb-col-xl-12 {\n    width: 50%;\n  }\n  .hb-col-xl-13 {\n    width: 54.16666667%;\n  }\n  .hb-col-xl-14 {\n    width: 58.33333333%;\n  }\n  .hb-col-xl-15 {\n    width: 62.5%;\n  }\n  .hb-col-xl-16 {\n    width: 66.66666667%;\n  }\n  .hb-col-xl-17 {\n    width: 70.83333333%;\n  }\n  .hb-col-xl-18 {\n    width: 75%;\n  }\n  .hb-col-xl-19 {\n    width: 79.16666667%;\n  }\n  .hb-col-xl-20 {\n    width: 83.33333333%;\n  }\n  .hb-col-xl-21 {\n    width: 87.5%;\n  }\n  .hb-col-xl-22 {\n    width: 91.66666667%;\n  }\n  .hb-col-xl-23 {\n    width: 95.83333333%;\n  }\n  .hb-col-xl-24 {\n    width: 100%;\n  }\n  .hb-col-xl-offset-0 {\n    margin-left: 0;\n  }\n  .hb-col-xl-offset-1 {\n    margin-left: 4.16666667%;\n  }\n  .hb-col-xl-offset-2 {\n    margin-left: 8.33333333%;\n  }\n  .hb-col-xl-offset-3 {\n    margin-left: 12.5%;\n  }\n  .hb-col-xl-offset-4 {\n    margin-left: 16.66666667%;\n  }\n  .hb-col-xl-offset-5 {\n    margin-left: 20.83333333%;\n  }\n  .hb-col-xl-offset-6 {\n    margin-left: 25%;\n  }\n  .hb-col-xl-offset-7 {\n    margin-left: 29.16666667%;\n  }\n  .hb-col-xl-offset-8 {\n    margin-left: 33.33333333%;\n  }\n  .hb-col-xl-offset-9 {\n    margin-left: 37.5%;\n  }\n  .hb-col-xl-offset-10 {\n    margin-left: 41.66666667%;\n  }\n  .hb-col-xl-offset-11 {\n    margin-left: 45.83333333%;\n  }\n  .hb-col-xl-offset-12 {\n    margin-left: 50%;\n  }\n  .hb-col-xl-offset-13 {\n    margin-left: 54.16666667%;\n  }\n  .hb-col-xl-offset-14 {\n    margin-left: 58.33333333%;\n  }\n  .hb-col-xl-offset-15 {\n    margin-left: 62.5%;\n  }\n  .hb-col-xl-offset-16 {\n    margin-left: 66.66666667%;\n  }\n  .hb-col-xl-offset-17 {\n    margin-left: 70.83333333%;\n  }\n  .hb-col-xl-offset-18 {\n    margin-left: 75%;\n  }\n  .hb-col-xl-offset-19 {\n    margin-left: 79.16666667%;\n  }\n  .hb-col-xl-offset-20 {\n    margin-left: 83.33333333%;\n  }\n  .hb-col-xl-offset-21 {\n    margin-left: 87.5%;\n  }\n  .hb-col-xl-offset-22 {\n    margin-left: 91.66666667%;\n  }\n  .hb-col-xl-offset-23 {\n    margin-left: 95.83333333%;\n  }\n  .hb-col-xl-offset-24 {\n    margin-left: 100%;\n  }\n  .hb-col-xl-push-0 {\n    left: 0;\n  }\n  .hb-col-xl-push-1 {\n    left: 4.16666667%;\n  }\n  .hb-col-xl-push-2 {\n    left: 8.33333333%;\n  }\n  .hb-col-xl-push-3 {\n    left: 12.5%;\n  }\n  .hb-col-xl-push-4 {\n    left: 16.66666667%;\n  }\n  .hb-col-xl-push-5 {\n    left: 20.83333333%;\n  }\n  .hb-col-xl-push-6 {\n    left: 25%;\n  }\n  .hb-col-xl-push-7 {\n    left: 29.16666667%;\n  }\n  .hb-col-xl-push-8 {\n    left: 33.33333333%;\n  }\n  .hb-col-xl-push-9 {\n    left: 37.5%;\n  }\n  .hb-col-xl-push-10 {\n    left: 41.66666667%;\n  }\n  .hb-col-xl-push-11 {\n    left: 45.83333333%;\n  }\n  .hb-col-xl-push-12 {\n    left: 50%;\n  }\n  .hb-col-xl-push-13 {\n    left: 54.16666667%;\n  }\n  .hb-col-xl-push-14 {\n    left: 58.33333333%;\n  }\n  .hb-col-xl-push-15 {\n    left: 62.5%;\n  }\n  .hb-col-xl-push-16 {\n    left: 66.66666667%;\n  }\n  .hb-col-xl-push-17 {\n    left: 70.83333333%;\n  }\n  .hb-col-xl-push-18 {\n    left: 75%;\n  }\n  .hb-col-xl-push-19 {\n    left: 79.16666667%;\n  }\n  .hb-col-xl-push-20 {\n    left: 83.33333333%;\n  }\n  .hb-col-xl-push-21 {\n    left: 87.5%;\n  }\n  .hb-col-xl-push-22 {\n    left: 91.66666667%;\n  }\n  .hb-col-xl-push-23 {\n    left: 95.83333333%;\n  }\n  .hb-col-xl-push-24 {\n    left: 100%;\n  }\n  .hb-col-xl-pull-0 {\n    right: 0;\n  }\n  .hb-col-xl-pull-1 {\n    right: 4.16666667%;\n  }\n  .hb-col-xl-pull-2 {\n    right: 8.33333333%;\n  }\n  .hb-col-xl-pull-3 {\n    right: 12.5%;\n  }\n  .hb-col-xl-pull-4 {\n    right: 16.66666667%;\n  }\n  .hb-col-xl-pull-5 {\n    right: 20.83333333%;\n  }\n  .hb-col-xl-pull-6 {\n    right: 25%;\n  }\n  .hb-col-xl-pull-7 {\n    right: 29.16666667%;\n  }\n  .hb-col-xl-pull-8 {\n    right: 33.33333333%;\n  }\n  .hb-col-xl-pull-9 {\n    right: 37.5%;\n  }\n  .hb-col-xl-pull-10 {\n    right: 41.66666667%;\n  }\n  .hb-col-xl-pull-11 {\n    right: 45.83333333%;\n  }\n  .hb-col-xl-pull-12 {\n    right: 50%;\n  }\n  .hb-col-xl-pull-13 {\n    right: 54.16666667%;\n  }\n  .hb-col-xl-pull-14 {\n    right: 58.33333333%;\n  }\n  .hb-col-xl-pull-15 {\n    right: 62.5%;\n  }\n  .hb-col-xl-pull-16 {\n    right: 66.66666667%;\n  }\n  .hb-col-xl-pull-17 {\n    right: 70.83333333%;\n  }\n  .hb-col-xl-pull-18 {\n    right: 75%;\n  }\n  .hb-col-xl-pull-19 {\n    right: 79.16666667%;\n  }\n  .hb-col-xl-pull-20 {\n    right: 83.33333333%;\n  }\n  .hb-col-xl-pull-21 {\n    right: 87.5%;\n  }\n  .hb-col-xl-pull-22 {\n    right: 91.66666667%;\n  }\n  .hb-col-xl-pull-23 {\n    right: 95.83333333%;\n  }\n  .hb-col-xl-pull-24 {\n    right: 100%;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/** 响应式栅格配置（对齐 antd：可传 number 或 {span,offset,push,pull}） */\nexport interface ColResponsive {\n  span?: number;\n  offset?: number;\n  push?: number;\n  pull?: number;\n}\n\n/**\n * Layout 布局组件\n * 通过基础的 24 分栏，迅速简便地创建布局。\n * 支持响应式：xs/sm/md/lg/xl 在对应断点应用各自的 span/offset/push/pull。\n */\n@Component({\n  tag: 'hb-layout',\n  styleUrl: 'layout.css',\n  shadow: true,\n})\nexport class Layout {\n  /**\n   * 栅格占据的列数\n   * @default 24\n   */\n  @Prop() span: number = 24;\n\n  /**\n   * 栅格左侧的间隔格数\n   * @default 0\n   */\n  @Prop() offset: number = 0;\n\n  /**\n   * 栅格向右移动格数\n   * @default 0\n   */\n  @Prop() push: number = 0;\n\n  /**\n   * 栅格向左移动格数\n   * @default 0\n   */\n  @Prop() pull: number = 0;\n\n  /**\n   * <576px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() xs?: number | ColResponsive;\n\n  /**\n   * ≥576px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() sm?: number | ColResponsive;\n\n  /**\n   * ≥768px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() md?: number | ColResponsive;\n\n  /**\n   * ≥992px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() lg?: number | ColResponsive;\n\n  /**\n   * ≥1200px 响应式栅格数或者栅格属性对象\n   */\n  @Prop() xl?: number | ColResponsive;\n\n  /** 把响应式 prop（number 或对象）规范化为 {span,offset,push,pull} */\n  private normalizeResponsive(value: number | ColResponsive | undefined): ColResponsive {\n    if (value === undefined || value === null) return {};\n    if (typeof value === 'number') return { span: value };\n    return value;\n  }\n\n  private getColClass() {\n    const classes: string[] = ['hb-col'];\n\n    // 基础（无断点）span/offset/push/pull —— 仅在没有 xs 时作为 xs 默认（antd 行为）\n    if (this.span) classes.push(`hb-col-${this.span}`);\n    if (this.offset) classes.push(`hb-col-offset-${this.offset}`);\n    if (this.push) classes.push(`hb-col-push-${this.push}`);\n    if (this.pull) classes.push(`hb-col-pull-${this.pull}`);\n\n    // 响应式断点：生成 hb-col-{bp}-{span} / hb-col-{bp}-offset-{n} 等 class，\n    // CSS 用 @media 在对应断点应用（覆盖基础值）。\n    const bps: Array<'xs' | 'sm' | 'md' | 'lg' | 'xl'> = ['xs', 'sm', 'md', 'lg', 'xl'];\n    for (const bp of bps) {\n      const v = this[bp];\n      if (v === undefined) continue;\n      const r = this.normalizeResponsive(v);\n      if (r.span !== undefined) classes.push(`hb-col-${bp}-${r.span}`);\n      if (r.offset !== undefined) classes.push(`hb-col-${bp}-offset-${r.offset}`);\n      if (r.push !== undefined) classes.push(`hb-col-${bp}-push-${r.push}`);\n      if (r.pull !== undefined) classes.push(`hb-col-${bp}-pull-${r.pull}`);\n    }\n\n    return classes.join(' ');\n  }\n\n  render() {\n    return (\n      <div class={this.getColClass()}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/hb-link.cjs.entry.js

@@ -52,12 +52,12 @@ const Link = class {
     };
     render() {
         const Tag = this.href ? 'a' : 'span';
-        return (index.h(Tag, { key: '7903426ed8f9d0553bfabf22068e8e74f4bc6232', class: {
+        return (index.h(Tag, { key: 'adc292c63a29c892aad0a7fbc8731daab5cb274f', class: {
                 'hb-link': true,
                 [`hb-link--${this.type}`]: true,
                 'hb-link--underline': this.underline,
                 'hb-link--disabled': this.disabled,
-            }, href: this.disabled ? undefined : this.href, target: this.target, onClick: this.handleClick }, this.icon && index.h("i", { key: '1945af3c95d3d9a29a2bbed159d48b10230f8901', class: this.icon }), index.h("slot", { key: '2499cb000e716f05f55c230a8c8ad72f15ce215a' })));
+            }, href: this.disabled ? undefined : this.href, target: this.target, onClick: this.handleClick }, this.icon && index.h("i", { key: '8647d19079e91743aa0cb73e170f1a017caed895', class: this.icon }), index.h("slot", { key: '852517194c30de3092746039dfa1d294dc5fd243' })));
     }
 };
 Link.style = HbLinkStyle0;

package/dist/cjs/hb-loading.cjs.entry.js

@@ -18,11 +18,11 @@ const Loading = class {
     /** 是否全屏显示 */
     fullscreen = false;
     render() {
-        return (index.h("div", { key: 'd8e3b21dac5f910d9a927180425753b0245550ee', class: {
+        return (index.h("div", { key: 'd4d4a02e79e76f293ec86320163cb69ff73b41ac', class: {
                 'hb-loading': true,
                 'hb-loading--fullscreen': this.fullscreen,
                 [`hb-loading--${this.size}`]: true,
-            } }, index.h("div", { key: '1aa9028b7e6c3ac550c0d8f6fd2e36ffd8a6b10a', class: "hb-loading__spinner" }, index.h("div", { key: 'ee52c55b1d98b7b48eac202d4c58e699b5df32e6', class: "hb-loading__circle" }), this.text && index.h("div", { key: 'e9221d649116747f720afb8d380c4a5caf6192d9', class: "hb-loading__text" }, this.text))));
+            } }, index.h("div", { key: 'c31b2e33a1d5a789dfd5eff3ae460b01f960627a', class: "hb-loading__spinner" }, index.h("div", { key: 'd02a2a05dbfe2b1185512375b64a157d2ebd16a0', class: "hb-loading__circle" }), this.text && index.h("div", { key: 'd224855e42c1448d2471262c52e14e812cc50d9a', class: "hb-loading__text" }, this.text))));
     }
 };
 Loading.style = HbLoadingStyle0;

package/dist/cjs/hb-menu-item.cjs.entry.js

@@ -3,15 +3,24 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5aa5c817.js');
-const a11y = require('./a11y-802de67a.js');
+const a11y = require('./a11y-4385c871.js');
 
 const MenuItem = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     get el() { return index.getElement(this); }
-    /** 唯一标识 */
+    /**
+     * 唯一标识。
+     * O3：推荐用 itemKey。保留 key 作为向后兼容别名（key 是 Stencil/React 保留 prop，
+     * 通过 JSX 设置时可能被 vdom 拦截；HTML 属性 key="..." 仍可工作）。
+     */
+    itemKey = '';
     key = '';
+    /** 解析出的有效 key：itemKey 优先，回退到 key */
+    get effectiveKey() {
+        return this.itemKey || this.key;
+    }
     /** 是否禁用 */
     disabled = false;
     /** 图标 */
@@ -25,7 +34,7 @@ const MenuItem = class {
         if (menu) {
             // 使用内部事件名 hbMenuItemSelect，与 Menu 向外发射的公开事件 hbSelect 区分，
             // 否则 Menu 的 @Listen('hbSelect') 会被自身 emit 的事件再次触发，导致无限递归。
-            menu.dispatchEvent(new CustomEvent('hbMenuItemSelect', { detail: this.key, bubbles: true }));
+            menu.dispatchEvent(new CustomEvent('hbMenuItemSelect', { detail: this.effectiveKey, bubbles: true }));
         }
     };
     handleKeydown = (e) => {
@@ -37,11 +46,11 @@ const MenuItem = class {
         }
     };
     render() {
-        return (index.h("li", { key: '73a414a55166b598c78b6a3d0471cae5559a6aa6', class: {
+        return (index.h("li", { key: '67ecfc7c68603c1264237d73a4d5cfa3803835df', class: {
                 'hb-menu-item': true,
                 'hb-menu-item--active': this.active,
                 'hb-menu-item--disabled': this.disabled,
-            }, role: "menuitem", tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.active ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && index.h("span", { key: '375938585e3f0b1550912723c93fe2f391f4e407', class: "hb-menu-item__icon" }, this.icon), index.h("span", { key: '6db5289368546e0695d386826700805d53660c68', class: "hb-menu-item__text" }, index.h("slot", { key: '1d2fc9baece71764747c07148de07de612b2f4b1' }))));
+            }, role: "menuitem", tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.active ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && index.h("span", { key: 'c1327820c95c2d16241194dad04143f8a05ee9ce', class: "hb-menu-item__icon" }, this.icon), index.h("span", { key: '01b93549cd0431e05f61ddcaddcfcf3ed71de866', class: "hb-menu-item__text" }, index.h("slot", { key: 'e7051746681ca4e78581494bb52bd0ed26afef21' }))));
     }
 };
 

package/dist/cjs/hb-menu-item.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"hb-menu-item.entry.cjs.js","mappings":";;;;;;;MAUa,QAAQ;;;;;;IAIX,GAAG,GAAW,EAAE,CAAC;;IAGjB,QAAQ,GAAY,KAAK,CAAC;;IAG1B,IAAI,CAAU;;IAGd,MAAM,GAAY,KAAK,CAAC;IAExB,WAAW,GAAG;QACpB,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QACxC,IAAI,IAAI,EAAE;;;YAGR,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;SAC9F;KACF,CAAC;IAEM,aAAa,GAAG,CAAC,CAAgB;QACvC,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAIA,oBAAe,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;YAC1B,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;KACF,CAAC;IAEF,MAAM;QACJ,QACEC,iEACE,KAAK,EAAE;gBACL,cAAc,EAAE,IAAI;gBACpB,sBAAsB,EAAE,IAAI,CAAC,MAAM;gBACnC,wBAAwB,EAAE,IAAI,CAAC,QAAQ;aACxC,EACD,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,mBACjB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,kBACnC,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAC9C,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,IAAI,CAAC,aAAa,IAE5B,IAAI,CAAC,IAAI,IAAIA,mEAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,IAAI,CAAQ,EACjEA,mEAAM,KAAK,EAAC,oBAAoB,IAACA,oEAAQ,CAAO,CAC7C,EACL;KACH;;;;;","names":["isActivationKey","h"],"sources":["src/components/Menu/MenuItem.tsx"],"sourcesContent":["import { Component, h, Prop, Element } from '@stencil/core';\nimport { isActivationKey } from '../../utils/a11y';\n\n/**\n * MenuItem 菜单项\n */\n@Component({\n  tag: 'hb-menu-item',\n  shadow: true,\n})\nexport class MenuItem {\n  @Element() el: HTMLElement;\n\n  /** 唯一标识 */\n  @Prop() key: string = '';\n\n  /** 是否禁用 */\n  @Prop() disabled: boolean = false;\n\n  /** 图标 */\n  @Prop() icon?: string;\n\n  /** 是否激活（由父级 Menu 设置） */\n  @Prop() active: boolean = false;\n\n  private handleClick = () => {\n    if (this.disabled) return;\n    const menu = this.el.closest('hb-menu');\n    if (menu) {\n      // 使用内部事件名 hbMenuItemSelect，与 Menu 向外发射的公开事件 hbSelect 区分，\n      // 否则 Menu 的 @Listen('hbSelect') 会被自身 emit 的事件再次触发，导致无限递归。\n      menu.dispatchEvent(new CustomEvent('hbMenuItemSelect', { detail: this.key, bubbles: true }));\n    }\n  };\n\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (this.disabled) return;\n    if (isActivationKey(e.key)) {\n      e.preventDefault();\n      this.handleClick();\n    }\n  };\n\n  render() {\n    return (\n      <li\n        class={{\n          'hb-menu-item': true,\n          'hb-menu-item--active': this.active,\n          'hb-menu-item--disabled': this.disabled,\n        }}\n        role=\"menuitem\"\n        tabindex={this.disabled ? -1 : 0}\n        aria-disabled={this.disabled ? 'true' : undefined}\n        aria-current={this.active ? 'page' : undefined}\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeydown}\n      >\n        {this.icon && <span class=\"hb-menu-item__icon\">{this.icon}</span>}\n        <span class=\"hb-menu-item__text\"><slot /></span>\n      </li>\n    );\n  }\n}\n"],"version":3}
+{"file":"hb-menu-item.entry.cjs.js","mappings":";;;;;;;MAUa,QAAQ;;;;;;;;;;IAQX,OAAO,GAAW,EAAE,CAAC;IACrB,GAAG,GAAW,EAAE,CAAC;;IAGzB,IAAY,YAAY;QACtB,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,GAAG,CAAC;KACjC;;IAGO,QAAQ,GAAY,KAAK,CAAC;;IAG1B,IAAI,CAAU;;IAGd,MAAM,GAAY,KAAK,CAAC;IAExB,WAAW,GAAG;QACpB,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QACxC,IAAI,IAAI,EAAE;;;YAGR,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;SACvG;KACF,CAAC;IAEM,aAAa,GAAG,CAAC,CAAgB;QACvC,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAIA,oBAAe,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;YAC1B,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;KACF,CAAC;IAEF,MAAM;QACJ,QACEC,iEACE,KAAK,EAAE;gBACL,cAAc,EAAE,IAAI;gBACpB,sBAAsB,EAAE,IAAI,CAAC,MAAM;gBACnC,wBAAwB,EAAE,IAAI,CAAC,QAAQ;aACxC,EACD,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,mBACjB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,kBACnC,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAC9C,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,IAAI,CAAC,aAAa,IAE5B,IAAI,CAAC,IAAI,IAAIA,mEAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,IAAI,CAAQ,EACjEA,mEAAM,KAAK,EAAC,oBAAoB,IAC9BA,oEAAQ,CACH,CACJ,EACL;KACH;;;;;","names":["isActivationKey","h"],"sources":["src/components/Menu/MenuItem.tsx"],"sourcesContent":["import { Component, h, Prop, Element } from '@stencil/core';\nimport { isActivationKey } from '../../utils/a11y';\n\n/**\n * MenuItem 菜单项\n */\n@Component({\n  tag: 'hb-menu-item',\n  shadow: true,\n})\nexport class MenuItem {\n  @Element() el: HTMLElement;\n\n  /**\n   * 唯一标识。\n   * O3：推荐用 itemKey。保留 key 作为向后兼容别名（key 是 Stencil/React 保留 prop，\n   * 通过 JSX 设置时可能被 vdom 拦截；HTML 属性 key=\"...\" 仍可工作）。\n   */\n  @Prop() itemKey: string = '';\n  @Prop() key: string = '';\n\n  /** 解析出的有效 key：itemKey 优先，回退到 key */\n  private get effectiveKey(): string {\n    return this.itemKey || this.key;\n  }\n\n  /** 是否禁用 */\n  @Prop() disabled: boolean = false;\n\n  /** 图标 */\n  @Prop() icon?: string;\n\n  /** 是否激活（由父级 Menu 设置） */\n  @Prop() active: boolean = false;\n\n  private handleClick = () => {\n    if (this.disabled) return;\n    const menu = this.el.closest('hb-menu');\n    if (menu) {\n      // 使用内部事件名 hbMenuItemSelect，与 Menu 向外发射的公开事件 hbSelect 区分，\n      // 否则 Menu 的 @Listen('hbSelect') 会被自身 emit 的事件再次触发，导致无限递归。\n      menu.dispatchEvent(new CustomEvent('hbMenuItemSelect', { detail: this.effectiveKey, bubbles: true }));\n    }\n  };\n\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (this.disabled) return;\n    if (isActivationKey(e.key)) {\n      e.preventDefault();\n      this.handleClick();\n    }\n  };\n\n  render() {\n    return (\n      <li\n        class={{\n          'hb-menu-item': true,\n          'hb-menu-item--active': this.active,\n          'hb-menu-item--disabled': this.disabled,\n        }}\n        role=\"menuitem\"\n        tabindex={this.disabled ? -1 : 0}\n        aria-disabled={this.disabled ? 'true' : undefined}\n        aria-current={this.active ? 'page' : undefined}\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeydown}\n      >\n        {this.icon && <span class=\"hb-menu-item__icon\">{this.icon}</span>}\n        <span class=\"hb-menu-item__text\">\n          <slot />\n        </span>\n      </li>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/hb-menu.cjs.entry.js

@@ -69,11 +69,11 @@ const Menu = class {
             style['--hb-menu-color'] = this.textColor;
         if (this.activeTextColor)
             style['--hb-menu-active-color'] = this.activeTextColor;
-        return (index.h("ul", { key: '8ed9611af410b2d453c01b9e026efb787c62cea6', class: {
+        return (index.h("ul", { key: 'afca5c6b17206341e12c66c5948c328396ceeccf', class: {
                 'hb-menu': true,
                 [`hb-menu--${this.mode}`]: true,
                 'hb-menu--collapsed': this.collapsed,
-            }, style: style, role: "menu" }, index.h("slot", { key: '7eb6d2b0fdd4ab9b3a0866ff4ba7c2c23bfdd6dd' })));
+            }, style: style, role: "menu" }, index.h("slot", { key: '3de1ef4c434bacb9fea50b46a275ab8854df65c6' })));
     }
     static get watchers() { return {
         "defaultActive": ["handleDefaultActiveChange"],

package/dist/cjs/hb-message.cjs.entry.js

@@ -25,21 +25,30 @@ const Message = class {
     /** 显示时间（毫秒），0 为不自动关闭 */
     duration = 3000;
     visible = true;
+    // L3：存储 timer id 以便 disconnectedCallback 清理（修复前未存、卸载后仍触发 detached 实例）
+    autoCloseTimer;
+    removeTimer;
     componentDidLoad() {
         if (this.duration > 0) {
-            setTimeout(() => this.close(), this.duration);
+            this.autoCloseTimer = setTimeout(() => this.close(), this.duration);
         }
     }
     close = () => {
         this.visible = false;
-        setTimeout(() => this.el.remove(), 300);
+        this.removeTimer = setTimeout(() => this.el.remove(), 300);
     };
+    disconnectedCallback() {
+        if (this.autoCloseTimer)
+            clearTimeout(this.autoCloseTimer);
+        if (this.removeTimer)
+            clearTimeout(this.removeTimer);
+    }
     render() {
-        return (index.h("div", { key: '903b6bef78fb6ba813556bf847b7e6e03de46c3d', class: {
+        return (index.h("div", { key: '8502f9c4c0877fb5cebe6db6fcc838ce9de92c97', class: {
                 'hb-message': true,
                 [`hb-message--${this.type}`]: true,
                 'hb-message--visible': this.visible,
-            }, role: "alert" }, index.h("span", { key: 'b29a9043e502cf7d3a96089b9fed6214a3d43bd4', class: "hb-message__icon" }, ICON_MAP[this.type]), index.h("span", { key: 'cc926f41bd0b721c203f687629019bb095134dbe', class: "hb-message__text" }, this.message), this.closable && (index.h("span", { key: 'f6d6743646b47e8ef5e83264c69c94d5398eb69b', class: "hb-message__close", onClick: this.close }, "\u00D7"))));
+            }, role: "alert" }, index.h("span", { key: 'fa00c1a8f6fbc9c4be3cb3809a739eb1f08035b2', class: "hb-message__icon" }, ICON_MAP[this.type]), index.h("span", { key: '870991d67ff662ba9c15d3df820394258d5eef3e', class: "hb-message__text" }, this.message), this.closable && (index.h("span", { key: '5f10b7332a0125841384238b2048572e7ee8558b', class: "hb-message__close", onClick: this.close }, "\u00D7"))));
     }
 };
 

package/dist/cjs/hb-message.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"hb-message.entry.cjs.js","mappings":";;;;;;AAIA,MAAM,QAAQ,GAAgC;IAC5C,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,GAAG;IACZ,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,GAAG;CACb,CAAC;MAUW,OAAO;;;;;;IAIV,OAAO,GAAW,EAAE,CAAC;;IAGrB,IAAI,GAAgB,MAAM,CAAC;;IAG3B,QAAQ,GAAY,KAAK,CAAC;;IAG1B,QAAQ,GAAW,IAAI,CAAC;IAEvB,OAAO,GAAY,IAAI,CAAC;IAEjC,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;YACrB,UAAU,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SAC/C;KACF;IAEO,KAAK,GAAG;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,UAAU,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC;KACzC,CAAC;IAEF,MAAM;QACJ,QACEA,kEACE,KAAK,EAAE;gBACL,YAAY,EAAE,IAAI;gBAClB,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;gBAClC,qBAAqB,EAAE,IAAI,CAAC,OAAO;aACpC,EACD,IAAI,EAAC,OAAO,IAEZA,mEAAM,KAAK,EAAC,kBAAkB,IAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAQ,EAC3DA,mEAAM,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,OAAO,CAAQ,EACnD,IAAI,CAAC,QAAQ,KACZA,mEAAM,KAAK,EAAC,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,aAAU,CAC9D,CACG,EACN;KACH;;;;;","names":["h"],"sources":["src/components/Message/Message.tsx"],"sourcesContent":["import { Component, h, Prop, State, Element } from '@stencil/core';\n\nexport type MessageType = 'success' | 'warning' | 'info' | 'error' | 'loading';\n\nconst ICON_MAP: Record<MessageType, string> = {\n  success: '✓',\n  warning: '⚠',\n  info: 'ℹ',\n  error: '✕',\n  loading: '⏳',\n};\n\n/**\n * Message 消息提示组件\n * 常用于主动操作后的反馈提示\n */\n@Component({\n  tag: 'hb-message',\n  shadow: true,\n})\nexport class Message {\n  @Element() el: HTMLElement;\n\n  /** 消息文字 */\n  @Prop() message: string = '';\n\n  /** 消息类型 */\n  @Prop() type: MessageType = 'info';\n\n  /** 是否显示关闭按钮 */\n  @Prop() closable: boolean = false;\n\n  /** 显示时间（毫秒），0 为不自动关闭 */\n  @Prop() duration: number = 3000;\n\n  @State() visible: boolean = true;\n\n  componentDidLoad() {\n    if (this.duration > 0) {\n      setTimeout(() => this.close(), this.duration);\n    }\n  }\n\n  private close = () => {\n    this.visible = false;\n    setTimeout(() => this.el.remove(), 300);\n  };\n\n  render() {\n    return (\n      <div\n        class={{\n          'hb-message': true,\n          [`hb-message--${this.type}`]: true,\n          'hb-message--visible': this.visible,\n        }}\n        role=\"alert\"\n      >\n        <span class=\"hb-message__icon\">{ICON_MAP[this.type]}</span>\n        <span class=\"hb-message__text\">{this.message}</span>\n        {this.closable && (\n          <span class=\"hb-message__close\" onClick={this.close}>×</span>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"hb-message.entry.cjs.js","mappings":";;;;;;AAIA,MAAM,QAAQ,GAAgC;IAC5C,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,GAAG;IACZ,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,GAAG;CACb,CAAC;MAUW,OAAO;;;;;;IAIV,OAAO,GAAW,EAAE,CAAC;;IAGrB,IAAI,GAAgB,MAAM,CAAC;;IAG3B,QAAQ,GAAY,KAAK,CAAC;;IAG1B,QAAQ,GAAW,IAAI,CAAC;IAEvB,OAAO,GAAY,IAAI,CAAC;;IAGzB,cAAc,CAAiC;IAC/C,WAAW,CAAiC;IAEpD,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;YACrB,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SACrE;KACF;IAEO,KAAK,GAAG;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC;KAC5D,CAAC;IAEF,oBAAoB;QAClB,IAAI,IAAI,CAAC,cAAc;YAAE,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAC3D,IAAI,IAAI,CAAC,WAAW;YAAE,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;KACtD;IAED,MAAM;QACJ,QACEA,kEACE,KAAK,EAAE;gBACL,YAAY,EAAE,IAAI;gBAClB,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;gBAClC,qBAAqB,EAAE,IAAI,CAAC,OAAO;aACpC,EACD,IAAI,EAAC,OAAO,IAEZA,mEAAM,KAAK,EAAC,kBAAkB,IAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAQ,EAC3DA,mEAAM,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,OAAO,CAAQ,EACnD,IAAI,CAAC,QAAQ,KACZA,mEAAM,KAAK,EAAC,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,aAE5C,CACR,CACG,EACN;KACH;;;;;","names":["h"],"sources":["src/components/Message/Message.tsx"],"sourcesContent":["import { Component, h, Prop, State, Element } from '@stencil/core';\n\nexport type MessageType = 'success' | 'warning' | 'info' | 'error' | 'loading';\n\nconst ICON_MAP: Record<MessageType, string> = {\n  success: '✓',\n  warning: '⚠',\n  info: 'ℹ',\n  error: '✕',\n  loading: '⏳',\n};\n\n/**\n * Message 消息提示组件\n * 常用于主动操作后的反馈提示\n */\n@Component({\n  tag: 'hb-message',\n  shadow: true,\n})\nexport class Message {\n  @Element() el: HTMLElement;\n\n  /** 消息文字 */\n  @Prop() message: string = '';\n\n  /** 消息类型 */\n  @Prop() type: MessageType = 'info';\n\n  /** 是否显示关闭按钮 */\n  @Prop() closable: boolean = false;\n\n  /** 显示时间（毫秒），0 为不自动关闭 */\n  @Prop() duration: number = 3000;\n\n  @State() visible: boolean = true;\n\n  // L3：存储 timer id 以便 disconnectedCallback 清理（修复前未存、卸载后仍触发 detached 实例）\n  private autoCloseTimer?: ReturnType<typeof setTimeout>;\n  private removeTimer?: ReturnType<typeof setTimeout>;\n\n  componentDidLoad() {\n    if (this.duration > 0) {\n      this.autoCloseTimer = setTimeout(() => this.close(), this.duration);\n    }\n  }\n\n  private close = () => {\n    this.visible = false;\n    this.removeTimer = setTimeout(() => this.el.remove(), 300);\n  };\n\n  disconnectedCallback() {\n    if (this.autoCloseTimer) clearTimeout(this.autoCloseTimer);\n    if (this.removeTimer) clearTimeout(this.removeTimer);\n  }\n\n  render() {\n    return (\n      <div\n        class={{\n          'hb-message': true,\n          [`hb-message--${this.type}`]: true,\n          'hb-message--visible': this.visible,\n        }}\n        role=\"alert\"\n      >\n        <span class=\"hb-message__icon\">{ICON_MAP[this.type]}</span>\n        <span class=\"hb-message__text\">{this.message}</span>\n        {this.closable && (\n          <span class=\"hb-message__close\" onClick={this.close}>\n            ×\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}