@oceanbase/ui 1.0.0-alpha.2 → 1.0.0-alpha.20

package/es/Boundary/Components/Exception.js

@@ -1,3 +1,4 @@
+"use client";
 var _excluded = ["imageUrl", "title", "buttonText", "subscription", "isNotCompatible", "showError", "hasButton", "locale", "className"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 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; }
@@ -17,12 +18,13 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-import { Alert, Button } from '@oceanbase/design';
-import React from 'react';
+import { Alert, Button, ConfigProvider } from '@oceanbase/design';
+import React, { useContext } from 'react';
 import LocaleWrapper from "../../locale/LocaleWrapper";
 import { EXCEPTION_PRESET } from "../constant";
 import zhCN from "../locale/zh-CN";
 import classNames from 'classnames';
+import useStyle from "../style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var BoundaryException = /*#__PURE__*/function (_React$PureComponent) {
@@ -65,78 +67,9 @@ var BoundaryException = /*#__PURE__*/function (_React$PureComponent) {
   }, {
     key: "render",
     value: function render() {
-      var _this$state2,
-        _this2 = this;
-      var _this$props = this.props,
-        imageUrl = _this$props.imageUrl,
-        title = _this$props.title,
-        buttonText = _this$props.buttonText,
-        subscription = _this$props.subscription,
-        isNotCompatible = _this$props.isNotCompatible,
-        _this$props$showError = _this$props.showError,
-        showError = _this$props$showError === void 0 ? false : _this$props$showError,
-        _this$props$hasButton = _this$props.hasButton,
-        hasButton = _this$props$hasButton === void 0 ? true : _this$props$hasButton,
-        locale = _this$props.locale,
-        className = _this$props.className,
-        restProps = _objectWithoutProperties(_this$props, _excluded);
-      var errorInfo = EXCEPTION_PRESET(locale).ERROR_BOUNDARY;
-      var notCompatibleInfo = EXCEPTION_PRESET(locale).INCOMPATIBLE_VERSION;
-      var _this$state = this.state,
-        error = _this$state.error,
-        info = _this$state.info;
-      var errorDescription = info === null || info === void 0 ? void 0 : info.componentStack;
-      var errorMessage = (error || '').toString();
-      if ((_this$state2 = this.state) !== null && _this$state2 !== void 0 && _this$state2.hasError) {
-        return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
-          className: classNames('boundary-container', 'ob-boundary-error', className)
-        }, restProps), {}, {
-          children: /*#__PURE__*/_jsxs("div", {
-            className: "empty",
-            children: [/*#__PURE__*/_jsx("img", {
-              src: imageUrl || errorInfo.imageUrl
-            }), /*#__PURE__*/_jsx("h4", {
-              children: title || errorInfo.title
-            }), showError ? /*#__PURE__*/_jsx(Alert, {
-              type: "error",
-              showIcon: true,
-              message: errorMessage,
-              description: errorDescription,
-              style: {
-                marginTop: 24,
-                overflow: 'auto',
-                maxHeight: '50vh',
-                // 为了避免被 Empty 的水平居中样式影响，需要设置 textAlign
-                textAlign: 'left'
-              }
-            }) : subscription && /*#__PURE__*/_jsx("span", {
-              children: subscription
-            }), hasButton ? /*#__PURE__*/_jsx(Button, {
-              type: "primary",
-              onClick: function onClick() {
-                return _this2.onClick();
-              },
-              children: buttonText || errorInfo.buttonText
-            }) : '']
-          })
-        }));
-      } else if (isNotCompatible) {
-        return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
-          className: classNames('boundary-container', 'ob-boundary-browser-not-compatible', className)
-        }, restProps), {}, {
-          children: /*#__PURE__*/_jsxs("div", {
-            className: "empty",
-            children: [/*#__PURE__*/_jsx("img", {
-              src: imageUrl || notCompatibleInfo.imageUrl
-            }), /*#__PURE__*/_jsx("h4", {
-              children: title || notCompatibleInfo.title
-            }), /*#__PURE__*/_jsx("span", {
-              children: subscription ? subscription : notCompatibleInfo.subscription
-            })]
-          })
-        }));
-      }
-      return this.props.children;
+      return /*#__PURE__*/_jsx(ExceptionWrapper, {
+        component: this
+      });
     }
   }], [{
     key: "getDerivedStateFromError",
@@ -148,6 +81,85 @@ var BoundaryException = /*#__PURE__*/function (_React$PureComponent) {
   }]);
   return BoundaryException;
 }(React.PureComponent);
