huibo-ui 0.3.0

package/dist/components/hb-slider.js

@@ -0,0 +1,202 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-1407a5e8.js';
+
+const sliderCss = "/*! 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{--hb-slider-main-bg-color:var(--hb-color-primary);--hb-slider-runway-bg-color:var(--hb-fill-color-light,#e4e7ed);--hb-slider-stop-bg-color:var(--hb-color-white,#fff);--hb-slider-button-size:20px;display:inline-block}.hb-slider{align-items:center;display:flex;height:40px;position:relative;width:100%}.hb-slider--vertical{flex-direction:column;height:100%;width:40px}.hb-slider__runway{background-color:var(--hb-slider-runway-bg-color);border-radius:3px;cursor:pointer;height:6px;margin:16px 0;position:relative;vertical-align:middle;width:100%}.hb-slider--vertical .hb-slider__runway{height:100%;margin:0 16px;width:6px}.hb-slider__bar{background-color:var(--hb-slider-main-bg-color);border-bottom-left-radius:3px;border-top-left-radius:3px;height:6px;left:0;position:absolute;top:0}.hb-slider--vertical .hb-slider__bar{border-bottom-left-radius:0;border-top-left-radius:3px;border-top-right-radius:3px;bottom:0;height:auto;top:auto;width:6px}.hb-slider__button-wrapper{background-color:#0000;margin-left:calc(var(--hb-slider-button-size)/-2);outline:none;position:absolute;text-align:center;top:50%;transform:translateY(-50%);-webkit-user-select:none;user-select:none;z-index:1001}.hb-slider--vertical .hb-slider__button-wrapper{bottom:0;left:50%;margin-bottom:calc(var(--hb-slider-button-size)/-2);margin-left:0;top:auto;transform:translate(-50%)}.hb-slider__button{background-color:var(--hb-color-white,#fff);border:2px solid var(--hb-slider-main-bg-color);border-radius:50%;cursor:grab;height:var(--hb-slider-button-size);transition:all .2s;-webkit-user-select:none;user-select:none;width:var(--hb-slider-button-size)}.hb-slider__button:active{cursor:grabbing}.hb-slider__button-wrapper--hover .hb-slider__button,.hb-slider__button-wrapper:hover .hb-slider__button{transform:scale(1.2)}.hb-slider__tooltip{background-color:#000000bf;border-radius:4px;bottom:calc(100% + 12px);color:var(--hb-color-white,#fff);font-size:12px;padding:6px 8px;white-space:nowrap}.hb-slider__tooltip,.hb-slider__tooltip:after{left:50%;position:absolute;transform:translate(-50%)}.hb-slider__tooltip:after{border:4px solid #0000;border-top-color:#000000bf;content:\"\";top:100%}.hb-slider--disabled{cursor:not-allowed}.hb-slider--disabled .hb-slider__runway{background-color:var(--hb-fill-color-light,#e4e7ed);cursor:not-allowed}.hb-slider--disabled .hb-slider__bar{background-color:var(--hb-color-text-disabled,#c0c4cc)}.hb-slider--disabled .hb-slider__button{border-color:var(--hb-color-text-disabled,#c0c4cc);cursor:not-allowed}@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 HbSliderStyle0 = sliderCss;
+
+const Slider = /*@__PURE__*/ proxyCustomElement(class Slider extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.hbChange = createEvent(this, "hbChange", 7);
+        this.hbInput = createEvent(this, "hbInput", 7);
+    }
+    get el() { return this; }
+    /**
+     * 绑定值
+     */
+    modelValue = 0;
+    /**
+     * 最小值
+     * @default 0
+     */
+    min = 0;
+    /**
+     * 最大值
+     * @default 100
+     */
+    max = 100;
+    /**
+     * 步长
+     * @default 1
+     */
+    step = 1;
+    /**
+     * 是否显示工具提示
+     * @default true
+     */
+    showTooltip = true;
+    /**
+     * 格式化 tooltip message
+     */
+    formatTooltip;
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled = false;
+    /**
+     * 是否为范围选择
+     * @default false
+     */
+    range = false;
+    /**
+     * 是否竖向模式
+     * @default false
+     */
+    vertical = false;
+    /**
+     * 高度，竖向模式时必填
+     */
+    height;
+    dragging = false;
+    currentValue = 0;
+    tooltipVisible = false;
+    tooltipValue = 0;
+    sliderRef;
+    isDragging = false;
+    /**
+     * 值改变事件
+     */
+    hbChange;
+    /**
+     * 值改变事件（拖拽时实时触发）
+     */
+    hbInput;
+    componentDidLoad() {
+        this.currentValue = this.modelValue;
+        this.addEventListeners();
+    }
+    disconnectedCallback() {
+        this.removeEventListeners();
+    }
+    addEventListeners() {
+        document.addEventListener('mousemove', this.handleMouseMove);
+        document.addEventListener('mouseup', this.handleMouseUp);
+    }
+    removeEventListeners() {
+        document.removeEventListener('mousemove', this.handleMouseMove);
+        document.removeEventListener('mouseup', this.handleMouseUp);
+    }
+    getPercentage(value) {
+        return ((value - this.min) / (this.max - this.min)) * 100;
+    }
+    getValueFromPercentage(percentage) {
+        const value = this.min + (percentage / 100) * (this.max - this.min);
+        return Math.round(value / this.step) * this.step;
+    }
+    handleMouseDown = (e) => {
+        if (this.disabled)
+            return;
+        e.preventDefault();
+        this.isDragging = true;
+        this.dragging = true;
+        this.handleDrag(e);
+    };
+    handleMouseMove = (e) => {
+        if (!this.isDragging)
+            return;
+        this.handleDrag(e);
+    };
+    handleMouseUp = () => {
+        if (!this.isDragging)
+            return;
+        this.isDragging = false;
+        this.dragging = false;
+        this.tooltipVisible = false;
+        this.hbChange.emit(this.currentValue);
+    };
+    handleDrag(e) {
+        if (!this.sliderRef)
+            return;
+        const rect = this.sliderRef.getBoundingClientRect();
+        const percentage = this.vertical
+            ? 1 - (e.clientY - rect.top) / rect.height
+            : (e.clientX - rect.left) / rect.width;
+        const clampedPercentage = Math.max(0, Math.min(100, percentage * 100));
+        const value = this.getValueFromPercentage(clampedPercentage);
+        if (this.range) {
+            const values = this.currentValue;
+            // 简化处理：更新第一个值
+            this.currentValue = [value, values[1] || this.max];
+        }
+        else {
+            this.currentValue = value;
+            this.tooltipValue = value;
+            this.tooltipVisible = true;
+        }
+        this.modelValue = this.currentValue;
+        this.hbInput.emit(this.currentValue);
+    }
+    formatValue(value) {
+        if (this.formatTooltip) {
+            return this.formatTooltip(value);
+        }
+        return String(value);
+    }
+    render() {
+        const percentage = this.range
+            ? this.getPercentage(this.currentValue[0])
+            : this.getPercentage(this.currentValue);
+        return (h("div", { key: 'b8ee15c3375f6786c252e6755ff6dd5d4ab0023f', class: {
+                'hb-slider': true,
+                'hb-slider--vertical': this.vertical,
+                'hb-slider--disabled': this.disabled,
+            }, style: this.vertical && this.height ? { height: this.height } : undefined }, h("div", { key: 'c75f1194e3a8a630d4ffa0cb82579fddc42e2461', class: "hb-slider__runway", ref: (el) => (this.sliderRef = el), onMouseDown: this.handleMouseDown }, h("div", { key: '5dcf4d4807e85cd4a96fd919d4b9d999f0d837d7', class: "hb-slider__bar", style: {
+                [this.vertical ? 'height' : 'width']: `${percentage}%`,
+                [this.vertical ? 'bottom' : 'left']: '0',
+            } }), h("div", { key: 'e10dc431c839183de585debfd9991a2d75922cc9', class: {
+                'hb-slider__button-wrapper': true,
+                'hb-slider__button-wrapper--hover': this.tooltipVisible,
+            }, style: {
+                [this.vertical ? 'bottom' : 'left']: `${percentage}%`,
+            } }, this.showTooltip && this.tooltipVisible && (h("div", { key: '270c0d8dd46b03fac7b4b8e62265a14158de18b7', class: "hb-slider__tooltip" }, this.formatValue(this.tooltipValue))), h("div", { key: '20772f2a08bed8c009c119b1c148ff0448c9a288', class: "hb-slider__button" })))));
+    }
+    static get style() { return HbSliderStyle0; }
+}, [1, "hb-slider", {
+        "modelValue": [1026, "model-value"],
+        "min": [2],
+        "max": [2],
+        "step": [2],
+        "showTooltip": [4, "show-tooltip"],
+        "formatTooltip": [16],
+        "disabled": [4],
+        "range": [4],
+        "vertical": [4],
+        "height": [1],
+        "dragging": [32],
+        "currentValue": [32],
+        "tooltipVisible": [32],
+        "tooltipValue": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-slider"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-slider":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Slider);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbSlider = Slider;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbSlider, defineCustomElement };
+
+//# sourceMappingURL=hb-slider.js.map

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

