@yuntijs/ui 1.0.0-beta.7 → 1.0.0-beta.71

package/es/SelectCard/index.js

@@ -0,0 +1,129 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["defaultValue", "value", "onChange", "multiple", "disabled", "options", "classNames", "styles", "size", "optionRender"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Icon } from '@lobehub/ui';
+import { Avatar, Flex, Typography } from 'antd';
+import { Check } from 'lucide-react';
+import { useMergedState } from 'rc-util';
+import React, { useCallback, useMemo } from 'react';
+import { getNumberBySize, useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var Text = Typography.Text,
+  Paragraph = Typography.Paragraph;
+export var SelectCard = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var defaultValue = props.defaultValue,
+    value = props.value,
+    onChange = props.onChange,
+    _props$multiple = props.multiple,
+    multiple = _props$multiple === void 0 ? false : _props$multiple,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$options = props.options,
+    options = _props$options === void 0 ? [] : _props$options,
+    classNames = props.classNames,
+    stylesFromProps = props.styles,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'middle' : _props$size,
+    optionRender = props.optionRender,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var isImg = useMemo(function () {
+    return options.some(function (o) {
+      return !!o.img || !!o.icon;
+    });
+  }, [options]);
+  var _useStyles = useStyles({
+      disabled: disabled,
+      size: size
+    }),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  var _useMemo = useMemo(function () {
+      return getNumberBySize(size);
+    }, [size]),
+    imgHeight = _useMemo.imgHeight;
+  var formatValue = useCallback(function (v) {
+    if (!multiple) {
+      return v;
+    }
+    if (Array.isArray(v)) {
+      return v;
+    }
+    return v === undefined ? [] : [v];
+  }, [multiple]);
+  var _useMergedState = useMergedState(formatValue(defaultValue), {
+      defaultValue: formatValue(defaultValue),
+      value: value,
+      onChange: onChange
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    currentValue = _useMergedState2[0],
+    setCurrentValue = _useMergedState2[1];
+  var onSelect = useCallback(function (v) {
+    if (disabled) {
+      return;
+    }
+    if (!multiple) {
+      setCurrentValue(v);
+      return;
+    }
+    if (currentValue.includes(v)) {
+      setCurrentValue(currentValue.filter(function (cv) {
+        return cv !== v;
+      }));
+      return;
+    }
+    setCurrentValue([].concat(_toConsumableArray(currentValue), [v]));
+  }, [currentValue, disabled, multiple, setCurrentValue]);
+  var isSelected = useCallback(function (v) {
+    return multiple ? currentValue.includes(v) : currentValue === v;
+  }, [currentValue, multiple]);
+  var renderOption = useCallback(function (o, index) {
+    var selected = isSelected(o.value);
+    var Option = /*#__PURE__*/_jsxs(Flex, {
+      align: isImg ? 'center' : 'flex-start',
+      className: cx(styles.option, selected && styles.optionSelected, classNames === null || classNames === void 0 ? void 0 : classNames.card),
+      gap: "small",
+      onClick: function onClick() {
+        return onSelect(o.value);
+      },
+      style: _objectSpread(_objectSpread({}, stylesFromProps === null || stylesFromProps === void 0 ? void 0 : stylesFromProps.card), o.style),
+      vertical: true,
+      children: [isImg && /*#__PURE__*/_jsx(Avatar, {
+        className: classNames === null || classNames === void 0 ? void 0 : classNames.icon,
+        icon: o.icon,
+        shape: "square",
+        size: imgHeight,
+        src: o.img,
+        style: _objectSpread(_objectSpread({}, stylesFromProps === null || stylesFromProps === void 0 ? void 0 : stylesFromProps.icon), o.iconStyle)
+      }), o.label && /*#__PURE__*/_jsx(Text, {
+        ellipsis: true,
+        strong: true,
+        children: o.label
+      }), !isImg && o.description && /*#__PURE__*/_jsx(Paragraph, {
+        ellipsis: {
+          rows: 2
+        },
+        type: "secondary",
+        children: o.description
+      }), multiple && selected && /*#__PURE__*/_jsx(Icon, {
+        className: styles.check,
+        icon: Check
+      })]
+    }, o.value);
+    return optionRender ? optionRender(Option, o, index) : Option;
+  }, [classNames === null || classNames === void 0 ? void 0 : classNames.card, classNames === null || classNames === void 0 ? void 0 : classNames.icon, cx, imgHeight, isImg, isSelected, multiple, onSelect, optionRender, styles.check, styles.option, styles.optionSelected, stylesFromProps === null || stylesFromProps === void 0 ? void 0 : stylesFromProps.card, stylesFromProps === null || stylesFromProps === void 0 ? void 0 : stylesFromProps.icon]);
+  return /*#__PURE__*/_jsx(Flex, _objectSpread(_objectSpread({
+    gap: "large",
+    ref: ref,
+    wrap: true
+  }, otherProps), {}, {
+    children: options.map(function (o, index) {
+      return renderOption(o, index);
+    })
+  }));
+});

package/es/SelectCard/style.d.ts

@@ -0,0 +1,10 @@
+import type { SelectCardProps } from '.';
+export declare const getNumberBySize: (size: SelectCardProps['size']) => {
+    cardWidth: number;
+    imgHeight: number;
+};
+export declare const useStyles: (props?: Pick<SelectCardProps, "size" | "disabled"> | undefined) => import("antd-style").ReturnStyles<{
+    option: import("antd-style").SerializedStyles;
+    optionSelected: import("antd-style").SerializedStyles;
+    check: import("antd-style").SerializedStyles;
+}>;

package/es/SelectCard/style.js

@@ -0,0 +1,42 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+import { createStyles } from 'antd-style';
+export var getNumberBySize = function getNumberBySize(size) {
+  switch (size) {
+    case 'small':
+      {
+        return {
+          cardWidth: 144,
+          imgHeight: 32
+        };
+      }
+    case 'large':
+      {
+        return {
+          cardWidth: 200,
+          imgHeight: 64
+        };
+      }
+    default:
+      {
+        return {
+          cardWidth: 168,
+          imgHeight: 40
+        };
+      }
+  }
+};
+export var useStyles = createStyles(function (_ref, _ref2) {
+  var css = _ref.css,
+    token = _ref.token,
+    prefixCls = _ref.prefixCls;
+  var disabled = _ref2.disabled,
+    size = _ref2.size;
+  var _getNumberBySize = getNumberBySize(size),
+    cardWidth = _getNumberBySize.cardWidth;
+  return {
+    option: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        position: relative;\n\n        border: 1px solid ", ";\n        border-radius: ", "px;\n\n        cursor: ", ";\n\n        padding: ", "px;\n\n        transition: all ", ";\n\n        width: ", "px;\n        min-height: 108px;\n\n        ", "\n\n        ", "\n\n        div.", "-typography {\n          margin-bottom: 0;\n        }\n      "])), token.colorBorder, token.borderRadius, disabled ? 'not-allowed' : 'pointer', token.padding, token.motionDurationFast, cardWidth, disabled && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n          background-color: ", ";\n          .", "-typography {\n            color: ", ";\n            &.", "-typography-secondary {\n              color: ", ";\n            }\n          }\n        "])), token.colorBgContainerDisabled, prefixCls, token.colorTextDisabled, prefixCls, token.colorTextDisabled), !disabled && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n          &:hover {\n            border-color: ", ";\n          }\n        "])), token.colorPrimaryBorderHover), prefixCls),
+    optionSelected: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        border-color: ", ";\n        &:hover {\n          border-color: ", ";\n        }\n      "])), token.colorPrimary, token.colorPrimaryActive),
+    check: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        position: absolute;\n        right: ", "px;\n        bottom: ", "px;\n        color: ", ";\n      "])), token.marginXS, token.marginXS, token.colorPrimary)
+  };
+});

