@digitalc/dxp-ui 0.0.4 → 0.0.5-alpha-gomo.1

package/es/components/TextInputInside/designTokens.js

@@ -0,0 +1,59 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { getToken } from "../../utils/tokenHelper";
+import { cssClasses } from "../../constants";
+var prefixCls = cssClasses.PREFIX + '-modal';
+var designTokens = {
+  borderRadius: getToken('borderRadiusInput'),
+  // 圆角
+  // paddingBlock: getToken('spacingInputPaddingVertical'), // 纵向内边距
+  paddingInline: getToken('spacingInputPaddingHorizontal'),
+  // 横向内边距
+  colorText: getToken('colorInputTextActive'),
+  // 内容文本颜色
+  colorBorder: 'transparent',
+  // 边框颜色
+  hoverBorderColor: 'transparent',
+  // 边框颜色
+  activeBorderColor: 'transparent',
+  // 边框颜色
+  activeShadow: '',
+  // 边框shadow颜色
+  colorError: 'transparent',
+  // 错误边框颜色
+  colorBgContainer: getToken('colorInputBackground'),
+  // 背景颜色
+  colorBgContainerDisabled: getToken('colorInputBackgroundHaze') // 背景颜色
+};
+var otherDesignTokens = {
+  hoverBorderColor: getToken('colorInputBorderActive'),
+  // hover边框颜色
+  activeBorderColor: getToken('colorInputBorderActive'),
+  // active边框颜色
+  paddingBlock: getToken('spacingInputPaddingVerticalLg'),
+  // 纵向内边距
+  colorLabelActive: getToken('colorInputTextLabelActive'),
+  // label激活状态的颜色
+  colorLabel: getToken('colorInputTextLabel'),
+  // label文本颜色
+  width: "calc(100vw - ".concat(getToken('spacingModalPaddingHorizontal'), "px - ").concat(getToken('spacingModalPaddingHorizontal'), "px)"),
+  // 宽度
+  colorError: getToken('colorInputTextError'),
+  // 错误信息文本颜色
+  iconPaddingLeft: getToken('spacingInputIconPaddingLeft'),
+  // 错误信息文本颜色
+  colorInputIconStandard: getToken('colorInputIconStandard'),
+  // 标准icon颜色
+  spacingInputTextHintMessagePaddingTop: getToken('spacingInputTextHintMessagePaddingTop'),
+  // 错误信息文本颜色
+  colorInputTextHintMessage: getToken('colorInputTextHintMessage'),
+  // 信息文本颜色
+  colorInputTextCounter: getToken('colorInputTextCounter'),
+  // 字数统计文本颜色
+  colorErrorBorder: getToken('colorInputBorderError'),
+  // error颜色
+  colorInputBackgroundHaze: getToken('colorInputBackgroundHaze') // 背景颜色
+};
+var commonToken = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "--".concat(prefixCls, "-header-margin-bottom"), 0), "--".concat(prefixCls, "-footer-margin-top"), 0), "--".concat(prefixCls, "-footer-padding"), "".concat(getToken('spacingModalButtonPaddingTop'), "px 0 0")), "--".concat(prefixCls, "-body-padding"), "".concat(getToken('spacingModalCardVerticalGap'), "px 0"));
+var styleToken = _defineProperty(_defineProperty(_defineProperty({}, "--".concat(prefixCls, "-content-padding"), "".concat(getToken('spacingModalCardPaddingTop'), "px ").concat(getToken('spacingModalCardPaddingHorizontal'), "px ").concat(getToken('spacingModalCardPaddingBottom'), "px ").concat(getToken('spacingModalCardPaddingHorizontal'), "px")), "--".concat(prefixCls, "-footer-border-top"), 'none'), "--".concat(prefixCls, "-footer-padding"), '0px');
+var stickyStyleToken = _defineProperty(_defineProperty(_defineProperty({}, "--".concat(prefixCls, "-content-padding"), "".concat(getToken('spacingModalCardPaddingTop'), "px ").concat(getToken('spacingModalCardPaddingHorizontal'), "px ").concat(40 + getToken('spacingModalButtonStickyPaddingVertical') + getToken('spacingModalButtonStickyPaddingHorizontal'), "px ").concat(getToken('spacingModalCardPaddingHorizontal'), "px")), "--".concat(prefixCls, "-footer-padding"), "".concat(getToken('spacingModalButtonStickyPaddingVertical'), "px ").concat(getToken('spacingModalButtonStickyPaddingHorizontal'), "px")), "--".concat(prefixCls, "-footer-border-top"), '1px solid #E1E1E1');
+export { designTokens, otherDesignTokens, styleToken, stickyStyleToken, commonToken };

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import './style/index.less';
+export type InputType = 'default' | 'search' | 'link' | 'image' | 'counter';
+export interface TextInputInsideProps {
+    type?: InputType;
+    style?: React.CSSProperties;
+    [key: string]: any;
+}
+declare const TextInputInside: (props: TextInputInsideProps) => React.JSX.Element;
+export default TextInputInside;

