@oceanbase/design 1.0.0-alpha.6 → 1.0.0-alpha.8

package/lib/input/TextArea.js

@@ -37,19 +37,36 @@ var import_react = require("react");
 var import_antd = require("antd");
 var import_config_provider = __toESM(require("../config-provider"));
 var import_en_US = __toESM(require("../locale/en-US"));
+var import_Input = require("./Input");
+var import_style = __toESM(require("./style"));
 __reExport(TextArea_exports, require("antd/es/input/TextArea"), module.exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var TextArea = (0, import_react.forwardRef)(
-  ({ locale: customLocale, ...restProps }, ref) => {
+  ({ prefixCls: customizePrefixCls, locale: customLocale, showCount, ...restProps }, ref) => {
     var _a, _b;
-    const { locale: contextLocale } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
+    const { getPrefixCls, locale: contextLocale } = (0, import_react.useContext)(
+      import_config_provider.default.ConfigContext
+    );
+    const prefixCls = getPrefixCls("input", customizePrefixCls);
+    const { wrapSSR } = (0, import_style.default)(prefixCls);
     const inputLocale = {
       placeholder: ((_a = contextLocale == null ? void 0 : contextLocale.global) == null ? void 0 : _a.inputPlaceholder) || ((_b = import_en_US.default.global) == null ? void 0 : _b.inputPlaceholder),
       ...import_en_US.default.Input,
       ...contextLocale == null ? void 0 : contextLocale.Input,
       ...customLocale
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Input.TextArea, { ref, placeholder: inputLocale.placeholder, ...restProps });
+    return wrapSSR(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_antd.Input.TextArea,
+        {
+          ref,
+          prefixCls: customizePrefixCls,
+          placeholder: inputLocale.placeholder,
+          showCount: showCount === true ? { formatter: import_Input.showCountFormatter } : showCount,
+          ...restProps
+        }
+      )
+    );
   }
 );
 if (process.env.NODE_ENV !== "production") {

package/lib/input/style/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { FullToken, GenerateStyle } from '../../theme/interface';
+export type InputToken = FullToken<'Input'>;
+export declare const genInputStyle: GenerateStyle<InputToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactNode) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    hashId: string;
+};
+export default _default;

package/lib/input/style/index.js