package/es/SliderInput/index.d.ts

@@ -0,0 +1,54 @@
+import { ColProps } from 'antd';
+import type { InputNumberProps, SliderSingleProps } from 'antd';
+import React from 'react';
+export interface SliderInputProps {
+    /** The current value */
+    value?: number;
+    /** The initial value */
+    defaultValue?: number;
+    /** The min value */
+    min?: number;
+    /** The max value */
+    max?: number;
+    /** The number to which the current value is increased or decreased. It can be an integer or decimal */
+    step?: number;
+    /** Spacing between grids, could be a number or a object like { xs: 8, sm: 16, md: 24}. Or you can use array to make horizontal and vertical spacing work at the same time [horizontal, vertical] */
+    gutter?: number;
+    /**
+     * @description Slider layout, like <Col> component. Set span offset value like {span: 3, offset: 12} or sm: {span: 3, offset: 12}
+     * @type ColProps
+     * @default { span: 12 }
+     */
+    sliderCol?: ColProps;
+    /**
+     * @description The layout for input controls, same as sliderCol, see https://ant.design/components/grid#row for detail
+     * @type ColProps
+     * @default { span: 5 }
+     */
+    inputCol?: ColProps;
+    /** The label text displayed before (on the left side of) the input field */
+    addonAfter?: React.ReactNode;
+    /** The label text displayed before (on the left side of) the input field */
+    addonBefore?: React.ReactNode;
+    /** placeholder  */
+    placeholder?: string;
+    /** The callback triggered when the value is changed */
+    onChange?: (value: number) => void;
+    /** style */
+    style?: React.CSSProperties;
+    /** className */
+    className?: string;
+    /**
+     * @description the props of slider, see https://ant.design/components/slider#api for detail
+     * @type SliderSingleProps
+     * @default {}
+     */
+    sliderProps?: SliderSingleProps;
+    /**
+     * @description the props of input, see https://ant.design/components/input-number#api for detail
+     * @type InputNumberProps
+     * @default {}
+     */
+    inputProps?: InputNumberProps;
+}
+export declare const SliderInput: React.FC<SliderInputProps>;