package/es/components/TextInputInside/index.js

@@ -0,0 +1,141 @@
+import "antd/es/config-provider/style";
+import _ConfigProvider from "antd/es/config-provider";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["label", "message", "status", "type", "image", "count", "value", "disabled"];
+import React, { useState, useRef } from 'react';
+import { useStyleRegister } from '@ant-design/cssinjs';
+import { theme } from "../../utils/theme";
+import { cssClasses } from "../../constants";
+import { designTokens, otherDesignTokens } from "./designTokens";
+import Text from "../Text";
+import Icon from "../Icon";
+import "./style/index.less";
+import { isEmpty } from 'lodash';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+var TextInputInside = function TextInputInside(props) {
+  var label = props.label,
+    message = props.message,
+    status = props.status,
+    type = props.type,
+    image = props.image,
+    count = props.count,
+    value = props.value,
+    disabled = props.disabled,
+    attr = _objectWithoutProperties(props, _excluded);
+  var paddingInline = designTokens.paddingInline,
+    colorBgContainer = designTokens.colorBgContainer,
+    borderRadius = designTokens.borderRadius;
+  var paddingBlock = otherDesignTokens.paddingBlock,
+    colorLabel = otherDesignTokens.colorLabel,
+    colorLabelActive = otherDesignTokens.colorLabelActive,
+    colorError = otherDesignTokens.colorError,
+    colorErrorBorder = otherDesignTokens.colorErrorBorder,
+    iconPaddingLeft = otherDesignTokens.iconPaddingLeft,
+    colorInputIconStandard = otherDesignTokens.colorInputIconStandard,
+    spacingInputTextHintMessagePaddingTop = otherDesignTokens.spacingInputTextHintMessagePaddingTop,
+    hoverBorderColor = otherDesignTokens.hoverBorderColor,
+    activeBorderColor = otherDesignTokens.activeBorderColor,
+    colorInputTextHintMessage = otherDesignTokens.colorInputTextHintMessage,
+    colorInputTextCounter = otherDesignTokens.colorInputTextCounter,
+    colorInputBackgroundHaze = otherDesignTokens.colorInputBackgroundHaze;
+  var inputRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    focus = _useState2[0],
+    setFocus = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    val = _useState4[0],
+    setVal = _useState4[1];
+  var prefix = "".concat(cssClasses.PREFIX, "-textInput");
+  var useCustomButtonStyle = function useCustomButtonStyle() {
+    var hashId = useStyleRegister({
+      theme: theme,
+      token: {
+        baseColor: 'blue'
+      },
+      path: ["".concat(prefix)]
+    }, function () {
+      return "\n      .".concat(prefix, " {\n        height: ").concat(paddingBlock * 2 + 24, "px;\n        background: ").concat(colorBgContainer, ";\n        padding: ").concat(paddingBlock, "px ").concat(paddingInline, "px;\n        border-radius: ").concat(borderRadius, "px;\n        border: 1px solid #fff;\n      }\n      .").concat(prefix, ":hover {\n        border-color: ").concat(hoverBorderColor, ";\n      }\n      .").concat(prefix, ":active {\n        border-color: ").concat(activeBorderColor, ";\n      }\n      .").concat(prefix, "-label {\n        color: ").concat(colorLabel, ";\n      }\n      .").concat(prefix, "-focus .").concat(prefix, "-label {\n        top: 7px;\n        color: ").concat(colorLabelActive, ";\n      }\n      .").concat(prefix, "-has-search {\n        padding-right: ").concat(paddingInline + iconPaddingLeft + 24, "px;\n      }\n      .").concat(prefix, "-focus {\n        padding-top: 30px;\n        padding-bottom: 10px;\n      }\n      .").concat(prefix, "-error {\n        border: 1px solid ").concat(colorErrorBorder, ";\n      }\n      .").concat(prefix, "-error:hover {\n        border-color: ").concat(colorErrorBorder, ";\n      }\n      .").concat(prefix, "-error:active {\n        border-color: ").concat(colorErrorBorder, ";\n      }\n      .").concat(prefix, "-tips {\n        bottom: -").concat(spacingInputTextHintMessagePaddingTop + 18, "px;\n        color: ").concat(colorInputTextHintMessage, ";\n      }\n      .").concat(prefix, "-error-tips {\n        color: ").concat(colorError, ";\n      }\n      .").concat(prefix, "-right {\n        right: ").concat(paddingInline, "px;\n        color: ").concat(colorInputIconStandard, ";\n        top: ").concat(paddingBlock, "px;\n        line-height: 1;\n      }\n     .").concat(prefix, "-count {\n        color: ").concat(colorInputTextCounter, ";\n      }\n     .").concat(prefix, "-disabled {\n        background: ").concat(colorInputBackgroundHaze, ";\n        border-color: ").concat(colorInputBackgroundHaze, ";\n      }\n      .").concat(prefix, "-disabled:hover {\n        border-color: ").concat(colorInputBackgroundHaze, ";\n      }\n      .").concat(prefix, "-disabled:active {\n        border-color: ").concat(colorInputBackgroundHaze, ";\n      }\n    ");
+    });
+    return hashId;
+  };
+  useCustomButtonStyle();
+  var error = status === 'error' ? "".concat(prefix, "-error") : '';
+  var disabledStyle = disabled ? "".concat(prefix, "-disabled") : '';
+  var focusStyle = focus || value ? "".concat(prefix, "-focus") : '';
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsx(_ConfigProvider, {
+      wave: {
+        disabled: true
+      },
+      prefixCls: prefix,
+      theme: {
+        components: {
+          Input: _objectSpread({}, designTokens)
+        },
+        cssVar: true,
+        hashed: false
+      },
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "".concat(prefix, " ").concat(focusStyle, " ").concat(error, " ").concat(disabledStyle),
+        children: [/*#__PURE__*/_jsx("span", {
+          className: "".concat(prefix, "-label"),
+          onClick: function onClick() {
+            inputRef.current.focus({
+              cursor: 'end'
+            });
+            setFocus(true);
+          },
+          children: /*#__PURE__*/_jsx(Text, {
+            size: focus || value ? 'ContentC12SemiBold' : 'ContentC14Regular',
+            children: label
+          })
+        }), /*#__PURE__*/_jsx(_Input, _objectSpread({
+          className: isEmpty(type) ? '' : "".concat(prefix, "-has-search"),
+          onFocus: function onFocus() {
+            setFocus(true);
+          },
+          onBlur: function onBlur() {
+            return setFocus(val ? true : false);
+          },
+          value: val || value,
+          onChange: function onChange(e) {
+            var newValue = e.target.value;
+            // 检查是否存在 count 属性且新值长度是否超过 count
+            if (!count || newValue.length <= count) {
+              setVal(newValue);
+            }
+          },
+          disabled: disabled,
+          ref: inputRef
+        }, attr)), /*#__PURE__*/_jsx(Text, {
+          size: "ContentC12Regular",
+          className: status === 'error' ? "".concat(prefix, "-tips ").concat(prefix, "-error-tips") : "".concat(prefix, "-tips"),
+          children: message
+        }), type === 'search' && /*#__PURE__*/_jsx(Icon, {
+          className: "".concat(prefix, "-right"),
+          size: 24,
+          name: "icon-Search"
+        }), type === 'link' && /*#__PURE__*/_jsx(Text, {
+          size: "ContentC14TextLink",
+          className: "".concat(prefix, "-right"),
+          children: "Link"
+        }), type === 'image' && /*#__PURE__*/_jsx("img", {
+          src: image,
+          alt: "",
+          className: "".concat(prefix, "-right")
+        }), type === 'counter' && /*#__PURE__*/_jsxs(Text, {
+          size: "ContentC12Regular",
+          className: "".concat(prefix, "-count"),
+          children: [(value || val || '').length, "/", count]
+        })]
+      })
+    })
+  });
+};
+export default TextInputInside;

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