+var ExceptionWrapper = function ExceptionWrapper(_ref) {
+  var _component$state2;
+  var component = _ref.component;
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('boundary');
+  var _useStyle = useStyle(prefixCls),
+    wrapSSR = _useStyle.wrapSSR;
+  var _component$props = component.props,
+    imageUrl = _component$props.imageUrl,
+    title = _component$props.title,
+    buttonText = _component$props.buttonText,
+    subscription = _component$props.subscription,
+    isNotCompatible = _component$props.isNotCompatible,
+    _component$props$show = _component$props.showError,
+    showError = _component$props$show === void 0 ? false : _component$props$show,
+    _component$props$hasB = _component$props.hasButton,
+    hasButton = _component$props$hasB === void 0 ? true : _component$props$hasB,
+    locale = _component$props.locale,
+    className = _component$props.className,
+    restProps = _objectWithoutProperties(_component$props, _excluded);
+  var errorInfo = EXCEPTION_PRESET(locale).ERROR_BOUNDARY;
+  var notCompatibleInfo = EXCEPTION_PRESET(locale).INCOMPATIBLE_VERSION;
+  var _component$state = component.state,
+    error = _component$state.error,
+    info = _component$state.info;
+  var errorDescription = info === null || info === void 0 ? void 0 : info.componentStack;
+  var errorMessage = (error || '').toString();
+  if ((_component$state2 = component.state) !== null && _component$state2 !== void 0 && _component$state2.hasError) {
+    return wrapSSR( /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+      className: classNames('boundary-container', "".concat(prefixCls, "-error"), className)
+    }, restProps), {}, {
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "boundary-empty",
+        children: [/*#__PURE__*/_jsx("img", {
+          src: imageUrl || errorInfo.imageUrl
+        }), /*#__PURE__*/_jsx("h4", {
+          children: title || errorInfo.title
+        }), showError ? /*#__PURE__*/_jsx(Alert, {
+          type: "error",
+          showIcon: true,
+          message: errorMessage,
+          description: errorDescription,
+          style: {
+            marginTop: 24,
+            overflow: 'auto',
+            maxHeight: '50vh',
+            // 为了避免被 Empty 的水平居中样式影响，需要设置 textAlign
+            textAlign: 'left'
+          }
+        }) : subscription && /*#__PURE__*/_jsx("span", {
+          children: subscription
+        }), hasButton ? /*#__PURE__*/_jsx(Button, {
+          type: "primary",
+          onClick: function onClick() {
+            return component.onClick();
+          },
+          children: buttonText || errorInfo.buttonText
+        }) : '']
+      })
+    })));
+  } else if (isNotCompatible) {
+    return wrapSSR( /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+      className: classNames('boundary-container', "".concat(prefixCls, "-browser-not-compatible"), className)
+    }, restProps), {}, {
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "boundary-empty",
+        children: [/*#__PURE__*/_jsx("img", {
+          src: imageUrl || notCompatibleInfo.imageUrl
+        }), /*#__PURE__*/_jsx("h4", {
+          children: title || notCompatibleInfo.title
+        }), /*#__PURE__*/_jsx("span", {
+          children: subscription ? subscription : notCompatibleInfo.subscription
+        })]
+      })
+    })));
+  }
+  return component.props.children;
+};
 export var Exception = LocaleWrapper({
   componentName: 'Boundary',
   defaultLocale: zhCN

package/es/Boundary/Components/Function.js

@@ -1,3 +1,4 @@
+"use client";
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["children", "state", "config", "onClick", "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; }
@@ -7,9 +8,10 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import { Button } from '@oceanbase/design';
-import React, { useMemo } from 'react';
+import { Button, ConfigProvider } from '@oceanbase/design';
+import React, { useContext, useMemo } from 'react';
 import classNames from 'classnames';
+import useStyle from "../style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var BoundaryFunction = function BoundaryFunction(props) {
@@ -19,14 +21,19 @@ export var BoundaryFunction = function BoundaryFunction(props) {
     onClick = props.onClick,
     className = props.className,
     restProps = _objectWithoutProperties(props, _excluded);
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('boundary');
+  var _useStyle = useStyle(prefixCls),
+    wrapSSR = _useStyle.wrapSSR;
   var info = useMemo(function () {
     return state ? config[state] : config[Object.keys(config)[0]];
   }, [config, state]);
-  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
-    className: classNames('boundary-container', 'ob-boundary-function', className)
+  return wrapSSR( /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: classNames('boundary-container', "".concat(prefixCls, "-function"), className)
   }, restProps), {}, {
     children: /*#__PURE__*/_jsxs("div", {
-      className: "empty",
+      className: "boundary-empty",
       children: [/*#__PURE__*/_jsx("img", {
         src: info.imageUrl
       }), /*#__PURE__*/_jsx("h4", {
@@ -37,5 +44,5 @@ export var BoundaryFunction = function BoundaryFunction(props) {
         children: info.buttonText
       })]
     })
-  }));
+  })));
 };

