npm - huibo-ui - Versions diffs - 0.3.0 → 0.4.0 - Mend

huibo-ui 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (668) hide show

package/dist/components/hb-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"hb-input.js","mappings":"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","names":[],"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 font-size: 16px;\n color: var(--hb-input-placeholder-color);\n transition: color 0.2s;\n}\n\n.hb-input__clear:hover {\n color: var(--hb-input-text-color);\n}\n\n.hb-input__password {\n font-size: 16px;\n cursor: pointer;\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 }\n\n componentDidLoad() {\n this.inputValue = this.modelValue;\n this.updateClearVisible();\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 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 };\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 && this.resize ? { resize: this.resize } : 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\" onClick={this.handleClear}>\n ×\n </span>\n )}\n {this.type === 'password' && this.showPassword && (\n <span class=\"hb-input__suffix-inner hb-input__password\" onClick={this.togglePasswordVisible}>\n {this.passwordVisible ? '👁️' : '👁️‍🗨️'}\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}
1	+ {"file":"hb-input.js","mappings":"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","names":[],"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}

package/dist/components/hb-layout.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-1407a5e8.js';
-const layoutCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.flex{display:flex}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-col{box-sizing:border-box;position:relative;width:100%}.hb-col-1{width:4.16667%}.hb-col-2{width:8.33333%}.hb-col-3{width:12.5%}.hb-col-4{width:16.6667%}.hb-col-5{width:20.8333%}.hb-col-6{width:25%}.hb-col-7{width:29.1667%}.hb-col-8{width:33.3333%}.hb-col-9{width:37.5%}.hb-col-10{width:41.6667%}.hb-col-11{width:45.8333%}.hb-col-12{width:50%}.hb-col-13{width:54.1667%}.hb-col-14{width:58.3333%}.hb-col-15{width:62.5%}.hb-col-16{width:66.6667%}.hb-col-17{width:70.8333%}.hb-col-18{width:75%}.hb-col-19{width:79.1667%}.hb-col-20{width:83.3333%}.hb-col-21{width:87.5%}.hb-col-22{width:91.6667%}.hb-col-23{width:95.8333%}.hb-col-24{width:100%}.hb-col-offset-1{margin-left:4.16667%}.hb-col-offset-2{margin-left:8.33333%}.hb-col-offset-3{margin-left:12.5%}.hb-col-offset-4{margin-left:16.6667%}.hb-col-offset-5{margin-left:20.8333%}.hb-col-offset-6{margin-left:25%}.hb-col-offset-7{margin-left:29.1667%}.hb-col-offset-8{margin-left:33.3333%}.hb-col-offset-9{margin-left:37.5%}.hb-col-offset-10{margin-left:41.6667%}.hb-col-offset-11{margin-left:45.8333%}.hb-col-offset-12{margin-left:50%}.hb-col-offset-13{margin-left:54.1667%}.hb-col-offset-14{margin-left:58.3333%}.hb-col-offset-15{margin-left:62.5%}.hb-col-offset-16{margin-left:66.6667%}.hb-col-offset-17{margin-left:70.8333%}.hb-col-offset-18{margin-left:75%}.hb-col-offset-19{margin-left:79.1667%}.hb-col-offset-20{margin-left:83.3333%}.hb-col-offset-21{margin-left:87.5%}.hb-col-offset-22{margin-left:91.6667%}.hb-col-offset-23{margin-left:95.8333%}.hb-col-push-1{left:4.16667%}.hb-col-push-2{left:8.33333%}.hb-col-push-3{left:12.5%}.hb-col-push-4{left:16.6667%}.hb-col-push-5{left:20.8333%}.hb-col-push-6{left:25%}.hb-col-push-7{left:29.1667%}.hb-col-push-8{left:33.3333%}.hb-col-push-9{left:37.5%}.hb-col-push-10{left:41.6667%}.hb-col-push-11{left:45.8333%}.hb-col-push-12{left:50%}.hb-col-pull-1{right:4.16667%}.hb-col-pull-2{right:8.33333%}.hb-col-pull-3{right:12.5%}.hb-col-pull-4{right:16.6667%}.hb-col-pull-5{right:20.8333%}.hb-col-pull-6{right:25%}.hb-col-pull-7{right:29.1667%}.hb-col-pull-8{right:33.3333%}.hb-col-pull-9{right:37.5%}.hb-col-pull-10{right:41.6667%}.hb-col-pull-11{right:45.8333%}.hb-col-pull-12{right:50%}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}";
+const layoutCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.flex{display:flex}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-col{box-sizing:border-box;position:relative;width:100%}.hb-col-1{width:4.16667%}.hb-col-2{width:8.33333%}.hb-col-3{width:12.5%}.hb-col-4{width:16.6667%}.hb-col-5{width:20.8333%}.hb-col-6{width:25%}.hb-col-7{width:29.1667%}.hb-col-8{width:33.3333%}.hb-col-9{width:37.5%}.hb-col-10{width:41.6667%}.hb-col-11{width:45.8333%}.hb-col-12{width:50%}.hb-col-13{width:54.1667%}.hb-col-14{width:58.3333%}.hb-col-15{width:62.5%}.hb-col-16{width:66.6667%}.hb-col-17{width:70.8333%}.hb-col-18{width:75%}.hb-col-19{width:79.1667%}.hb-col-20{width:83.3333%}.hb-col-21{width:87.5%}.hb-col-22{width:91.6667%}.hb-col-23{width:95.8333%}.hb-col-24{width:100%}.hb-col-offset-1{margin-left:4.16667%}.hb-col-offset-2{margin-left:8.33333%}.hb-col-offset-3{margin-left:12.5%}.hb-col-offset-4{margin-left:16.6667%}.hb-col-offset-5{margin-left:20.8333%}.hb-col-offset-6{margin-left:25%}.hb-col-offset-7{margin-left:29.1667%}.hb-col-offset-8{margin-left:33.3333%}.hb-col-offset-9{margin-left:37.5%}.hb-col-offset-10{margin-left:41.6667%}.hb-col-offset-11{margin-left:45.8333%}.hb-col-offset-12{margin-left:50%}.hb-col-offset-13{margin-left:54.1667%}.hb-col-offset-14{margin-left:58.3333%}.hb-col-offset-15{margin-left:62.5%}.hb-col-offset-16{margin-left:66.6667%}.hb-col-offset-17{margin-left:70.8333%}.hb-col-offset-18{margin-left:75%}.hb-col-offset-19{margin-left:79.1667%}.hb-col-offset-20{margin-left:83.3333%}.hb-col-offset-21{margin-left:87.5%}.hb-col-offset-22{margin-left:91.6667%}.hb-col-offset-23{margin-left:95.8333%}.hb-col-push-1{left:4.16667%}.hb-col-push-2{left:8.33333%}.hb-col-push-3{left:12.5%}.hb-col-push-4{left:16.6667%}.hb-col-push-5{left:20.8333%}.hb-col-push-6{left:25%}.hb-col-push-7{left:29.1667%}.hb-col-push-8{left:33.3333%}.hb-col-push-9{left:37.5%}.hb-col-push-10{left:41.6667%}.hb-col-push-11{left:45.8333%}.hb-col-push-12{left:50%}.hb-col-pull-1{right:4.16667%}.hb-col-pull-2{right:8.33333%}.hb-col-pull-3{right:12.5%}.hb-col-pull-4{right:16.6667%}.hb-col-pull-5{right:20.8333%}.hb-col-pull-6{right:25%}.hb-col-pull-7{right:29.1667%}.hb-col-pull-8{right:33.3333%}.hb-col-pull-9{right:37.5%}.hb-col-pull-10{right:41.6667%}.hb-col-pull-11{right:45.8333%}.hb-col-pull-12{right:50%}.hb-col-xs-0{display:none}.hb-col-xs-1{width:4.16667%}.hb-col-xs-2{width:8.33333%}.hb-col-xs-3{width:12.5%}.hb-col-xs-4{width:16.6667%}.hb-col-xs-5{width:20.8333%}.hb-col-xs-6{width:25%}.hb-col-xs-7{width:29.1667%}.hb-col-xs-8{width:33.3333%}.hb-col-xs-9{width:37.5%}.hb-col-xs-10{width:41.6667%}.hb-col-xs-11{width:45.8333%}.hb-col-xs-12{width:50%}.hb-col-xs-13{width:54.1667%}.hb-col-xs-14{width:58.3333%}.hb-col-xs-15{width:62.5%}.hb-col-xs-16{width:66.6667%}.hb-col-xs-17{width:70.8333%}.hb-col-xs-18{width:75%}.hb-col-xs-19{width:79.1667%}.hb-col-xs-20{width:83.3333%}.hb-col-xs-21{width:87.5%}.hb-col-xs-22{width:91.6667%}.hb-col-xs-23{width:95.8333%}.hb-col-xs-24{width:100%}.hb-col-xs-offset-0{margin-left:0}.hb-col-xs-offset-1{margin-left:4.16667%}.hb-col-xs-offset-2{margin-left:8.33333%}.hb-col-xs-offset-3{margin-left:12.5%}.hb-col-xs-offset-4{margin-left:16.6667%}.hb-col-xs-offset-5{margin-left:20.8333%}.hb-col-xs-offset-6{margin-left:25%}.hb-col-xs-offset-7{margin-left:29.1667%}.hb-col-xs-offset-8{margin-left:33.3333%}.hb-col-xs-offset-9{margin-left:37.5%}.hb-col-xs-offset-10{margin-left:41.6667%}.hb-col-xs-offset-11{margin-left:45.8333%}.hb-col-xs-offset-12{margin-left:50%}.hb-col-xs-offset-13{margin-left:54.1667%}.hb-col-xs-offset-14{margin-left:58.3333%}.hb-col-xs-offset-15{margin-left:62.5%}.hb-col-xs-offset-16{margin-left:66.6667%}.hb-col-xs-offset-17{margin-left:70.8333%}.hb-col-xs-offset-18{margin-left:75%}.hb-col-xs-offset-19{margin-left:79.1667%}.hb-col-xs-offset-20{margin-left:83.3333%}.hb-col-xs-offset-21{margin-left:87.5%}.hb-col-xs-offset-22{margin-left:91.6667%}.hb-col-xs-offset-23{margin-left:95.8333%}.hb-col-xs-offset-24{margin-left:100%}.hb-col-xs-push-0{left:0}.hb-col-xs-push-1{left:4.16667%}.hb-col-xs-push-2{left:8.33333%}.hb-col-xs-push-3{left:12.5%}.hb-col-xs-push-4{left:16.6667%}.hb-col-xs-push-5{left:20.8333%}.hb-col-xs-push-6{left:25%}.hb-col-xs-push-7{left:29.1667%}.hb-col-xs-push-8{left:33.3333%}.hb-col-xs-push-9{left:37.5%}.hb-col-xs-push-10{left:41.6667%}.hb-col-xs-push-11{left:45.8333%}.hb-col-xs-push-12{left:50%}.hb-col-xs-push-13{left:54.1667%}.hb-col-xs-push-14{left:58.3333%}.hb-col-xs-push-15{left:62.5%}.hb-col-xs-push-16{left:66.6667%}.hb-col-xs-push-17{left:70.8333%}.hb-col-xs-push-18{left:75%}.hb-col-xs-push-19{left:79.1667%}.hb-col-xs-push-20{left:83.3333%}.hb-col-xs-push-21{left:87.5%}.hb-col-xs-push-22{left:91.6667%}.hb-col-xs-push-23{left:95.8333%}.hb-col-xs-push-24{left:100%}.hb-col-xs-pull-0{right:0}.hb-col-xs-pull-1{right:4.16667%}.hb-col-xs-pull-2{right:8.33333%}.hb-col-xs-pull-3{right:12.5%}.hb-col-xs-pull-4{right:16.6667%}.hb-col-xs-pull-5{right:20.8333%}.hb-col-xs-pull-6{right:25%}.hb-col-xs-pull-7{right:29.1667%}.hb-col-xs-pull-8{right:33.3333%}.hb-col-xs-pull-9{right:37.5%}.hb-col-xs-pull-10{right:41.6667%}.hb-col-xs-pull-11{right:45.8333%}.hb-col-xs-pull-12{right:50%}.hb-col-xs-pull-13{right:54.1667%}.hb-col-xs-pull-14{right:58.3333%}.hb-col-xs-pull-15{right:62.5%}.hb-col-xs-pull-16{right:66.6667%}.hb-col-xs-pull-17{right:70.8333%}.hb-col-xs-pull-18{right:75%}.hb-col-xs-pull-19{right:79.1667%}.hb-col-xs-pull-20{right:83.3333%}.hb-col-xs-pull-21{right:87.5%}.hb-col-xs-pull-22{right:91.6667%}.hb-col-xs-pull-23{right:95.8333%}.hb-col-xs-pull-24{right:100%}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@media (min-width:576px){.hb-col-sm-0{display:none}.hb-col-sm-1{width:4.16667%}.hb-col-sm-2{width:8.33333%}.hb-col-sm-3{width:12.5%}.hb-col-sm-4{width:16.6667%}.hb-col-sm-5{width:20.8333%}.hb-col-sm-6{width:25%}.hb-col-sm-7{width:29.1667%}.hb-col-sm-8{width:33.3333%}.hb-col-sm-9{width:37.5%}.hb-col-sm-10{width:41.6667%}.hb-col-sm-11{width:45.8333%}.hb-col-sm-12{width:50%}.hb-col-sm-13{width:54.1667%}.hb-col-sm-14{width:58.3333%}.hb-col-sm-15{width:62.5%}.hb-col-sm-16{width:66.6667%}.hb-col-sm-17{width:70.8333%}.hb-col-sm-18{width:75%}.hb-col-sm-19{width:79.1667%}.hb-col-sm-20{width:83.3333%}.hb-col-sm-21{width:87.5%}.hb-col-sm-22{width:91.6667%}.hb-col-sm-23{width:95.8333%}.hb-col-sm-24{width:100%}.hb-col-sm-offset-0{margin-left:0}.hb-col-sm-offset-1{margin-left:4.16667%}.hb-col-sm-offset-2{margin-left:8.33333%}.hb-col-sm-offset-3{margin-left:12.5%}.hb-col-sm-offset-4{margin-left:16.6667%}.hb-col-sm-offset-5{margin-left:20.8333%}.hb-col-sm-offset-6{margin-left:25%}.hb-col-sm-offset-7{margin-left:29.1667%}.hb-col-sm-offset-8{margin-left:33.3333%}.hb-col-sm-offset-9{margin-left:37.5%}.hb-col-sm-offset-10{margin-left:41.6667%}.hb-col-sm-offset-11{margin-left:45.8333%}.hb-col-sm-offset-12{margin-left:50%}.hb-col-sm-offset-13{margin-left:54.1667%}.hb-col-sm-offset-14{margin-left:58.3333%}.hb-col-sm-offset-15{margin-left:62.5%}.hb-col-sm-offset-16{margin-left:66.6667%}.hb-col-sm-offset-17{margin-left:70.8333%}.hb-col-sm-offset-18{margin-left:75%}.hb-col-sm-offset-19{margin-left:79.1667%}.hb-col-sm-offset-20{margin-left:83.3333%}.hb-col-sm-offset-21{margin-left:87.5%}.hb-col-sm-offset-22{margin-left:91.6667%}.hb-col-sm-offset-23{margin-left:95.8333%}.hb-col-sm-offset-24{margin-left:100%}.hb-col-sm-push-0{left:0}.hb-col-sm-push-1{left:4.16667%}.hb-col-sm-push-2{left:8.33333%}.hb-col-sm-push-3{left:12.5%}.hb-col-sm-push-4{left:16.6667%}.hb-col-sm-push-5{left:20.8333%}.hb-col-sm-push-6{left:25%}.hb-col-sm-push-7{left:29.1667%}.hb-col-sm-push-8{left:33.3333%}.hb-col-sm-push-9{left:37.5%}.hb-col-sm-push-10{left:41.6667%}.hb-col-sm-push-11{left:45.8333%}.hb-col-sm-push-12{left:50%}.hb-col-sm-push-13{left:54.1667%}.hb-col-sm-push-14{left:58.3333%}.hb-col-sm-push-15{left:62.5%}.hb-col-sm-push-16{left:66.6667%}.hb-col-sm-push-17{left:70.8333%}.hb-col-sm-push-18{left:75%}.hb-col-sm-push-19{left:79.1667%}.hb-col-sm-push-20{left:83.3333%}.hb-col-sm-push-21{left:87.5%}.hb-col-sm-push-22{left:91.6667%}.hb-col-sm-push-23{left:95.8333%}.hb-col-sm-push-24{left:100%}.hb-col-sm-pull-0{right:0}.hb-col-sm-pull-1{right:4.16667%}.hb-col-sm-pull-2{right:8.33333%}.hb-col-sm-pull-3{right:12.5%}.hb-col-sm-pull-4{right:16.6667%}.hb-col-sm-pull-5{right:20.8333%}.hb-col-sm-pull-6{right:25%}.hb-col-sm-pull-7{right:29.1667%}.hb-col-sm-pull-8{right:33.3333%}.hb-col-sm-pull-9{right:37.5%}.hb-col-sm-pull-10{right:41.6667%}.hb-col-sm-pull-11{right:45.8333%}.hb-col-sm-pull-12{right:50%}.hb-col-sm-pull-13{right:54.1667%}.hb-col-sm-pull-14{right:58.3333%}.hb-col-sm-pull-15{right:62.5%}.hb-col-sm-pull-16{right:66.6667%}.hb-col-sm-pull-17{right:70.8333%}.hb-col-sm-pull-18{right:75%}.hb-col-sm-pull-19{right:79.1667%}.hb-col-sm-pull-20{right:83.3333%}.hb-col-sm-pull-21{right:87.5%}.hb-col-sm-pull-22{right:91.6667%}.hb-col-sm-pull-23{right:95.8333%}.hb-col-sm-pull-24{right:100%}}@media (min-width:768px){.hb-col-md-0{display:none}.hb-col-md-1{width:4.16667%}.hb-col-md-2{width:8.33333%}.hb-col-md-3{width:12.5%}.hb-col-md-4{width:16.6667%}.hb-col-md-5{width:20.8333%}.hb-col-md-6{width:25%}.hb-col-md-7{width:29.1667%}.hb-col-md-8{width:33.3333%}.hb-col-md-9{width:37.5%}.hb-col-md-10{width:41.6667%}.hb-col-md-11{width:45.8333%}.hb-col-md-12{width:50%}.hb-col-md-13{width:54.1667%}.hb-col-md-14{width:58.3333%}.hb-col-md-15{width:62.5%}.hb-col-md-16{width:66.6667%}.hb-col-md-17{width:70.8333%}.hb-col-md-18{width:75%}.hb-col-md-19{width:79.1667%}.hb-col-md-20{width:83.3333%}.hb-col-md-21{width:87.5%}.hb-col-md-22{width:91.6667%}.hb-col-md-23{width:95.8333%}.hb-col-md-24{width:100%}.hb-col-md-offset-0{margin-left:0}.hb-col-md-offset-1{margin-left:4.16667%}.hb-col-md-offset-2{margin-left:8.33333%}.hb-col-md-offset-3{margin-left:12.5%}.hb-col-md-offset-4{margin-left:16.6667%}.hb-col-md-offset-5{margin-left:20.8333%}.hb-col-md-offset-6{margin-left:25%}.hb-col-md-offset-7{margin-left:29.1667%}.hb-col-md-offset-8{margin-left:33.3333%}.hb-col-md-offset-9{margin-left:37.5%}.hb-col-md-offset-10{margin-left:41.6667%}.hb-col-md-offset-11{margin-left:45.8333%}.hb-col-md-offset-12{margin-left:50%}.hb-col-md-offset-13{margin-left:54.1667%}.hb-col-md-offset-14{margin-left:58.3333%}.hb-col-md-offset-15{margin-left:62.5%}.hb-col-md-offset-16{margin-left:66.6667%}.hb-col-md-offset-17{margin-left:70.8333%}.hb-col-md-offset-18{margin-left:75%}.hb-col-md-offset-19{margin-left:79.1667%}.hb-col-md-offset-20{margin-left:83.3333%}.hb-col-md-offset-21{margin-left:87.5%}.hb-col-md-offset-22{margin-left:91.6667%}.hb-col-md-offset-23{margin-left:95.8333%}.hb-col-md-offset-24{margin-left:100%}.hb-col-md-push-0{left:0}.hb-col-md-push-1{left:4.16667%}.hb-col-md-push-2{left:8.33333%}.hb-col-md-push-3{left:12.5%}.hb-col-md-push-4{left:16.6667%}.hb-col-md-push-5{left:20.8333%}.hb-col-md-push-6{left:25%}.hb-col-md-push-7{left:29.1667%}.hb-col-md-push-8{left:33.3333%}.hb-col-md-push-9{left:37.5%}.hb-col-md-push-10{left:41.6667%}.hb-col-md-push-11{left:45.8333%}.hb-col-md-push-12{left:50%}.hb-col-md-push-13{left:54.1667%}.hb-col-md-push-14{left:58.3333%}.hb-col-md-push-15{left:62.5%}.hb-col-md-push-16{left:66.6667%}.hb-col-md-push-17{left:70.8333%}.hb-col-md-push-18{left:75%}.hb-col-md-push-19{left:79.1667%}.hb-col-md-push-20{left:83.3333%}.hb-col-md-push-21{left:87.5%}.hb-col-md-push-22{left:91.6667%}.hb-col-md-push-23{left:95.8333%}.hb-col-md-push-24{left:100%}.hb-col-md-pull-0{right:0}.hb-col-md-pull-1{right:4.16667%}.hb-col-md-pull-2{right:8.33333%}.hb-col-md-pull-3{right:12.5%}.hb-col-md-pull-4{right:16.6667%}.hb-col-md-pull-5{right:20.8333%}.hb-col-md-pull-6{right:25%}.hb-col-md-pull-7{right:29.1667%}.hb-col-md-pull-8{right:33.3333%}.hb-col-md-pull-9{right:37.5%}.hb-col-md-pull-10{right:41.6667%}.hb-col-md-pull-11{right:45.8333%}.hb-col-md-pull-12{right:50%}.hb-col-md-pull-13{right:54.1667%}.hb-col-md-pull-14{right:58.3333%}.hb-col-md-pull-15{right:62.5%}.hb-col-md-pull-16{right:66.6667%}.hb-col-md-pull-17{right:70.8333%}.hb-col-md-pull-18{right:75%}.hb-col-md-pull-19{right:79.1667%}.hb-col-md-pull-20{right:83.3333%}.hb-col-md-pull-21{right:87.5%}.hb-col-md-pull-22{right:91.6667%}.hb-col-md-pull-23{right:95.8333%}.hb-col-md-pull-24{right:100%}}@media (min-width:992px){.hb-col-lg-0{display:none}.hb-col-lg-1{width:4.16667%}.hb-col-lg-2{width:8.33333%}.hb-col-lg-3{width:12.5%}.hb-col-lg-4{width:16.6667%}.hb-col-lg-5{width:20.8333%}.hb-col-lg-6{width:25%}.hb-col-lg-7{width:29.1667%}.hb-col-lg-8{width:33.3333%}.hb-col-lg-9{width:37.5%}.hb-col-lg-10{width:41.6667%}.hb-col-lg-11{width:45.8333%}.hb-col-lg-12{width:50%}.hb-col-lg-13{width:54.1667%}.hb-col-lg-14{width:58.3333%}.hb-col-lg-15{width:62.5%}.hb-col-lg-16{width:66.6667%}.hb-col-lg-17{width:70.8333%}.hb-col-lg-18{width:75%}.hb-col-lg-19{width:79.1667%}.hb-col-lg-20{width:83.3333%}.hb-col-lg-21{width:87.5%}.hb-col-lg-22{width:91.6667%}.hb-col-lg-23{width:95.8333%}.hb-col-lg-24{width:100%}.hb-col-lg-offset-0{margin-left:0}.hb-col-lg-offset-1{margin-left:4.16667%}.hb-col-lg-offset-2{margin-left:8.33333%}.hb-col-lg-offset-3{margin-left:12.5%}.hb-col-lg-offset-4{margin-left:16.6667%}.hb-col-lg-offset-5{margin-left:20.8333%}.hb-col-lg-offset-6{margin-left:25%}.hb-col-lg-offset-7{margin-left:29.1667%}.hb-col-lg-offset-8{margin-left:33.3333%}.hb-col-lg-offset-9{margin-left:37.5%}.hb-col-lg-offset-10{margin-left:41.6667%}.hb-col-lg-offset-11{margin-left:45.8333%}.hb-col-lg-offset-12{margin-left:50%}.hb-col-lg-offset-13{margin-left:54.1667%}.hb-col-lg-offset-14{margin-left:58.3333%}.hb-col-lg-offset-15{margin-left:62.5%}.hb-col-lg-offset-16{margin-left:66.6667%}.hb-col-lg-offset-17{margin-left:70.8333%}.hb-col-lg-offset-18{margin-left:75%}.hb-col-lg-offset-19{margin-left:79.1667%}.hb-col-lg-offset-20{margin-left:83.3333%}.hb-col-lg-offset-21{margin-left:87.5%}.hb-col-lg-offset-22{margin-left:91.6667%}.hb-col-lg-offset-23{margin-left:95.8333%}.hb-col-lg-offset-24{margin-left:100%}.hb-col-lg-push-0{left:0}.hb-col-lg-push-1{left:4.16667%}.hb-col-lg-push-2{left:8.33333%}.hb-col-lg-push-3{left:12.5%}.hb-col-lg-push-4{left:16.6667%}.hb-col-lg-push-5{left:20.8333%}.hb-col-lg-push-6{left:25%}.hb-col-lg-push-7{left:29.1667%}.hb-col-lg-push-8{left:33.3333%}.hb-col-lg-push-9{left:37.5%}.hb-col-lg-push-10{left:41.6667%}.hb-col-lg-push-11{left:45.8333%}.hb-col-lg-push-12{left:50%}.hb-col-lg-push-13{left:54.1667%}.hb-col-lg-push-14{left:58.3333%}.hb-col-lg-push-15{left:62.5%}.hb-col-lg-push-16{left:66.6667%}.hb-col-lg-push-17{left:70.8333%}.hb-col-lg-push-18{left:75%}.hb-col-lg-push-19{left:79.1667%}.hb-col-lg-push-20{left:83.3333%}.hb-col-lg-push-21{left:87.5%}.hb-col-lg-push-22{left:91.6667%}.hb-col-lg-push-23{left:95.8333%}.hb-col-lg-push-24{left:100%}.hb-col-lg-pull-0{right:0}.hb-col-lg-pull-1{right:4.16667%}.hb-col-lg-pull-2{right:8.33333%}.hb-col-lg-pull-3{right:12.5%}.hb-col-lg-pull-4{right:16.6667%}.hb-col-lg-pull-5{right:20.8333%}.hb-col-lg-pull-6{right:25%}.hb-col-lg-pull-7{right:29.1667%}.hb-col-lg-pull-8{right:33.3333%}.hb-col-lg-pull-9{right:37.5%}.hb-col-lg-pull-10{right:41.6667%}.hb-col-lg-pull-11{right:45.8333%}.hb-col-lg-pull-12{right:50%}.hb-col-lg-pull-13{right:54.1667%}.hb-col-lg-pull-14{right:58.3333%}.hb-col-lg-pull-15{right:62.5%}.hb-col-lg-pull-16{right:66.6667%}.hb-col-lg-pull-17{right:70.8333%}.hb-col-lg-pull-18{right:75%}.hb-col-lg-pull-19{right:79.1667%}.hb-col-lg-pull-20{right:83.3333%}.hb-col-lg-pull-21{right:87.5%}.hb-col-lg-pull-22{right:91.6667%}.hb-col-lg-pull-23{right:95.8333%}.hb-col-lg-pull-24{right:100%}}@media (min-width:1200px){.hb-col-xl-0{display:none}.hb-col-xl-1{width:4.16667%}.hb-col-xl-2{width:8.33333%}.hb-col-xl-3{width:12.5%}.hb-col-xl-4{width:16.6667%}.hb-col-xl-5{width:20.8333%}.hb-col-xl-6{width:25%}.hb-col-xl-7{width:29.1667%}.hb-col-xl-8{width:33.3333%}.hb-col-xl-9{width:37.5%}.hb-col-xl-10{width:41.6667%}.hb-col-xl-11{width:45.8333%}.hb-col-xl-12{width:50%}.hb-col-xl-13{width:54.1667%}.hb-col-xl-14{width:58.3333%}.hb-col-xl-15{width:62.5%}.hb-col-xl-16{width:66.6667%}.hb-col-xl-17{width:70.8333%}.hb-col-xl-18{width:75%}.hb-col-xl-19{width:79.1667%}.hb-col-xl-20{width:83.3333%}.hb-col-xl-21{width:87.5%}.hb-col-xl-22{width:91.6667%}.hb-col-xl-23{width:95.8333%}.hb-col-xl-24{width:100%}.hb-col-xl-offset-0{margin-left:0}.hb-col-xl-offset-1{margin-left:4.16667%}.hb-col-xl-offset-2{margin-left:8.33333%}.hb-col-xl-offset-3{margin-left:12.5%}.hb-col-xl-offset-4{margin-left:16.6667%}.hb-col-xl-offset-5{margin-left:20.8333%}.hb-col-xl-offset-6{margin-left:25%}.hb-col-xl-offset-7{margin-left:29.1667%}.hb-col-xl-offset-8{margin-left:33.3333%}.hb-col-xl-offset-9{margin-left:37.5%}.hb-col-xl-offset-10{margin-left:41.6667%}.hb-col-xl-offset-11{margin-left:45.8333%}.hb-col-xl-offset-12{margin-left:50%}.hb-col-xl-offset-13{margin-left:54.1667%}.hb-col-xl-offset-14{margin-left:58.3333%}.hb-col-xl-offset-15{margin-left:62.5%}.hb-col-xl-offset-16{margin-left:66.6667%}.hb-col-xl-offset-17{margin-left:70.8333%}.hb-col-xl-offset-18{margin-left:75%}.hb-col-xl-offset-19{margin-left:79.1667%}.hb-col-xl-offset-20{margin-left:83.3333%}.hb-col-xl-offset-21{margin-left:87.5%}.hb-col-xl-offset-22{margin-left:91.6667%}.hb-col-xl-offset-23{margin-left:95.8333%}.hb-col-xl-offset-24{margin-left:100%}.hb-col-xl-push-0{left:0}.hb-col-xl-push-1{left:4.16667%}.hb-col-xl-push-2{left:8.33333%}.hb-col-xl-push-3{left:12.5%}.hb-col-xl-push-4{left:16.6667%}.hb-col-xl-push-5{left:20.8333%}.hb-col-xl-push-6{left:25%}.hb-col-xl-push-7{left:29.1667%}.hb-col-xl-push-8{left:33.3333%}.hb-col-xl-push-9{left:37.5%}.hb-col-xl-push-10{left:41.6667%}.hb-col-xl-push-11{left:45.8333%}.hb-col-xl-push-12{left:50%}.hb-col-xl-push-13{left:54.1667%}.hb-col-xl-push-14{left:58.3333%}.hb-col-xl-push-15{left:62.5%}.hb-col-xl-push-16{left:66.6667%}.hb-col-xl-push-17{left:70.8333%}.hb-col-xl-push-18{left:75%}.hb-col-xl-push-19{left:79.1667%}.hb-col-xl-push-20{left:83.3333%}.hb-col-xl-push-21{left:87.5%}.hb-col-xl-push-22{left:91.6667%}.hb-col-xl-push-23{left:95.8333%}.hb-col-xl-push-24{left:100%}.hb-col-xl-pull-0{right:0}.hb-col-xl-pull-1{right:4.16667%}.hb-col-xl-pull-2{right:8.33333%}.hb-col-xl-pull-3{right:12.5%}.hb-col-xl-pull-4{right:16.6667%}.hb-col-xl-pull-5{right:20.8333%}.hb-col-xl-pull-6{right:25%}.hb-col-xl-pull-7{right:29.1667%}.hb-col-xl-pull-8{right:33.3333%}.hb-col-xl-pull-9{right:37.5%}.hb-col-xl-pull-10{right:41.6667%}.hb-col-xl-pull-11{right:45.8333%}.hb-col-xl-pull-12{right:50%}.hb-col-xl-pull-13{right:54.1667%}.hb-col-xl-pull-14{right:58.3333%}.hb-col-xl-pull-15{right:62.5%}.hb-col-xl-pull-16{right:66.6667%}.hb-col-xl-pull-17{right:70.8333%}.hb-col-xl-pull-18{right:75%}.hb-col-xl-pull-19{right:79.1667%}.hb-col-xl-pull-20{right:83.3333%}.hb-col-xl-pull-21{right:87.5%}.hb-col-xl-pull-22{right:91.6667%}.hb-col-xl-pull-23{right:95.8333%}.hb-col-xl-pull-24{right:100%}}";
 const HbLayoutStyle0 = layoutCss;
 const Layout = /*@__PURE__*/ proxyCustomElement(class Layout extends H {
@@ -30,43 +30,65 @@ const Layout = /*@__PURE__*/ proxyCustomElement(class Layout extends H {
      */
     pull = 0;
     /**
-     * <768px 响应式栅格数或者栅格属性对象
+     * <576px 响应式栅格数或者栅格属性对象
      */
     xs;
     /**
-     * ≥768px 响应式栅格数或者栅格属性对象
+     * ≥576px 响应式栅格数或者栅格属性对象
      */
     sm;
     /**
-     * ≥992px 响应式栅格数或者栅格属性对象
+     * ≥768px 响应式栅格数或者栅格属性对象
      */
     md;
     /**
-     * ≥1200px 响应式栅格数或者栅格属性对象
+     * ≥992px 响应式栅格数或者栅格属性对象
      */
     lg;
     /**
-     * ≥1920px 响应式栅格数或者栅格属性对象
+     * ≥1200px 响应式栅格数或者栅格属性对象
      */
     xl;
+    /** 把响应式 prop（number 或对象）规范化为 {span,offset,push,pull} */
+    normalizeResponsive(value) {
+        if (value === undefined || value === null)
+            return {};
+        if (typeof value === 'number')
+            return { span: value };
+        return value;
+    }
     getColClass() {
         const classes = ['hb-col'];
-        if (this.span) {
+        // 基础（无断点）span/offset/push/pull —— 仅在没有 xs 时作为 xs 默认（antd 行为）
+        if (this.span)
             classes.push(`hb-col-${this.span}`);
-        }
-        if (this.offset) {
+        if (this.offset)
             classes.push(`hb-col-offset-${this.offset}`);
-        }
-        if (this.push) {
+        if (this.push)
             classes.push(`hb-col-push-${this.push}`);
-        }
-        if (this.pull) {
+        if (this.pull)
             classes.push(`hb-col-pull-${this.pull}`);
+        // 响应式断点：生成 hb-col-{bp}-{span} / hb-col-{bp}-offset-{n} 等 class，
+        // CSS 用 @media 在对应断点应用（覆盖基础值）。
+        const bps = ['xs', 'sm', 'md', 'lg', 'xl'];
+        for (const bp of bps) {
+            const v = this[bp];
+            if (v === undefined)
+                continue;
+            const r = this.normalizeResponsive(v);
+            if (r.span !== undefined)
+                classes.push(`hb-col-${bp}-${r.span}`);
+            if (r.offset !== undefined)
+                classes.push(`hb-col-${bp}-offset-${r.offset}`);
+            if (r.push !== undefined)
+                classes.push(`hb-col-${bp}-push-${r.push}`);
+            if (r.pull !== undefined)
+                classes.push(`hb-col-${bp}-pull-${r.pull}`);
         }
         return classes.join(' ');
     }
     render() {
-        return (h("div", { key: 'fc06cef5bbbcb0c108907a16b5c96fe8dc9f4f77', class: this.getColClass() }, h("slot", { key: '9ca9f6e93df8c29dc901f84a39b3eed635b953bb' })));
+        return (h("div", { key: '4a746d8ded47283a969473aa8cfbd65ad174a18f', class: this.getColClass() }, h("slot", { key: '5c6a2eacb1a2c84678e210cc75aec9a085ae902a' })));
     }
     static get style() { return HbLayoutStyle0; }
 }, [1, "hb-layout", {

package/dist/components/hb-layout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"hb-layout.js","mappings":";;AAAA,MAAM,SAAS,GAAG,8xPAA8xP,CAAC;AACjzP,uBAAe,SAAS;;MCUX,MAAM;;;;;;;;;;IAKT,IAAI,GAAW,EAAE,CAAC;;;;;IAMlB,MAAM,GAAW,CAAC,CAAC;;;;;IAMnB,IAAI,GAAW,CAAC,CAAC;;;;;IAMjB,IAAI,GAAW,CAAC,CAAC;;;;IAKjB,EAAE,CAAmB;;;;IAKrB,EAAE,CAAmB;;;;IAKrB,EAAE,CAAmB;;;;IAKrB,EAAE,CAAmB;;;;IAKrB,EAAE,CAAmB;IAErB,WAAW;QACjB,MAAM,OAAO,GAAa,CAAC,QAAQ,CAAC,CAAC;QAErC,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;SACrC;QACD,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,OAAO,CAAC,IAAI,CAAC,iBAAiB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;SAC9C;QACD,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;SAC1C;QACD,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;SAC1C;QAED,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,IAC5B,8DAAa,CACT,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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","import { Component, h, Prop } from '@stencil/core';\n\n/\n Layout 布局组件\n * 通过基础的 24 分栏，迅速简便地创建布局\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 <768px 响应式栅格数或者栅格属性对象\n /\n @Prop() xs?: number \| object;\n\n /\n ≥768px 响应式栅格数或者栅格属性对象\n /\n @Prop() sm?: number \| object;\n\n /\n ≥992px 响应式栅格数或者栅格属性对象\n /\n @Prop() md?: number \| object;\n\n /\n ≥1200px 响应式栅格数或者栅格属性对象\n /\n @Prop() lg?: number \| object;\n\n /\n ≥1920px 响应式栅格数或者栅格属性对象\n */\n @Prop() xl?: number \| object;\n\n private getColClass() {\n const classes: string[] = ['hb-col'];\n \n if (this.span) {\n classes.push(`hb-col-${this.span}`);\n }\n if (this.offset) {\n classes.push(`hb-col-offset-${this.offset}`);\n }\n if (this.push) {\n classes.push(`hb-col-push-${this.push}`);\n }\n if (this.pull) {\n classes.push(`hb-col-pull-${this.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}
1	+ {"file":"hb-layout.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,QACE,4DAAK,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,IAC5B,8DAAa,CACT,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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}

package/dist/components/hb-link.js CHANGED Viewed

@@ -50,12 +50,12 @@ const Link = /*@__PURE__*/ proxyCustomElement(class Link extends H {
     };
     render() {
         const Tag = this.href ? 'a' : 'span';
-        return (h(Tag, { key: 'f4aac8cc7a366ae0c9b4b24fa0d3ee80f79da58b', class: {
+        return (h(Tag, { key: '7903426ed8f9d0553bfabf22068e8e74f4bc6232', 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 && h("i", { key: '4b2675a1daf216c9ee79ea12bcab5ed24fd858ca', class: this.icon }), h("slot", { key: '948264261fa279325d939820adb2c67ae7aaf465' })));
+            }, href: this.disabled ? undefined : this.href, target: this.target, onClick: this.handleClick }, this.icon && h("i", { key: '1945af3c95d3d9a29a2bbed159d48b10230f8901', class: this.icon }), h("slot", { key: '2499cb000e716f05f55c230a8c8ad72f15ce215a' })));
     }
     static get style() { return HbLinkStyle0; }
 }, [1, "hb-link", {

package/dist/components/hb-loading.js CHANGED Viewed

@@ -16,11 +16,11 @@ const Loading = /*@__PURE__*/ proxyCustomElement(class Loading extends H {
     /** 是否全屏显示 */
     fullscreen = false;
     render() {
-        return (h("div", { key: 'a29b2a7301ecd1ea3d4cc775b3eb842f591be4c3', class: {
+        return (h("div", { key: 'd8e3b21dac5f910d9a927180425753b0245550ee', class: {
                 'hb-loading': true,
                 'hb-loading--fullscreen': this.fullscreen,
                 [`hb-loading--${this.size}`]: true,
-            } }, h("div", { key: 'c429099b5e4c3d5ac229cd2d4befb58f9baff269', class: "hb-loading__spinner" }, h("div", { key: '36e30057b133e3d1f0874da7d2be3d933292fc26', class: "hb-loading__circle" }), this.text && h("div", { key: 'a13830edf63e082e26f14d9d120763cf3e7a8003', class: "hb-loading__text" }, this.text))));
+            } }, h("div", { key: '1aa9028b7e6c3ac550c0d8f6fd2e36ffd8a6b10a', class: "hb-loading__spinner" }, h("div", { key: 'ee52c55b1d98b7b48eac202d4c58e699b5df32e6', class: "hb-loading__circle" }), this.text && h("div", { key: 'e9221d649116747f720afb8d380c4a5caf6192d9', class: "hb-loading__text" }, this.text))));
     }
     static get style() { return HbLoadingStyle0; }
 }, [1, "hb-loading", {

package/dist/components/hb-main.js CHANGED Viewed

@@ -10,7 +10,7 @@ const Main = /*@__PURE__*/ proxyCustomElement(class Main extends H {
         this.__attachShadow();
     }
     render() {
-        return (h("main", { key: 'd326db7b0e9de0ff411ca3af99f2399a5e760557', class: "hb-main" }, h("slot", { key: 'cea61788b327d41f6307be518c368eca41a254b2' })));
+        return (h("main", { key: '98dd998acef2d0cf91173425d84b5e14cd86c104', class: "hb-main" }, h("slot", { key: 'e508104800157f61bec0b0754371c83a4a76dabe' })));
     }
     static get style() { return HbMainStyle0; }
 }, [1, "hb-main"]);

package/dist/components/hb-menu-item.js CHANGED Viewed

@@ -35,11 +35,11 @@ const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends H {
         }
     };
     render() {
-        return (h("li", { key: '34b8ae3ee2a580757cd0c01261772e6de97bf332', class: {
+        return (h("li", { key: '73a414a55166b598c78b6a3d0471cae5559a6aa6', 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 && h("span", { key: 'a0b70a81ce4f8ed1cef7bd37c5b194a02554bc22', class: "hb-menu-item__icon" }, this.icon), h("span", { key: '8ef65eda6376d1e16ed614fa30e7cef532abc2ad', class: "hb-menu-item__text" }, h("slot", { key: '716cf4bc2cd4cd6d992010759d55f2924662cd9a' }))));
+            }, 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 && h("span", { key: '375938585e3f0b1550912723c93fe2f391f4e407', class: "hb-menu-item__icon" }, this.icon), h("span", { key: '6db5289368546e0695d386826700805d53660c68', class: "hb-menu-item__text" }, h("slot", { key: '1d2fc9baece71764747c07148de07de612b2f4b1' }))));
     }
 }, [1, "hb-menu-item", {
         "key": [1],

package/dist/components/hb-menu.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-1407a5e8.js';
-const menuCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-menu{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));border-right:1px solid var(--hb-color-border-secondary);box-sizing:border-box;color:var(--hb-menu-color,var(--hb-color-text));font-size:var(--hb-font-size-sm);list-style:none;margin:0;padding:4px 0}.hb-menu--horizontal{border-bottom:1px solid var(--hb-color-border-secondary);border-right:none;display:flex}.hb-menu--collapsed{width:64px}.hb-menu--collapsed .hb-menu-item__text,.hb-menu--collapsed .hb-sub-menu__arrow,.hb-menu--collapsed .hb-sub-menu__label{display:none}.hb-sub-menu--collapsed{position:relative}.hb-sub-menu--collapsed .hb-sub-menu__title{justify-content:center;padding:0}.hb-sub-menu__children--popover{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));border:1px solid var(--hb-color-border-secondary);border-radius:var(--hb-radius-sm,4px);box-shadow:0 2px 8px #0000001f;left:100%;margin-left:4px;min-width:160px;padding:4px 0;position:absolute;top:0;white-space:nowrap;z-index:1000}.hb-sub-menu__children--popover .hb-menu-item{padding-left:var(--hb-spacing-md)}::slotted(hb-menu-item){display:block}.hb-menu-item{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--hb-spacing-xs);height:var(--hb-size-default);line-height:var(--hb-size-default);list-style:none;padding:0 var(--hb-spacing-md);transition:all var(--hb-transition-duration)var(--hb-transition-function);white-space:nowrap}.hb-menu-item:hover:not(.hb-menu-item--disabled){background-color:var(--hb-menu-item-hover-bg,var(--hb-color-fill-tertiary))}.hb-menu-item--active{background-color:var(--hb-menu-item-active-bg,var(--hb-color-primary-bg));color:var(--hb-menu-active-color,var(--hb-color-primary))}.hb-menu-item--disabled{cursor:not-allowed;opacity:.5}.hb-menu-item__icon{display:inline-flex;width:16px}.hb-sub-menu{list-style:none}.hb-sub-menu__title{align-items:center;cursor:pointer;display:flex;gap:var(--hb-spacing-xs);height:var(--hb-size-default);line-height:var(--hb-size-default);padding:0 var(--hb-spacing-md);transition:all var(--hb-transition-duration)}.hb-sub-menu__title:hover{background-color:var(--hb-menu-item-hover-bg,var(--hb-color-fill-tertiary))}.hb-sub-menu__label{flex:1}.hb-sub-menu__arrow{font-size:10px;transition:transform var(--hb-transition-duration)}.hb-sub-menu__arrow--open{transform:rotate(90deg)}.hb-sub-menu__children{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));list-style:none;margin:0;padding:0}.hb-sub-menu__children .hb-menu-item{padding-left:calc(var(--hb-spacing-md) + var(--hb-spacing-lg))}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}";
+const menuCss = "/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex;padding-block:0}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}} /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{}@layer base{}@layer components;:host{display:block}.hb-menu{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));border-right:1px solid var(--hb-color-border-secondary);box-sizing:border-box;color:var(--hb-menu-color,var(--hb-color-text));font-size:var(--hb-font-size-sm);list-style:none;margin:0;padding:4px 0}.hb-menu--horizontal{border-bottom:1px solid var(--hb-color-border-secondary);border-right:none;display:flex}.hb-menu--collapsed{width:64px}.hb-menu--collapsed .hb-menu-item__text,.hb-menu--collapsed .hb-sub-menu__arrow,.hb-menu--collapsed .hb-sub-menu__label{display:none}.hb-sub-menu--collapsed{position:relative}.hb-sub-menu--collapsed .hb-sub-menu__title{justify-content:center;padding:0}.hb-sub-menu__children--popover{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));border:1px solid var(--hb-color-border-secondary);border-radius:var(--hb-radius-sm,4px);box-shadow:0 2px 8px #0000001f;left:100%;margin-left:4px;min-width:160px;padding:4px 0;position:absolute;top:0;white-space:nowrap;z-index:1000}.hb-sub-menu__children--popover .hb-menu-item{padding-left:var(--hb-spacing-md)}::slotted(hb-menu-item){display:block}.hb-menu-item{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--hb-spacing-xs);height:var(--hb-size-default);line-height:var(--hb-size-default);list-style:none;padding:0 var(--hb-spacing-md);transition:all var(--hb-transition-duration)var(--hb-transition-function);white-space:nowrap}.hb-menu-item:hover:not(.hb-menu-item--disabled){background-color:var(--hb-menu-item-hover-bg,var(--hb-color-fill-tertiary))}.hb-menu-item--active{background-color:var(--hb-menu-item-active-bg,var(--hb-color-primary-bg));color:var(--hb-menu-active-color,var(--hb-color-primary))}.hb-menu-item--disabled{cursor:not-allowed;opacity:.5}.hb-menu-item__icon{display:inline-flex;width:16px}.hb-sub-menu{list-style:none}.hb-sub-menu__title{align-items:center;cursor:pointer;display:flex;gap:var(--hb-spacing-xs);height:var(--hb-size-default);line-height:var(--hb-size-default);padding:0 var(--hb-spacing-md);transition:all var(--hb-transition-duration)}.hb-sub-menu__title:hover{background-color:var(--hb-menu-item-hover-bg,var(--hb-color-fill-tertiary))}.hb-sub-menu__label{flex:1}.hb-sub-menu__arrow{font-size:10px;transition:transform var(--hb-transition-duration)}.hb-sub-menu__arrow--open{transform:rotate(90deg)}.hb-sub-menu__children{background-color:var(--hb-menu-bg,var(--hb-color-bg-container));list-style:none;margin:0;padding:0}.hb-sub-menu__children .hb-menu-item{padding-left:calc(var(--hb-spacing-md) + var(--hb-spacing-lg))}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@media (max-width:575.98px){.hb-menu--horizontal{align-items:stretch;flex-direction:column;gap:2px}.hb-menu--horizontal .hb-menu-item,.hb-menu--horizontal .hb-sub-menu{padding:10px 12px}:host .hb-menu-item__text,:host .hb-sub-menu__label{display:inline}}";
 const HbMenuStyle0 = menuCss;
 const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends H {
@@ -67,11 +67,11 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends H {
             style['--hb-menu-color'] = this.textColor;
         if (this.activeTextColor)
             style['--hb-menu-active-color'] = this.activeTextColor;
-        return (h("ul", { key: '0352bda3d62d4a280681612a7bf301f16459bcc0', class: {
+        return (h("ul", { key: '8ed9611af410b2d453c01b9e026efb787c62cea6', class: {
                 'hb-menu': true,
                 [`hb-menu--${this.mode}`]: true,
                 'hb-menu--collapsed': this.collapsed,
-            }, style: style, role: "menu" }, h("slot", { key: '142fea193616a6e311b854f6bd893e0646950b29' })));
+            }, style: style, role: "menu" }, h("slot", { key: '7eb6d2b0fdd4ab9b3a0866ff4ba7c2c23bfdd6dd' })));
     }
     static get watchers() { return {
         "defaultActive": ["handleDefaultActiveChange"],

package/dist/components/hb-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"hb-menu.js","mappings":";;AAAA,MAAM,OAAO,GAAG,~~2nQAA2nQ~~,CAAC;~~AAC5oQ~~,qBAAe,OAAO;;MCUT,IAAI;;;;;;;;;IAIP,IAAI,GAA8B,UAAU,CAAC;;IAG5B,aAAa,GAAW,EAAE,CAAC;;IAG5C,SAAS,GAAY,KAAK,CAAC;;IAG3B,eAAe,CAAU;;IAGzB,SAAS,CAAU;;IAGnB,eAAe,CAAU;IAExB,UAAU,GAAW,EAAE,CAAC;;IAGxB,QAAQ,CAAuB;IAExC,gBAAgB;QACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC;;QAErC,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;IAGD,yBAAyB;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC;KACtC;IAGD,qBAAqB;QACnB,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;;;;;IAMO,uBAAuB;QAC7B,IAAI,CAAC,IAAI,CAAC,EAAE;YAAE,OAAO;QACrB,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG;YAClD,GAAG,CAAC,YAAY,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;SAClE,CAAC,CAAC;KACJ;;IAID,YAAY,CAAC,KAA0B;QACrC,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC;QACtB,IAAI,CAAC,aAAa,GAAG,GAAG,CAAC;QACzB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;QAExB,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI;YACpD,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;SAClF,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,MAAM,KAAK,GAA2B,EAAE,CAAC;QACzC,IAAI,IAAI,CAAC,eAAe;YAAE,KAAK,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC;QACvE,IAAI,IAAI,CAAC,SAAS;YAAE,KAAK,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;QAC9D,IAAI,IAAI,CAAC,eAAe;YAAE,KAAK,CAAC,wBAAwB,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC;QAEjF,QACE,2DACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,CAAC,YAAY,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;gBAC/B,oBAAoB,EAAE,IAAI,CAAC,SAAS;aACrC,EACD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,MAAM,IAEX,8DAAQ,CACL,EACL;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Menu/menu.css?tag=hb-menu&encapsulation=shadow","src/components/Menu/Menu.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hb-menu {\n list-style: none;\n margin: 0;\n padding: 4px 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n color: var(--hb-menu-color, var(--hb-color-text));\n font-size: var(--hb-font-size-sm);\n border-right: 1px solid var(--hb-color-border-secondary);\n box-sizing: border-box;\n}\n\n/* ---- 水平模式 ---- /\n.hb-menu--horizontal {\n display: flex;\n border-right: none;\n border-bottom: 1px solid var(--hb-color-border-secondary);\n}\n\n/ ---- 折叠 ---- /\n.hb-menu--collapsed {\n width: 64px;\n}\n.hb-menu--collapsed .hb-menu-item__text,\n.hb-menu--collapsed .hb-sub-menu__label,\n.hb-menu--collapsed .hb-sub-menu__arrow {\n display: none;\n}\n\n/ 折叠态 SubMenu：图标条布局（仅显示 icon），不再就地展开 /\n.hb-sub-menu--collapsed {\n position: relative;\n}\n.hb-sub-menu--collapsed .hb-sub-menu__title {\n justify-content: center;\n padding: 0;\n}\n\n/ 折叠态浮层：绝对定位弹出在右侧 /\n.hb-sub-menu__children--popover {\n position: absolute;\n left: 100%;\n top: 0;\n margin-left: 4px;\n min-width: 160px;\n padding: 4px 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n border: 1px solid var(--hb-color-border-secondary);\n border-radius: var(--hb-radius-sm, 4px);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n z-index: 1000;\n white-space: nowrap;\n}\n\n/ 折叠态浮层内的 MenuItem 取消就地展开时的缩进 /\n.hb-sub-menu__children--popover .hb-menu-item {\n padding-left: var(--hb-spacing-md);\n}\n\n/ ---- MenuItem ---- /\n::slotted(hb-menu-item) {\n display: block;\n}\n\n.hb-menu-item {\n display: flex;\n align-items: center;\n gap: var(--hb-spacing-xs);\n padding: 0 var(--hb-spacing-md);\n height: var(--hb-size-default);\n line-height: var(--hb-size-default);\n cursor: pointer;\n transition: all var(--hb-transition-duration) var(--hb-transition-function);\n white-space: nowrap;\n list-style: none;\n box-sizing: border-box;\n}\n\n.hb-menu-item:hover:not(.hb-menu-item--disabled) {\n background-color: var(--hb-menu-item-hover-bg, var(--hb-color-fill-tertiary));\n}\n\n.hb-menu-item--active {\n color: var(--hb-menu-active-color, var(--hb-color-primary));\n background-color: var(--hb-menu-item-active-bg, var(--hb-color-primary-bg));\n}\n\n.hb-menu-item--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.hb-menu-item__icon {\n display: inline-flex;\n width: 16px;\n}\n\n/ ---- SubMenu ---- /\n.hb-sub-menu {\n list-style: none;\n}\n\n.hb-sub-menu__title {\n display: flex;\n align-items: center;\n gap: var(--hb-spacing-xs);\n padding: 0 var(--hb-spacing-md);\n height: var(--hb-size-default);\n line-height: var(--hb-size-default);\n cursor: pointer;\n transition: all var(--hb-transition-duration);\n}\n\n.hb-sub-menu__title:hover {\n background-color: var(--hb-menu-item-hover-bg, var(--hb-color-fill-tertiary));\n}\n\n.hb-sub-menu__label {\n flex: 1;\n}\n\n.hb-sub-menu__arrow {\n font-size: 10px;\n transition: transform var(--hb-transition-duration);\n}\n\n.hb-sub-menu__arrow--open {\n transform: rotate(90deg);\n}\n\n.hb-sub-menu__children {\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n}\n\n.hb-sub-menu__children .hb-menu-item {\n padding-left: calc(var(--hb-spacing-md) + var(--hb-spacing-lg));\n}\n","import { Component, h, Prop, State, Element, Watch, Event, EventEmitter, Listen } from '@stencil/core';\n\n/\n Menu 导航菜单组件\n * 为页面和功能提供导航的菜单\n /\n@Component({\n tag: 'hb-menu',\n styleUrl: 'menu.css',\n shadow: true,\n})\nexport class Menu {\n @Element() el: HTMLElement;\n\n /* 模式 /\n @Prop() mode: 'horizontal' \| 'vertical' = 'vertical';\n\n /* 当前激活菜单项 /\n @Prop({ mutable: true }) defaultActive: string = '';\n\n /* 是否折叠（仅垂直模式） /\n @Prop() collapsed: boolean = false;\n\n /* 背景色 /\n @Prop() backgroundColor?: string;\n\n /* 文字颜色 /\n @Prop() textColor?: string;\n\n /* 激活项文字颜色 /\n @Prop() activeTextColor?: string;\n\n @State() activeItem: string = '';\n\n /* 选中事件 /\n @Event() hbSelect: EventEmitter<string>;\n\n componentDidLoad() {\n this.activeItem = this.defaultActive;\n // 折叠态透传给子 hb-sub-menu（子组件无法继承 prop，需在 host 属性层面同步）\n this.syncCollapsedToChildren();\n }\n\n @Watch('defaultActive')\n handleDefaultActiveChange() {\n this.activeItem = this.defaultActive;\n }\n\n @Watch('collapsed')\n handleCollapsedChange() {\n this.syncCollapsedToChildren();\n }\n\n /\n 把 collapsed 状态同步到所有直连与嵌套的 hb-sub-menu 子节点。\n * querySelectorAll 递归匹配，因此 hb-sub-menu > hb-sub-menu（多级）也会被覆盖。\n /\n private syncCollapsedToChildren() {\n if (!this.el) return;\n this.el.querySelectorAll('hb-sub-menu').forEach((sub) => {\n sub.setAttribute('collapsed', this.collapsed ? 'true' : 'false');\n });\n }\n\n /* 监听子 hb-menu-item 派发的内部选中事件，更新激活态并向外发射公开的 hbSelect */\n @Listen('hbMenuItemSelect')\n handleSelect(event: CustomEvent<string>) {\n const key = event.detail;\n this.activeItem = key;\n this.defaultActive = key;\n this.hbSelect.emit(key);\n // 通知子组件（含嵌套在 hb-sub-menu 内的 hb-menu-item）\n this.el.querySelectorAll('hb-menu-item').forEach((item) => {\n item.setAttribute('active', item.getAttribute('key') === key ? 'true' : 'false');\n });\n }\n\n render() {\n const style: Record<string, string> = {};\n if (this.backgroundColor) style['--hb-menu-bg'] = this.backgroundColor;\n if (this.textColor) style['--hb-menu-color'] = this.textColor;\n if (this.activeTextColor) style['--hb-menu-active-color'] = this.activeTextColor;\n\n return (\n <ul\n class={{\n 'hb-menu': true,\n [`hb-menu--${this.mode}`]: true,\n 'hb-menu--collapsed': this.collapsed,\n }}\n style={style}\n role=\"menu\"\n >\n <slot />\n </ul>\n );\n }\n}\n"],"version":3}
1	+ {"file":"hb-menu.js","mappings":";;AAAA,MAAM,OAAO,GAAG,y3QAAy3Q,CAAC;AAC14Q,qBAAe,OAAO;;MCUT,IAAI;;;;;;;;;IAIP,IAAI,GAA8B,UAAU,CAAC;;IAG5B,aAAa,GAAW,EAAE,CAAC;;IAG5C,SAAS,GAAY,KAAK,CAAC;;IAG3B,eAAe,CAAU;;IAGzB,SAAS,CAAU;;IAGnB,eAAe,CAAU;IAExB,UAAU,GAAW,EAAE,CAAC;;IAGxB,QAAQ,CAAuB;IAExC,gBAAgB;QACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC;;QAErC,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;IAGD,yBAAyB;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC;KACtC;IAGD,qBAAqB;QACnB,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAChC;;;;;IAMO,uBAAuB;QAC7B,IAAI,CAAC,IAAI,CAAC,EAAE;YAAE,OAAO;QACrB,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG;YAClD,GAAG,CAAC,YAAY,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;SAClE,CAAC,CAAC;KACJ;;IAID,YAAY,CAAC,KAA0B;QACrC,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC;QACtB,IAAI,CAAC,aAAa,GAAG,GAAG,CAAC;QACzB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;QAExB,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI;YACpD,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;SAClF,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,MAAM,KAAK,GAA2B,EAAE,CAAC;QACzC,IAAI,IAAI,CAAC,eAAe;YAAE,KAAK,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC;QACvE,IAAI,IAAI,CAAC,SAAS;YAAE,KAAK,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;QAC9D,IAAI,IAAI,CAAC,eAAe;YAAE,KAAK,CAAC,wBAAwB,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC;QAEjF,QACE,2DACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,CAAC,YAAY,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;gBAC/B,oBAAoB,EAAE,IAAI,CAAC,SAAS;aACrC,EACD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,MAAM,IAEX,8DAAQ,CACL,EACL;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Menu/menu.css?tag=hb-menu&encapsulation=shadow","src/components/Menu/Menu.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hb-menu {\n list-style: none;\n margin: 0;\n padding: 4px 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n color: var(--hb-menu-color, var(--hb-color-text));\n font-size: var(--hb-font-size-sm);\n border-right: 1px solid var(--hb-color-border-secondary);\n box-sizing: border-box;\n}\n\n/* ---- 水平模式 ---- /\n.hb-menu--horizontal {\n display: flex;\n border-right: none;\n border-bottom: 1px solid var(--hb-color-border-secondary);\n}\n\n/ ---- 折叠 ---- /\n.hb-menu--collapsed {\n width: 64px;\n}\n.hb-menu--collapsed .hb-menu-item__text,\n.hb-menu--collapsed .hb-sub-menu__label,\n.hb-menu--collapsed .hb-sub-menu__arrow {\n display: none;\n}\n\n/ 折叠态 SubMenu：图标条布局（仅显示 icon），不再就地展开 /\n.hb-sub-menu--collapsed {\n position: relative;\n}\n.hb-sub-menu--collapsed .hb-sub-menu__title {\n justify-content: center;\n padding: 0;\n}\n\n/ 折叠态浮层：绝对定位弹出在右侧 /\n.hb-sub-menu__children--popover {\n position: absolute;\n left: 100%;\n top: 0;\n margin-left: 4px;\n min-width: 160px;\n padding: 4px 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n border: 1px solid var(--hb-color-border-secondary);\n border-radius: var(--hb-radius-sm, 4px);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n z-index: 1000;\n white-space: nowrap;\n}\n\n/ 折叠态浮层内的 MenuItem 取消就地展开时的缩进 /\n.hb-sub-menu__children--popover .hb-menu-item {\n padding-left: var(--hb-spacing-md);\n}\n\n/ ---- MenuItem ---- /\n::slotted(hb-menu-item) {\n display: block;\n}\n\n.hb-menu-item {\n display: flex;\n align-items: center;\n gap: var(--hb-spacing-xs);\n padding: 0 var(--hb-spacing-md);\n height: var(--hb-size-default);\n line-height: var(--hb-size-default);\n cursor: pointer;\n transition: all var(--hb-transition-duration) var(--hb-transition-function);\n white-space: nowrap;\n list-style: none;\n box-sizing: border-box;\n}\n\n.hb-menu-item:hover:not(.hb-menu-item--disabled) {\n background-color: var(--hb-menu-item-hover-bg, var(--hb-color-fill-tertiary));\n}\n\n.hb-menu-item--active {\n color: var(--hb-menu-active-color, var(--hb-color-primary));\n background-color: var(--hb-menu-item-active-bg, var(--hb-color-primary-bg));\n}\n\n.hb-menu-item--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.hb-menu-item__icon {\n display: inline-flex;\n width: 16px;\n}\n\n/ ---- SubMenu ---- /\n.hb-sub-menu {\n list-style: none;\n}\n\n.hb-sub-menu__title {\n display: flex;\n align-items: center;\n gap: var(--hb-spacing-xs);\n padding: 0 var(--hb-spacing-md);\n height: var(--hb-size-default);\n line-height: var(--hb-size-default);\n cursor: pointer;\n transition: all var(--hb-transition-duration);\n}\n\n.hb-sub-menu__title:hover {\n background-color: var(--hb-menu-item-hover-bg, var(--hb-color-fill-tertiary));\n}\n\n.hb-sub-menu__label {\n flex: 1;\n}\n\n.hb-sub-menu__arrow {\n font-size: 10px;\n transition: transform var(--hb-transition-duration);\n}\n\n.hb-sub-menu__arrow--open {\n transform: rotate(90deg);\n}\n\n.hb-sub-menu__children {\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: var(--hb-menu-bg, var(--hb-color-bg-container));\n}\n\n.hb-sub-menu__children .hb-menu-item {\n padding-left: calc(var(--hb-spacing-md) + var(--hb-spacing-lg));\n}\n\n/ ============================================================\n * 响应式（移动端）：小屏水平菜单改为纵向折叠，\n * 子菜单展开为内联列表（避免横向溢出）。对齐 antd 移动端行为。\n * ============================================================ /\n@media (max-width: 575.98px) {\n / 水平菜单在小屏改为垂直堆叠 /\n .hb-menu--horizontal {\n flex-direction: column;\n align-items: stretch;\n gap: 2px;\n }\n\n / 收窄的内边距 /\n .hb-menu--horizontal .hb-menu-item,\n .hb-menu--horizontal .hb-sub-menu {\n padding: 10px 12px;\n }\n\n / 让所有菜单项文字始终显示（即便桌面端折叠态隐藏文字，移动端不适用） /\n :host .hb-menu-item__text,\n :host .hb-sub-menu__label {\n display: inline;\n }\n}\n","import { Component, h, Prop, State, Element, Watch, Event, EventEmitter, Listen } from '@stencil/core';\n\n/\n Menu 导航菜单组件\n * 为页面和功能提供导航的菜单\n /\n@Component({\n tag: 'hb-menu',\n styleUrl: 'menu.css',\n shadow: true,\n})\nexport class Menu {\n @Element() el: HTMLElement;\n\n /* 模式 /\n @Prop() mode: 'horizontal' \| 'vertical' = 'vertical';\n\n /* 当前激活菜单项 /\n @Prop({ mutable: true }) defaultActive: string = '';\n\n /* 是否折叠（仅垂直模式） /\n @Prop() collapsed: boolean = false;\n\n /* 背景色 /\n @Prop() backgroundColor?: string;\n\n /* 文字颜色 /\n @Prop() textColor?: string;\n\n /* 激活项文字颜色 /\n @Prop() activeTextColor?: string;\n\n @State() activeItem: string = '';\n\n /* 选中事件 /\n @Event() hbSelect: EventEmitter<string>;\n\n componentDidLoad() {\n this.activeItem = this.defaultActive;\n // 折叠态透传给子 hb-sub-menu（子组件无法继承 prop，需在 host 属性层面同步）\n this.syncCollapsedToChildren();\n }\n\n @Watch('defaultActive')\n handleDefaultActiveChange() {\n this.activeItem = this.defaultActive;\n }\n\n @Watch('collapsed')\n handleCollapsedChange() {\n this.syncCollapsedToChildren();\n }\n\n /\n 把 collapsed 状态同步到所有直连与嵌套的 hb-sub-menu 子节点。\n * querySelectorAll 递归匹配，因此 hb-sub-menu > hb-sub-menu（多级）也会被覆盖。\n /\n private syncCollapsedToChildren() {\n if (!this.el) return;\n this.el.querySelectorAll('hb-sub-menu').forEach((sub) => {\n sub.setAttribute('collapsed', this.collapsed ? 'true' : 'false');\n });\n }\n\n /* 监听子 hb-menu-item 派发的内部选中事件，更新激活态并向外发射公开的 hbSelect */\n @Listen('hbMenuItemSelect')\n handleSelect(event: CustomEvent<string>) {\n const key = event.detail;\n this.activeItem = key;\n this.defaultActive = key;\n this.hbSelect.emit(key);\n // 通知子组件（含嵌套在 hb-sub-menu 内的 hb-menu-item）\n this.el.querySelectorAll('hb-menu-item').forEach((item) => {\n item.setAttribute('active', item.getAttribute('key') === key ? 'true' : 'false');\n });\n }\n\n render() {\n const style: Record<string, string> = {};\n if (this.backgroundColor) style['--hb-menu-bg'] = this.backgroundColor;\n if (this.textColor) style['--hb-menu-color'] = this.textColor;\n if (this.activeTextColor) style['--hb-menu-active-color'] = this.activeTextColor;\n\n return (\n <ul\n class={{\n 'hb-menu': true,\n [`hb-menu--${this.mode}`]: true,\n 'hb-menu--collapsed': this.collapsed,\n }}\n style={style}\n role=\"menu\"\n >\n <slot />\n </ul>\n );\n }\n}\n"],"version":3}

package/dist/components/hb-message.js CHANGED Viewed

@@ -33,11 +33,11 @@ const Message = /*@__PURE__*/ proxyCustomElement(class Message extends H {
         setTimeout(() => this.el.remove(), 300);
     };
     render() {
-        return (h("div", { key: '51069b8f2a5079fcfd64bb24168907bbcfbfd869', class: {
+        return (h("div", { key: '903b6bef78fb6ba813556bf847b7e6e03de46c3d', class: {
                 'hb-message': true,
                 [`hb-message--${this.type}`]: true,
                 'hb-message--visible': this.visible,
-            }, role: "alert" }, h("span", { key: 'ad3123ae0c4eb9b8010c446bf0016d54af7b8a3a', class: "hb-message__icon" }, ICON_MAP[this.type]), h("span", { key: '557ea0f92544ab58079a498b8f90dc774746c0a2', class: "hb-message__text" }, this.message), this.closable && (h("span", { key: 'e90e3380ba2b9a473d5f839983b959584948fd2a', class: "hb-message__close", onClick: this.close }, "\u00D7"))));
+            }, role: "alert" }, h("span", { key: 'b29a9043e502cf7d3a96089b9fed6214a3d43bd4', class: "hb-message__icon" }, ICON_MAP[this.type]), h("span", { key: 'cc926f41bd0b721c203f687629019bb095134dbe', class: "hb-message__text" }, this.message), this.closable && (h("span", { key: 'f6d6743646b47e8ef5e83264c69c94d5398eb69b', class: "hb-message__close", onClick: this.close }, "\u00D7"))));
     }
 }, [1, "hb-message", {
         "message": [1],

package/dist/components/hb-notification.js CHANGED Viewed

@@ -50,12 +50,12 @@ const Notification = /*@__PURE__*/ proxyCustomElement(class Notification extends
         this.hbClose.emit(this.id);
     };
     render() {
-        return (h("div", { key: '9848b6a924f89df2fa9996742f06986ad8c33da5', class: {
+        return (h("div", { key: '9be96a5baeb818da2c93a36e47c25aaa64bc5cfa', class: {
                 'hb-notification': true,
                 [`hb-notification--${this.type}`]: true,
                 [`hb-notification--${this.position}`]: true,
                 'hb-notification--visible': this.visible,
-            }, role: "alert" }, h("div", { key: 'a15adaf1401116e0dd462fa2a9abf56595052069', class: "hb-notification__icon", "aria-hidden": "true" }, h("span", { key: '7d56d7ce4760963f1bd7c214c5d19c9003e302ee', class: `hb-notification__icon-sign hb-notification__icon-sign--${this.type}` })), h("div", { key: '881c23e049f6870a4f2a4db347fdfaedc331708e', class: "hb-notification__content" }, this.title && h("div", { key: '034c55a3d5b0b4bbb27657db8f2f35bf917caf91', class: "hb-notification__title" }, this.title), this.message && h("div", { key: '0d49cebbf4e1db0baa953691c7519a2a8469563d', class: "hb-notification__message" }, this.message)), this.showClose && (h("button", { key: '180dc1d07aa4993a25ef97e92eb8ab4700e6c120', type: "button", class: "hb-notification__close", onClick: this.close, "aria-label": "\u5173\u95ED" }, "\u00D7"))));
+            }, role: "alert" }, h("div", { key: '81e28521a930f9dfabe4c5cdc821bf25fe15fc6a', class: "hb-notification__icon", "aria-hidden": "true" }, h("span", { key: '5023ecaabb4a12ecc2c7dbc1ce0f5ff9d979ced9', class: `hb-notification__icon-sign hb-notification__icon-sign--${this.type}` })), h("div", { key: '525ed80909f70b304eb4460bd2ad70e1ee969a8e', class: "hb-notification__content" }, this.title && h("div", { key: '5c7ff54e7c91a0df0e476db31f6df33262cf15ec', class: "hb-notification__title" }, this.title), this.message && h("div", { key: '25b34f64119a5ac609deab1633b8876036fd73df', class: "hb-notification__message" }, this.message)), this.showClose && (h("button", { key: '5999ff418c3e232e74257be4ea3d8cfe619cb401', type: "button", class: "hb-notification__close", onClick: this.close, "aria-label": "\u5173\u95ED" }, "\u00D7"))));
     }
     static get style() { return HbNotificationStyle0; }
 }, [1, "hb-notification", {

package/dist/components/hb-page-header.js CHANGED Viewed

@@ -25,7 +25,7 @@ const PageHeader = /*@__PURE__*/ proxyCustomElement(class PageHeader extends H {
         this.hbBack.emit();
     };
     render() {
-        return (h("div", { key: '1b030e60e77df9e97b6d60f704e521c05ae7af51', class: { 'hb-page-header': true, 'hb-page-header--ghost': this.ghost } }, h("div", { key: '2ee91ddf333fe5e771c9cbb0a62b14b03a3b1663', class: "hb-page-header__main" }, this.back && (h("button", { key: '225309da83f36a22e5e75200344399bcb94a3391', type: "button", class: "hb-page-header__back", onClick: this.handleBack, "aria-label": "\u8FD4\u56DE" }, h("span", { key: '1f67010455c9c682df8cefbb2dd81b1a41a73457', class: "hb-page-header__back-arrow" }, "\u2190"))), h("div", { key: '50ec1439869c987330e4536fe6f12e62416b1527', class: "hb-page-header__titles" }, this.title && h("span", { key: 'cdfde7eb8f6b643ea01327c87cab94db474b0825', class: "hb-page-header__title" }, this.title), this.subtitle && h("span", { key: '21756140f35d3fb19cea52d6c5a9e759641c0118', class: "hb-page-header__subtitle" }, this.subtitle))), h("div", { key: '59b5e1c8a71f17e9bb647394048ffe9484a85a5a', class: "hb-page-header__extra" }, h("slot", { key: '2c0543b118ac038e47b0aad6b389b996bf4f163c' }))));
+        return (h("div", { key: 'd0a12aabf3367b79a6b772519747bf8a1bc4b6a6', class: { 'hb-page-header': true, 'hb-page-header--ghost': this.ghost } }, h("div", { key: 'a1b06d2e308104ac47c6ef8fea494d50f11491ba', class: "hb-page-header__main" }, this.back && (h("button", { key: '9bff3ddc9271167a63b1abca030299a09fa92281', type: "button", class: "hb-page-header__back", onClick: this.handleBack, "aria-label": "\u8FD4\u56DE" }, h("span", { key: '099fa0f3b3c5aa3da46e72b1341589f90406ac85', class: "hb-page-header__back-arrow" }, "\u2190"))), h("div", { key: '17ab5366d4b9e0ccc5a3ed593a2564afdf7a333b', class: "hb-page-header__titles" }, this.title && h("span", { key: '587984784445116a7a20485d405fb8e8920fd631', class: "hb-page-header__title" }, this.title), this.subtitle && h("span", { key: '36d2e8452515ae043d87fb8371b5d6c3f7fd5121', class: "hb-page-header__subtitle" }, this.subtitle))), h("div", { key: '1cda5981edc21edafe737c1b8b4c922a14676787', class: "hb-page-header__extra" }, h("slot", { key: '67e7fa41c6467e676e7e46a11a2d3fe6bf7db413' }))));
     }
     static get style() { return HbPageHeaderStyle0; }
 }, [1, "hb-page-header", {