@huibo-ui/react-antd 1.0.0

package/lib/components/Radio.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+export declare function Radio(props: {
+    value?: any;
+    checked?: boolean;
+    onChange?: (e: any) => void;
+    disabled?: boolean;
+    children?: React.ReactNode;
+}): React.JSX.Element;
+export declare namespace Radio {
+    var Group: any;
+    var Button: any;
+}
+export declare function RadioGroup(props: {
+    value?: any;
+    onChange?: (value: any) => void;
+    options?: {
+        value: any;
+        label: React.ReactNode;
+        disabled?: boolean;
+    }[];
+    disabled?: boolean;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Radio.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbRadio } from '@huibo-ui/react';
+export function Radio(props) {
+    return _jsx(HbRadio, { value: props.value, checked: props.checked, disabled: props.disabled, label: props.children, onHbChange: (e) => props.onChange?.({ target: { value: e.detail } }), children: props.children });
+}
+// RadioGroup：huibo-ui 无独立 hb-radio-group 组件，用 div + 多个 hb-radio 实现
+export function RadioGroup(props) {
+    const { value, onChange, options, disabled } = props;
+    if (options) {
+        return (_jsx("div", { style: props.style, children: options.map((opt, i) => (_jsx(HbRadio, { value: opt.value, checked: value === opt.value, disabled: disabled || opt.disabled, label: opt.label, onHbChange: (e) => onChange?.(e.detail) }, i))) }));
+    }
+    // children 模式：透传（用户自己用 <Radio> 子元素）
+    return _jsx("div", { style: props.style, "data-value": value, children: props.children });
+}
+// 挂上 antd 静态子组件（Radio.Group / Radio.Button）
+Radio.Group = RadioGroup;
+/**
+ * Radio.Button —— 样式变体，huibo hb-radio 无 button 形态；
+ * 这里复用 Radio 渲染（功能可用，视觉非按钮）。
+ */
+Radio.Button = function RadioButton(props) {
+    return _jsx(Radio, { ...props });
+};

package/lib/components/Rate.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare function Rate(props: {
+    value?: number;
+    onChange?: (value: number) => void;
+    count?: number;
+    allowHalf?: boolean;
+    disabled?: boolean;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Rate.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbRate } from '@huibo-ui/react';
+export function Rate(props) {
+    return _jsx(HbRate, { modelValue: props.value ?? 0, max: props.count ?? 5, allowHalf: props.allowHalf, disabled: props.disabled, onHbChange: (e) => props.onChange?.(e.detail), style: props.style });
+}

package/lib/components/Result.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare function Result(props: {
+    status?: 'success' | 'error' | 'info' | 'warning' | '404' | '403' | '500';
+    title?: React.ReactNode;
+    subTitle?: React.ReactNode;
+    extra?: React.ReactNode;
+    children?: React.ReactNode;
+}): React.JSX.Element;

package/lib/components/Result.js

@@ -0,0 +1,5 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { HbResult } from '@huibo-ui/react';
+export function Result(props) {
+    return _jsxs(HbResult, { status: props.status, title: typeof props.title === 'string' ? props.title : '', subTitle: typeof props.subTitle === 'string' ? props.subTitle : '', children: [props.extra, props.children] });
+}

package/lib/components/Segmented.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare function Segmented(props: {
+    options?: {
+        value: string;
+        label: React.ReactNode;
+    }[];
+    value?: string;
+    onChange?: (value: string) => void;
+    block?: boolean;
+    size?: 'small' | 'middle' | 'large';
+}): React.JSX.Element;

package/lib/components/Segmented.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbSegmented } from '@huibo-ui/react';
+export function Segmented(props) {
+    return _jsx(HbSegmented, { options: props.options, modelValue: props.value, block: props.block, size: props.size === 'middle' ? 'default' : props.size, onHbChange: (e) => props.onChange?.(e.detail) });
+}

package/lib/components/Select.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+export interface SelectOption {
+    value: string | number;
+    label: React.ReactNode;
+    disabled?: boolean;
+}
+export interface SelectProps {
+    value?: string | number | (string | number)[];
+    defaultValue?: string | number | (string | number)[];
+    onChange?: (value: any, option: any) => void;
+    options?: SelectOption[];
+    mode?: 'multiple' | 'tags';
+    placeholder?: string;
+    disabled?: boolean;
+    size?: 'small' | 'middle' | 'large';
+    allowClear?: boolean;
+    showSearch?: boolean;
+    loading?: boolean;
+    style?: React.CSSProperties;
+    className?: string;
+    children?: React.ReactNode;
+    virtual?: boolean;
+    onSearch?: (value: string) => void;
+    onDropdownVisibleChange?: (open: boolean) => void;
+}
+export declare function Select(props: SelectProps): React.JSX.Element;
+export declare namespace Select {
+    var Option: any;
+    var OptGroup: any;
+}

package/lib/components/Select.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { HbSelect } from '@huibo-ui/react';
+/**
+ * 把 antd 声明式 children（<Select.Option value>label</Select.Option>）转成 options 数组。
+ * hb-select 只认 options，不认 option 子节点。
+ */
+function optionsFromChildren(children) {
+    const opts = [];
+    React.Children.forEach(children, child => {
+        if (!React.isValidElement(child))
+            return;
+        const props = child.props || {};
+        // Select.Option 或 Select.OptGroup
+        if (child.type === SelectOptionComponent || child.type === Select.Option) {
+            opts.push({ value: props.value, label: props.label ?? props.children, disabled: props.disabled });
+        }
+        else if (props.options && Array.isArray(props.options)) {
+            // OptGroup: { label, options: [{value,label}] }
+            props.options.forEach((o) => opts.push({ value: o.value, label: o.label ?? o.value }));
+        }
+    });
+    return opts;
+}
+function SelectOptionComponent(_props) {
+    // Select.Option 不实际渲染（由父 Select 收集为 options）
+    return null;
+}
+export function Select(props) {
+    const { value, onChange, options, mode, placeholder, disabled, size, allowClear, showSearch, virtual, style, children, } = props;
+    // 优先用 options prop；否则从 <Select.Option> children 提取
+    const resolvedOptions = options && options.length > 0 ? options : optionsFromChildren(children);
+    return (_jsx(HbSelect, { modelValue: value, options: resolvedOptions, multiple: mode === 'multiple' || mode === 'tags', placeholder: placeholder, disabled: disabled, size: size === 'middle' ? 'default' : size, clearable: allowClear, filterable: showSearch, virtual: virtual, style: style, onHbChange: (e) => {
+            if (onChange)
+                onChange(e.detail, undefined);
+        }, onHbVisibleChange: (e) => {
+            if (props.onDropdownVisibleChange)
+                props.onDropdownVisibleChange(e.detail);
+        } }));
+}
+// Select.Option / Select.OptGroup —— 声明式用法占位（值由父 Select 收集）
+Select.Option = SelectOptionComponent;
+Select.OptGroup = SelectOptionComponent;

package/lib/components/Skeleton.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+export declare function Skeleton(props: {
+    active?: boolean;
+    loading?: boolean;
+    avatar?: boolean;
+    paragraph?: {
+        rows?: number;
+        width?: any;
+    };
+    title?: boolean;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;
+export declare namespace Skeleton {
+    var Input: any;
+    var Button: any;
+    var Avatar: any;
+    var Image: any;
+}

package/lib/components/Skeleton.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbSkeleton } from '@huibo-ui/react';
+export function Skeleton(props) {
+    return (_jsx(HbSkeleton, { loading: props.loading ?? true, animated: props.active, rows: props.paragraph?.rows, children: props.children }));
+}
+Skeleton.Input = function SkeletonInput({ active, style }) {
+    return _jsx("div", { style: { height: 32, width: '100%', background: 'rgba(0,0,0,0.06)', borderRadius: 6, ...style } });
+};
+Skeleton.Button = function SkeletonButton({ active, size, style }) {
+    const h = size === 'small' ? 24 : size === 'large' ? 40 : 32;
+    const w = size === 'small' ? 48 : size === 'large' ? 64 : 56;
+    return _jsx("div", { style: { width: w, height: h, background: 'rgba(0,0,0,0.06)', borderRadius: 6, ...style } });
+};
+Skeleton.Avatar = function SkeletonAvatar({ active, size, style }) {
+    const s = size ?? 32;
+    return _jsx("div", { style: { width: s, height: s, borderRadius: '50%', background: 'rgba(0,0,0,0.06)', ...style } });
+};
+Skeleton.Image = function SkeletonImage({ active, style }) {
+    return _jsx("div", { style: { width: 96, height: 96, background: 'rgba(0,0,0,0.06)', ...style } });
+};

package/lib/components/Slider.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare function Slider(props: {
+    value?: number;
+    onChange?: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    vertical?: boolean;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Slider.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbSlider } from '@huibo-ui/react';
+export function Slider(props) {
+    return _jsx(HbSlider, { modelValue: props.value ?? 0, min: props.min ?? 0, max: props.max ?? 100, step: props.step ?? 1, disabled: props.disabled, vertical: props.vertical, onHbChange: (e) => props.onChange?.(e.detail), style: props.style });
+}

package/lib/components/Space.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export declare function Space(props: {
+    size?: 'small' | 'middle' | 'large' | number;
+    direction?: 'horizontal' | 'vertical';
+    align?: 'start' | 'center' | 'end';
+    wrap?: boolean;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;
+export declare namespace Space {
+    var Compact: any;
+}

package/lib/components/Space.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbSpace } from '@huibo-ui/react';
+export function Space(props) {
+    return _jsx(HbSpace, { size: props.size === 'middle' ? 'default' : props.size, direction: props.direction, align: props.align, wrap: props.wrap, style: props.style, children: props.children });
+}
+/**
+ * Space.Compact —— 紧凑布局（antd 子组件）。huibo 无对应形态，
+ * 这里直接透传 children（间距为 0）。
+ */
+Space.Compact = function Compact(props) {
+    return _jsx("div", { style: { display: 'inline-flex', ...props.style }, children: props.children });
+};

package/lib/components/Spin.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare function Spin(props: {
+    spinning?: boolean;
+    size?: 'small' | 'middle' | 'large';
+    tip?: React.ReactNode;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Spin.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HbLoading } from '@huibo-ui/react';
+export function Spin(props) {
+    if (props.children) {
+        return _jsxs("div", { style: { position: 'relative' }, children: [props.spinning && _jsx(HbLoading, { size: props.size === 'middle' ? 'default' : props.size, fullscreen: false }), props.children] });
+    }
+    return _jsx(HbLoading, { size: props.size === 'middle' ? 'default' : props.size });
+}

package/lib/components/Statistic.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare function Statistic(props: {
+    title?: React.ReactNode;
+    value?: string | number;
+    precision?: number;
+    prefix?: React.ReactNode;
+    suffix?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Statistic.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbStatistic } from '@huibo-ui/react';
+export function Statistic(props) {
+    return _jsx(HbStatistic, { title: typeof props.title === 'string' ? props.title : '', value: props.value ?? 0, precision: props.precision, prefix: props.prefix, suffix: props.suffix, style: props.style });
+}

package/lib/components/Steps.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export declare function Steps(props: {
+    current?: number;
+    items?: any[];
+    direction?: 'horizontal' | 'vertical';
+    size?: 'small' | 'default';
+    status?: 'process' | 'finish' | 'error' | 'wait';
+    type?: 'default' | 'navigation' | 'inline';
+    children?: React.ReactNode;
+}): React.JSX.Element;
+export declare namespace Steps {
+    var Step: any;
+}

package/lib/components/Steps.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { HbSteps, HbStep } from '@huibo-ui/react';
+export function Steps(props) {
+    return _jsx(HbSteps, { active: props.current ?? 0, items: props.items, direction: props.direction, type: props.type, processStatus: props.status, size: props.size, children: props.children });
+}
+Steps.Step = function Step(props) { return React.createElement(HbStep, { title: props.title, description: props.description, status: props.status }, props.children); };

package/lib/components/Switch.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export declare function Switch(props: {
+    checked?: boolean;
+    onChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    size?: 'small' | 'middle' | 'large';
+    checkedChildren?: React.ReactNode;
+    unCheckedChildren?: React.ReactNode;
+    loading?: boolean;
+}): React.JSX.Element;

package/lib/components/Switch.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbSwitch } from '@huibo-ui/react';
+export function Switch(props) {
+    return _jsx(HbSwitch, { modelValue: props.checked ?? false, disabled: props.disabled, size: props.size === 'middle' ? 'default' : props.size, activeText: props.checkedChildren, inactiveText: props.unCheckedChildren, onHbChange: (e) => props.onChange?.(e.detail) });
+}

package/lib/components/Table.d.ts

@@ -0,0 +1,55 @@
+import React from 'react';
+export interface ColumnType<T = any> {
+    title?: React.ReactNode | (() => React.ReactNode);
+    dataIndex?: string;
+    key?: string | number;
+    width?: string | number;
+    minWidth?: string | number;
+    align?: 'left' | 'center' | 'right';
+    fixed?: 'left' | 'right' | boolean;
+    sorter?: boolean | ((a: T, b: T) => number);
+    sortOrder?: 'ascend' | 'descend' | null;
+    filters?: {
+        text: React.ReactNode;
+        value: string | number;
+    }[];
+    filteredValue?: (string | number)[];
+    onFilter?: (value: any, record: T) => boolean;
+    render?: (value: any, record: T, index: number) => React.ReactNode;
+    ellipsis?: boolean;
+}
+export interface TableProps<T = any> {
+    dataSource?: T[];
+    columns?: ColumnType<T>[];
+    rowKey?: string | ((record: T) => string | number);
+    loading?: boolean;
+    size?: 'small' | 'middle' | 'large';
+    bordered?: boolean;
+    pagination?: false | {
+        current?: number;
+        pageSize?: number;
+        total?: number;
+        showSizeChanger?: boolean;
+        pageSizeOptions?: string[];
+        showTotal?: (total: number) => React.ReactNode;
+        onChange?: (page: number, pageSize: number) => void;
+    };
+    rowSelection?: {
+        type?: 'checkbox' | 'radio';
+        selectedRowKeys?: React.Key[];
+        onChange?: (selectedRowKeys: React.Key[], selectedRows: T[]) => void;
+        getCheckboxProps?: (record: T) => {
+            disabled?: boolean;
+        };
+    };
+    scroll?: {
+        x?: number | string;
+        y?: number | string;
+    };
+    onChange?: (pagination: any, filters: any, sorter: any) => void;
+    expandedRowRender?: (record: T, index: number) => React.ReactNode;
+    style?: React.CSSProperties;
+    className?: string;
+}
+export declare function Table<T = any>(props: TableProps<T>): React.JSX.Element;
+export type ColumnsType<T = any> = ColumnType<T>[];

package/lib/components/Table.js

@@ -0,0 +1,187 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { createRoot } from 'react-dom/client';
+import { HbTable } from '@huibo-ui/react';
+/**
+ * 兼容层 Table 单元格 portal sentinel。
+ * hb-table 的 render 返回此常量时，会渲染出一个带 data-row-key / data-col /
+ * data-row-index 的空 <span class="hb-table__cell-portal">，并在 componentDidRender
+ * 发出 hbCellsRendered 事件。本组件据此用 React createRoot 把「带事件 handler 的」
+ * 真正内容挂进该 span —— 从而让表格单元格里 Switch / 按钮等交互控件保留可点击性
+ * （旧实现 renderToStaticMarkup 会把事件 handler 全部剥掉，控件渲染但点不动）。
+ */
+const CELL_PORTAL_SENTINEL = '__HB_TABLE_CELL_PORTAL__';
+/**
+ * 把 render 返回的 React 元素拍平成 HTML 字符串。
+ * Stencil hb-table 的 renderCell 直接把值塞进 vdom，若值是 React 元素（被冻结），
+ * Stencil 会把它当 vnode patch → "Cannot add property $elm$"。
+ * 所以这里转成 HTML 字符串再传给 hb-table（单元格内通常是小段文字/标签/图标，可接受）。
+ */
+function renderToHtml(node) {
+    if (node == null || node === false || node === true)
+        return '';
+    if (typeof node === 'string' || typeof node === 'number')
+        return String(node);
+    try {
+        return renderToStaticMarkup(node);
+    }
+    catch {
+        return '';
+    }
+}
+export function Table(props) {
+    const { dataSource = [], columns = [], rowKey, loading, size, bordered, pagination, rowSelection, scroll, onChange } = props;
+    // antd columns → huibo columns
+    const huiboColumns = columns.map(c => ({
+        prop: c.dataIndex || c.key || '',
+        // 支持 antd 动态表头：title 为函数时先调用取返回值（否则 React 会把函数当子节点 →
+        // "Functions are not valid as a React child" 警告且表头为空）
+        label: renderToHtml(typeof c.title === 'function' ? c.title() : c.title),
+        width: c.width ? String(c.width).replace('px', '') + 'px' : undefined,
+        minWidth: c.minWidth ? String(c.minWidth) : undefined,
+        align: c.align,
+        fixed: c.fixed,
+        sortable: typeof c.sorter === 'boolean' ? c.sorter : !!c.sorter,
+        sorter: typeof c.sorter === 'function' ? c.sorter : undefined,
+        sortOrder: c.sortOrder === 'ascend' ? 'ascending' : c.sortOrder === 'descend' ? 'descending' : undefined,
+        filters: c.filters?.map((f) => ({ label: String(f.text), value: f.value })),
+        filteredValue: c.filteredValue,
+        onFilter: c.onFilter ? (row, val) => c.onFilter(val, row) : undefined,
+        // 有 render 的列走 portal：hb-table 渲染空 sentinel span，再由本组件用 React
+        // createRoot 挂入真正的交互内容（保留事件 handler）。无 render 的列走原值快路径。
+        render: c.render ? () => CELL_PORTAL_SENTINEL : undefined,
+        ellipsis: c.ellipsis,
+    }));
+    // rowKey 函数 → 字符串
+    const huiboRowKey = typeof rowKey === 'string' ? rowKey : '';
+    // pagination 适配
+    const huiboPagination = pagination === false ? undefined : pagination ? {
+        current: pagination.current,
+        pageSize: pagination.pageSize,
+        pageSizes: pagination.pageSizeOptions?.map((s) => parseInt(s)),
+        showTotal: !!pagination.showTotal,
+    } : undefined;
+    // rowSelection 适配
+    const huiboRowSelection = rowSelection ? {
+        type: rowSelection.type || 'checkbox',
+        selectedRowKeys: rowSelection.selectedRowKeys,
+        getCheckboxProps: rowSelection.getCheckboxProps,
+    } : undefined;
+    // ===== 单元格 portal：把含交互内容的单元格用 React createRoot 挂进 hb-table 的 sentinel span =====
+    // 用 callback ref 稳定拿到 hb-table CE 节点（输出目标 forwardRef 模板兼容）。
+    const tableHostRef = React.useRef(null);
+    const setTableHost = React.useCallback((el) => {
+        tableHostRef.current = el;
+    }, []);
+    // key = `${rowKey}::${colProp}` → { root, node }；node 用于检测 span 是否被 hb-table 重建
+    const cellRootsRef = React.useRef(new Map());
+    // colProp → { col }，仅含有 render 的列
+    const colRenderMap = React.useMemo(() => {
+        const m = new Map();
+        columns.forEach(c => {
+            if (c.render)
+                m.set(c.dataIndex || c.key || '', { col: c });
+        });
+        return m;
+    }, [columns]);
+    // hb-table 每次 componentDidRender 发 hbCellsRendered 后，扫描 sentinel span，
+    // 把真正的 React 内容（含事件 handler）挂进去。
+    const reconcileCellPortals = React.useCallback(() => {
+        const host = tableHostRef.current;
+        const sr = host && host.shadowRoot;
+        if (!sr)
+            return;
+        const spans = Array.from(sr.querySelectorAll('.hb-table__cell-portal'));
+        const seen = new Set();
+        const rkStr = typeof rowKey === 'string' ? rowKey : '';
+        for (const span of spans) {
+            const rk = span.getAttribute('data-row-key') || '';
+            const colProp = span.getAttribute('data-col') || '';
+            const key = `${rk}::${colProp}`;
+            seen.add(key);
+            const info = colRenderMap.get(colProp);
+            if (!info)
+                continue;
+            // 行数据定位：受控 rowKey 用字段匹配，否则用 rowIndex
+            let index = -1;
+            if (rkStr) {
+                index = dataSource.findIndex(r => String(r[rkStr]) === rk);
+            }
+            else {
+                const n = Number(rk);
+                index = Number.isFinite(n) ? n : -1;
+            }
+            if (index < 0 || index >= dataSource.length)
+                continue;
+            const row = dataSource[index];
+            let node;
+            try {
+                node = info.col.render(row[info.col.dataIndex ?? colProp], row, index);
+            }
+            catch {
+                node = '';
+            }
+            // 基本类型：直接 textContent（格式化列走快路径，无需 React root）
+            if (node == null || typeof node === 'string' || typeof node === 'number') {
+                const prev = cellRootsRef.current.get(key);
+                if (prev) {
+                    prev.root.unmount();
+                    cellRootsRef.current.delete(key);
+                }
+                const txt = node == null ? '' : String(node);
+                if (span.textContent !== txt)
+                    span.textContent = txt;
+            }
+            else {
+                // React 元素：createRoot 挂载/更新，保留事件 handler（交互控件可点击）
+                let entry = cellRootsRef.current.get(key);
+                if (!entry || entry.node !== span) {
+                    if (entry)
+                        entry.root.unmount();
+                    entry = { root: createRoot(span), node: span };
+                    cellRootsRef.current.set(key, entry);
+                }
+                entry.root.render(node);
+            }
+        }
+        // 清理已消失的单元格 root，防泄漏
+        for (const [key, entry] of cellRootsRef.current) {
+            if (!seen.has(key)) {
+                entry.root.unmount();
+                cellRootsRef.current.delete(key);
+            }
+        }
+    }, [colRenderMap, dataSource, rowKey]);
+    React.useEffect(() => {
+        const host = tableHostRef.current;
+        if (!host)
+            return;
+        const onRendered = () => reconcileCellPortals();
+        host.addEventListener('hbCellsRendered', onRendered);
+        reconcileCellPortals();
+        return () => {
+            host.removeEventListener('hbCellsRendered', onRendered);
+        };
+    }, [reconcileCellPortals]);
+    // 卸载清理
+    React.useEffect(() => {
+        return () => {
+            cellRootsRef.current.forEach(e => e.root.unmount());
+            cellRootsRef.current.clear();
+        };
+    }, []);
+    return (_jsx(HbTable, { ref: setTableHost, data: dataSource, columns: huiboColumns, rowKey: huiboRowKey, loading: loading, size: size === 'middle' ? 'default' : size || 'default', border: bordered, stripe: false, pagination: huiboPagination, rowSelection: huiboRowSelection, tableScroll: scroll ? { x: scroll.x ? String(scroll.x) : undefined, y: scroll.y ? String(scroll.y) : undefined } : undefined, onHbPageChange: (e) => {
+            if (pagination && pagination.onChange)
+                pagination.onChange(e.detail.current, e.detail.pageSize);
+        }, onHbSelectionChange: (e) => {
+            if (rowSelection?.onChange) {
+                const rows = e.detail;
+                const keys = huiboRowKey ? rows.map((r) => r[huiboRowKey]) : rows.map((_, i) => i);
+                rowSelection.onChange(keys, rows);
+            }
+        }, onHbSortChange: (e) => {
+            if (onChange)
+                onChange({}, {}, { field: e.detail.prop, order: e.detail.order === 'ascending' ? 'ascend' : e.detail.order === 'descending' ? 'descend' : undefined });
+        }, style: props.style }));
+}

package/lib/components/Tabs.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+export interface TabItemType {
+    key: string;
+    label: React.ReactNode;
+    children?: React.ReactNode;
+    disabled?: boolean;
+}
+export declare function Tabs(props: {
+    items?: TabItemType[];
+    activeKey?: string;
+    defaultActiveKey?: string;
+    onChange?: (key: string) => void;
+    type?: 'line' | 'card';
+    size?: 'small' | 'middle' | 'large';
+    tabPosition?: 'top' | 'bottom' | 'left' | 'right';
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;
+export declare namespace Tabs {
+    var TabPane: any;
+}

package/lib/components/Tabs.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { HbTabs, HbTabPane } from '@huibo-ui/react';
+export function Tabs(props) {
+    return _jsx(HbTabs, { items: props.items, modelValue: props.activeKey, type: props.type, size: props.size === 'middle' ? 'default' : props.size, tabPosition: props.tabPosition, onHbTabChange: (e) => props.onChange?.(e.detail), style: props.style, children: props.children });
+}
+Tabs.TabPane = function TabPane(props) { return React.createElement(HbTabPane, { key: props.tabKey || props.key, label: props.tab }, props.children); };

package/lib/components/Tag.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare function Tag(props: {
+    color?: string;
+    closable?: boolean;
+    onClose?: () => void;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}): React.JSX.Element;

package/lib/components/Tag.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HbTag } from '@huibo-ui/react';
+const colorMap = { success: 'success', processing: 'info', error: 'danger', default: 'info', warning: 'warning', blue: 'primary', green: 'success', red: 'danger', orange: 'warning' };
+export function Tag(props) {
+    return _jsx(HbTag, { type: (colorMap[props.color || 'default'] || 'default'), closable: props.closable, onHbClose: () => props.onClose?.(), style: props.style, children: props.children });
+}

package/lib/components/TimePicker.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare function TimePicker(props: {
+    value?: string;
+    onChange?: (value: any) => void;
+    format?: string;
+    allowClear?: boolean;
+    disabled?: boolean;
+    size?: 'small' | 'middle' | 'large';
+    placeholder?: string;
+    style?: React.CSSProperties;
+}): React.JSX.Element;