@@ -0,0 +1,36 @@
+@import './variables.less';
+
+// 基础按钮样式
+@components: textInput;
+
+// 使用字符串拼接
+.@{prefix}-@{components} {
+  position: relative;
+  box-sizing: border-box;
+  margin-bottom: 22px;
+  .@{prefix}-@{components}-label {
+    position: absolute;
+    z-index: 1;
+  }
+  .@{prefix}-@{components}-input {
+    height: 24px;
+    padding: 0;
+  }
+  .@{prefix}-@{components}-right {
+    position: absolute;
+    z-index: 1;
+  }
+  .@{prefix}-@{components}-tips {
+    position: absolute;
+    left: 0;
+    padding-top: 4px;
+  }
+  .@{prefix}-@{components}-count {
+    position: absolute;
+    right: 0;
+    bottom: -22px;
+  }
+  img {
+    height: 24px;
+  }
+}

package/es/components/TextInputInside/style/variables.less

@@ -0,0 +1,5 @@
+
+@import '../../../style/variables.less';
+
+// Primary Button
+@btn-primary-bg-default: var(--base-color-primary);

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

@@ -0,0 +1,41 @@
+declare const designTokens: {
+    borderRadius: any;
+    paddingBlock: any;
+    paddingInline: any;
+    colorText: any;
+    hoverBorderColor: any;
+    activeBorderColor: any;
+    activeShadow: string;
+    colorError: any;
+    colorBgContainer: any;
+    borderWidthInputStandard: any;
+    colorBorder: any;
+    colorInputTextPlaceholder: any;
+    fontSize: any;
+    colorBgContainerDisabled: any;
+};
+declare const designFormTokens: {
+    labelRequiredMarkColor: any;
+    colorError: any;
+    lineHeight: number;
+    labelHeight: number;
+    labelColor: any;
+    labelFontSize: any;
+    fontSize: any;
+    itemMarginBottom: number;
+};
+declare const designFormHorizontalTokens: {
+    verticalLabelPadding: string;
+    labelRequiredMarkColor: any;
+    colorError: any;
+    labelHeight: string;
+    labelColor: any;
+    lineHeight: number;
+    labelFontSize: any;
+    fontSize: any;
+    itemMarginBottom: number;
+};
+declare const styleToken: {
+    [x: string]: any;
+};
+export { designTokens, designFormTokens, designFormHorizontalTokens, styleToken };

