@yuntijs/ui 1.0.0-beta.15 → 1.0.0-beta.17

package/es/App/index.d.ts

@@ -0,0 +1,7 @@
+import { App as AntdApp, type AppProps as AntdAppProps } from 'antd';
+import React from 'react';
+export type AppProps = AntdAppProps;
+export declare const App: React.FC<AppProps> & {
+    useApp: typeof AntdApp.useApp;
+};
+export default App;

package/es/App/index.js

@@ -0,0 +1,19 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["children"];
+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 { App as AntdApp } from 'antd';
+import React from 'react';
+import { NotificationGlobalStyle } from "../notification";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var App = function App(props) {
+  var children = props.children,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/_jsxs(AntdApp, _objectSpread(_objectSpread({}, otherProps), {}, {
+    children: [/*#__PURE__*/_jsx(NotificationGlobalStyle, {}), children]
+  }));
+};
+App.useApp = AntdApp.useApp;
+export default App;

package/es/Radio/index.d.ts

@@ -0,0 +1,36 @@
+import { Radio as AntdRadio, type RadioGroupProps as AntdRadioGroupProps, RadioProps } from 'antd';
+import type { RadioRef } from 'antd/es/radio/interface';
+import React from 'react';
+export interface CustomRadioProps {
+    /**
+     * @description Set the button style is similar to the Segmented component
+     * @default 'false'
+     */
+    segmented?: {
+        /**
+         * @description Set the spacing between buttons
+         * @default 'true'
+         */
+        gap?: 'small' | 'middle' | 'large' | number | boolean;
+        /**
+         * @description Set border-radius of buttons
+         * @default 'true'
+         */
+        borderRadius?: number | boolean;
+        /**
+         * @description Sets whether the button's border is displayed
+         * @default 'false'
+         */
+        bordered?: boolean;
+    } | boolean;
+}
+export interface RadioGroupProps extends AntdRadioGroupProps, CustomRadioProps {
+}
+type RadioType = React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<RadioRef>> & {
+    Group: typeof Group;
+    Button: typeof AntdRadio.Button;
+};
+export declare const Radio: RadioType;
+declare const Group: React.FC<RadioGroupProps>;
+export default Radio;
+export { type RadioChangeEvent, type RadioProps } from 'antd';

package/es/Radio/index.js

@@ -0,0 +1,26 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["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 { Radio as AntdRadio } from 'antd';
+import AntdGroup from 'antd/es/radio/group';
+import React from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Radio = AntdRadio;
+var Group = function Group(props) {
+  var className = props.className,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  if (otherProps.segmented) {
+    otherProps.optionType = 'button';
+  }
+  var _useStyles = useStyles(otherProps),
+    styles = _useStyles.styles,
+    cx = _useStyles.cx;
+  return /*#__PURE__*/_jsx(AntdGroup, _objectSpread(_objectSpread({}, otherProps), {}, {
+    className: cx(styles.custom, className)
+  }));
+};
+Radio.Group = Group;
+export default Radio;

package/es/Radio/style.d.ts

@@ -0,0 +1,4 @@
+import { RadioGroupProps } from './index';
+export declare const useStyles: (props?: RadioGroupProps | undefined) => import("antd-style").ReturnStyles<{
+    custom: import("antd-style").SerializedStyles;
+}>;

package/es/Radio/style.js

@@ -0,0 +1,66 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref, _ref2) {
+  var css = _ref.css,
+    token = _ref.token,
+    prefixCls = _ref.prefixCls;
+  var size = _ref2.size,
+    segmented = _ref2.segmented;
+  var gap = function () {
+    if (!segmented) {
+      return 0;
+    }
+    if (segmented !== true) {
+      return segmented.gap;
+    }
+    return true;
+  }();
+  var borderRadius = function () {
+    if (!segmented) {
+      return;
+    }
+    if (segmented !== true) {
+      return segmented.borderRadius;
+    }
+    return true;
+  }();
+  var getGapSize = function getGapSize() {
+    var gapSizeMap = {
+      small: token.sizeSM,
+      middle: token.size,
+      large: token.sizeLG
+    };
+    if (typeof gap === 'string') {
+      return gapSizeMap[gap];
+    }
+    if (gap === true) {
+      return size ? gapSizeMap[size] : gapSizeMap['middle'];
+    }
+    if (!gap) {
+      return 0;
+    }
+    return gap;
+  };
+  var getBorderRadius = function getBorderRadius() {
+    var borderRadiusSizeMap = {
+      small: token.controlHeightSM,
+      middle: token.controlHeight,
+      large: token.controlHeightLG
+    };
+    if (borderRadius === true) {
+      return size ? borderRadiusSizeMap[size] : borderRadiusSizeMap['middle'];
+    }
+    if (borderRadius || borderRadius === 0) {
+      return borderRadius;
+    }
+  };
+  var borderRadiusStyle = getBorderRadius() && css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        label {\n          border-inline-start-width: 1px !important;\n          border-radius: ", "px !important;\n        }\n        label::before {\n          display: none !important;\n        }\n      "])), getBorderRadius());
+  var gapStyle = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      label {\n        margin-right: ", "px !important;\n      }\n      label:last-child {\n        margin-right: 0 !important;\n      }\n    "])), getGapSize());
+  var noBorderd = segmented === true || segmented && !segmented.bordered;
+  return {
+    custom: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        ", "\n        ", "\n        ", "\n      "])), borderRadiusStyle, gapStyle, noBorderd && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n          .", "-radio-button-wrapper {\n            border: none !important;\n          }\n          .", "-radio-button-wrapper-checked {\n            border: 1px solid ", " !important;\n          }\n        "])), prefixCls, prefixCls, token.colorPrimary))
+  };
+}, {
+  hashPriority: 'low'
+});