@@ -0,0 +1 @@
+{"file":"hb-slider.js","mappings":"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","names":[],"sources":["src/components/Slider/slider.css?tag=hb-slider&encapsulation=shadow","src/components/Slider/Slider.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  --hb-slider-main-bg-color: var(--hb-color-primary);\n  --hb-slider-runway-bg-color: var(--hb-fill-color-light, #e4e7ed);\n  --hb-slider-stop-bg-color: var(--hb-color-white, #ffffff);\n  --hb-slider-button-size: 20px;\n}\n\n.hb-slider {\n  width: 100%;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.hb-slider--vertical {\n  width: 40px;\n  height: 100%;\n  flex-direction: column;\n}\n\n.hb-slider__runway {\n  width: 100%;\n  height: 6px;\n  margin: 16px 0;\n  background-color: var(--hb-slider-runway-bg-color);\n  border-radius: 3px;\n  position: relative;\n  cursor: pointer;\n  vertical-align: middle;\n}\n\n.hb-slider--vertical .hb-slider__runway {\n  width: 6px;\n  height: 100%;\n  margin: 0 16px;\n}\n\n.hb-slider__bar {\n  height: 6px;\n  background-color: var(--hb-slider-main-bg-color);\n  border-top-left-radius: 3px;\n  border-bottom-left-radius: 3px;\n  position: absolute;\n  top: 0;\n  left: 0;\n}\n\n.hb-slider--vertical .hb-slider__bar {\n  width: 6px;\n  height: auto;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n  border-bottom-left-radius: 0;\n  bottom: 0;\n  top: auto;\n}\n\n.hb-slider__button-wrapper {\n  position: absolute;\n  z-index: 1001;\n  top: 50%;\n  transform: translateY(-50%);\n  background-color: transparent;\n  text-align: center;\n  user-select: none;\n  outline: none;\n  margin-left: calc(var(--hb-slider-button-size) / -2);\n}\n\n.hb-slider--vertical .hb-slider__button-wrapper {\n  left: 50%;\n  top: auto;\n  bottom: 0;\n  transform: translateX(-50%);\n  margin-left: 0;\n  margin-bottom: calc(var(--hb-slider-button-size) / -2);\n}\n\n.hb-slider__button {\n  width: var(--hb-slider-button-size);\n  height: var(--hb-slider-button-size);\n  background-color: var(--hb-color-white, #ffffff);\n  border: 2px solid var(--hb-slider-main-bg-color);\n  border-radius: 50%;\n  transition: 0.2s;\n  user-select: none;\n  cursor: grab;\n}\n\n.hb-slider__button:active {\n  cursor: grabbing;\n}\n\n.hb-slider__button-wrapper:hover .hb-slider__button,\n.hb-slider__button-wrapper--hover .hb-slider__button {\n  transform: scale(1.2);\n}\n\n.hb-slider__tooltip {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  left: 50%;\n  transform: translateX(-50%);\n  padding: 6px 8px;\n  background-color: rgba(0, 0, 0, 0.75);\n  color: var(--hb-color-white, #ffffff);\n  border-radius: 4px;\n  font-size: 12px;\n  white-space: nowrap;\n}\n\n.hb-slider__tooltip::after {\n  content: '';\n  position: absolute;\n  top: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  border: 4px solid transparent;\n  border-top-color: rgba(0, 0, 0, 0.75);\n}\n\n.hb-slider--disabled {\n  cursor: not-allowed;\n}\n\n.hb-slider--disabled .hb-slider__runway {\n  cursor: not-allowed;\n  background-color: var(--hb-fill-color-light, #e4e7ed);\n}\n\n.hb-slider--disabled .hb-slider__bar {\n  background-color: var(--hb-color-text-disabled, #c0c4cc);\n}\n\n.hb-slider--disabled .hb-slider__button {\n  border-color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n}\n\n","import { Component, h, Prop, Event, EventEmitter, State, Element } from '@stencil/core';\n\n/**\n * Slider 滑块组件\n * 通过拖动滑块在一个固定区间内进行选择\n */\n@Component({\n  tag: 'hb-slider',\n  styleUrl: 'slider.css',\n  shadow: true,\n})\nexport class Slider {\n  @Element() el: HTMLElement;\n\n  /**\n   * 绑定值\n   */\n  @Prop({ mutable: true }) modelValue: number | number[] = 0;\n\n  /**\n   * 最小值\n   * @default 0\n   */\n  @Prop() min: number = 0;\n\n  /**\n   * 最大值\n   * @default 100\n   */\n  @Prop() max: number = 100;\n\n  /**\n   * 步长\n   * @default 1\n   */\n  @Prop() step: number = 1;\n\n  /**\n   * 是否显示工具提示\n   * @default true\n   */\n  @Prop() showTooltip: boolean = true;\n\n  /**\n   * 格式化 tooltip message\n   */\n  @Prop() formatTooltip?: (value: number) => string;\n\n  /**\n   * 是否禁用\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * 是否为范围选择\n   * @default false\n   */\n  @Prop() range: boolean = false;\n\n  /**\n   * 是否竖向模式\n   * @default false\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * 高度，竖向模式时必填\n   */\n  @Prop() height?: string;\n\n  @State() dragging: boolean = false;\n  @State() currentValue: number | number[] = 0;\n  @State() tooltipVisible: boolean = false;\n  @State() tooltipValue: number = 0;\n\n  private sliderRef?: HTMLDivElement;\n  private isDragging: boolean = false;\n\n  /**\n   * 值改变事件\n   */\n  @Event() hbChange: EventEmitter<number | number[]>;\n\n  /**\n   * 值改变事件（拖拽时实时触发）\n   */\n  @Event() hbInput: EventEmitter<number | number[]>;\n\n  componentDidLoad() {\n    this.currentValue = this.modelValue;\n    this.addEventListeners();\n  }\n\n  disconnectedCallback() {\n    this.removeEventListeners();\n  }\n\n  private addEventListeners() {\n    document.addEventListener('mousemove', this.handleMouseMove);\n    document.addEventListener('mouseup', this.handleMouseUp);\n  }\n\n  private removeEventListeners() {\n    document.removeEventListener('mousemove', this.handleMouseMove);\n    document.removeEventListener('mouseup', this.handleMouseUp);\n  }\n\n  private getPercentage(value: number): number {\n    return ((value - this.min) / (this.max - this.min)) * 100;\n  }\n\n  private getValueFromPercentage(percentage: number): number {\n    const value = this.min + (percentage / 100) * (this.max - this.min);\n    return Math.round(value / this.step) * this.step;\n  }\n\n  private handleMouseDown = (e: MouseEvent) => {\n    if (this.disabled) return;\n    e.preventDefault();\n    this.isDragging = true;\n    this.dragging = true;\n    this.handleDrag(e);\n  };\n\n  private handleMouseMove = (e: MouseEvent) => {\n    if (!this.isDragging) return;\n    this.handleDrag(e);\n  };\n\n  private handleMouseUp = () => {\n    if (!this.isDragging) return;\n    this.isDragging = false;\n    this.dragging = false;\n    this.tooltipVisible = false;\n    this.hbChange.emit(this.currentValue);\n  };\n\n  private handleDrag(e: MouseEvent) {\n    if (!this.sliderRef) return;\n\n    const rect = this.sliderRef.getBoundingClientRect();\n    const percentage = this.vertical\n      ? 1 - (e.clientY - rect.top) / rect.height\n      : (e.clientX - rect.left) / rect.width;\n    \n    const clampedPercentage = Math.max(0, Math.min(100, percentage * 100));\n    const value = this.getValueFromPercentage(clampedPercentage);\n\n    if (this.range) {\n      const values = this.currentValue as number[];\n      // 简化处理：更新第一个值\n      this.currentValue = [value, values[1] || this.max];\n    } else {\n      this.currentValue = value;\n      this.tooltipValue = value;\n      this.tooltipVisible = true;\n    }\n\n    this.modelValue = this.currentValue;\n    this.hbInput.emit(this.currentValue);\n  }\n\n  private formatValue(value: number): string {\n    if (this.formatTooltip) {\n      return this.formatTooltip(value);\n    }\n    return String(value);\n  }\n\n  render() {\n    const percentage = this.range\n      ? this.getPercentage((this.currentValue as number[])[0])\n      : this.getPercentage(this.currentValue as number);\n\n    return (\n      <div\n        class={{\n          'hb-slider': true,\n          'hb-slider--vertical': this.vertical,\n          'hb-slider--disabled': this.disabled,\n        }}\n        style={this.vertical && this.height ? { height: this.height } : undefined}\n      >\n        <div\n          class=\"hb-slider__runway\"\n          ref={(el) => (this.sliderRef = el)}\n          onMouseDown={this.handleMouseDown}\n        >\n          <div\n            class=\"hb-slider__bar\"\n            style={{\n              [this.vertical ? 'height' : 'width']: `${percentage}%`,\n              [this.vertical ? 'bottom' : 'left']: '0',\n            }}\n          ></div>\n          <div\n            class={{\n              'hb-slider__button-wrapper': true,\n              'hb-slider__button-wrapper--hover': this.tooltipVisible,\n            }}\n            style={{\n              [this.vertical ? 'bottom' : 'left']: `${percentage}%`,\n            }}\n          >\n            {this.showTooltip && this.tooltipVisible && (\n              <div class=\"hb-slider__tooltip\">\n                {this.formatValue(this.tooltipValue)}\n              </div>\n            )}\n            <div class=\"hb-slider__button\"></div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\n"],"version":3}

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

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