package/es/components/TextInputOutside/designTokens.js

@@ -0,0 +1,67 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { getToken } from "../../utils/tokenHelper";
+import { cssClasses } from "../../constants";
+var prefixCls = cssClasses.PREFIX + '-input-outside';
+var designTokens = {
+  borderRadius: getToken('borderRadiusInput'),
+  // 圆角
+  paddingBlock: getToken('spacinginputpaddingVerticalM'),
+  // 纵向内边距
+  paddingInline: getToken('spacingInputPaddingHorizontal'),
+  // 横向内边距
+  colorText: getToken('colorInputTextActive'),
+  // 内容文本颜色
+  hoverBorderColor: getToken('colorInputBorderActive'),
+  // hover边框颜色
+  activeBorderColor: getToken('colorInputBorderActive'),
+  // active边框颜色
+  activeShadow: '0px 0px 0px 2px #180C8E33',
+  // 边框shadow颜色
+  colorError: getToken('colorInputTextError'),
+  // 错误信息文本颜色
+  colorBgContainer: getToken('colorInputBackground'),
+  // 背景颜色
+  borderWidthInputStandard: getToken('borderWidthInputStandard'),
+  // 标准边框宽度
+  colorBorder: getToken('colorInputBorderStandard'),
+  // 标准边框颜色
+  colorInputTextPlaceholder: getToken('colorInputTextPlaceholder'),
+  // placeholder文本颜色
+  fontSize: getToken('ContentC14Regular'),
+  // 字体大小
+  colorBgContainerDisabled: getToken('colorInputBackgroundHaze') // 背景颜色
+};
+var designFormTokens = {
+  labelRequiredMarkColor: getToken('colorInputTextError'),
+  colorError: getToken('colorInputTextError'),
+  // 错误信息文本颜色
+  lineHeight: 24 / getToken('ContentC14Regular'),
+  // 行高
+  labelHeight: 24 / getToken('ContentC14Regular'),
+  // 行高
+  labelColor: getToken('colorInputTextLabel'),
+  // label文本颜色
+  labelFontSize: getToken('ContentC14Regular'),
+  fontSize: getToken('ContentC14Regular'),
+  // 字体大小
+  itemMarginBottom: 28
+};
+var designFormHorizontalTokens = {
+  verticalLabelPadding: '0 0 8px',
+  labelRequiredMarkColor: getToken('colorInputTextError'),
+  colorError: getToken('colorInputTextError'),
+  // 错误信息文本颜色
+  labelHeight: "".concat(getToken('spacinginputpaddingVerticalM') * 2 + 24, "px"),
+  // label高
+  labelColor: getToken('colorInputTextLabel'),
+  // label文本颜色
+  lineHeight: 24 / getToken('ContentC14Regular'),
+  // 行高
+  labelFontSize: getToken('ContentC14Regular'),
+  fontSize: getToken('ContentC14Regular'),
+  // 字体大小
+  itemMarginBottom: 28
+};
+// --dxp-input-outside-line-height
+var styleToken = _defineProperty({}, "--".concat(prefixCls, "-color-error-border-hover"), getToken('colorInputBorderError'));
+export { designTokens, designFormTokens, designFormHorizontalTokens, styleToken };

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