package/es/Table/index.d.ts

@@ -0,0 +1,17 @@
+import { Table as AntdTable, TableProps } from 'antd';
+import { AnyObject } from 'antd/es/_util/type';
+import React from 'react';
+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;
+};
+export default Table;

package/es/Table/index.js

@@ -0,0 +1,51 @@
+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 from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Table = function Table(props) {
+  var columns = props.columns,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var formatColumns;
+  if (columns) {
+    formatColumns = columns.map(function (item) {
+      if (!item.render) {
+        item.render = function (text) {
+          return text !== null && text !== void 0 ? text : '-';
+        };
+      }
+      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
+            })) : '-';
+          }
+        });
+      }
+      return item;
+    });
+  }
+  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;
+export default Table;

package/es/index.d.ts

@@ -5,15 +5,19 @@ export * from './MonacoEditor';
 export * from './SliderInput';
 export * from './Tree';
 export * from './Alert';
+export * from './App';
 export * from './Card';
 export * from './Descriptions';
 export * from './Divider';
 export * from './Drawer';
 export * from './FormHelper';
 export * from './Modal';
-export { Affix, type AffixProps, Anchor, type AnchorProps, App, type AppProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, BackTop, type BackTopProps, Badge, // @todo composed type
+export * from './notification';
+export * from './Radio';
+export * from './Table';
+export { Affix, type AffixProps, Anchor, type AnchorProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, BackTop, type BackTopProps, Badge, // @todo composed type
 type BadgeProps, Button, // @todo dependence unifiedLink. link type, hover primary color, back button
 type ButtonProps, Calendar, type CalendarProps, Carousel, type CarouselProps, Cascader, type CascaderProps, Checkbox, type CheckboxProps, Col, Collapse, type CollapseProps, ColorPicker, type ColorPickerProps, type ColProps, // @todo center style
-DatePicker, type DatePickerProps, Dropdown, type DropDownProps, Empty, type EmptyProps, Flex, type FlexProps, FloatButton, type FloatButtonProps, Form, type FormInstance, type FormItemProps, type FormListFieldData, type FormListOperation, type FormProps, type FormRule, Grid, Image, type ImageProps, Input, InputNumber, type InputNumberProps, type InputProps, type InputRef, Layout, type LayoutProps, List, type ListProps, type MentionProps, Mentions, Menu, type MenuItemProps, type MenuProps, type MenuRef, type MenuTheme, message, type MessageArgsProps, Space, type SpaceProps, type SubMenuProps, } from 'antd';
+type CountdownProps, DatePicker, type DatePickerProps, Dropdown, type DropDownProps, Empty, type EmptyProps, Flex, type FlexProps, FloatButton, type FloatButtonProps, Form, type FormInstance, type FormItemProps, type FormListFieldData, type FormListOperation, type FormProps, type FormRule, type GlobalToken, Grid, Image, type ImageProps, Input, InputNumber, type InputNumberProps, type InputProps, type InputRef, Layout, type LayoutProps, List, type ListProps, type MappingAlgorithm, type MentionProps, Mentions, Menu, type MenuItemProps, type MenuProps, type MenuRef, type MenuTheme, message, type MessageArgsProps, Pagination, type PaginationProps, Popconfirm, type PopconfirmProps, Popover, type PopoverProps, Progress, type ProgressProps, QRCode, type QRCodeProps, type QRPropsCanvas, type QRPropsSvg, Rate, type RateProps, type RefSelectProps, Result, type ResultProps, Row, type RowProps, Segmented, type SegmentedProps, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderSingleProps, Space, type SpaceProps, Spin, type SpinProps, Statistic, type StatisticProps, type StepProps, Steps, type StepsProps, type SubMenuProps, Switch, type SwitchProps, type TabPaneProps, Tabs, type TabsProps, Tag, type TagProps, type TagType, theme, Timeline, type TimelineItemProps, type TimelineProps, TimePicker, type TimePickerProps, type TimeRangePickerProps, Tooltip, type TooltipProps, Tour, type TourProps, type TourStepProps, Transfer, type TransferProps, Tree, type TreeDataNode, type TreeNodeProps, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyProps, Upload, type UploadFile, type UploadProps, version, Watermark, type WatermarkProps, } from 'antd';
 export { Highlighter, type HighlighterProps, Markdown, type MarkdownProps, SyntaxHighlighter, type SyntaxHighlighterProps, } from '@lobehub/ui';
 export { useResponsive, useTheme, useThemeMode } from 'antd-style';

