@digitalc/dxp-ui 0.0.5-alpha.1 → 0.0.5-alpha.2

package/es/assets/token.json

@@ -99,7 +99,7 @@
   "colorRibbonSecondary2": "#E8F6FF",
   "colorRibbonSecondaryDark": "#1482CC",
   "colorTagPrimary": "#D01660",
-  "colorTagSecondary": "#1482CC",
+  "colorTagSecondary": "#1700E8",
   "colorTextAlert": "#bc1430",
   "colorTextCoachmark": "#ffffff",
   "colorTextCta": "#4D28E8",

package/es/components/Amount/designTokens.d.ts

@@ -0,0 +1,6 @@
+declare const designTokens: {
+    colorCardTextTitle: any;
+    colorCardTextPriceStrikethrough: any;
+    colorCardTextPrice: any;
+};
+export { designTokens };

package/es/components/Amount/designTokens.js

@@ -0,0 +1,10 @@
+import { getToken } from "../../utils/tokenHelper";
+var designTokens = {
+  colorCardTextTitle: getToken('colorCardTextTitle'),
+  // title颜色
+  colorCardTextPriceStrikethrough: getToken('colorCardTextPriceStrikethrough'),
+  // 划线价颜色
+  colorCardTextPrice: getToken('colorCardTextPrice') // 金额颜色
+};
+export { designTokens };
+//# sourceMappingURL=designTokens.js.map