@@ -0,0 +1,46 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/input/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genInputStyle: () => genInputStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genInputStyle = (token) => {
+  const { componentCls } = token;
+  return {
+    [`${componentCls}-affix-wrapper`]: {
+      [`${componentCls}-suffix`]: {
+        fontSize: token.fontSizeSM
+      }
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Input", (token) => {
+    return [genInputStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genInputStyle
+});

package/lib/input-number/index.js

@@ -37,19 +37,34 @@ var import_antd = require("antd");
 var import_react = __toESM(require("react"));
 var import_config_provider = __toESM(require("../config-provider"));
 var import_en_US = __toESM(require("../locale/en-US"));
+var import_style = __toESM(require("./style"));
 __reExport(input_number_exports, require("antd/es/input-number"), module.exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var InternalInputNumber = import_react.default.forwardRef(
-  ({ locale: customLocale, ...restProps }, ref) => {
+  ({ prefixCls: customizePrefixCls, locale: customLocale, ...restProps }, ref) => {
     var _a, _b;
-    const { locale: contextLocale } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
+    const { getPrefixCls, locale: contextLocale } = (0, import_react.useContext)(
+      import_config_provider.default.ConfigContext
+    );
+    const prefixCls = getPrefixCls("input-number", customizePrefixCls);
+    const { wrapSSR } = (0, import_style.default)(prefixCls);
     const inputNumberLocale = {
       placeholder: ((_a = contextLocale == null ? void 0 : contextLocale.global) == null ? void 0 : _a.inputPlaceholder) || ((_b = import_en_US.default.global) == null ? void 0 : _b.inputPlaceholder),
       ...import_en_US.default.InputNumber,
       ...contextLocale == null ? void 0 : contextLocale.InputNumber,
       ...customLocale
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.InputNumber, { ref, placeholder: inputNumberLocale.placeholder, ...restProps });
+    return wrapSSR(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_antd.InputNumber,
+        {
+          ref,
+          prefixCls: customizePrefixCls,
+          placeholder: inputNumberLocale.placeholder,
+          ...restProps
+        }
+      )
+    );
   }
 );
 var InputNumber = InternalInputNumber;

package/lib/input-number/style/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { FullToken, GenerateStyle } from '../../theme/interface';
+export type InputNumberToken = FullToken<'InputNumber'>;
+export declare const genInputStyle: GenerateStyle<InputNumberToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactNode) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    hashId: string;
+};
+export default _default;

package/lib/input-number/style/index.js

@@ -0,0 +1,51 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/input-number/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genInputStyle: () => genInputStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genInputStyle = (token) => {
+  const { antCls, componentCls } = token;
+  const selectComponentCls = `${antCls}-select-selector`;
+  return {
+    [`${componentCls}-group-wrapper`]: {
+      [`${componentCls}-group-addon`]: {
+        color: token.colorTextTertiary,
+        fontSize: token.fontSizeSM,
+        [selectComponentCls]: {
+          color: token.colorTextTertiary
+        }
+      }
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("InputNumber", (token) => {
+    return [genInputStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genInputStyle
+});

package/lib/locale/ja-JP.js

@@ -44,13 +44,13 @@ var ja_JP_default = {
     total: "合計 ${total} 件"
   },
   Drawer: {
-    okText: "確定",
+    okText: "OK",
     cancelText: "キャンセル"
   },
   Table: {
     ...import_ja_JP.default.Table,
     batchOperationBar: {
-      selected: "選択済み",
+      selected: "選択中",
       object: "件",
       cancel: "キャンセル",
       collapse: "折りたたむ",

package/lib/segmented/index.d.ts

@@ -6,6 +6,7 @@ import type { SegmentedRawOption } from 'rc-segmented';
 export * from 'antd/es/segmented';
 type BadgeType = BadgeProps | BadgeProps['count'];
 export type SegmentedLabeledOption = AntSegmentedLabeledOption & {
+    icon?: React.ReactNode;
     ellipsis?: EllipsisConfig;
     badge?: BadgeType;
 };

package/lib/segmented/index.js

@@ -57,11 +57,18 @@ var Segmented = import_react.default.forwardRef(
     }, []);
     const newOptions = options == null ? void 0 : options.map((item) => {
       if (typeof item === "object") {
-        const { label, badge, ...restItem } = item;
+        const {
+          label,
+          icon,
+          badge,
+          ellipsis = { tooltip: true },
+          ...restItem
+        } = item;
         return {
           ...restItem,
-          label: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_antd.Flex, { gap: 4, align: "center", justify: "center", children: [
-            (item == null ? void 0 : item.ellipsis) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_typography.default.Text, { ellipsis: item.ellipsis, children: label }) : label,
+          label: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_antd.Flex, { align: "center", justify: "center", children: [
+            icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `${prefixCls}-item-icon`, children: icon }),
+            ellipsis ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_typography.default.Text, { ellipsis, children: label }) : label,
             badge && renderBadge(badge)
           ] })
         };

package/lib/segmented/style/index.js

@@ -45,6 +45,7 @@ var genSegmentedStyle = (token) => {
       [`>${componentCls}-item`]: {
         [`>${componentCls}-item-label`]: {
           [`${antCls}-badge >${antCls}-badge-count`]: {
+            marginInlineStart: 4,
             backgroundColor: colorFillSecondary,
             color: "inherit",
             boxShadow: "none"

package/lib/style/global.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
 import 'antd/dist/reset.css';
-declare const GlobalStyle: React.FC;
+export interface GlobalStyleProps {
+    prefixCls?: string;
+}
+declare const GlobalStyle: React.FC<GlobalStyleProps>;
 export { GlobalStyle };
 export default GlobalStyle;

package/lib/style/global.js

@@ -35,36 +35,70 @@ __export(global_exports, {
 module.exports = __toCommonJS(global_exports);
 var import_cssinjs = require("@ant-design/cssinjs");
 var import_theme = __toESM(require("../theme"));
-var import_Inter = __toESM(require("../fonts/Inter.woff2"));
+var import_Inter_Regular = __toESM(require("../fonts/Inter-Regular.woff2"));
+var import_Inter_Medium = __toESM(require("../fonts/Inter-Medium.woff2"));
+var import_Inter_SemiBold = __toESM(require("../fonts/Inter-SemiBold.woff2"));
 var import_Consolas = __toESM(require("../fonts/Consolas.woff2"));
 var import_HelveticaNeue = __toESM(require("../fonts/HelveticaNeue.woff2"));
 var import_reset = require("antd/dist/reset.css");
 var import_jsx_runtime = require("react/jsx-runtime");
-var genGlobalStyle = (token) => {
+var genGlobalStyle = (token, prefixCls) => {
+  const antCls = `.${prefixCls}`;
+  const buttonComponentCls = `${antCls}-btn`;
+  const typographyComponentCls = `${antCls}-typography`;
+  const menuComponentCls = `${antCls}-menu`;
   return [
-    // Priority: local font > self-hosting font > remote font
     {
       "@font-face": {
-        fontFamily: "'Inter'",
-        src: `local('Inter'), url(${import_Inter.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*2aG4RJIdUGYAAAAAAAAAAAAADmfOAQ/Inter.woff2') format('woff2')`,
+        fontFamily: "Inter",
+        fontStyle: "lighter",
+        fontWeight: 300,
+        // load priority: local font > self-hosting font > remote font
+        src: `local('Inter'), url(${import_Inter_Regular.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*ucHoQ4exBNYAAAAARtAAAAgAemfOAQ/Inter-Regular.woff2') format('woff2')`,
         fontDisplay: "swap"
       }
     },
     {
       "@font-face": {
-        fontFamily: "'Consolas'",
+        fontFamily: "Inter",
+        fontStyle: "normal",
+        fontWeight: 400,
+        src: `local('Inter'), url(${import_Inter_Medium.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*GboAQ56sQbkAAAAARwAAAAgAemfOAQ/Inter-Medium.woff2') format('woff2')`,
+        fontDisplay: "swap"
+      }
+    },
+    {
+      "@font-face": {
+        fontFamily: "Inter",
+        fontStyle: "medium",
+        fontWeight: 500,
+        src: `local('Inter'), url(${import_Inter_Medium.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*GboAQ56sQbkAAAAARwAAAAgAemfOAQ/Inter-Medium.woff2') format('woff2')`,
+        fontDisplay: "swap"
+      }
+    },
+    {
+      "@font-face": {
+        fontFamily: "Inter",
+        fontStyle: "semibold",
+        fontWeight: 600,
+        src: `local('Inter'), url(${import_Inter_SemiBold.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*tcOIT5gLQl4AAAAARwAAAAgAemfOAQ/Inter-SemiBold.woff2') format('woff2')`,
+        fontDisplay: "swap"
+      }
+    },
+    {
+      "@font-face": {
+        fontFamily: "Consolas",
         src: `local('Consolas'), url(${import_Consolas.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*R8bMTqAdGWgAAAAAAAAAAAAADmfOAQ/Consolas.woff2') format('woff2')`,
         fontDisplay: "swap"
       }
     },
     {
       "@font-face": {
-        fontFamily: "'Helvetica Neue'",
+        fontFamily: "Helvetica Neue",
         src: `local('Helvetica Neue'), url(${import_HelveticaNeue.default}) format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*3EzqR6aYJMkAAAAAAAAAAAAADmfOAQ/HelveticaNeue.woff2') format('woff2')`,
         fontDisplay: "swap"
       }
     },
-    // Global element styles
     {
       "pre, code, kbd, samp": {
         fontFamily: token.fontFamilyCode
@@ -74,11 +108,44 @@ var genGlobalStyle = (token) => {
       },
       ".rc-virtual-list-scrollbar-thumb": {
         background: `${token.colorFillSecondary} !important`
+      },
+      // link with href or data-aspm-param^="obcloud_openLink= show underline on hover
+      // except disabled and antd element
+      'a[href], a[data-aspm-param^="obcloud_openLink="]': {
+        [`&:not([disabled]):not([class^="${prefixCls}-"]):hover`]: {
+          textDecoration: "underline"
+        }
+      },
+      // handle link style in button
+      [`${buttonComponentCls}${buttonComponentCls}-link:not(${buttonComponentCls}-disabled)`]: {
+        '&[href], &[data-aspm-param^="obcloud_openLink="]': {
+          "&:hover": {
+            textDecoration: "underline"
+          }
+        }
+      },
+      // handle link style in typography
+      [`${typographyComponentCls}:not(${typographyComponentCls}-disabled)`]: {
+        '&[href], &[data-aspm-param^="obcloud_openLink="]': {
+          "&:hover": {
+            textDecoration: "underline"
+          }
+        }
+      },
+      // handle link style in menu
+      [`${menuComponentCls}`]: {
+        [`${menuComponentCls}-item`]: {
+          [`${menuComponentCls}-title-content`]: {
+            "a:hover": {
+              textDecoration: "none"
+            }
+          }
+        }
       }
     }
   ];
 };
-var GlobalStyle = () => {
+var GlobalStyle = ({ prefixCls = "ant" }) => {
   const { theme, token } = import_theme.default.useToken();
   const wrapSSR = (0, import_cssinjs.useStyleRegister)(
     {
@@ -90,7 +157,7 @@ var GlobalStyle = () => {
       order: -1e3
       // Inject before other styles
     },
-    () => genGlobalStyle(token)
+    () => genGlobalStyle(token, prefixCls)
   );
   return wrapSSR(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {}));
 };

package/lib/table/index.d.ts

@@ -38,8 +38,8 @@ declare const _default: (<RecordType extends AnyObject = AnyObject>(props: Table
     SELECTION_ALL: "SELECT_ALL";
     SELECTION_INVERT: "SELECT_INVERT";
     SELECTION_NONE: "SELECT_NONE";
-    Column: <RecordType extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType>) => null;
-    ColumnGroup: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_1>) => null;
+    Column: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType_1>) => null;
+    ColumnGroup: <RecordType_2 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_2>) => null;
     Summary: typeof Summary;
     useStyle: (prefixCls: string) => {
         wrapSSR: (node: ReactNode) => ReactElement<any, string | React.JSXElementConstructor<any>>;

package/lib/table/style/index.js

@@ -89,7 +89,11 @@ var genTableStyle = (token) => {
         },
         // 为了避免行展开/收起时出现 border 动画，覆盖 antd 默认配置，仅设置背景色动画
         [`tr > td`]: {
-          transition: `background ${token.motionDurationMid}`
+          fontWeight: token.fontWeight,
+          transition: `background ${token.motionDurationMid}`,
+          a: {
+            fontWeight: token.fontWeightStrong
+          }
         },
         // empty style
         [`${componentCls}-placeholder td`]: {},

package/lib/theme/default.d.ts

@@ -1,5 +1,5 @@
 export declare const fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'";
-export declare const fontWeightWeakEn = 400;
+export declare const fontWeightWeakEn = 300;
 export declare const fontWeightEn = 500;
 export declare const fontWeightStrongEn = 600;
 declare const _default: import("antd").ThemeConfig;

package/lib/theme/default.js

@@ -44,7 +44,7 @@ var borderRadius = 4;
 var borderRadiusMD = 6;
 var borderRadiusLG = 8;
 var fontFamilyEn = `Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'`;
-var fontWeightWeakEn = 400;
+var fontWeightWeakEn = 300;
 var fontWeightEn = 500;
 var fontWeightStrongEn = 600;
 var defaultTheme = {

package/lib/typography/style/index.js

@@ -69,16 +69,19 @@ var genTypographyStyle = (token) => {
     [`${componentCls}${componentCls}-edit-content`]: {
       [`${componentCls}-div&`]: {
         insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+        insetBlockStart: 0,
         marginTop: negativeMarginOffset,
         marginBottom: calc("1em").sub(marginOffset).equal()
       },
       [`${componentCls}-span&`]: {
         insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+        insetBlockStart: 0,
         marginTop: negativeMarginOffset,
         marginBottom: negativeMarginOffset
       },
       [`${componentCls}-h1&, ${componentCls}-h2&, ${componentCls}-h3&, ${componentCls}-h4&, ${componentCls}-h5&`]: {
         insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+        insetBlockStart: 0,
         marginTop: `${negativeMarginOffset} !important`,
         marginBottom: `${negativeMarginOffset} !important`
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oceanbase/design",
-  "version": "1.0.0-alpha.6",
+  "version": "1.0.0-alpha.8",
   "description": "The Design System of OceanBase",
   "keywords": [
     "oceanbase",
@@ -56,6 +56,7 @@
     "@babel/cli": "^7.28.3",
     "@babel/preset-env": "^7.28.5",
     "antd-token-previewer": "^2.0.8",
+    "rc-input": "^1.8.0",
     "rc-select": "^14.16.8",
     "rc-slider": "^11.1.9",
     "rc-table": "^7.55.1",
@@ -65,5 +66,5 @@
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
-  "gitHead": "7ce9c565c23262a8ffaeab5904095ca65806def9"
+  "gitHead": "bf92d8043456556eac797dbd6197288c5695504d"
 }