@@ -0,0 +1,18 @@
+import React from 'react';
+import './style/index.less';
+type FieldType = {
+    [key: string]: any;
+};
+export type InputType = 'default' | 'search' | 'link' | 'image' | 'counter';
+export interface TextInputOutsideProps {
+    name: string;
+    label?: string;
+    rules?: FieldType[];
+    layout?: 'vertical' | 'horizontal';
+    placeholder?: string;
+    type?: InputType;
+    style?: React.CSSProperties;
+    [key: string]: any;
+}
+declare const TextInputOutside: (props: TextInputOutsideProps) => React.JSX.Element;
+export default TextInputOutside;

package/es/components/TextInputOutside/index.js

@@ -0,0 +1,66 @@
+import "antd/es/config-provider/style";
+import _ConfigProvider from "antd/es/config-provider";
+import "antd/es/form/style";
+import _Form from "antd/es/form";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["layout", "placeholder", "disabled"];
+import React from 'react';
+import { useStyleRegister } from '@ant-design/cssinjs';
+import { theme } from "../../utils/theme";
+import { cssClasses } from "../../constants";
+import { designTokens, designFormTokens, designFormHorizontalTokens, styleToken } from "./designTokens";
+import "./style/index.less";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+var TextInputOutside = function TextInputOutside(props) {
+  var _props$layout = props.layout,
+    layout = _props$layout === void 0 ? 'horizontal' : _props$layout,
+    placeholder = props.placeholder,
+    disabled = props.disabled,
+    attr = _objectWithoutProperties(props, _excluded);
+  var prefix = "".concat(cssClasses.PREFIX, "-inputOutside");
+  var useCustomButtonStyle = function useCustomButtonStyle() {
+    var hashId = useStyleRegister({
+      theme: theme,
+      token: {
+        baseColor: 'blue'
+      },
+      path: ["".concat(prefix)]
+    }, function () {
+      return "\n      .".concat(prefix, "-input {\n        height: ").concat(designTokens.paddingBlock * 2 + 24, "px;;\n      }\n    ");
+    });
+    return hashId;
+  };
+  useCustomButtonStyle();
+  var customStyle = styleToken;
+  var formDesign = layout === 'vertical' ? designFormTokens : designFormHorizontalTokens;
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsx(_ConfigProvider, {
+      wave: {
+        disabled: true
+      },
+      prefixCls: prefix,
+      theme: {
+        components: {
+          Input: _objectSpread({}, designTokens),
+          Form: _objectSpread({}, formDesign)
+        },
+        cssVar: true,
+        hashed: false
+      },
+      children: /*#__PURE__*/_jsx(_Form.Item, _objectSpread(_objectSpread({
+        layout: layout,
+        className: prefix
+      }, attr), {}, {
+        children: /*#__PURE__*/_jsx(_Input, {
+          placeholder: placeholder,
+          disabled: disabled,
+          style: _objectSpread({}, customStyle)
+        })
+      }))
+    })
+  });
+};
+export default TextInputOutside;

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