package/es/index.js

@@ -7,19 +7,24 @@ export * from "./Tree";
 
 // ~ custom antd
 export * from "./Alert";
+export * from "./App";
 export * from "./Card";
 export * from "./Descriptions";
 export * from "./Divider";
 export * from "./Drawer";
 export * from "./FormHelper";
 export * from "./Modal";
+export * from "./notification";
+export * from "./Radio";
+export * from "./Table";
 
 // ~ antd
-export { Affix, Anchor, App, AutoComplete, Avatar, BackTop, Badge // @todo composed type
+export { Affix, Anchor, AutoComplete, Avatar, BackTop, Badge // @todo composed type
 , Button // @todo dependence unifiedLink. link type, hover primary color, back button
-, Calendar, Carousel, Cascader, Checkbox, Col, Collapse, ColorPicker,
+, Calendar, Carousel, Cascader, Checkbox, Col, Collapse, ColorPicker
+
 // @todo center style
-DatePicker, Dropdown, Empty, Flex, FloatButton, Form, Grid, Image, Input, InputNumber, Layout, List, Mentions, Menu, message, Space } from 'antd';
+, DatePicker, Dropdown, Empty, Flex, FloatButton, Form, Grid, Image, Input, InputNumber, Layout, List, Mentions, Menu, message, Pagination, Popconfirm, Popover, Progress, QRCode, Rate, Result, Row, Segmented, Select, Skeleton, Slider, Space, Spin, Statistic, Steps, Switch, Tabs, Tag, theme, Timeline, TimePicker, Tooltip, Tour, Transfer, Tree, TreeSelect, Typography, Upload, version, Watermark } from 'antd';
 
 // ~ @lobehub/ui
 export { Highlighter, Markdown, SyntaxHighlighter } from '@lobehub/ui';

package/es/notification/index.d.ts