package/dist/components/hb-space.js

@@ -0,0 +1,94 @@
+import { p as proxyCustomElement, H, h } from './p-1407a5e8.js';
+
+const spaceCss = "/*! 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{--hb-space-size:8px;--hb-space-alignment:start;--hb-space-fill-ratio:100%;display:inline-flex}.hb-space{align-items:var(--hb-space-alignment);display:inline-flex;flex-wrap:nowrap;gap:var(--hb-space-size)}.hb-space--horizontal{flex-direction:row}.hb-space--vertical{flex-direction:column}.hb-space--wrap{flex-wrap:wrap}.hb-space--fill,.hb-space--fill.hb-space--horizontal{width:100%}.hb-space--fill.hb-space--vertical{height:100%}::slotted(*){display:inline-block;flex-shrink:0;margin:0}.hb-space__item{align-items:center;display:inline-flex}.hb-space__item+.hb-space__item:before{color:var(--hb-color-text-placeholder,#c0c4cc);content:attr(data-separator);display:inline-block;margin:0 var(--hb-space-size)}@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 HbSpaceStyle0 = spaceCss;
+
+const Space = /*@__PURE__*/ proxyCustomElement(class Space extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    /**
+     * 间距大小
+     * @default 'small'
+     */
+    size = 'small';
+    /**
+     * 间距方向
+     * @default 'horizontal'
+     */
+    direction = 'horizontal';
+    /**
+     * 是否自动换行，仅在 horizontal 时有效
+     * @default false
+     */
+    wrap = false;
+    /**
+     * 对齐方式
+     */
+    alignment = 'start';
+    /**
+     * 是否填充父容器
+     * @default false
+     */
+    fill = false;
+    /**
+     * 是否填充每行
+     * @default false
+     */
+    fillRatio = 100;
+    getSizeValue() {
+        if (typeof this.size === 'number') {
+            return `${this.size}px`;
+        }
+        const sizeMap = {
+            small: '8px',
+            default: '16px',
+            large: '24px',
+        };
+        return sizeMap[this.size];
+    }
+    render() {
+        const sizeValue = this.getSizeValue();
+        return (h("div", { key: 'c6a3c89f29c25988b47aa100c8d3ac45c44f550e', class: {
+                'hb-space': true,
+                [`hb-space--${this.direction}`]: true,
+                'hb-space--wrap': this.wrap && this.direction === 'horizontal',
+                'hb-space--fill': this.fill,
+            }, style: {
+                '--hb-space-size': sizeValue,
+                '--hb-space-alignment': this.alignment,
+                '--hb-space-fill-ratio': `${this.fillRatio}%`,
+            } }, h("slot", { key: '638d65e135eb572d71d3220183031cb0b18b1078' })));
+    }
+    static get style() { return HbSpaceStyle0; }
+}, [1, "hb-space", {
+        "size": [8],
+        "direction": [1],
+        "wrap": [4],
+        "alignment": [1],
+        "fill": [4],
+        "fillRatio": [2, "fill-ratio"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-space"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-space":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Space);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbSpace = Space;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbSpace, defineCustomElement };
+
+//# sourceMappingURL=hb-space.js.map

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

@@ -0,0 +1 @@
+{"file":"hb-space.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,szMAAszM,CAAC;AACx0M,sBAAe,QAAQ;;MCUV,KAAK;;;;;;;;;;IAKR,IAAI,GAA2C,OAAO,CAAC;;;;;IAMvD,SAAS,GAA8B,YAAY,CAAC;;;;;IAMpD,IAAI,GAAY,KAAK,CAAC;;;;IAKtB,SAAS,GAA4C,OAAO,CAAC;;;;;IAM7D,IAAI,GAAY,KAAK,CAAC;;;;;IAMtB,SAAS,GAAW,GAAG,CAAC;IAExB,YAAY;QAClB,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;YACjC,OAAO,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC;SACzB;QACD,MAAM,OAAO,GAAG;YACd,KAAK,EAAE,KAAK;YACZ,OAAO,EAAE,MAAM;YACf,KAAK,EAAE,MAAM;SACd,CAAC;QACF,OAAO,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC3B;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QAEtC,QACE,4DACE,KAAK,EAAE;gBACL,UAAU,EAAE,IAAI;gBAChB,CAAC,aAAa,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI;gBACrC,gBAAgB,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,SAAS,KAAK,YAAY;gBAC9D,gBAAgB,EAAE,IAAI,CAAC,IAAI;aAC5B,EACD,KAAK,EAAE;gBACL,iBAAiB,EAAE,SAAS;gBAC5B,sBAAsB,EAAE,IAAI,CAAC,SAAS;gBACtC,uBAAuB,EAAE,GAAG,IAAI,CAAC,SAAS,GAAG;aAC9C,IAED,8DAAa,CACT,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Space/space.css?tag=hb-space&encapsulation=shadow","src/components/Space/Space.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  --hb-space-size: 8px;\n  --hb-space-alignment: start;\n  --hb-space-fill-ratio: 100%;\n}\n\n.hb-space {\n  display: inline-flex;\n  flex-wrap: nowrap;\n  align-items: var(--hb-space-alignment);\n  gap: var(--hb-space-size);\n}\n\n.hb-space--horizontal {\n  flex-direction: row;\n}\n\n.hb-space--vertical {\n  flex-direction: column;\n}\n\n.hb-space--wrap {\n  flex-wrap: wrap;\n}\n\n.hb-space--fill {\n  width: 100%;\n}\n\n.hb-space--fill.hb-space--horizontal {\n  width: 100%;\n}\n\n.hb-space--fill.hb-space--vertical {\n  height: 100%;\n}\n\n::slotted(*) {\n  display: inline-block;\n  flex-shrink: 0;\n  margin: 0;\n}\n\n/* 分隔符样式 */\n.hb-space__item {\n  display: inline-flex;\n  align-items: center;\n}\n\n.hb-space__item + .hb-space__item::before {\n  content: attr(data-separator);\n  display: inline-block;\n  margin: 0 var(--hb-space-size);\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n}\n\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Space 间距组件\n * 设置组件之间的间距\n */\n@Component({\n  tag: 'hb-space',\n  styleUrl: 'space.css',\n  shadow: true,\n})\nexport class Space {\n  /**\n   * 间距大小\n   * @default 'small'\n   */\n  @Prop() size: 'small' | 'default' | 'large' | number = 'small';\n\n  /**\n   * 间距方向\n   * @default 'horizontal'\n   */\n  @Prop() direction: 'horizontal' | 'vertical' = 'horizontal';\n\n  /**\n   * 是否自动换行，仅在 horizontal 时有效\n   * @default false\n   */\n  @Prop() wrap: boolean = false;\n\n  /**\n   * 对齐方式\n   */\n  @Prop() alignment: 'start' | 'end' | 'center' | 'baseline' = 'start';\n\n  /**\n   * 是否填充父容器\n   * @default false\n   */\n  @Prop() fill: boolean = false;\n\n  /**\n   * 是否填充每行\n   * @default false\n   */\n  @Prop() fillRatio: number = 100;\n\n  private getSizeValue(): string {\n    if (typeof this.size === 'number') {\n      return `${this.size}px`;\n    }\n    const sizeMap = {\n      small: '8px',\n      default: '16px',\n      large: '24px',\n    };\n    return sizeMap[this.size];\n  }\n\n  render() {\n    const sizeValue = this.getSizeValue();\n    \n    return (\n      <div\n        class={{\n          'hb-space': true,\n          [`hb-space--${this.direction}`]: true,\n          'hb-space--wrap': this.wrap && this.direction === 'horizontal',\n          'hb-space--fill': this.fill,\n        }}\n        style={{\n          '--hb-space-size': sizeValue,\n          '--hb-space-alignment': this.alignment,\n          '--hb-space-fill-ratio': `${this.fillRatio}%`,\n        }}\n      >\n        <slot></slot>\n      </div>\n    );\n  }\n}\n\n"],"version":3}

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

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