package/es/SliderInput/index.js

@@ -0,0 +1,74 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Col, InputNumber, Row, Slider } from 'antd';
+import React, { useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var SliderInput = function SliderInput(_ref) {
+  var value = _ref.value,
+    defaultValue = _ref.defaultValue,
+    _ref$min = _ref.min,
+    min = _ref$min === void 0 ? 0 : _ref$min,
+    max = _ref.max,
+    step = _ref.step,
+    _ref$gutter = _ref.gutter,
+    gutter = _ref$gutter === void 0 ? 16 : _ref$gutter,
+    _ref$sliderCol = _ref.sliderCol,
+    sliderCol = _ref$sliderCol === void 0 ? {
+      span: 12
+    } : _ref$sliderCol,
+    _ref$inputCol = _ref.inputCol,
+    inputCol = _ref$inputCol === void 0 ? {
+      span: 5
+    } : _ref$inputCol,
+    addonAfter = _ref.addonAfter,
+    addonBefore = _ref.addonBefore,
+    placeholder = _ref.placeholder,
+    onChange = _ref.onChange,
+    style = _ref.style,
+    className = _ref.className,
+    _ref$sliderProps = _ref.sliderProps,
+    sliderProps = _ref$sliderProps === void 0 ? {} : _ref$sliderProps,
+    _ref$inputProps = _ref.inputProps,
+    inputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps;
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    number = _useState2[0],
+    setNumber = _useState2[1];
+  var onNumberChange = function onNumberChange(newNumber) {
+    if (Number.isNaN(newNumber)) {
+      return;
+    }
+    setNumber(newNumber);
+    onChange === null || onChange === void 0 || onChange(newNumber);
+  };
+  return /*#__PURE__*/_jsxs(Row, {
+    className: className,
+    gutter: gutter,
+    style: style,
+    children: [/*#__PURE__*/_jsx(Col, _objectSpread(_objectSpread({}, sliderCol), {}, {
+      children: /*#__PURE__*/_jsx(Slider, _objectSpread(_objectSpread({}, sliderProps), {}, {
+        defaultValue: defaultValue,
+        max: max,
+        min: min,
+        onChange: onNumberChange,
+        step: step,
+        value: value !== null && value !== void 0 ? value : number
+      }))
+    })), /*#__PURE__*/_jsx(Col, _objectSpread(_objectSpread({}, inputCol), {}, {
+      children: /*#__PURE__*/_jsx(InputNumber, _objectSpread(_objectSpread({}, inputProps), {}, {
+        addonAfter: addonAfter,
+        addonBefore: addonBefore,
+        defaultValue: defaultValue,
+        max: max,
+        min: min,
+        onChange: onNumberChange,
+        placeholder: placeholder,
+        step: step,
+        value: value !== null && value !== void 0 ? value : number
+      }))
+    }))]
+  });
+};

package/es/Status/index.d.ts

@@ -0,0 +1,7 @@
+import { BadgeProps } from 'antd';
+import React from 'react';
+export interface StatusProps extends Pick<BadgeProps, 'className' | 'color' | 'status' | 'style' | 'text'> {
+    tooltip?: React.ReactNode;
+    title?: string;
+}
+export declare const Status: React.FC<StatusProps>;

package/es/Status/index.js

@@ -0,0 +1,39 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["tooltip", "className", "status", "text", "color"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Icon } from '@lobehub/ui';
+import { Badge, Space, Tooltip } from 'antd';
+import { Info } from 'lucide-react';
+import React from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var Status = function Status(_ref) {
+  var tooltip = _ref.tooltip,
+    className = _ref.className,
+    status = _ref.status,
+    text = _ref.text,
+    color = _ref.color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsxs(Space, _objectSpread(_objectSpread({
+    className: cx(styles.root, className),
+    size: "small"
+  }, props), {}, {
+    children: [/*#__PURE__*/_jsx(Badge, {
+      status: status,
+      text: text,
+      color: color
+    }), tooltip && /*#__PURE__*/_jsx(Tooltip, {
+      className: styles.tooltip,
+      title: tooltip,
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: Info
+      })
+    })]
+  }));
+};