@@ -0,0 +1,24 @@
+import { type NotificationArgsProps as AntdNotificationArgsProps } from 'antd';
+import React from 'react';
+export interface NotificationArgsProps extends AntdNotificationArgsProps {
+    /** 如果不为空，则会以折叠面板的形式展示描述，展开后展示报错内容，可用来展示报错详情 */
+    detail?: Record<string, any>;
+    descKey?: string;
+    errors?: Error[];
+}
+export declare const notification: {
+    success: (args: NotificationArgsProps) => void;
+    info: (args: NotificationArgsProps) => void;
+    warning: (args: NotificationArgsProps) => void;
+    warn: (args: NotificationArgsProps) => void;
+    error: (args: NotificationArgsProps) => void;
+    warnings: (args: NotificationArgsProps) => void;
+    warns: (args: NotificationArgsProps) => void;
+    open: (config: AntdNotificationArgsProps) => void;
+    destroy: (key?: React.Key | undefined) => void;
+    config: (config: import("antd/es/notification/interface").GlobalConfigProps) => void;
+    useNotification: typeof import("antd/es/notification/useNotification").default;
+    _InternalPanelDoNotUseOrYouWillBeFired: React.FC<import("antd/es/notification/PurePanel").PurePanelProps>;
+};
+export default notification;
+export { NotificationGlobalStyle } from './style';

package/es/notification/index.js