package/es/components/Amount/designTokens.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getToken","designTokens","colorCardTextTitle","colorCardTextPriceStrikethrough","colorCardTextPrice"],"sources":["../../../src/components/Amount/designTokens.ts"],"sourcesContent":["import { getToken } from '@/utils/tokenHelper';\n\nconst designTokens = {\n  colorCardTextTitle: getToken('colorCardTextTitle'), // title颜色\n  colorCardTextPriceStrikethrough: getToken('colorCardTextPriceStrikethrough'), // 划线价颜色\n  colorCardTextPrice: getToken('colorCardTextPrice'), // 金额颜色\n};\n\nexport { designTokens };\n"],"mappings":"AAAA,SAASA,QAAQ;AAEjB,IAAMC,YAAY,GAAG;EACnBC,kBAAkB,EAAEF,QAAQ,CAAC,oBAAoB,CAAC;EAAE;EACpDG,+BAA+B,EAAEH,QAAQ,CAAC,iCAAiC,CAAC;EAAE;EAC9EI,kBAAkB,EAAEJ,QAAQ,CAAC,oBAAoB,CAAC,CAAE;AACtD,CAAC;AAED,SAASC,YAAY"}

package/es/components/Amount/index.js

@@ -5,13 +5,12 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _excluded = ["children", "className", "size", "title", "position", "prefixCls", "priceStrikethrough", "style"];
+var _excluded = ["children", "className", "size", "title", "position", "prefixCls", "priceStrikethrough", "style", "priceColor", "textColor", "colorStrikethrough"];
 import React, { PureComponent } from 'react';
-import { DownOutlined } from '@ant-design/icons';
 import { default as classNames } from 'classnames';
-import TokenManager from "../../utils/tokenManager";
+import { designTokens } from "./designTokens";
 import { cssClasses } from "../../constants";
-import { Text } from "../index";
+import { Text, Icon } from "../index";
 import "./style/index.less";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 var Amount = /*#__PURE__*/function (_PureComponent) {
@@ -33,15 +32,13 @@ var Amount = /*#__PURE__*/function (_PureComponent) {
         prefixCls = _this$props.prefixCls,
         priceStrikethrough = _this$props.priceStrikethrough,
         style = _this$props.style,
+        priceColor = _this$props.priceColor,
+        textColor = _this$props.textColor,
+        colorStrikethrough = _this$props.colorStrikethrough,
         attr = _objectWithoutProperties(_this$props, _excluded);
-      var colorCardTextPrice = TokenManager.tokenKey('colorCardTextPrice');
-      var colorIconNeutral = TokenManager.designTokenKey('colorIconNeutral');
-      var colorCardTextTitle = TokenManager.tokenKey('colorCardTextTitle');
-      var colorCardTextPriceStrikethrough = TokenManager.tokenKey('colorCardTextPriceStrikethrough');
-      var colorValue = undefined;
-      if (typeof colorIconNeutral === 'string') {
-        colorValue = colorIconNeutral;
-      }
+      var colorCardTextPrice = designTokens.colorCardTextPrice,
+        colorCardTextPriceStrikethrough = designTokens.colorCardTextPriceStrikethrough,
+        colorCardTextTitle = designTokens.colorCardTextTitle;
       var baseProps = {
         className: classNames(prefixCls, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-size-").concat(size), size), "".concat(prefixCls, "-position-").concat(position), position), className),
         style: style
@@ -65,18 +62,17 @@ var Amount = /*#__PURE__*/function (_PureComponent) {
           children: title === 'discount' ? /*#__PURE__*/_jsx(Text, {
             size: "smallBodyBold",
             style: {
-              color: '#D01660'
+              color: textColor || '#D01660'
             },
             children: "Discount"
           }) : /*#__PURE__*/_jsxs(Text, {
             size: "smallbodyRegular",
             style: {
-              color: colorCardTextPrice
+              color: textColor || colorCardTextTitle
             },
-            children: [title, /*#__PURE__*/_jsx(DownOutlined, {
-              style: {
-                color: colorValue
-              }
+            children: [title, /*#__PURE__*/_jsx(Icon, {
+              size: 12,
+              name: "icon-a-Arrow-Down"
             })]
           })
         });
@@ -85,7 +81,7 @@ var Amount = /*#__PURE__*/function (_PureComponent) {
         return /*#__PURE__*/_jsx(Text, {
           size: getSize(size),
           style: {
-            color: colorCardTextTitle
+            color: priceColor || colorCardTextPrice
           },
           children: children
         });
@@ -94,7 +90,7 @@ var Amount = /*#__PURE__*/function (_PureComponent) {
         return /*#__PURE__*/_jsx(Text, {
           size: "smallBodyStrikethrough",
           style: {
-            color: colorCardTextPriceStrikethrough
+            color: colorStrikethrough || colorCardTextPriceStrikethrough
           },
           children: priceStrikethrough
         });

package/es/components/Amount/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","PureComponent","DownOutlined","default","classNames","TokenManager","cssClasses","Text","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Amount","_PureComponent","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_this$props","props","children","className","size","title","position","prefixCls","priceStrikethrough","style","attr","_objectWithoutProperties","_excluded","colorCardTextPrice","tokenKey","colorIconNeutral","designTokenKey","colorCardTextTitle","colorCardTextPriceStrikethrough","colorValue","undefined","baseProps","_defineProperty","concat","getSize","fontSize","TitleDom","color","PriceDom","PriceStrikethroughDom","positionLeft","positionRight","positionUp","positionDown","_objectSpread","onClick","onMouseDown","PREFIX"],"sources":["../../../src/components/Amount/index.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport {\n  DownOutlined\n} from '@ant-design/icons';\nimport { default as classNames } from 'classnames';\nimport TokenManager from '@/utils/tokenManager';\nimport { cssClasses } from '../../constants';\nimport { Text } from '../index';\nimport './style/index.less';\n\nexport type Size = '12' | '16' | '20' | '24';\nexport type Position = 'up' | 'right' | 'down' | 'left';\n\nexport interface AmountProps{\n  children?: React.ReactNode;\n  className?: string;\n  size?: Size;\n  position?: Position;\n  style?: React.CSSProperties;\n  onClick?: React.MouseEventHandler;\n  [key: string]: any;\n}\n\nexport default class Amount extends PureComponent<AmountProps> {\n  static defaultProps = {\n    size: '20',\n    title: 'Total',\n    position: 'down',\n    prefixCls: cssClasses.PREFIX + '-amount',\n  };\n\n  render() {\n    const {\n      children,\n      className,\n      size,\n      title,\n      position,\n      prefixCls,\n      priceStrikethrough,\n      style,\n      ...attr\n    } = this.props;\n\n    const colorCardTextPrice = TokenManager.tokenKey('colorCardTextPrice');\n    const colorIconNeutral = TokenManager.designTokenKey('colorIconNeutral');\n    const colorCardTextTitle = TokenManager.tokenKey('colorCardTextTitle');\n    const colorCardTextPriceStrikethrough = TokenManager.tokenKey('colorCardTextPriceStrikethrough');\n    \n    let colorValue: string | undefined = undefined;\n    if (typeof colorIconNeutral === 'string') {\n      colorValue = colorIconNeutral;\n    }\n\n    const baseProps = {\n      className: classNames(\n        prefixCls,\n        {\n          // 映射secondary为default，tertiary为dashed\n          [`${prefixCls}-size-${size}`]: size,\n          [`${prefixCls}-position-${position}`]: position,\n        },\n        className,\n      ),\n      style,\n    };\n\n    const getSize = (fontSize: string | undefined) => {\n      switch (fontSize) {\n        case '12':\n          return 'smallbodyRegular';\n        case '16':\n          return 'bodyBold';\n        case '20':\n          return 'header';\n        case '24':\n          return 'sectionTitle';\n        default:\n          return 'smallbodyRegular';\n      }\n    }\n\n    const TitleDom = () => (\n      <>\n        {title === 'discount' ? (\n          <Text size=\"smallBodyBold\" style={{ color: '#D01660' }}>\n            Discount\n          </Text>\n        ) : (\n          <Text size=\"smallbodyRegular\" style={{ color: colorCardTextPrice}}>\n            {title}\n            <DownOutlined style={{ color: colorValue }} />\n          </Text>\n        )}\n      </>\n    )\n\n    const PriceDom = () => (\n      <Text size={getSize(size)} style={{ color: colorCardTextTitle}}>\n        {children}\n      </Text>\n    )\n\n    const PriceStrikethroughDom = () => (\n      <Text size=\"smallBodyStrikethrough\" style={{ color: colorCardTextPriceStrikethrough}}>\n        {priceStrikethrough}\n      </Text>\n    )\n\n    const positionLeft = () => (\n      <>\n        <TitleDom />\n        <div>\n          <PriceStrikethroughDom />\n          <PriceDom />\n        </div>\n      </>\n    )\n\n    const positionRight = () => (\n      <>\n        <TitleDom />\n        <div>\n          <PriceDom />\n          <PriceStrikethroughDom />\n        </div>\n      </>\n    )\n\n    const positionUp = () => (\n      <>\n        <TitleDom />\n        <PriceStrikethroughDom />\n        <PriceDom />\n      </>\n    )\n\n    const positionDown = () => (\n      <>\n        <TitleDom />\n        <PriceDom />\n        <PriceStrikethroughDom />\n      </>\n    )\n\n    return (\n      <span\n        onClick={this.props.onClick} \n        {...baseProps}\n        onMouseDown={this.props.onMouseDown}\n        {...attr}\n      >\n        {position === 'left' && positionLeft()}\n        {position === 'right' && positionRight()}\n        {position === 'up' && positionUp()}\n        {position === 'down' && positionDown()}\n      </span>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","PureComponent","default","classNames","designTokens","cssClasses","Text","Icon","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Amount","_PureComponent","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_this$props","props","children","className","size","title","position","prefixCls","priceStrikethrough","style","priceColor","textColor","colorStrikethrough","attr","_objectWithoutProperties","_excluded","colorCardTextPrice","colorCardTextPriceStrikethrough","colorCardTextTitle","baseProps","_defineProperty","concat","getSize","fontSize","TitleDom","color","name","PriceDom","PriceStrikethroughDom","positionLeft","positionRight","positionUp","positionDown","_objectSpread","onClick","onMouseDown","PREFIX"],"sources":["../../../src/components/Amount/index.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport { default as classNames } from 'classnames';\nimport { designTokens } from './designTokens';\nimport { cssClasses } from '../../constants';\nimport { Text, Icon } from '../index';\nimport './style/index.less';\n\nexport type Size = '12' | '16' | '20' | '24';\nexport type Position = 'up' | 'right' | 'down' | 'left';\n\nexport interface AmountProps{\n  children?: React.ReactNode;\n  className?: string;\n  size?: Size;\n  position?: Position;\n  style?: React.CSSProperties;\n  onClick?: React.MouseEventHandler;\n  [key: string]: any;\n}\n\nexport default class Amount extends PureComponent<AmountProps> {\n  static defaultProps = {\n    size: '20',\n    title: 'Total',\n    position: 'down',\n    prefixCls: cssClasses.PREFIX + '-amount',\n  };\n\n  render() {\n    const {\n      children,\n      className,\n      size,\n      title,\n      position,\n      prefixCls,\n      priceStrikethrough,\n      style,\n      priceColor,\n      textColor,\n      colorStrikethrough,\n      ...attr\n    } = this.props;\n\n\n  const {\n    colorCardTextPrice,\n    colorCardTextPriceStrikethrough,\n    colorCardTextTitle,\n  } = designTokens;\n\n    const baseProps = {\n      className: classNames(\n        prefixCls,\n        {\n          // 映射secondary为default，tertiary为dashed\n          [`${prefixCls}-size-${size}`]: size,\n          [`${prefixCls}-position-${position}`]: position,\n        },\n        className,\n      ),\n      style,\n    };\n\n    const getSize = (fontSize: string | undefined) => {\n      switch (fontSize) {\n        case '12':\n          return 'smallbodyRegular';\n        case '16':\n          return 'bodyBold';\n        case '20':\n          return 'header';\n        case '24':\n          return 'sectionTitle';\n        default:\n          return 'smallbodyRegular';\n      }\n    }\n\n    const TitleDom = () => (\n      <>\n        {title === 'discount' ? (\n          <Text size=\"smallBodyBold\" style={{ color: textColor || '#D01660' }}>\n            Discount\n          </Text>\n        ) : (\n          <Text size=\"smallbodyRegular\" style={{ color: textColor || colorCardTextTitle}}>\n            {title}\n            <Icon size={12} name=\"icon-a-Arrow-Down\" />\n          </Text>\n        )}\n      </>\n    )\n\n    const PriceDom = () => (\n      <Text size={getSize(size)} style={{ color: priceColor || colorCardTextPrice}}>\n        {children}\n      </Text>\n    )\n\n    const PriceStrikethroughDom = () => (\n      <Text size=\"smallBodyStrikethrough\" style={{ color: colorStrikethrough || colorCardTextPriceStrikethrough}}>\n        {priceStrikethrough}\n      </Text>\n    )\n\n    const positionLeft = () => (\n      <>\n        <TitleDom />\n        <div>\n          <PriceStrikethroughDom />\n          <PriceDom />\n        </div>\n      </>\n    )\n\n    const positionRight = () => (\n      <>\n        <TitleDom />\n        <div>\n          <PriceDom />\n          <PriceStrikethroughDom />\n        </div>\n      </>\n    )\n\n    const positionUp = () => (\n      <>\n        <TitleDom />\n        <PriceStrikethroughDom />\n        <PriceDom />\n      </>\n    )\n\n    const positionDown = () => (\n      <>\n        <TitleDom />\n        <PriceDom />\n        <PriceStrikethroughDom />\n      </>\n    )\n\n    return (\n      <span\n        onClick={this.props.onClick} \n        {...baseProps}\n        onMouseDown={this.props.onMouseDown}\n        {...attr}\n      >\n        {position === 'left' && positionLeft()}\n        {position === 'right' && positionRight()}\n        {position === 'up' && positionUp()}\n        {position === 'down' && positionDown()}\n      </span>\n    );\n  }\n}\n"],"mappings":"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"}

package/es/components/Amount/style/index.less

@@ -1,10 +1,10 @@
 
 @import './variables.less';
-
-.dxp-amount {
+@components: amount;
+.@{prefix}-@{components} {
   display: flex;
   flex-direction: column;
-  .anticon-down {
-    margin-left: 4px;
+  svg {
+    padding-left: 4px;
   }
 }

package/es/components/Button/index.d.ts

@@ -1,11 +1,11 @@
 import React, { PureComponent } from 'react';
+import type { TextProps } from "../Text";
 import { noop } from '../../utils/noop';
 import './style/index.less';
 export type HtmlType = 'button' | 'reset' | 'submit';
 export type Size = 'middle' | 'small' | 'large';
 export type ButtonType = 'primary' | 'default' | 'dashed' | 'link' | 'text';
 export type ButtonColorType = 'default' | 'primary' | 'danger' | 'blue' | 'purple' | 'cyan' | 'green' | 'magenta' | 'pink' | 'red' | 'orange' | 'yellow' | 'volcano' | 'geekblue' | 'lime' | 'gold';
-export type fontSize = 'bannerTitle' | 'pageTitle' | 'sectionTitle' | 'header' | 'bodyBold' | 'bodyRegular' | 'bodyStrikethrough' | 'smallbodyRegular' | 'smallBodyStrikethrough' | 'smallBodySemiBold' | 'smallBodyBold' | 'smallBodyLink' | 'textLink' | 'mediumBody' | 'mediumBodyBold';
 export interface xDXpProps {
     'x-dxp-prop'?: string;
 }
@@ -16,7 +16,7 @@ export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonE
     loading?: boolean;
     htmlType?: HtmlType;
     size?: Size;
-    fontSize?: fontSize;
+    fontSize?: TextProps['size'];
     disabled?: boolean;
     block?: boolean;
     style?: React.CSSProperties;

package/es/components/Button/index.js

@@ -11,9 +11,9 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 var _excluded = ["fontSize", "theme", "inverse"];
 import React, { PureComponent } from 'react';
+import Text from "../Text";
 import { cssClasses } from "../../constants";
 import { noop } from "../../utils/noop";
-import Text from "../Text";
 import { designTokens, inverseDesignTokens } from "./designTokens";
 
 // 这种是另一方 定制 antd 的 style 的方式； 现在使用了上面的 designTokens.ts 的方式。

package/es/components/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","PureComponent","cssClasses","noop","Text","designTokens","inverseDesignTokens","jsx","_jsx","Fragment","_Fragment","Button","_PureComponent","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_this$props","props","children","inverse","fontSize","_this$props2","_","__","theme","___","filteredProps","_objectWithoutProperties","_excluded","_ConfigProvider","wave","disabled","prefixCls","PREFIX","components","_objectSpread","cssVar","hashed","_Button","size","_defineProperty","type","htmlType","onMouseDown","onClick","onMouseEnter","onMouseLeave","default"],"sources":["../../../src/components/Button/index.tsx"],"sourcesContent":["import { Button as AntdBtn, ConfigProvider } from 'antd';\nimport React, { PureComponent } from 'react';\nimport { cssClasses } from '../../constants';\nimport { noop } from '../../utils/noop';\nimport Text from '../Text';\nimport { designTokens, inverseDesignTokens } from './designTokens';\n\n// 这种是另一方 定制 antd 的 style 的方式； 现在使用了上面的 designTokens.ts 的方式。\nimport './style/index.less';\n\n// const { htmlTypes, btnTypes, sizes } = strings;\n\nexport type HtmlType = 'button' | 'reset' | 'submit';\nexport type Size = 'middle' | 'small' | 'large';\n// export type Theme = 'solid' | 'borderless' | 'light' | 'outline';\nexport type ButtonType = 'primary' | 'default' | 'dashed' | 'link' | 'text';\nexport type ButtonColorType = 'default' | 'primary' | 'danger' | 'blue' | 'purple' | 'cyan' | 'green' | 'magenta' | 'pink' | 'red' | 'orange' | 'yellow' | 'volcano' | 'geekblue' | 'lime' | 'gold';\nexport type fontSize =\n  | 'bannerTitle'\n  | 'pageTitle'\n  | 'sectionTitle'\n  | 'header'\n  | 'bodyBold'\n  | 'bodyRegular'\n  | 'bodyStrikethrough'\n  | 'smallbodyRegular'\n  | 'smallBodyStrikethrough'\n  | 'smallBodySemiBold'\n  | 'smallBodyBold'\n  | 'smallBodyLink'\n  | 'textLink'\n  | 'mediumBody'\n  | 'mediumBodyBold';\n\nexport interface xDXpProps {\n  'x-dxp-prop'?: string;\n  // 其他可能的属性\n}\nexport interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'color'> {\n  type?: ButtonType;\n  color?: ButtonColorType;\n  inverse?: boolean;\n  loading?: boolean;\n  htmlType?: HtmlType;\n  size?: Size;\n  fontSize?: fontSize;\n  disabled?: boolean;\n  block?: boolean;\n  style?: React.CSSProperties;\n  theme?: string;\n  prefixCls?: string;\n  'aria-label'?: React.AriaAttributes['aria-label'];\n  contentClassName?: string;\n  [key: string]: any;\n}\n\nexport default class Button extends PureComponent<ButtonProps> {\n  static defaultProps = {\n    disabled: false,\n    size: 'large',\n    fontSize: 'bodyBold',\n    type: 'default',\n    theme: 'light',\n    htmlType: 'button',\n    onMouseDown: noop,\n    onClick: noop,\n    onMouseEnter: noop,\n    onMouseLeave: noop,\n    prefixCls: cssClasses.PREFIX + '-button',\n  };\n\n  render() {\n    const { children, inverse, fontSize } = this.props;\n\n    // Filter out fontSize from props to avoid passing it to AntdBtn\n    // const { fontSize: _, ...filteredProps } = this.props;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { fontSize: _, theme: __, inverse: ___, ...filteredProps } = this.props;\n    return (\n      <>\n        <ConfigProvider\n          wave={{ disabled: true }}\n          prefixCls={cssClasses.PREFIX}\n          theme={{\n            // 这个外层的 Seed Token，影响范围大。\n            // token: designTokens,\n            components: {\n              Button: {\n                ...(inverse ? inverseDesignTokens : designTokens),\n              },\n            },\n            cssVar: true,\n            hashed: false,\n          }}\n        >\n          <AntdBtn {...filteredProps}>\n            <Text size={fontSize}>{children}</Text>\n          </AntdBtn>\n        </ConfigProvider>\n      </>\n    );\n  }\n}\n"],"mappings":";;;;;;;;;;;;AACA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,SAASC,UAAU;AACnB,SAASC,IAAI;AACb,OAAOC,IAAI;AACX,SAASC,YAAY,EAAEC,mBAAmB;;AAE1C;AACA;;AAEA;;AAIA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA;AAAA,IA0CqBC,MAAM,0BAAAC,cAAA;EAAAC,SAAA,CAAAF,MAAA,EAAAC,cAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,MAAA;EAAA,SAAAA,OAAA;IAAAK,eAAA,OAAAL,MAAA;IAAA,OAAAG,MAAA,CAAAG,KAAA,OAAAC,SAAA;EAAA;EAAAC,YAAA,CAAAR,MAAA;IAAAS,GAAA;IAAAC,KAAA,EAezB,SAAAC,OAAA,EAAS;MACP,IAAAC,WAAA,GAAwC,IAAI,CAACC,KAAK;QAA1CC,QAAQ,GAAAF,WAAA,CAARE,QAAQ;QAAEC,OAAO,GAAAH,WAAA,CAAPG,OAAO;QAAEC,QAAQ,GAAAJ,WAAA,CAARI,QAAQ;;MAEnC;MACA;MACA;MACA,IAAAC,YAAA,GAAmE,IAAI,CAACJ,KAAK;QAA3DK,CAAC,GAAAD,YAAA,CAAXD,QAAQ;QAAYG,EAAE,GAAAF,YAAA,CAATG,KAAK;QAAeC,GAAG,GAAAJ,YAAA,CAAZF,OAAO;QAAUO,aAAa,GAAAC,wBAAA,CAAAN,YAAA,EAAAO,SAAA;MAC9D,oBACE3B,IAAA,CAAAE,SAAA;QAAAe,QAAA,eACEjB,IAAA,CAAA4B,eAAA;UACEC,IAAI,EAAE;YAAEC,QAAQ,EAAE;UAAK,CAAE;UACzBC,SAAS,EAAErC,UAAU,CAACsC,MAAO;UAC7BT,KAAK,EAAE;YACL;YACA;YACAU,UAAU,EAAE;cACV9B,MAAM,EAAA+B,aAAA,KACAhB,OAAO,GAAGpB,mBAAmB,GAAGD,YAAY;YAEpD,CAAC;YACDsC,MAAM,EAAE,IAAI;YACZC,MAAM,EAAE;UACV,CAAE;UAAAnB,QAAA,eAEFjB,IAAA,CAAAqC,OAAA,EAAAH,aAAA,CAAAA,aAAA,KAAaT,aAAa;YAAAR,QAAA,eACxBjB,IAAA,CAACJ,IAAI;cAAC0C,IAAI,EAAEnB,QAAS;cAAAF,QAAA,EAAEA;YAAQ,CAAO;UAAC,EAChC;QAAC,CACI;MAAC,CACjB,CAAC;IAEP;EAAC;EAAA,OAAAd,MAAA;AAAA,EA7CiCV,aAAa;AAAA8C,eAAA,CAA5BpC,MAAM,kBACH;EACpB2B,QAAQ,EAAE,KAAK;EACfQ,IAAI,EAAE,OAAO;EACbnB,QAAQ,EAAE,UAAU;EACpBqB,IAAI,EAAE,SAAS;EACfjB,KAAK,EAAE,OAAO;EACdkB,QAAQ,EAAE,QAAQ;EAClBC,WAAW,EAAE/C,IAAI;EACjBgD,OAAO,EAAEhD,IAAI;EACbiD,YAAY,EAAEjD,IAAI;EAClBkD,YAAY,EAAElD,IAAI;EAClBoC,SAAS,EAAErC,UAAU,CAACsC,MAAM,GAAG;AACjC,CAAC;AAAA,SAbkB7B,MAAM,IAAA2C,OAAA"}
+{"version":3,"names":["React","PureComponent","Text","cssClasses","noop","designTokens","inverseDesignTokens","jsx","_jsx","Fragment","_Fragment","Button","_PureComponent","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","value","render","_this$props","props","children","inverse","fontSize","_this$props2","_","__","theme","___","filteredProps","_objectWithoutProperties","_excluded","_ConfigProvider","wave","disabled","prefixCls","PREFIX","components","_objectSpread","cssVar","hashed","_Button","size","_defineProperty","type","htmlType","onMouseDown","onClick","onMouseEnter","onMouseLeave","default"],"sources":["../../../src/components/Button/index.tsx"],"sourcesContent":["import { Button as AntdBtn, ConfigProvider } from 'antd';\nimport React, { PureComponent } from 'react';\nimport Text from '@/components/Text';\nimport type { TextProps } from '@/components/Text';\n\nimport { cssClasses } from '../../constants';\nimport { noop } from '../../utils/noop';\nimport { designTokens, inverseDesignTokens } from './designTokens';\n\n// 这种是另一方 定制 antd 的 style 的方式； 现在使用了上面的 designTokens.ts 的方式。\nimport './style/index.less';\n\n// const { htmlTypes, btnTypes, sizes } = strings;\n\nexport type HtmlType = 'button' | 'reset' | 'submit';\nexport type Size = 'middle' | 'small' | 'large';\n// export type Theme = 'solid' | 'borderless' | 'light' | 'outline';\nexport type ButtonType = 'primary' | 'default' | 'dashed' | 'link' | 'text';\nexport type ButtonColorType = 'default' | 'primary' | 'danger' | 'blue' | 'purple' | 'cyan' | 'green' | 'magenta' | 'pink' | 'red' | 'orange' | 'yellow' | 'volcano' | 'geekblue' | 'lime' | 'gold';\n\nexport interface xDXpProps {\n  'x-dxp-prop'?: string;\n  // 其他可能的属性\n}\nexport interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'color'> {\n  type?: ButtonType;\n  color?: ButtonColorType;\n  inverse?: boolean;\n  loading?: boolean;\n  htmlType?: HtmlType;\n  size?: Size;\n  fontSize?: TextProps['size'];\n  disabled?: boolean;\n  block?: boolean;\n  style?: React.CSSProperties;\n  theme?: string;\n  prefixCls?: string;\n  'aria-label'?: React.AriaAttributes['aria-label'];\n  contentClassName?: string;\n  [key: string]: any;\n}\n\nexport default class Button extends PureComponent<ButtonProps> {\n  static defaultProps = {\n    disabled: false,\n    size: 'large',\n    fontSize: 'bodyBold',\n    type: 'default',\n    theme: 'light',\n    htmlType: 'button',\n    onMouseDown: noop,\n    onClick: noop,\n    onMouseEnter: noop,\n    onMouseLeave: noop,\n    prefixCls: cssClasses.PREFIX + '-button',\n  };\n\n  render() {\n    const { children, inverse, fontSize } = this.props;\n\n    // Filter out fontSize from props to avoid passing it to AntdBtn\n    // const { fontSize: _, ...filteredProps } = this.props;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { fontSize: _, theme: __, inverse: ___, ...filteredProps } = this.props;\n    return (\n      <>\n        <ConfigProvider\n          wave={{ disabled: true }}\n          prefixCls={cssClasses.PREFIX}\n          theme={{\n            // 这个外层的 Seed Token，影响范围大。\n            // token: designTokens,\n            components: {\n              Button: {\n                ...(inverse ? inverseDesignTokens : designTokens),\n              },\n            },\n            cssVar: true,\n            hashed: false,\n          }}\n        >\n          <AntdBtn {...filteredProps}>\n            <Text size={fontSize}>{children}</Text>\n          </AntdBtn>\n        </ConfigProvider>\n      </>\n    );\n  }\n}\n"],"mappings":";;;;;;;;;;;;AACA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,OAAOC,IAAI;AAGX,SAASC,UAAU;AACnB,SAASC,IAAI;AACb,SAASC,YAAY,EAAEC,mBAAmB;;AAE1C;AACA;;AAEA;;AAIA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA;AAAA,IA0BqBC,MAAM,0BAAAC,cAAA;EAAAC,SAAA,CAAAF,MAAA,EAAAC,cAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,MAAA;EAAA,SAAAA,OAAA;IAAAK,eAAA,OAAAL,MAAA;IAAA,OAAAG,MAAA,CAAAG,KAAA,OAAAC,SAAA;EAAA;EAAAC,YAAA,CAAAR,MAAA;IAAAS,GAAA;IAAAC,KAAA,EAezB,SAAAC,OAAA,EAAS;MACP,IAAAC,WAAA,GAAwC,IAAI,CAACC,KAAK;QAA1CC,QAAQ,GAAAF,WAAA,CAARE,QAAQ;QAAEC,OAAO,GAAAH,WAAA,CAAPG,OAAO;QAAEC,QAAQ,GAAAJ,WAAA,CAARI,QAAQ;;MAEnC;MACA;MACA;MACA,IAAAC,YAAA,GAAmE,IAAI,CAACJ,KAAK;QAA3DK,CAAC,GAAAD,YAAA,CAAXD,QAAQ;QAAYG,EAAE,GAAAF,YAAA,CAATG,KAAK;QAAeC,GAAG,GAAAJ,YAAA,CAAZF,OAAO;QAAUO,aAAa,GAAAC,wBAAA,CAAAN,YAAA,EAAAO,SAAA;MAC9D,oBACE3B,IAAA,CAAAE,SAAA;QAAAe,QAAA,eACEjB,IAAA,CAAA4B,eAAA;UACEC,IAAI,EAAE;YAAEC,QAAQ,EAAE;UAAK,CAAE;UACzBC,SAAS,EAAEpC,UAAU,CAACqC,MAAO;UAC7BT,KAAK,EAAE;YACL;YACA;YACAU,UAAU,EAAE;cACV9B,MAAM,EAAA+B,aAAA,KACAhB,OAAO,GAAGpB,mBAAmB,GAAGD,YAAY;YAEpD,CAAC;YACDsC,MAAM,EAAE,IAAI;YACZC,MAAM,EAAE;UACV,CAAE;UAAAnB,QAAA,eAEFjB,IAAA,CAAAqC,OAAA,EAAAH,aAAA,CAAAA,aAAA,KAAaT,aAAa;YAAAR,QAAA,eACxBjB,IAAA,CAACN,IAAI;cAAC4C,IAAI,EAAEnB,QAAS;cAAAF,QAAA,EAAEA;YAAQ,CAAO;UAAC,EAChC;QAAC,CACI;MAAC,CACjB,CAAC;IAEP;EAAC;EAAA,OAAAd,MAAA;AAAA,EA7CiCV,aAAa;AAAA8C,eAAA,CAA5BpC,MAAM,kBACH;EACpB2B,QAAQ,EAAE,KAAK;EACfQ,IAAI,EAAE,OAAO;EACbnB,QAAQ,EAAE,UAAU;EACpBqB,IAAI,EAAE,SAAS;EACfjB,KAAK,EAAE,OAAO;EACdkB,QAAQ,EAAE,QAAQ;EAClBC,WAAW,EAAE9C,IAAI;EACjB+C,OAAO,EAAE/C,IAAI;EACbgD,YAAY,EAAEhD,IAAI;EAClBiD,YAAY,EAAEjD,IAAI;EAClBmC,SAAS,EAAEpC,UAAU,CAACqC,MAAM,GAAG;AACjC,CAAC;AAAA,SAbkB7B,MAAM,IAAA2C,OAAA"}

package/es/components/Chip/index.js

@@ -6,26 +6,13 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["types", "children", "prefixCls", "checked", "onChange", "style"];
 import React from 'react';
-import { Theme, useStyleRegister } from '@ant-design/cssinjs';
+import { useStyleRegister } from '@ant-design/cssinjs';
+import { theme } from "../../utils/theme";
 import { designTokens } from "./designTokens";
 import { BASE_CLASS_PREFIX } from "../../constants";
 import Text from "../Text";
 import "./style/index.less";
-
-// 定义设计令牌类型
-
-// 定义派生令牌类型
 import { jsx as _jsx } from "react/jsx-runtime";
-// 定义派生函数
-var derivativeFunc = function derivativeFunc(token) {
-  return {
-    buttonColor: token.primaryColor,
-    buttonFontSize: token.fontSize * 1.2
-  };
-};
-
-// 创建主题
-var theme = new Theme(derivativeFunc);
 var Chip = function Chip(props) {
   var _props$types = props.types,
     types = _props$types === void 0 ? 'textOnly' : _props$types,

package/es/components/Chip/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Theme","useStyleRegister","designTokens","BASE_CLASS_PREFIX","Text","jsx","_jsx","derivativeFunc","token","buttonColor","primaryColor","buttonFontSize","fontSize","theme","Chip","props","_props$types","types","children","_props$prefixCls","prefixCls","checked","_props$onChange","onChange","style","attr","_objectWithoutProperties","_excluded","borderRadiusChip","colorChipBackgroundStandard","colorChipBorderStandard","borderWidthChip","spacingChipPaddingHorizontal","spacingChipPaddingVertical","colorChipBackgroundHover","colorChipTextInactive","colorChipBackgroundActive","colorChipBorderActive","colorChipTextActive","sizingChipIconClose","useCustomButtonStyle","hashId","baseColor","path","concat","_ConfigProvider","components","Tag","borderRadiusSM","defaultBg","colorBorder","lineWidth","colorText","marginXS","fontSizeIcon","className","onClick","size","_Tag","_objectSpread","padding"],"sources":["../../../src/components/Chip/index.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProvider, Tag as AntdTag } from 'antd';\nimport { Theme, useStyleRegister } from '@ant-design/cssinjs';\nimport { designTokens } from './designTokens';\nimport { BASE_CLASS_PREFIX } from '../../constants';\nimport Text from '../Text';\nimport './style/index.less';\n\nexport interface ChipProps {\n  prefixCls?: string;\n  children?: React.ReactNode;\n  types?: 'textOnly' | 'removable';\n  style?: React.CSSProperties;\n  [key: string]: any;\n}\n\n// 定义设计令牌类型\ntype DesignToken = {\n  primaryColor: string;\n  fontSize: number;\n};\n\n// 定义派生令牌类型\ntype DerivativeToken = {\n  buttonColor: string;\n  buttonFontSize: number;\n};\n\n// 定义派生函数\nconst derivativeFunc = (token: DesignToken): DerivativeToken => {\n  return {\n    buttonColor: token.primaryColor,\n    buttonFontSize: token.fontSize * 1.2,\n  };\n};\n\n// 创建主题\nconst theme = new Theme<DesignToken, DerivativeToken>(derivativeFunc);\nconst Chip = (props: ChipProps) => {\n  const {\n    types = 'textOnly',\n    children,\n    prefixCls = 'tag',\n    checked,\n    onChange = () => {},\n    style,\n    ...attr\n  } = props;\n\n  const {\n    borderRadiusChip,\n    colorChipBackgroundStandard,\n    colorChipBorderStandard,\n    borderWidthChip,\n    spacingChipPaddingHorizontal,\n    spacingChipPaddingVertical,\n    colorChipBackgroundHover,\n    colorChipTextInactive,\n    colorChipBackgroundActive,\n    colorChipBorderActive,\n    colorChipTextActive,\n    sizingChipIconClose,\n    // spacingChipTextLinkPaddingVertical,\n    // spacingChipTextLinkPaddingHorizontal,\n  } = designTokens;\n  \n  const useCustomButtonStyle = () => {\n    const hashId = useStyleRegister({\n      theme: theme,\n      token: { baseColor: 'blue' },\n      path: ['tag-textonly'],\n    }, () => `\n      .tag-textonly {\n        color: ${colorChipTextInactive};\n        border-color: ${colorChipBorderStandard};\n        border-width: ${borderWidthChip}px;\n        border-radius: ${borderRadiusChip}px;\n        background-color: ${colorChipBackgroundStandard};\n        padding: ${spacingChipPaddingVertical}px ${spacingChipPaddingHorizontal}px;\n      }\n      .tag-textonly:hover {\n        background-color: ${colorChipBackgroundHover};\n      }\n      .tag-textonly:active {\n        background-color: ${colorChipBackgroundHover};\n      }\n      .tag-active,\n      .tag-active:hover,\n      .tag-active:active {\n        color: ${colorChipTextActive};\n        border-color: ${colorChipBorderActive};\n        background-color: ${colorChipBackgroundActive};\n      }\n    `);\n    return hashId;\n  };\n  useCustomButtonStyle();\n  \n  return (\n    <ConfigProvider\n      prefixCls={BASE_CLASS_PREFIX}\n      theme={{\n        components: {\n          Tag: {\n            borderRadiusSM: borderRadiusChip,\n            defaultBg: colorChipBackgroundActive,\n            colorBorder: colorChipBorderActive,\n            lineWidth: borderWidthChip,\n            colorText: colorChipTextActive,\n            marginXS: 16,\n            fontSizeIcon: sizingChipIconClose,\n            // spacingChipTextLinkPaddingVertical,\n            // spacingChipTextLinkPaddingHorizontal,\n          },\n        },\n      }}\n    >\n      {types === 'textOnly' ? (\n        <span\n          className={`${BASE_CLASS_PREFIX}-${prefixCls}-${types} tag-textonly ${checked ? 'tag-active' : ''}`}\n          onClick={() => onChange()}\n          style={style}\n        >\n          <Text size='bodyRegular' >{children}</Text>\n        </span>\n      ) : (\n        <AntdTag\n          {...attr}\n          className={`${BASE_CLASS_PREFIX}-${prefixCls}-${types}`}\n          style={{ padding: `${spacingChipPaddingVertical}px ${spacingChipPaddingHorizontal}px`, ...style }}\n        >\n          <Text size='bodyRegular'>{children}</Text>\n        </AntdTag>\n      )}\n    </ConfigProvider>\n  );\n};\n\nexport default Chip;"],"mappings":"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"}
+{"version":3,"names":["React","useStyleRegister","theme","designTokens","BASE_CLASS_PREFIX","Text","jsx","_jsx","Chip","props","_props$types","types","children","_props$prefixCls","prefixCls","checked","_props$onChange","onChange","style","attr","_objectWithoutProperties","_excluded","borderRadiusChip","colorChipBackgroundStandard","colorChipBorderStandard","borderWidthChip","spacingChipPaddingHorizontal","spacingChipPaddingVertical","colorChipBackgroundHover","colorChipTextInactive","colorChipBackgroundActive","colorChipBorderActive","colorChipTextActive","sizingChipIconClose","useCustomButtonStyle","hashId","token","baseColor","path","concat","_ConfigProvider","components","Tag","borderRadiusSM","defaultBg","colorBorder","lineWidth","colorText","marginXS","fontSizeIcon","className","onClick","size","_Tag","_objectSpread","padding"],"sources":["../../../src/components/Chip/index.tsx"],"sourcesContent":["import React from 'react';\nimport { ConfigProvider, Tag as AntdTag } from 'antd';\nimport { useStyleRegister } from '@ant-design/cssinjs';\nimport { theme } from '../../utils/theme';\nimport { designTokens } from './designTokens';\nimport { BASE_CLASS_PREFIX } from '../../constants';\nimport Text from '../Text';\nimport './style/index.less';\n\nexport interface ChipProps {\n  prefixCls?: string;\n  children?: React.ReactNode;\n  types?: 'textOnly' | 'removable';\n  style?: React.CSSProperties;\n  [key: string]: any;\n}\nconst Chip = (props: ChipProps) => {\n  const {\n    types = 'textOnly',\n    children,\n    prefixCls = 'tag',\n    checked,\n    onChange = () => {},\n    style,\n    ...attr\n  } = props;\n\n  const {\n    borderRadiusChip,\n    colorChipBackgroundStandard,\n    colorChipBorderStandard,\n    borderWidthChip,\n    spacingChipPaddingHorizontal,\n    spacingChipPaddingVertical,\n    colorChipBackgroundHover,\n    colorChipTextInactive,\n    colorChipBackgroundActive,\n    colorChipBorderActive,\n    colorChipTextActive,\n    sizingChipIconClose,\n    // spacingChipTextLinkPaddingVertical,\n    // spacingChipTextLinkPaddingHorizontal,\n  } = designTokens;\n  \n  const useCustomButtonStyle = () => {\n    const hashId = useStyleRegister({\n      theme: theme,\n      token: { baseColor: 'blue' },\n      path: ['tag-textonly'],\n    }, () => `\n      .tag-textonly {\n        color: ${colorChipTextInactive};\n        border-color: ${colorChipBorderStandard};\n        border-width: ${borderWidthChip}px;\n        border-radius: ${borderRadiusChip}px;\n        background-color: ${colorChipBackgroundStandard};\n        padding: ${spacingChipPaddingVertical}px ${spacingChipPaddingHorizontal}px;\n      }\n      .tag-textonly:hover {\n        background-color: ${colorChipBackgroundHover};\n      }\n      .tag-textonly:active {\n        background-color: ${colorChipBackgroundHover};\n      }\n      .tag-active,\n      .tag-active:hover,\n      .tag-active:active {\n        color: ${colorChipTextActive};\n        border-color: ${colorChipBorderActive};\n        background-color: ${colorChipBackgroundActive};\n      }\n    `);\n    return hashId;\n  };\n  useCustomButtonStyle();\n  \n  return (\n    <ConfigProvider\n      prefixCls={BASE_CLASS_PREFIX}\n      theme={{\n        components: {\n          Tag: {\n            borderRadiusSM: borderRadiusChip,\n            defaultBg: colorChipBackgroundActive,\n            colorBorder: colorChipBorderActive,\n            lineWidth: borderWidthChip,\n            colorText: colorChipTextActive,\n            marginXS: 16,\n            fontSizeIcon: sizingChipIconClose,\n            // spacingChipTextLinkPaddingVertical,\n            // spacingChipTextLinkPaddingHorizontal,\n          },\n        },\n      }}\n    >\n      {types === 'textOnly' ? (\n        <span\n          className={`${BASE_CLASS_PREFIX}-${prefixCls}-${types} tag-textonly ${checked ? 'tag-active' : ''}`}\n          onClick={() => onChange()}\n          style={style}\n        >\n          <Text size='bodyRegular' >{children}</Text>\n        </span>\n      ) : (\n        <AntdTag\n          {...attr}\n          className={`${BASE_CLASS_PREFIX}-${prefixCls}-${types}`}\n          style={{ padding: `${spacingChipPaddingVertical}px ${spacingChipPaddingHorizontal}px`, ...style }}\n        >\n          <Text size='bodyRegular'>{children}</Text>\n        </AntdTag>\n      )}\n    </ConfigProvider>\n  );\n};\n\nexport default Chip;"],"mappings":"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"}

package/es/components/Chip/style/index.less

@@ -1,7 +1,9 @@
 
 @import './variables.less';
 
-.dxp-tag-textOnly {
+@components: tag;
+.@{prefix}-@{components}-textOnly {
   border-style: solid;
   cursor: pointer;
+  white-space: nowrap;
 }

package/es/components/Divider/style/index.less

@@ -1,22 +1,23 @@
 
 @import './variables.less';
 
-.dxp-divider {
+@components: divider;
+.@{prefix}-@{components} {
   width: 100%;
 }
 
-.dxp-divider-type-solid {
+.@{prefix}-@{components}-type-solid {
   border-bottom: 1px solid #BFBFC7;
 }
 
-.dxp-divider-type-dashed {
+.@{prefix}-@{components}-type-dashed {
   border-bottom: 1px dashed #E6E6E6;
 }
 
-.dxp-divider-type-eight {
+.@{prefix}-@{components}-type-eight {
   border-bottom: 8px solid #F5F5F8;
 }
-.dxp-divider-type-whiteBg {
+.@{prefix}-@{components}-type-whiteBg {
   position: relative;
   padding-top: 8px;
   overflow: hidden;
@@ -44,7 +45,7 @@
     border-bottom: 2px dashed #EBEBEB;
   }
 }
-.dxp-divider-type-grayBg {
+.@{prefix}-@{components}-type-grayBg {
   position: relative;
   padding-top: 8px;
   overflow: hidden;
@@ -70,7 +71,7 @@
     border-bottom: 2px dashed #F2F2F2;
   }
 }
-.dxp-divider-type-vertical {
+.@{prefix}-@{components}-type-vertical {
   width: auto;
   min-height: 12px;
   border-left: 1px solid #BFBFC7;

package/es/components/IconButton/designTokens.d.ts

@@ -0,0 +1,21 @@
+declare const designTokens: {
+    colorIconButtonNeutral: any;
+    colorIconButtonInverse: any;
+    sizingIconButtonMedium: any;
+    sizingIconButtonSmall: any;
+    spacingIconButtonPaddingVertical: any;
+    spacingIconButtonPaddingVerticalSm: any;
+    spacingIconButtonPaddingHorizontal: any;
+    spacingIconButtonPaddingHorizontalSm: any;
+    spacingIconButtonHorizontalGap: any;
+    spacingIconButtonHorizontalGapSm: any;
+    colorIconButtonDisabled: any;
+    colorIconButtonHover: any;
+    colorIconButtonActive: any;
+    transitionIconButton: string;
+};
+declare const otherDesignTokens: {
+    [x: string]: string;
+};
+export { designTokens, otherDesignTokens, };
+export default designTokens;

package/es/components/IconButton/designTokens.js

@@ -0,0 +1,40 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { getToken } from "../../utils/tokenHelper";
+import { cssClasses } from "../../constants";
+var prefixCls = cssClasses.PREFIX + '-icon-button';
+
+// 设计令牌定义
+var designTokens = {
+  // 图标按钮颜色
+  colorIconButtonNeutral: getToken('colorIconButtonNeutral'),
+  colorIconButtonInverse: getToken('colorIconButtonInverse'),
+  // 反色
+
+  // 图标按钮尺寸
+  sizingIconButtonMedium: getToken('sizingIconButtonIconMedium'),
+  // Medium Icon: 24px x 24px
+  sizingIconButtonSmall: getToken('sizingIconButtonIconSmall'),
+  // Small Icon: 16px x 16px
+
+  //  padding
+  spacingIconButtonPaddingVertical: getToken('spacingIconButtonPaddingVertical'),
+  // Medium
+  spacingIconButtonPaddingVerticalSm: getToken('spacingIconButtonPaddingVerticalSm'),
+  // Small
+
+  spacingIconButtonPaddingHorizontal: getToken('spacingIconButtonPaddingHorizontal'),
+  spacingIconButtonPaddingHorizontalSm: getToken('spacingIconButtonPaddingHorizontalSm'),
+  spacingIconButtonHorizontalGap: getToken('spacingIconButtonHorizontalGap'),
+  spacingIconButtonHorizontalGapSm: getToken('spacingIconButtonHorizontalGapSm'),
+  colorIconButtonDisabled: getToken('colorIconButtonDisabled'),
+  colorIconButtonHover: getToken('colorIconButtonHover'),
+  colorIconButtonActive: getToken('colorIconButtonActive'),
+  // 过渡动画
+  transitionIconButton: '0.3s'
+};
+
+// 其他样式属性
+var otherDesignTokens = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "--".concat(prefixCls, "-color"), "".concat(getToken('colorIconButtonNeutral'))), "--".concat(prefixCls, "-color-inverse"), "".concat(getToken('colorIconButtonInverse'))), "--".concat(prefixCls, "-color-disabled"), "".concat(getToken('colorIconButtonDisabled'))), "--".concat(prefixCls, "-transition"), "all ".concat(designTokens.transitionIconButton));
+export { designTokens, otherDesignTokens };
+export default designTokens;
+//# sourceMappingURL=designTokens.js.map

package/es/components/IconButton/designTokens.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getToken","cssClasses","prefixCls","PREFIX","designTokens","colorIconButtonNeutral","colorIconButtonInverse","sizingIconButtonMedium","sizingIconButtonSmall","spacingIconButtonPaddingVertical","spacingIconButtonPaddingVerticalSm","spacingIconButtonPaddingHorizontal","spacingIconButtonPaddingHorizontalSm","spacingIconButtonHorizontalGap","spacingIconButtonHorizontalGapSm","colorIconButtonDisabled","colorIconButtonHover","colorIconButtonActive","transitionIconButton","otherDesignTokens","_defineProperty","concat"],"sources":["../../../src/components/IconButton/designTokens.ts"],"sourcesContent":["import { getToken } from '@/utils/tokenHelper';\nimport { cssClasses } from '@/constants';\n\nconst prefixCls = cssClasses.PREFIX + '-icon-button';\n\n// 设计令牌定义\nconst designTokens = {\n  // 图标按钮颜色\n  colorIconButtonNeutral: getToken('colorIconButtonNeutral'),\n  colorIconButtonInverse: getToken('colorIconButtonInverse'), // 反色\n\n  // 图标按钮尺寸\n  sizingIconButtonMedium: getToken('sizingIconButtonIconMedium'), // Medium Icon: 24px x 24px\n  sizingIconButtonSmall:  getToken('sizingIconButtonIconSmall'),  // Small Icon: 16px x 16px\n\n  //  padding\n  spacingIconButtonPaddingVertical: getToken('spacingIconButtonPaddingVertical'), // Medium\n  spacingIconButtonPaddingVerticalSm: getToken('spacingIconButtonPaddingVerticalSm'),  // Small\n\n  spacingIconButtonPaddingHorizontal: getToken('spacingIconButtonPaddingHorizontal'),\n  spacingIconButtonPaddingHorizontalSm: getToken('spacingIconButtonPaddingHorizontalSm'),\n\n  spacingIconButtonHorizontalGap: getToken('spacingIconButtonHorizontalGap'),\n  spacingIconButtonHorizontalGapSm: getToken('spacingIconButtonHorizontalGapSm'),\n\n  colorIconButtonDisabled: getToken('colorIconButtonDisabled'),\n  colorIconButtonHover: getToken('colorIconButtonHover'),\n  colorIconButtonActive: getToken('colorIconButtonActive'),\n\n  // 过渡动画\n  transitionIconButton: '0.3s',\n};\n\n// 其他样式属性\nconst otherDesignTokens = {\n  [`--${prefixCls}-color`]: `${getToken('colorIconButtonNeutral')}`,\n  [`--${prefixCls}-color-inverse`]: `${getToken('colorIconButtonInverse')}`,\n  [`--${prefixCls}-color-disabled`]: `${getToken('colorIconButtonDisabled')}`,\n  [`--${prefixCls}-transition`]: `all ${designTokens.transitionIconButton}`,\n};\n\nexport {\n  designTokens,\n  otherDesignTokens,\n};\n\nexport default designTokens;\n\n"],"mappings":";AAAA,SAASA,QAAQ;AACjB,SAASC,UAAU;AAEnB,IAAMC,SAAS,GAAGD,UAAU,CAACE,MAAM,GAAG,cAAc;;AAEpD;AACA,IAAMC,YAAY,GAAG;EACnB;EACAC,sBAAsB,EAAEL,QAAQ,CAAC,wBAAwB,CAAC;EAC1DM,sBAAsB,EAAEN,QAAQ,CAAC,wBAAwB,CAAC;EAAE;;EAE5D;EACAO,sBAAsB,EAAEP,QAAQ,CAAC,4BAA4B,CAAC;EAAE;EAChEQ,qBAAqB,EAAGR,QAAQ,CAAC,2BAA2B,CAAC;EAAG;;EAEhE;EACAS,gCAAgC,EAAET,QAAQ,CAAC,kCAAkC,CAAC;EAAE;EAChFU,kCAAkC,EAAEV,QAAQ,CAAC,oCAAoC,CAAC;EAAG;;EAErFW,kCAAkC,EAAEX,QAAQ,CAAC,oCAAoC,CAAC;EAClFY,oCAAoC,EAAEZ,QAAQ,CAAC,sCAAsC,CAAC;EAEtFa,8BAA8B,EAAEb,QAAQ,CAAC,gCAAgC,CAAC;EAC1Ec,gCAAgC,EAAEd,QAAQ,CAAC,kCAAkC,CAAC;EAE9Ee,uBAAuB,EAAEf,QAAQ,CAAC,yBAAyB,CAAC;EAC5DgB,oBAAoB,EAAEhB,QAAQ,CAAC,sBAAsB,CAAC;EACtDiB,qBAAqB,EAAEjB,QAAQ,CAAC,uBAAuB,CAAC;EAExD;EACAkB,oBAAoB,EAAE;AACxB,CAAC;;AAED;AACA,IAAMC,iBAAiB,GAAAC,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAAA,eAAA,UAAAC,MAAA,CACfnB,SAAS,gBAAAmB,MAAA,CAAcrB,QAAQ,CAAC,wBAAwB,CAAC,SAAAqB,MAAA,CACzDnB,SAAS,wBAAAmB,MAAA,CAAsBrB,QAAQ,CAAC,wBAAwB,CAAC,SAAAqB,MAAA,CACjEnB,SAAS,yBAAAmB,MAAA,CAAuBrB,QAAQ,CAAC,yBAAyB,CAAC,SAAAqB,MAAA,CACnEnB,SAAS,yBAAAmB,MAAA,CAAuBjB,YAAY,CAACc,oBAAoB,EACxE;AAED,SACEd,YAAY,EACZe,iBAAiB;AAGnB,eAAef,YAAY"}

package/es/components/IconButton/index.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import './style/index.less';
+export type Size = 'medium' | 'small';
+export interface IconButtonProps {
+    prefixCls?: string;
+    name: string;
+    color?: string;
+    size?: Size | string | number;
+    style?: React.CSSProperties;
+    className?: string;
+    inverse?: boolean;
+    disabled?: boolean;
+    loading?: boolean;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseDown?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseEnter?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseLeave?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    [key: string]: any;
+}
+declare const IconButton: React.FC<IconButtonProps>;
+import IconButtonGroup from '../IconButtonGroup';
+export { IconButtonGroup };
+export default IconButton;

package/es/components/IconButton/index.js

@@ -0,0 +1,107 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["prefixCls", "size", "disabled", "loading", "style", "className", "onMouseDown", "onClick", "onMouseEnter", "onMouseLeave"];
+import Icon from "../Icon";
+import { Theme, useStyleRegister } from '@ant-design/cssinjs';
+import classNames from 'classnames';
+import React from 'react';
+import { cssClasses } from "../../constants";
+import { noop } from "../../utils/noop";
+import { designTokens, otherDesignTokens } from "./designTokens";
+
+// 这种是另一方 定制 antd 的 style 的方式； 现在使用了上面的 designTokens.ts 的方式。
+import "./style/index.less";
+
+// 定义设计令牌类型
+
+// 定义派生令牌类型
+
+// 定义派生函数
+var derivativeFunc = function derivativeFunc(token) {
+  return {
+    buttonColor: token.primaryColor,
+    buttonFontSize: token.fontSize * 1.2
+  };
+};
+
+// 创建主题
+var theme = new Theme(derivativeFunc);
+var IconButton = function IconButton(props) {
+  var _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? cssClasses.PREFIX + '-icon-button' : _props$prefixCls,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'medium' : _props$size,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
+    style = props.style,
+    className = props.className,
+    _props$onMouseDown = props.onMouseDown,
+    onMouseDown = _props$onMouseDown === void 0 ? noop : _props$onMouseDown,
+    _props$onClick = props.onClick,
+    onClick = _props$onClick === void 0 ? noop : _props$onClick,
+    _props$onMouseEnter = props.onMouseEnter,
+    onMouseEnter = _props$onMouseEnter === void 0 ? noop : _props$onMouseEnter,
+    _props$onMouseLeave = props.onMouseLeave,
+    onMouseLeave = _props$onMouseLeave === void 0 ? noop : _props$onMouseLeave,
+    restProps = _objectWithoutProperties(props, _excluded);
+  console.log('IconButton', props);
+
+  // 获取图标尺寸
+  var getIconSize = function getIconSize() {
+    if (size === 'medium') {
+      return designTokens.sizingIconButtonMedium;
+    } else if (size === 'small') {
+      return designTokens.sizingIconButtonSmall;
+    }
+    return designTokens.sizingIconButtonMedium;
+  };
+
+  // 处理点击事件
+  var handleClick = function handleClick(e) {
+    if (disabled || loading) {
+      return;
+    }
+    onClick === null || onClick === void 0 || onClick(e);
+  };
+
+  // 使用 useStyleRegister 注册自定义样式
+  var useCustomIconButtonStyle = function useCustomIconButtonStyle() {
+    var iconSize = getIconSize();
+    console.log('iconSize', iconSize);
+    var gap = size === 'medium' ? designTokens.spacingIconButtonHorizontalGap : designTokens.spacingIconButtonHorizontalGapSm;
+    var hashId = useStyleRegister({
+      theme: theme,
+      token: {},
+      path: [prefixCls]
+    }, function () {
+      return "\n      .".concat(prefixCls, "-container {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        // width: ").concat(iconSize, "px;\n        // height: ").concat(iconSize, "px;\n        cursor: ").concat(disabled ? 'not-allowed' : 'pointer', ";\n        opacity: ").concat(disabled ? 0.5 : 1, ";\n        transition: ").concat(designTokens.transitionIconButton, ";\n      }\n\n      .").concat(prefixCls, "-medium {\n        width: ").concat(designTokens.sizingIconButtonMedium, "px;\n        height: ").concat(designTokens.sizingIconButtonMedium, "px;\n        padding:  ").concat(designTokens.spacingIconButtonPaddingHorizontal, "px ").concat(designTokens.spacingIconButtonPaddingVertical, "px;\n      }\n\n      .").concat(prefixCls, "-small {\n        width: ").concat(designTokens.sizingIconButtonSmall, "px;\n        height: ").concat(designTokens.sizingIconButtonSmall, "px;\n        padding: ").concat(designTokens.spacingIconButtonPaddingHorizontalSm, "px ").concat(designTokens.spacingIconButtonPaddingVerticalSm, "px;\n      }\n\n      .").concat(prefixCls, "-container:hover {\n        opacity: 0.8;\n        color: ").concat(designTokens.colorIconButtonHover, ";\n      }\n\n      .").concat(prefixCls, "-container:active {\n        opacity: 0.7;\n        color: ").concat(designTokens.colorIconButtonActive, ";\n      }\n\n      .").concat(prefixCls, "-loading .anticon {\n        animation: loadingCircle 1s infinite linear;\n      }\n\n      .").concat(prefixCls, "-group {\n        gap: ").concat(gap, "px;\n      }\n\n      .").concat(prefixCls, "-group .").concat(prefixCls, "-medium + .").concat(prefixCls, "-medium {\n        padding-left: ").concat(designTokens.spacingIconButtonHorizontalGap, "px;\n      }\n\n      .").concat(prefixCls, "-group .").concat(prefixCls, "-small + .").concat(prefixCls, "-small {\n        padding-left: ").concat(designTokens.spacingIconButtonHorizontalGapSm, "px;\n      }\n    ");
+    });
+    return hashId;
+  };
+  var hashId = useCustomIconButtonStyle();
+  var iconSize = getIconSize();
+  return /*#__PURE__*/_jsx("div", {
+    className: classNames("".concat(prefixCls, " ").concat(prefixCls, "-container ").concat(prefixCls, "-").concat(size, " ").concat(loading ? "".concat(prefixCls, "-loading") : ''), hashId, className),
+    style: style,
+    onClick: handleClick,
+    onMouseDown: onMouseDown,
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    children: /*#__PURE__*/_jsx(Icon, _objectSpread(_objectSpread({}, restProps), {}, {
+      size: iconSize,
+      style: _objectSpread({}, otherDesignTokens)
+    }))
+  });
+};
+
+// 导入IconButtonGroup组件
+import IconButtonGroup from "../IconButtonGroup";
+import { jsx as _jsx } from "react/jsx-runtime";
+// 导出组件
+export { IconButtonGroup };
+
+// 默认导出
+export default IconButton;
+//# sourceMappingURL=index.js.map