package/es/Status/style.d.ts

@@ -0,0 +1,4 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    root: import("antd-style").SerializedStyles;
+    tooltip: import("antd-style").SerializedStyles;
+}>;

package/es/Status/style.js

@@ -0,0 +1,14 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token,
+    prefixCls = _ref.prefixCls;
+  return {
+    root: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        .", "-badge.", "-badge-status {\n          .", "-badge-status-dot {\n            width: 8px;\n            height: 8px;\n          }\n        }\n      "])), prefixCls, prefixCls, prefixCls),
+    tooltip: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        &.anticon {\n          cursor: help;\n          color: ", ";\n        }\n      "])), token.colorTextTertiary)
+  };
+}, {
+  hashPriority: 'low'
+});

package/es/Table/collapse/index.d.ts

@@ -0,0 +1,8 @@
+import type { TableProps } from 'antd';
+import React from 'react';
+import { CollapseGroupProps } from '../../CollapseGroup';
+export interface CollapseTableProps extends Omit<TableProps, 'title'>, Pick<CollapseGroupProps, 'icon' | 'title' | 'variant' | 'defaultActive' | 'extra'> {
+    rootStyle?: React.CSSProperties;
+    rootClassName?: string;
+}
+export declare const CollapseTable: React.FC<CollapseTableProps>;

package/es/Table/collapse/index.js

@@ -0,0 +1,39 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["rootStyle", "rootClassName", "icon", "title", "variant", "defaultActive", "extra", "className"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Table } from 'antd';
+import React from 'react';
+import { CollapseGroup } from "../../CollapseGroup";
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var CollapseTable = function CollapseTable(_ref) {
+  var rootStyle = _ref.rootStyle,
+    rootClassName = _ref.rootClassName,
+    icon = _ref.icon,
+    title = _ref.title,
+    variant = _ref.variant,
+    defaultActive = _ref.defaultActive,
+    extra = _ref.extra,
+    className = _ref.className,
+    tableProps = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx(CollapseGroup, {
+    className: rootClassName,
+    style: rootStyle,
+    icon: icon,
+    title: title,
+    variant: variant,
+    defaultActive: defaultActive,
+    extra: extra,
+    children: /*#__PURE__*/_jsx(Table, _objectSpread({
+      className: cx(styles.table, className),
+      pagination: false,
+      rowHoverable: false,
+      size: "small"
+    }, tableProps))
+  });
+};

package/es/Table/collapse/style.d.ts

@@ -0,0 +1,3 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    table: import("antd-style").SerializedStyles;
+}>;

package/es/Table/collapse/style.js