@@ -0,0 +1,4 @@
+@import './variables.less';
+
+// 基础按钮样式
+@components: inputOutside;

package/es/components/TextInputOutside/style/variables.less

@@ -0,0 +1,5 @@
+
+@import '../../../style/variables.less';
+
+// Primary Button
+@btn-primary-bg-default: var(--base-color-primary);

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

@@ -0,0 +1,10 @@
+declare const designTokens: {
+    spacingTextLinkHorizontalGap: any;
+    sizingTextLinkIconLeft: any;
+    sizingTextLinkIconRight: any;
+    colorTextLinkTextInverse: any;
+    colorTextLinkText: any;
+    colorTextLinkIconInverse: any;
+    colorTextLinkIcon: any;
+};
+export default designTokens;

package/es/components/TextLink/designTokens.js

@@ -0,0 +1,11 @@
+import TokenManager from "../../utils/tokenManager";
+var designTokens = {
+  spacingTextLinkHorizontalGap: TokenManager.tokenKey('spacingTextLinkHorizontalGap'),
+  sizingTextLinkIconLeft: TokenManager.tokenKey('sizingTextLinkIconLeft'),
+  sizingTextLinkIconRight: TokenManager.tokenKey('sizingTextLinkIconRight'),
+  colorTextLinkTextInverse: TokenManager.tokenKey('colorTextLinkTextInverse'),
+  colorTextLinkText: TokenManager.tokenKey('colorTextLinkText'),
+  colorTextLinkIconInverse: TokenManager.tokenKey('colorTextLinkIconInverse'),
+  colorTextLinkIcon: TokenManager.tokenKey('colorTextLinkIcon')
+};
+export default designTokens;

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

@@ -0,0 +1,20 @@
+import React from 'react';
+export declare const TextLinkEnum: {
+    readonly default: "default";
+    readonly withLeftIcon: "withLeftIcon";
+    readonly withRightIcon: "withRightIcon";
+    readonly inlineParagraph: "inlineParagraph";
+};
+export type TextLinkType = typeof TextLinkEnum[keyof typeof TextLinkEnum];
+export interface ITextLinkProps {
+    style?: React.CSSProperties;
+    type: TextLinkType;
+    iconName?: string;
+    iconSize?: string | number;
+    text?: string;
+    inverse?: boolean;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    className?: string;
+}
+declare const TextLink: (props: ITextLinkProps) => React.JSX.Element;
+export default TextLink;

package/es/components/TextLink/index.js