package/es/Boundary/index.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import './index.less';
 declare const _default: {
     Code: any;
     Function: import("react").FC<import("./Components/Function").IBoundaryFunction>;

package/es/Boundary/index.js

@@ -1,5 +1,5 @@
+"use client";
 import { BoundaryFunction, Code, Exception } from "./Components";
-import "./index.less";
 export default {
   Code: Code,
   Function: BoundaryFunction,

package/es/Boundary/locale/en-US.js

@@ -4,7 +4,7 @@ export default {
   noPage: 'This page was not found',
   normal: 'normal operation',
   test: 'Click to test crash effect',
-  collapse: 'The page crashed ~',
+  collapse: 'The page crashed',
   incompatible: 'Incompatible browser version',
   proposal: 'The browser version is too low. In order to avoid possible security risks, it is recommended to use Chrome browser version 80 or above'
 };

package/es/Boundary/locale/ja-JP.d.ts

@@ -0,0 +1,11 @@
+declare const _default: {
+    goHome: string;
+    noPermission: string;
+    noPage: string;
+    normal: string;
+    test: string;
+    collapse: string;
+    incompatible: string;
+    proposal: string;
+};
+export default _default;

package/es/Boundary/locale/ja-JP.js

@@ -0,0 +1,10 @@
+export default {
+  goHome: 'ホームに戻る',
+  noPermission: 'このページへのアクセス権限がありません',
+  noPage: 'このページが見つかりません',
+  normal: '正常動作',
+  test: 'クリックしてクラッシュをテスト',
+  collapse: 'ページがクラッシュしました',
+  incompatible: 'ブラウザがサポートされていません',
+  proposal: 'ブラウザのバージョンが古すぎます。セキュリティリスクを避けるため、Chrome 80以上のご利用をおすすめします'
+};

package/es/Boundary/locale/zh-CN.js

@@ -4,7 +4,7 @@ export default {
   noPage: '此页面未找到',
   normal: '正常运行',
   test: '点击测试崩溃效果',
-  collapse: '页面崩溃了～',
+  collapse: '页面崩溃了',
   incompatible: '浏览器版本不兼容',
   proposal: '浏览器版本过低，为避免可能存在的安全隐患，建议使用Chrome浏览器的80及以上版本'
 };

package/es/Boundary/locale/zh-TW.js

@@ -4,7 +4,7 @@ export default {
   noPage: '此頁面未找到',
   normal: '正常運行',
   test: '點擊測試崩潰效果',
-  collapse: '頁面崩潰了～',
+  collapse: '頁面崩潰了',
   incompatible: '流覽器版本不相容',
   proposal: '流覽器版本過低，為避免可能存在的安全隱患，建議使用Chrome瀏覽器的80及以上版本'
 };

package/es/Boundary/style/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { GenerateStyle } from '@oceanbase/design/es/theme';
+import type { OBToken } from '../../_util/genComponentStyleHook';
+export type BoundaryToken = OBToken;
+export declare const genBoundaryStyle: GenerateStyle<BoundaryToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};
+export default _default;

package/es/Boundary/style/index.js

@@ -0,0 +1,48 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
+export var genBoundaryStyle = function genBoundaryStyle(token) {
+  var colorTextTertiary = token.colorTextTertiary;
+  return _defineProperty(_defineProperty({}, ".boundary-container", {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: '100%',
+    backgroundColor: token.colorBgContainer,
+    paddingBlock: token.paddingLG,
+    paddingInline: token.paddingXL,
+    '.boundary-empty': {
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
+      '> img': {
+        height: 102,
+        marginBottom: 24
+      },
+      '> h4': {
+        margin: 0,
+        fontSize: 18
+      },
+      '> span': {
+        marginTop: 8,
+        color: colorTextTertiary,
+        fontSize: token.fontSize,
+        textAlign: 'center'
+      },
+      '> button': {
+        marginTop: 24
+      }
+    }
+  }), ".boundary-code", {
+    minHeight: 'calc(100vh - 120px)'
+  });
+};
+export default (function (prefixCls) {
+  var useStyle = genComponentStyleHook('Boundary', function (token) {
+    return [genBoundaryStyle(token)];
+  });
+  return useStyle(prefixCls);
+});

package/es/ContentWithIcon/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import './index.less';
 export interface ContentWithIconProps {
     content?: React.ReactNode;
     tooltip?: any;

package/es/ContentWithIcon/index.js

@@ -1,3 +1,4 @@
+"use client";
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["content", "tooltip", "prefixIcon", "suffixIcon", "className", "children", "iconType", "color", "tooltipWithLink", "popOver", "textHidden", "size", "infoColor", "exclamationColor"];
 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; }
@@ -7,16 +8,13 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import React, { isValidElement } from 'react';
-import { Tooltip, Space, Popover } from 'antd';
+import React, { isValidElement, useContext } from 'react';
+import { Tooltip, Space, Popover, ConfigProvider } from 'antd';
 import { ExclamationCircleFilled, InfoCircleFilled, InfoCircleOutlined, QuestionCircleOutlined } from '@oceanbase/icons';
 import classNames from 'classnames';
-import { getPrefix } from "../_util";
-import "./index.less";
+import useStyle from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-var prefix = getPrefix('content-with-question');
 var ContentWithIcon = function ContentWithIcon(_ref) {
   var content = _ref.content,
     tooltip = _ref.tooltip,
@@ -38,6 +36,11 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
     _ref$exclamationColor = _ref.exclamationColor,
     exclamationColor = _ref$exclamationColor === void 0 ? '#FAAD14' : _ref$exclamationColor,
     restProps = _objectWithoutProperties(_ref, _excluded);
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('content-with-icon');
+  var _useStyle = useStyle(prefixCls),
+    wrapSSR = _useStyle.wrapSSR;
   var defaultIconType = function defaultIconType() {
     if (iconType === 'question') {
       return /*#__PURE__*/_jsx(QuestionCircleOutlined, {
@@ -45,7 +48,7 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
           color: color === 'default' ? '#132039' : color,
           fontSize: size
         },
-        className: "".concat(prefix, "-help")
+        className: "".concat(prefixCls, "-help")
       });
     }
     if (iconType === 'info') {
@@ -55,7 +58,7 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
             color: infoColor,
             fontSize: size
           },
-          className: "".concat(prefix, "-help")
+          className: "".concat(prefixCls, "-help")
         });
       } else {
         return /*#__PURE__*/_jsx(InfoCircleOutlined, {
@@ -63,7 +66,7 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
             color: '3333333',
             fontSize: size
           },
-          className: "".concat(prefix, "-help")
+          className: "".concat(prefixCls, "-help")
         });
       }
     }