@@ -0,0 +1,11 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token,
+    prefixCls = _ref.prefixCls;
+  return {
+    table: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      .", "-table {\n        &-thead {\n          & > tr > th {\n            font-weight: normal;\n            color: ", ";\n            background-color: unset;\n            &::before {\n              display: none;\n            }\n          }\n        }\n        &-tbody {\n          & > tr:last-child {\n            & > td {\n              border-bottom-color: transparent;\n            }\n          }\n        }\n        &-cell {\n          vertical-align: top;\n        }\n      }\n    "])), prefixCls, token.colorTextTertiary)
+  };
+});

package/es/Table/index.d.ts

@@ -0,0 +1,20 @@
+import { Table as AntdTable, TableProps } from 'antd';
+import { AnyObject } from 'antd/es/_util/type';
+import React from 'react';
+import { CollapseTable } from './collapse';
+export * from './collapse';
+export { type TableColumnGroupType, type TableColumnProps, type TableColumnsType, type TableColumnType, type TablePaginationConfig, type TableProps, } from 'antd';
+type YuntiTable = <RecordType extends AnyObject = AnyObject>(props: TableProps<RecordType>) => React.ReactElement;
+export declare const Table: YuntiTable & {
+    displayName?: typeof AntdTable.displayName;
+    SELECTION_COLUMN: typeof AntdTable.SELECTION_COLUMN;
+    EXPAND_COLUMN: typeof AntdTable.EXPAND_COLUMN;
+    SELECTION_ALL: typeof AntdTable.SELECTION_ALL;
+    SELECTION_INVERT: typeof AntdTable.SELECTION_INVERT;
+    SELECTION_NONE: typeof AntdTable.SELECTION_NONE;
+    Column: typeof AntdTable.Column;
+    ColumnGroup: typeof AntdTable.ColumnGroup;
+    Summary: typeof AntdTable.Summary;
+    Collapse: typeof CollapseTable;
+};
+export default Table;

package/es/Table/index.js

@@ -0,0 +1,56 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["columns"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Table as AntdTable, Tooltip } from 'antd';
+import React, { useMemo } from 'react';
+import { CollapseTable } from "./collapse";
+import { jsx as _jsx } from "react/jsx-runtime";
+export * from "./collapse";
+export var Table = function Table(props) {
+  var columns = props.columns,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var formatColumns = useMemo(function () {
+    return columns === null || columns === void 0 ? void 0 : columns.map(function (item) {
+      if (item.render) {
+        return item;
+      }
+      if (item.ellipsis && item.ellipsis !== true && item.ellipsis.showTitle || item.ellipsis === true) {
+        var tooltipProps = item.ellipsis === true ? {} : item.ellipsis;
+        return _objectSpread(_objectSpread({}, item), {}, {
+          ellipsis: {
+            showTitle: false
+          },
+          render: function render(text) {
+            return text || text === 0 ? /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({}, tooltipProps), {}, {
+              placement: "topLeft",
+              title: text,
+              children: text
+            })) : '-';
+          }
+        });
+      }
+      if (!item.render) {
+        item.render = function (text) {
+          return text !== null && text !== void 0 ? text : '-';
+        };
+      }
+      return item;
+    });
+  }, [columns]);
+  return /*#__PURE__*/_jsx(AntdTable, _objectSpread(_objectSpread({}, otherProps), {}, {
+    columns: formatColumns
+  }));
+};
+Table.displayName = 'Table';
+Table.SELECTION_COLUMN = AntdTable.SELECTION_COLUMN;
+Table.EXPAND_COLUMN = AntdTable.EXPAND_COLUMN;
+Table.SELECTION_ALL = AntdTable.SELECTION_ALL;
+Table.SELECTION_INVERT = AntdTable.SELECTION_INVERT;
+Table.SELECTION_NONE = AntdTable.SELECTION_NONE;
+Table.Column = AntdTable.Column;
+Table.ColumnGroup = AntdTable.ColumnGroup;
+Table.Summary = AntdTable.Summary;
+Table.Collapse = CollapseTable;
+export default Table;

package/es/Typography/index.d.ts