@@ -0,0 +1,237 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+var _excluded = ["detail", "message", "description", "onClose", "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; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { MinusSquareOutlined, PlusSquareOutlined, WarningFilled } from '@ant-design/icons';
+import { notification as AntdNotification, Collapse, Typography } from 'antd';
+import React, { isValidElement, useState } from 'react';
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+var Panel = Collapse.Panel;
+var Link = Typography.Link,
+  Paragraph = Typography.Paragraph,
+  Text = Typography.Text;
+var NOTICE_MAP = {};
+var setNoticeMap = function setNoticeMap(key, noticeProps) {
+  if (!NOTICE_MAP[key]) {
+    NOTICE_MAP[key] = [];
+  }
+  NOTICE_MAP[key].push(noticeProps);
+};
+var removeNoticeMap = function removeNoticeMap(key) {
+  delete NOTICE_MAP[key];
+};
+var reactNodeToString = function reactNodeToString(reactNode) {
+  var string = '';
+  if (typeof reactNode === 'string') {
+    string = reactNode;
+  } else if (typeof reactNode === 'number') {
+    string = reactNode.toString();
+  } else if (Array.isArray(reactNode)) {
+    var _iterator = _createForOfIteratorHelper(reactNode),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var child = _step.value;
+        string += reactNodeToString(child);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  } else if ( /*#__PURE__*/isValidElement(reactNode)) {
+    string += reactNodeToString(reactNode.props.children);
+  }
+  return string;
+};
+var Message = function Message(props) {
+  var _NOTICE_MAP$key;
+  var key = props.noticeKey,
+    message = props.message;
+  var count = ((_NOTICE_MAP$key = NOTICE_MAP[key]) === null || _NOTICE_MAP$key === void 0 ? void 0 : _NOTICE_MAP$key.length) || 0;
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [message, count > 1 && " (".concat(count, ")")]
+  });
+};
+var Description = function Description(props) {
+  var key = props.noticeKey;
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    activePanels = _useState2[0],
+    setActivePanels = _useState2[1];
+  var descMap = {};
+  var _iterator2 = _createForOfIteratorHelper(NOTICE_MAP[key]),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var noticeProps = _step2.value;
+      var descKey = reactNodeToString(noticeProps.description);
+      noticeProps.descKey = descKey;
+      descMap[descKey] = noticeProps;
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return /*#__PURE__*/_jsx(Collapse, {
+    accordion: true,
+    activeKey: activePanels,
+    className: "yunti-notification-collapse",
+    expandIcon: function expandIcon(_ref) {
+      var isActive = _ref.isActive;
+      return /*#__PURE__*/_jsx("span", {
+        className: "yunti-notification-collapse-expand-icon",
+        children: isActive ? /*#__PURE__*/_jsx(Link, {
+          className: "yunti-notification-link",
+          children: /*#__PURE__*/_jsx(MinusSquareOutlined, {
+            title: "\u70B9\u51FB\u5173\u95ED\u9519\u8BEF\u8BE6\u60C5"
+          })
+        }) : /*#__PURE__*/_jsx(PlusSquareOutlined, {
+          title: "\u70B9\u51FB\u67E5\u770B\u9519\u8BEF\u8BE6\u60C5"
+        })
+      });
+    },
+    ghost: true,
+    onChange: function onChange(keys) {
+      setActivePanels(keys);
+    },
+    children: Object.values(descMap).map(function (_ref2) {
+      var descKey = _ref2.descKey,
+        description = _ref2.description,
+        detail = _ref2.detail;
+      return /*#__PURE__*/_jsx(Panel, {
+        header: /*#__PURE__*/_jsx(Text, {
+          ellipsis: {
+            tooltip: false
+          },
+          style: {
+            width: 250
+          },
+          children: description
+        }),
+        children: /*#__PURE__*/_jsx(Paragraph, {
+          className: "yunti-notification-collapse-content-p",
+          copyable: {
+            text: JSON.stringify(detail, null, 2)
+          },
+          type: "secondary",
+          children: /*#__PURE__*/_jsx("pre", {
+            children: JSON.stringify(detail, null, 2)
+          })
+        })
+      }, descKey);
+    })
+  });
+};
+var notice = function notice(args) {
+  var detail = args.detail,
+    message = args.message,
+    description = args.description,
+    onCloseFromProps = args.onClose,
+    className = args.className,
+    restArgs = _objectWithoutProperties(args, _excluded);
+  var key = reactNodeToString(message);
+  setNoticeMap(key, args);
+  var onClose = function onClose() {
+    onCloseFromProps === null || onCloseFromProps === void 0 || onCloseFromProps();
+    removeNoticeMap(key);
+  };
+  if (args.type === 'warning' && !args.icon) {
+    restArgs.icon = /*#__PURE__*/_jsx(WarningFilled, {
+      style: {
+        color: '#ff7d00'
+      }
+    });
+  }
+  if (!detail) {
+    return AntdNotification.open(_objectSpread({
+      key: key,
+      message: /*#__PURE__*/_jsx(Message, {
+        message: message,
+        noticeKey: key
+      }),
+      description: description,
+      onClose: onClose,
+      className: "yunti-notification ".concat(className)
+    }, restArgs));
+  }
+  return AntdNotification.open(_objectSpread({
+    key: key,
+    message: /*#__PURE__*/_jsx(Message, {
+      message: message,
+      noticeKey: key
+    }),
+    description: /*#__PURE__*/_jsx(Description, {
+      noticeKey: key
+    }),
+    onClose: onClose,
+    className: "yunti-notification ".concat(className)
+  }, restArgs));
+};
+var warnsFun = function warnsFun(args) {
+  var _args$errors;
+  if (((args === null || args === void 0 || (_args$errors = args.errors) === null || _args$errors === void 0 ? void 0 : _args$errors.length) || 0) > 0) {
+    if (args !== null && args !== void 0 && args.errors || []) {
+      var _iterator3 = _createForOfIteratorHelper((args === null || args === void 0 ? void 0 : args.errors) || []),
+        _step3;
+      try {
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var item = _step3.value;
+          notice(_objectSpread(_objectSpread({
+            detail: item,
+            description: item.message
+          }, args), {}, {
+            type: 'warning'
+          }));
+        }
+      } catch (err) {
+        _iterator3.e(err);
+      } finally {
+        _iterator3.f();
+      }
+    }
+  } else {
+    notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'warning'
+    }));
+  }
+};
+export var notification = _objectSpread(_objectSpread({}, AntdNotification), {}, {
+  success: function success(args) {
+    return notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'success'
+    }));
+  },
+  info: function info(args) {
+    return notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'info'
+    }));
+  },
+  warning: function warning(args) {
+    return notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'warning'
+    }));
+  },
+  warn: function warn(args) {
+    return notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'warning'
+    }));
+  },
+  error: function error(args) {
+    return notice(_objectSpread(_objectSpread({}, args), {}, {
+      type: 'error'
+    }));
+  },
+  warnings: warnsFun,
+  warns: warnsFun
+});
+export default notification;
+export { NotificationGlobalStyle } from "./style";