@@ -73,7 +76,7 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
           color: exclamationColor,
           fontSize: size
         },
-        className: "".concat(prefix, "-help")
+        className: "".concat(prefixCls, "-help")
       });
     }
   };
@@ -102,24 +105,22 @@ var ContentWithIcon = function ContentWithIcon(_ref) {
       children: /*#__PURE__*/isValidElement(iconConfig) ? iconConfig : defaultIconType()
     })) : null;
   };
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
-      className: classNames(_defineProperty(_defineProperty({}, "".concat(prefix, "-item"), true), className, !!className))
-    }, restProps), {}, {
-      children: /*#__PURE__*/_jsxs(Space, {
-        size: 4,
-        children: [getIcon(
-        //  图标在文字前
-        prefixIcon === true ? defaultIconType() : prefixIcon), /*#__PURE__*/_jsx("span", {
-          "data-testid": "content",
-          style: {
-            color: color === 'default' ? '#5C6B8A' : color,
-            fontSize: size
-          },
-          children: content !== null && content !== void 0 ? content : children
-        }), getIcon(suffixIcon)]
-      })
-    }))
-  });
+  return wrapSSR( /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
+    className: classNames(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-item"), true), className, !!className))
+  }, restProps), {}, {
+    children: /*#__PURE__*/_jsxs(Space, {
+      size: 4,
+      children: [getIcon(
+      //  图标在文字前
+      prefixIcon === true ? defaultIconType() : prefixIcon), /*#__PURE__*/_jsx("span", {
+        "data-testid": "content",
+        style: {
+          color: color === 'default' ? '#5C6B8A' : color,
+          fontSize: size
+        },
+        children: content !== null && content !== void 0 ? content : children
+      }), getIcon(suffixIcon)]
+    })
+  })));
 };
 export default ContentWithIcon;