package/dist/components/hb-statistic.js

@@ -0,0 +1,88 @@
+import { p as proxyCustomElement, H, h } from './p-1407a5e8.js';
+
+const statisticCss = "/*! 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-statistic{display:inline-flex;flex-direction:column;line-height:var(--hb-line-height)}.hb-statistic__title{color:var(--hb-color-text-secondary);font-size:var(--hb-font-size-base);margin-bottom:var(--hb-spacing-xs)}.hb-statistic__content{align-items:baseline;color:var(--hb-color-text-primary);display:flex}.hb-statistic__value{font-size:var(--hb-font-size-2xl);font-weight:500;line-height:1}.hb-statistic__prefix{font-size:var(--hb-font-size-lg);margin-right:var(--hb-spacing-xxs)}.hb-statistic__suffix{font-size:var(--hb-font-size-lg);margin-left:var(--hb-spacing-xxs)}@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 HbStatisticStyle0 = statisticCss;
+
+const Statistic = /*@__PURE__*/ proxyCustomElement(class Statistic extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    /** 数值标题（使用默认值使其成为 required string，避免与 HTMLElement.title 类型冲突） */
+    title = '';
+    /** 数值内容（数字或字符串） */
+    value = 0;
+    /** 数值小数位数 */
+    precision;
+    /** 数值前缀（如货币符号 ¥）（改名 valuePrefix 避免与 Element.prefix 类型冲突） */
+    valuePrefix = '';
+    /** 数值后缀（如单位） */
+    suffix;
+    /** 数值容器的内联样式 */
+    valueStyle;
+    /**
+     * 将 value 按 precision 格式化为千分位字符串
+     * - 纯数字字符串（含小数）会被当作数值进行格式化（便于 attribute 传入）
+     * - 含非数字字符的字符串原样返回（如 "1.2K"、"N/A"）
+     */
+    getFormattedValue() {
+        // 将 value 归一为数值：number 直接用；纯数字字符串转为 number；否则原样返回
+        let numericValue;
+        if (typeof this.value === 'number') {
+            numericValue = this.value;
+        }
+        else {
+            const trimmed = this.value.trim();
+            if (/^-?\d+(\.\d+)?$/.test(trimmed)) {
+                numericValue = Number(trimmed);
+            }
+            else {
+                return this.value;
+            }
+        }
+        let str;
+        if (typeof this.precision === 'number' && this.precision >= 0) {
+            str = numericValue.toFixed(this.precision);
+        }
+        else {
+            str = String(numericValue);
+        }
+        // 拆分整数/小数部分，仅对整数部分加千分位
+        const [intPart, decPart] = str.split('.');
+        const grouped = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+        return decPart !== undefined ? `${grouped}.${decPart}` : grouped;
+    }
+    render() {
+        return (h("div", { key: 'e38db3c8ae83480a933a7a9fd03d4ecb8e3cb07d', class: "hb-statistic" }, this.title && h("div", { key: '2d4af905f79558e98b6db498db1d251d10b64151', class: "hb-statistic__title" }, this.title), h("div", { key: 'f60f0263f6f22ca95d863c1fcd7f94556b351cea', class: "hb-statistic__content", style: this.valueStyle ? { cssText: this.valueStyle } : undefined }, this.valuePrefix && h("span", { key: '4dd5f92066507ad0abf5c5bbeca64001d425b83a', class: "hb-statistic__prefix" }, this.valuePrefix), h("span", { key: '746806287e5f0752263ce913a4b81fa221b0fb3b', class: "hb-statistic__value" }, this.getFormattedValue()), this.suffix !== undefined && h("span", { key: 'a93c66aeb111922903214884e664b425279cc5ac', class: "hb-statistic__suffix" }, this.suffix))));
+    }
+    static get style() { return HbStatisticStyle0; }
+}, [1, "hb-statistic", {
+        "title": [1],
+        "value": [8],
+        "precision": [2],
+        "valuePrefix": [1, "value-prefix"],
+        "suffix": [1],
+        "valueStyle": [1, "value-style"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-statistic"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-statistic":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Statistic);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbStatistic = Statistic;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbStatistic, defineCustomElement };
+
+//# sourceMappingURL=hb-statistic.js.map

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

@@ -0,0 +1 @@
+{"file":"hb-statistic.js","mappings":";;AAAA,MAAM,YAAY,GAAG,+rMAA+rM,CAAC;AACrtM,0BAAe,YAAY;;MCUd,SAAS;;;;;;;IAEZ,KAAK,GAAW,EAAE,CAAC;;IAGnB,KAAK,GAAoB,CAAC,CAAC;;IAG3B,SAAS,CAAU;;IAGnB,WAAW,GAAW,EAAE,CAAC;;IAGzB,MAAM,CAAU;;IAGhB,UAAU,CAAU;;;;;;IAOpB,iBAAiB;;QAEvB,IAAI,YAAoB,CAAC;QACzB,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YAClC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC;SAC3B;aAAM;YACL,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YAClC,IAAI,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;gBACnC,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;aAChC;iBAAM;gBACL,OAAO,IAAI,CAAC,KAAK,CAAC;aACnB;SACF;QAED,IAAI,GAAW,CAAC;QAChB,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,QAAQ,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,EAAE;YAC7D,GAAG,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SAC5C;aAAM;YACL,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;SAC5B;;QAED,MAAM,CAAC,OAAO,EAAE,OAAO,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC1C,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,uBAAuB,EAAE,GAAG,CAAC,CAAC;QAC9D,OAAO,OAAO,KAAK,SAAS,GAAG,GAAG,OAAO,IAAI,OAAO,EAAE,GAAG,OAAO,CAAC;KAClE;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,KAAK,IAAI,4DAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,KAAK,CAAO,EAClE,4DAAK,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,GAAG,SAAS,IACjG,IAAI,CAAC,WAAW,IAAI,6DAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,WAAW,CAAQ,EACjF,6DAAM,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,iBAAiB,EAAE,CAAQ,EAClE,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,6DAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,MAAM,CAAQ,CACjF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Statistic/statistic.css?tag=hb-statistic&encapsulation=shadow","src/components/Statistic/Statistic.tsx"],"sourcesContent":[":host { display: block; }\n\n.hb-statistic { display: inline-flex; flex-direction: column; line-height: var(--hb-line-height); }\n\n/* 标题 */\n.hb-statistic__title {\n  color: var(--hb-color-text-secondary);\n  font-size: var(--hb-font-size-base);\n  margin-bottom: var(--hb-spacing-xs);\n}\n\n/* 数值容器 */\n.hb-statistic__content { display: flex; align-items: baseline; color: var(--hb-color-text-primary); }\n\n/* 数值本体：大号 */\n.hb-statistic__value {\n  font-size: var(--hb-font-size-2xl);\n  font-weight: 500;\n  line-height: 1;\n}\n\n/* 前缀（如 ¥） */\n.hb-statistic__prefix {\n  margin-right: var(--hb-spacing-xxs);\n  font-size: var(--hb-font-size-lg);\n}\n\n/* 后缀（如 单位） */\n.hb-statistic__suffix {\n  margin-left: var(--hb-spacing-xxs);\n  font-size: var(--hb-font-size-lg);\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Statistic 统计数值组件\n * 展示某个统计数据，常用于展示一个指标的当前值\n */\n@Component({\n  tag: 'hb-statistic',\n  styleUrl: 'statistic.css',\n  shadow: true,\n})\nexport class Statistic {\n  /** 数值标题（使用默认值使其成为 required string，避免与 HTMLElement.title 类型冲突） */\n  @Prop() title: string = '';\n\n  /** 数值内容（数字或字符串） */\n  @Prop() value: number | string = 0;\n\n  /** 数值小数位数 */\n  @Prop() precision?: number;\n\n  /** 数值前缀（如货币符号 ¥）（改名 valuePrefix 避免与 Element.prefix 类型冲突） */\n  @Prop() valuePrefix: string = '';\n\n  /** 数值后缀（如单位） */\n  @Prop() suffix?: string;\n\n  /** 数值容器的内联样式 */\n  @Prop() valueStyle?: string;\n\n  /**\n   * 将 value 按 precision 格式化为千分位字符串\n   * - 纯数字字符串（含小数）会被当作数值进行格式化（便于 attribute 传入）\n   * - 含非数字字符的字符串原样返回（如 \"1.2K\"、\"N/A\"）\n   */\n  private getFormattedValue(): string {\n    // 将 value 归一为数值：number 直接用；纯数字字符串转为 number；否则原样返回\n    let numericValue: number;\n    if (typeof this.value === 'number') {\n      numericValue = this.value;\n    } else {\n      const trimmed = this.value.trim();\n      if (/^-?\\d+(\\.\\d+)?$/.test(trimmed)) {\n        numericValue = Number(trimmed);\n      } else {\n        return this.value;\n      }\n    }\n\n    let str: string;\n    if (typeof this.precision === 'number' && this.precision >= 0) {\n      str = numericValue.toFixed(this.precision);\n    } else {\n      str = String(numericValue);\n    }\n    // 拆分整数/小数部分，仅对整数部分加千分位\n    const [intPart, decPart] = str.split('.');\n    const grouped = intPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n    return decPart !== undefined ? `${grouped}.${decPart}` : grouped;\n  }\n\n  render() {\n    return (\n      <div class=\"hb-statistic\">\n        {this.title && <div class=\"hb-statistic__title\">{this.title}</div>}\n        <div class=\"hb-statistic__content\" style={this.valueStyle ? { cssText: this.valueStyle } : undefined}>\n          {this.valuePrefix && <span class=\"hb-statistic__prefix\">{this.valuePrefix}</span>}\n          <span class=\"hb-statistic__value\">{this.getFormattedValue()}</span>\n          {this.suffix !== undefined && <span class=\"hb-statistic__suffix\">{this.suffix}</span>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

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

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

package/dist/components/hb-step.js

@@ -0,0 +1,42 @@
+import { p as proxyCustomElement, H, h } from './p-1407a5e8.js';
+
+const Step = /*@__PURE__*/ proxyCustomElement(class Step extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    title = '';
+    description;
+    icon;
+    status = 'wait';
+    render() {
+        return h("div", { key: '8a42e9bcdb6ab736095af526989a331edc76f0bb', class: "hb-step" }, h("slot", { key: 'cff737be2d6690f6edee1b0996c2d49e9621ffaa' }));
+    }
+}, [1, "hb-step", {
+        "title": [1],
+        "description": [1],
+        "icon": [1],
+        "status": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["hb-step"];
+    components.forEach(tagName => { switch (tagName) {
+        case "hb-step":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Step);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const HbStep = Step;
+const defineCustomElement = defineCustomElement$1;
+
+export { HbStep, defineCustomElement };
+
+//# sourceMappingURL=hb-step.js.map

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

@@ -0,0 +1 @@
+{"file":"hb-step.js","mappings":";;MAGa,IAAI;;;;;;IACP,KAAK,GAAW,EAAE,CAAC;IACnB,WAAW,CAAU;IACrB,IAAI,CAAU;IACd,MAAM,GAA4C,MAAM,CAAC;IACjE,MAAM;QAAK,OAAO,4DAAK,KAAK,EAAC,SAAS,IAAC,8DAAQ,CAAM,CAAC;KAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Steps/Step.tsx"],"sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({ tag: 'hb-step', shadow: true })\nexport class Step {\n  @Prop() title: string = '';\n  @Prop() description?: string;\n  @Prop() icon?: string;\n  @Prop() status: 'wait' | 'process' | 'finish' | 'error' = 'wait';\n  render() { return <div class=\"hb-step\"><slot /></div>; }\n}\n"],"version":3}

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

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