@@ -0,0 +1,32 @@
+import { Typography as AntdTypography } from 'antd';
+import type { TextProps } from 'antd/es/typography/Text';
+import type { TooltipPropsWithTitle } from 'antd/lib/tooltip';
+import React from 'react';
+export declare const Typography: TypographyProps;
+interface TimeProps extends TextProps {
+    /**
+     * @description Set display time
+     * @default '-'
+     */
+    time: string;
+    /**
+     * @description Formatted display time
+     * @default 'YYYY-MM-DD HH:mm:ss'
+     */
+    format?: string;
+    /**
+     * @description Display relative time
+     * @default 'true'
+     */
+    relativeTime?: boolean;
+    /**
+     * @description Mouse above to show time
+     * @default '{title: "YYYY-MM-DD HH:mm:ss"}'
+     */
+    tooltip?: TooltipPropsWithTitle;
+}
+declare const Time: React.FC<TimeProps>;
+export type TypographyProps = typeof AntdTypography & {
+    Time: typeof Time;
+};
+export default Typography;

package/es/Typography/index.js

@@ -0,0 +1,77 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["time", "format", "relativeTime", "tooltip"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { Typography as AntdTypography, Tooltip } from 'antd';
+import dayjs from 'dayjs';
+import dayjsRelativeTime from 'dayjs/plugin/relativeTime';
+import { set } from 'lodash-es';
+import React, { useCallback, useEffect, useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+dayjs.extend(dayjsRelativeTime);
+export var Typography = AntdTypography;
+var getFromNow = function getFromNow(t) {
+  return dayjs(t ? new Date(t) : new Date()).fromNow();
+};
+var Time = function Time(props) {
+  var _tooltip$title;
+  var time = props.time,
+    format = props.format,
+    _props$relativeTime = props.relativeTime,
+    relativeTime = _props$relativeTime === void 0 ? true : _props$relativeTime,
+    tooltip = props.tooltip,
+    textProps = _objectWithoutProperties(props, _excluded);
+  var _useState = useState(getFromNow(time)),
+    _useState2 = _slicedToArray(_useState, 2),
+    showTime = _useState2[0],
+    setShowTime = _useState2[1];
+
+  // The relative time within the last hour is updated automatically
+  var setTimeInterval = useCallback(function (currentTime) {
+    var now = dayjs();
+    var timeMoment = dayjs(currentTime);
+    var diff = now.diff(timeMoment);
+    if (diff > 0 && diff < 60 * 60 * 1000) {
+      return setInterval(function () {
+        setShowTime(getFromNow(currentTime));
+      }, 60 * 1000);
+    }
+  }, []);
+  useEffect(function () {
+    var timeout;
+    if (relativeTime) {
+      timeout = setTimeInterval(new Date(time));
+    }
+    return function () {
+      if (timeout) {
+        clearInterval(timeout);
+      }
+    };
+  }, [relativeTime, setTimeInterval, time]);
+  useEffect(function () {
+    if (!relativeTime) return;
+    var nextFromNow = getFromNow(time);
+    if (nextFromNow !== showTime) {
+      setShowTime(nextFromNow);
+      setTimeInterval(new Date(time));
+    }
+  }, [time, relativeTime, showTime, setTimeInterval]);
+  var fmtTime = dayjs(time).format(format || 'YYYY-MM-DD HH:mm:ss');
+  var currentTime = relativeTime ? showTime : fmtTime;
+  var tooltipTitle = (_tooltip$title = tooltip === null || tooltip === void 0 ? void 0 : tooltip.title) !== null && _tooltip$title !== void 0 ? _tooltip$title : relativeTime ? fmtTime : undefined;
+
+  // Avoid duplicate tooltips
+  if (tooltipTitle) {
+    set(textProps, 'ellipsis.tooltip.title', undefined);
+  }
+  return /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({}, tooltip || {}), {}, {
+    title: tooltipTitle,
+    children: /*#__PURE__*/_jsx(Typography.Text, _objectSpread(_objectSpread({}, textProps), {}, {
+      children: currentTime
+    }))
+  }));
+};
+Typography.Time = Time;
+export default Typography;

package/es/WaveformIcon/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface WaveformIconProps {
+    height?: number;
+    width?: number;
+    lineColor?: string;
+    bgColor?: string;
+}
+export declare const WaveformIcon: React.FC<WaveformIconProps>;
+export {};