package/es/ContentWithIcon/style/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { GenerateStyle } from '@oceanbase/design/es/theme';
+import type { OBToken } from '../../_util/genComponentStyleHook';
+export type ContentWithIconToken = OBToken;
+export declare const genContentWithIconStyle: GenerateStyle<ContentWithIconToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};
+export default _default;

package/es/ContentWithIcon/style/index.js

@@ -0,0 +1,26 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
+export var genContentWithIconStyle = function genContentWithIconStyle(token) {
+  var componentCls = token.componentCls;
+  return _defineProperty({}, "".concat(componentCls, "-item"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    display: 'inline-flex',
+    alignItems: 'center'
+  }, "".concat(componentCls, "-prefix"), {
+    marginRight: 8
+  }), "".concat(componentCls, "-suffix"), {
+    marginLeft: 8
+  }), "".concat(componentCls, "-help"), {
+    cursor: 'help'
+  }), "".concat(componentCls, "-color"), {
+    color: 'red'
+  }));
+};
+export default (function (prefixCls) {
+  var useStyle = genComponentStyleHook('ContentWithIcon', function (token) {
+    return [genContentWithIconStyle(token)];
+  });
+  return useStyle(prefixCls);
+});

package/es/ContentWithQuestion/index.js

@@ -1,3 +1,4 @@
+"use client";
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["content", "tooltip", "prefixIcon", "suffixIcon", "prefixCls", "className", "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; }

package/es/DateRanger/EditableDateTimeInput.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import type { Dayjs } from 'dayjs';
+import type { Moment } from 'moment';
+export interface EditableDateTimeInputProps {
+    value?: [Dayjs | Moment | null, Dayjs | Moment | null];
+    onChange?: (value: [Dayjs | Moment, Dayjs | Moment]) => void;
+    format?: string;
+    hideYear?: boolean;
+    hideSecond?: boolean;
+    isMoment?: boolean;
+    isCn?: boolean;
+    className?: string;
+    prefixCls?: string;
+    disabled?: boolean;
+    onClick?: () => void;
+    open?: boolean;
+}
+export interface EditableDateTimeInputRef {
+    hasPastedValue: boolean;
+    confirmPastedValue: () => void;
+}
+declare const EditableDateTimeInput: React.ForwardRefExoticComponent<EditableDateTimeInputProps & React.RefAttributes<EditableDateTimeInputRef>>;
+export default EditableDateTimeInput;