@@ -0,0 +1,95 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["text", "style", "iconName", "iconSize", "type", "inverse", "onClick", "className"];
+import React from 'react';
+import Text from "../Text";
+import Icon from "../Icon";
+import designTokens from "./designTokens";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export var TextLinkEnum = {
+  default: 'default',
+  withLeftIcon: 'withLeftIcon',
+  withRightIcon: 'withRightIcon',
+  inlineParagraph: 'inlineParagraph'
+};
+;
+var TextLink = function TextLink(props) {
+  var text = props.text,
+    style = props.style,
+    iconName = props.iconName,
+    iconSize = props.iconSize,
+    _props$type = props.type,
+    type = _props$type === void 0 ? TextLinkEnum.default : _props$type,
+    _props$inverse = props.inverse,
+    inverse = _props$inverse === void 0 ? false : _props$inverse,
+    onClick = props.onClick,
+    className = props.className,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var spacingTextLinkHorizontalGap = designTokens.spacingTextLinkHorizontalGap,
+    sizingTextLinkIconLeft = designTokens.sizingTextLinkIconLeft,
+    sizingTextLinkIconRight = designTokens.sizingTextLinkIconRight,
+    colorTextLinkTextInverse = designTokens.colorTextLinkTextInverse,
+    colorTextLinkText = designTokens.colorTextLinkText,
+    colorTextLinkIconInverse = designTokens.colorTextLinkIconInverse,
+    colorTextLinkIcon = designTokens.colorTextLinkIcon;
+  var colorTextLinkText_ = inverse ? colorTextLinkTextInverse : colorTextLinkText;
+  var colorTextLinkIcon_ = inverse ? colorTextLinkIconInverse : colorTextLinkIcon;
+  var sizingTextLinkIcon = iconSize || 0;
+  if (type === TextLinkEnum.withLeftIcon) {
+    sizingTextLinkIcon = sizingTextLinkIconLeft;
+  } else if (type === TextLinkEnum.withRightIcon) {
+    sizingTextLinkIcon = sizingTextLinkIconRight;
+  }
+  var renderText = function renderText() {
+    return /*#__PURE__*/_jsx(Text, {
+      size: "ContentC14TextLink",
+      style: {
+        color: colorTextLinkText_
+      },
+      children: text
+    });
+  };
+  var renderIcon = function renderIcon() {
+    if (iconName) {
+      return /*#__PURE__*/_jsx(Icon, {
+        name: iconName,
+        size: sizingTextLinkIcon,
+        color: colorTextLinkIcon_,
+        style: type === TextLinkEnum.withLeftIcon ? {
+          marginRight: spacingTextLinkHorizontalGap
+        } : {
+          marginLeft: spacingTextLinkHorizontalGap
+        }
+      });
+    }
+    return null;
+  };
+  var renderContent = function renderContent(type) {
+    switch (type) {
+      case TextLinkEnum.withLeftIcon:
+        return /*#__PURE__*/_jsxs(_Fragment, {
+          children: [renderIcon(), renderText()]
+        });
+      case TextLinkEnum.withRightIcon:
+        return /*#__PURE__*/_jsxs(_Fragment, {
+          children: [renderText(), renderIcon()]
+        });
+      case TextLinkEnum.inlineParagraph:
+        return /*#__PURE__*/_jsxs(_Fragment, {
+          children: [renderText(), renderIcon()]
+        });
+      default:
+        return /*#__PURE__*/_jsx(_Fragment, {
+          children: renderText()
+        });
+    }
+  };
+  return /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
+    style: style,
+    onClick: onClick,
+    className: "".concat(className || '')
+  }, restProps), {}, {
+    children: renderContent(type)
+  }));
+};
+export default TextLink;

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

@@ -0,0 +1,13 @@
+declare const designTokens: {
+    colorText: any;
+    contentBg: any;
+    borderRadiusLG: any;
+    colorWarning: string;
+    colorSuccess: string;
+    colorInfo: string;
+    horizontalGap: string;
+    contentPadding: string;
+    colorLinkText: any;
+    sizingToastIcon: any;
+};
+export { designTokens };

package/es/components/Toast/designTokens.js

@@ -0,0 +1,20 @@
+import { getToken } from "../../utils/tokenHelper";
+var designTokens = {
+  // 算法配置
+  // algorithm: true,
+
+  colorText: getToken('colorToastTextInverse'),
+  contentBg: getToken('colorToastBackground'),
+  borderRadiusLG: getToken('borderRadiusCardSm'),
+  colorWarning: "rgb(255,181,36)",
+  colorSuccess: "rgb(0,179,121)",
+  // 成功状态的颜色
+  colorInfo: "rgb(255,93,118)",
+  horizontalGap: "".concat(getToken('spacingToastPaddingHorizontal'), "px"),
+  contentPadding: "".concat(getToken('spacingToastPaddingHorizontal'), "px ").concat(getToken('spacingToastPaddingVertical'), "px"),
+  colorLinkText: getToken('colorToastTextLinkInverse'),
+  sizingToastIcon: getToken('sizingToastIcon')
+};
+
+// export default designTokens;
+export { designTokens };