package/es/notification/style.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const NotificationGlobalStyle: import("react").NamedExoticComponent<object>;

package/es/notification/style.js

@@ -0,0 +1,28 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject;
+import { notification } from 'antd';
+import { createGlobalStyle } from 'antd-style';
+export var NotificationGlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.yunti-notification {\n  width: auto;\n  min-width: 360px;\n  max-width: 520px;\n  &-link {\n    color: ", ";\n  }\n  &-link:hover {\n    color: ", ";\n  }\n  &-collapse {\n    &-expand-icon {\n      font-size: 14px !important;\n    }\n    &.ant-collapse > .ant-collapse-item {\n      & > .ant-collapse-header {\n        padding: 6px 16px 6px 24px;\n        & > span {\n          color: rgba(0, 0, 0, 0.7);\n        }\n        &:hover {\n          .yunti-notification-collapse-expand-icon {\n            color: ", ";\n          }\n        }\n        .ant-collapse-expand-icon {\n          position: absolute;\n          top: 3.429px;\n          left: 0%;\n        }\n\n        .ant-collapse-arrow {\n          position: relative;\n          top: 3.429px;\n\n          display: inline-block;\n\n          padding: 6px 0;\n\n          line-height: 0;\n          text-align: center;\n          text-transform: none;\n          text-rendering: optimizelegibility;\n          vertical-align: -0.125em;\n        }\n        & > .ant-collapse-header-text {\n          width: 100%;\n        }\n      }\n      & > .ant-collapse-content > .ant-collapse-content-box {\n        padding: 0;\n      }\n    }\n    &-content-p {\n      position: relative;\n      & > pre {\n        overflow: auto;\n        height: 166px;\n        margin: 0;\n        padding-right: 24px;\n      }\n      & > .ant-typography-copy {\n        position: absolute;\n        right: 16px;\n        bottom: 8px;\n\n        font-size: 14px;\n        color:", ";\n      }\n\n      & > .ant-typography-copy:hover {\n        color:", ";\n      }\n    }\n  }\n  ", "\n}\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return "".concat(theme === null || theme === void 0 ? void 0 : theme.colorPrimary, " !important");
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return "".concat(theme === null || theme === void 0 ? void 0 : theme.colorPrimaryHover, " !important");
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme === null || theme === void 0 ? void 0 : theme.colorPrimary;
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return "".concat(theme === null || theme === void 0 ? void 0 : theme.colorPrimary, " !important");
+}, function (_ref5) {
+  var theme = _ref5.theme;
+  return "".concat(theme === null || theme === void 0 ? void 0 : theme.colorPrimaryHover, " !important");
+}, function (_ref6) {
+  var theme = _ref6.theme;
+  var _ref7 = theme || {},
+    prefixCls = _ref7.prefixCls;
+  notification.config({
+    prefixCls: prefixCls
+  });
+  return "\n      .".concat(prefixCls, "-notice-message {\n        font-weight: 500 !important;\n      }\n      .").concat(prefixCls, "-notice-description {\n        max-height: ~'calc(100vh - 160px)';\n        overflow: auto;\n      }\n    ");
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuntijs/ui",
-  "version": "1.0.0-beta.15",
+  "version": "1.0.0-beta.17",
   "description": "☁️ Yunti UI - an open-source UI component library for building Cloud Native web apps",
   "keywords": [
     "yuntijs",
@@ -98,7 +98,7 @@
     "@types/react-dom": "^18",
     "@vitest/coverage-v8": "latest",
     "@yuntijs/lint": "^1.4.0",
-    "antd": "^5.12.5",
+    "antd": "^5.16.1",
     "antd-style": "^3",
     "babel-plugin-antd-style": "latest",
     "commitlint": "^18",