@oceanbase/design 1.0.0-alpha.1 → 1.0.0-alpha.11

package/lib/tag/style/index.js

@@ -1,104 +1,91 @@
-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);
+"use strict";
 
-// src/tag/style/index.ts
-var style_exports = {};
-__export(style_exports, {
-  default: () => style_default,
-  genTagStyle: () => genTagStyle
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(style_exports);
-var import_internal = require("antd/es/theme/internal");
-var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
-var import_internal2 = require("antd/lib/theme/internal");
-var import_getWeakenBorderColor = require("../../_util/getWeakenBorderColor");
-var getTagBorderColor = (color) => {
-  return (0, import_getWeakenBorderColor.getWeakenBorderColor)(color);
-};
-var genTagPresetStatusStyle = (token, status) => {
-  const borderColorMap = {
+exports.genTagStyle = exports.default = void 0;
+var _cssinjs = require("@ant-design/cssinjs");
+var _internal = require("antd/es/theme/internal");
+var _genComponentStyleHook = require("../../_util/genComponentStyleHook");
+const genTagPresetStatusStyle = (token, status) => {
+  const colorMap = {
+    success: token.colorSuccessText,
+    processing: token.colorInfoText,
+    warning: token.colorWarningText,
+    error: token.colorErrorText,
+    critical: token.colorFuchsiaText
+  };
+  const bgMap = {
+    success: token.colorSuccessBg,
+    processing: token.colorInfoBg,
+    warning: token.colorWarningBg,
+    error: token.colorErrorBg,
+    critical: token.colorFuchsiaBg
+  };
+  const borderMap = {
     success: token.colorSuccessBorder,
     processing: token.colorInfoBorder,
+    warning: token.colorWarningBorder,
     error: token.colorErrorBorder,
-    warning: token.colorWarningBorder
+    critical: token.colorFuchsiaBorder
   };
   return {
     [`${token.componentCls}${token.componentCls}-${status}`]: {
-      borderColor: getTagBorderColor(borderColorMap[status])
+      color: colorMap[status],
+      background: bgMap[status],
+      borderColor: borderMap[status],
+      [`&${token.componentCls}-borderless`]: {
+        borderColor: 'transparent'
+      }
     }
   };
 };
-var genPresetStyle = (token) => (0, import_internal2.genPresetColor)(token, (colorKey, { lightBorderColor }) => {
-  return {
-    [`${token.componentCls}${token.componentCls}-${colorKey}`]: {
-      borderColor: getTagBorderColor(lightBorderColor)
-    }
-  };
-});
-var genTagStyle = (token) => {
-  const { antCls, componentCls, tagPaddingHorizontal, lineWidth, calc } = token;
-  const paddingInline = calc(tagPaddingHorizontal).sub(lineWidth).equal();
+const genTagStyle = token => {
+  const {
+    antCls,
+    componentCls,
+    iconCls
+  } = token;
   return {
     [`${componentCls}`]: {
       paddingInline: token.paddingXS,
-      borderColor: getTagBorderColor(token.colorBorder),
       fontSize: token.fontSizeSM,
+      [`${componentCls}-close-icon${iconCls}`]: {
+        marginInlineStart: token.marginXXS
+      },
       [`${antCls}-typography`]: {
         [`${componentCls}-icon`]: {
-          marginInlineEnd: paddingInline
+          marginInlineEnd: token.marginXXS
         }
       },
-      ["&-ellipsis"]: {
-        maxWidth: "100%",
-        textOverflow: "ellipsis",
-        overflow: "hidden",
-        verticalAlign: "bottom"
+      ['&-ellipsis']: {
+        maxWidth: '100%',
+        textOverflow: 'ellipsis',
+        overflow: 'hidden',
+        verticalAlign: 'bottom'
       },
-      ["&-checkable"]: {
-        borderColor: "transparent"
+      ['&-checkable']: {
+        borderColor: 'transparent'
       },
-      ["&-hidden"]: {
-        display: "none"
+      ['&-hidden']: {
+        display: 'none'
       },
-      ["&-borderless"]: {
-        borderColor: "transparent"
+      ['&-borderless']: {
+        borderColor: 'transparent'
+      },
+      ['&-pill']: {
+        borderRadius: 100,
+        marginInlineEnd: token.marginXXS,
+        borderColor: token.colorBorderSecondary,
+        color: token.colorTextSecondary,
+        // pill tag use smaller line-height
+        lineHeight: (0, _cssinjs.unit)(token.fontHeightSM)
       }
     }
   };
 };
-var style_default = (prefixCls) => {
-  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Tag", (token) => {
-    const tagToken = (0, import_internal.mergeToken)(token, {
-      tagPaddingHorizontal: 8
-      // Fixed padding.
-    });
-    return [
-      genTagStyle(tagToken),
-      genPresetStyle(tagToken),
-      genTagPresetStatusStyle(tagToken, "success"),
-      genTagPresetStatusStyle(tagToken, "error"),
-      genTagPresetStatusStyle(tagToken, "processing"),
-      genTagPresetStatusStyle(tagToken, "warning")
-    ];
-  });
-  return useStyle(prefixCls);
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  genTagStyle
-});
+exports.genTagStyle = genTagStyle;
+var _default = exports.default = (0, _genComponentStyleHook.genStyleHooks)('Tag', token => {
+  const tagToken = (0, _internal.mergeToken)(token, {});
+  return [genTagStyle(tagToken), genTagPresetStatusStyle(tagToken, 'success'), genTagPresetStatusStyle(tagToken, 'error'), genTagPresetStatusStyle(tagToken, 'processing'), genTagPresetStatusStyle(tagToken, 'warning'), genTagPresetStatusStyle(tagToken, 'critical')];
+});

package/lib/theme/aliyun.js

@@ -1,36 +1,9 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/theme/aliyun.ts
-var aliyun_exports = {};
-__export(aliyun_exports, {
-  default: () => aliyun_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(aliyun_exports);
-var import_aliyun_theme = __toESM(require("@oceanbase/aliyun-theme"));
-var aliyun_default = import_aliyun_theme.default;
+exports.default = void 0;
+var _aliyunTheme = _interopRequireDefault(require("@oceanbase/aliyun-theme"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _default = exports.default = _aliyunTheme.default;

package/lib/theme/compact.d.ts

@@ -1,5 +1,5 @@
 declare const compactTheme: {
-    token: import("antd/es/theme/internal").AliasToken;
+    token: import("antd/es/theme/internal").SeedToken;
     components: {
         InputNumber: {
             handleVisible: boolean;

package/lib/theme/compact.js

@@ -1,44 +1,13 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/theme/compact.ts
-var compact_exports = {};
-__export(compact_exports, {
-  default: () => compact_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(compact_exports);
-var import_antd = require("antd");
-var import_index = __toESM(require("./index"));
-var compactTheme = {
-  token: import_antd.theme.getDesignToken({
-    algorithm: import_antd.theme.compactAlgorithm,
-    token: import_index.default.defaultSeed
-  }),
+exports.default = void 0;
+var _index = _interopRequireDefault(require("./index"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const compactTheme = {
+  token: _index.default.defaultSeed,
   components: {
     InputNumber: {
       handleVisible: true
@@ -50,4 +19,4 @@ var compactTheme = {
     }
   }
 };
-var compact_default = compactTheme;
+var _default = exports.default = compactTheme;

package/lib/theme/dark.d.ts

@@ -1,52 +1,5 @@
 declare const darkTheme: {
-    token: {
-        colorPrimary: string;
-        colorSuccess: string;
-        colorWarning: string;
-        colorError: string;
-        colorInfo: string;
-        colorTextBase: string;
-        colorBgBase: string;
-        colorLink: string;
-        fontFamily: string;
-        fontFamilyCode: string;
-        fontSize: number;
-        lineWidth: number;
-        lineType: string;
-        borderRadius: number;
-        sizeUnit: number;
-        sizeStep: number;
-        sizePopupArrow: number;
-        controlHeight: number;
-        zIndexBase: number;
-        zIndexPopupBase: number;
-        opacityImage: number;
-        motionUnit: number;
-        motionBase: number;
-        motionEaseOutCirc: string;
-        motionEaseInOutCirc: string;
-        motionEaseInOut: string;
-        motionEaseOutBack: string;
-        motionEaseInBack: string;
-        motionEaseInQuint: string;
-        motionEaseOutQuint: string;
-        motionEaseOut: string;
-        wireframe: boolean;
-        motion: boolean;
-        blue: string;
-        purple: string;
-        cyan: string;
-        green: string;
-        magenta: string;
-        pink: string;
-        red: string;
-        orange: string;
-        yellow: string;
-        volcano: string;
-        geekblue: string;
-        lime: string;
-        gold: string;
-    };
+    token: import("antd/es/theme/internal").SeedToken;
     components: {
         InputNumber: {
             handleVisible: boolean;

package/lib/theme/dark.js

@@ -1,44 +1,17 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/theme/dark.ts
-var dark_exports = {};
-__export(dark_exports, {
-  default: () => dark_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(dark_exports);
-var import_index = __toESM(require("./index"));
-var darkTheme = {
-  token: import_index.default.defaultSeed,
+exports.default = void 0;
+var _index = _interopRequireDefault(require("./index"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const darkTheme = {
+  token: _index.default.defaultSeed,
   components: {
     InputNumber: {
       handleVisible: true
     }
   }
 };
-var dark_default = darkTheme;
+var _default = exports.default = darkTheme;

package/lib/theme/default.d.ts

@@ -1,4 +1,50 @@
-import type { ThemeConfig } from 'antd';
+export declare const white = "#ffffff";
+export declare const gray1 = "#fbfcfe";
+export declare const gray2 = "#f5f7fc";
+export declare const gray3 = "#ebeff7";
+export declare const gray4 = "#e2e8f3";
+export declare const gray5 = "#cdd5e4";
+export declare const gray6 = "#b6c0d4";
+export declare const gray7 = "#8592ad";
+export declare const gray8 = "#5c6b8a";
+export declare const gray9 = "#3b4a69";
+export declare const gray10 = "#132039";
+export declare const black = "#000000";
+export declare const blue1 = "#f3f8fe";
+export declare const blue2 = "#b3d3ff";
+export declare const blue3 = "#619ef3";
+export declare const blue4 = "#0d6cf2";
+export declare const blue5 = "#0852bb";
+export declare const blue6 = "#0d3c80";
+export declare const green1 = "#f5faf8";
+export declare const green2 = "#b3e6d5";
+export declare const green3 = "#79d1b4";
+export declare const green4 = "#16b882";
+export declare const green5 = "#0a8c61";
+export declare const green6 = "#09593f";
+export declare const orange1 = "#fff9ee";
+export declare const orange2 = "#ffe7c2";
+export declare const orange3 = "#fac373";
+export declare const orange4 = "#f49f25";
+export declare const orange5 = "#ac690b";
+export declare const orange6 = "#6c4408";
+export declare const red1 = "#fff2f2";
+export declare const red2 = "#ffd6d6";
+export declare const red3 = "#f69898";
+export declare const red4 = "#eb4242";
+export declare const red5 = "#b52727";
+export declare const red6 = "#8a1b1b";
+export declare const fuchsia1 = "#faf0fc";
+export declare const fuchsia2 = "#e8caee";
+export declare const fuchsia3 = "#d88ee7";
+export declare const fuchsia4 = "#b04ec4";
+export declare const fuchsia5 = "#802792";
+export declare const fuchsia6 = "#580e67";
+export declare const colorNaviBg = "#f1f6ff";
+export declare const colorNaviBgHover = "#e8effb";
 export declare const fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'";
-declare const _default: ThemeConfig;
+export declare const fontWeightWeakEn = 300;
+export declare const fontWeightEn = 500;
+export declare const fontWeightStrongEn = 600;
+declare const _default: import("antd").ThemeConfig;
 export default _default;