@digitalc/dxp-ui 0.0.5-alpha.15 → 0.0.5-alpha.17

package/lib/components/Text/index.js

@@ -1,6 +1,8 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
@@ -18,6 +20,7 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -67,13 +70,15 @@ var import_constants = require("../../constants");
 var import_style = require("./style/index.less");
 var Text = (props) => {
   const _a = props, {
+    color,
     children,
-    className,
+    className = "",
     size = "ContentC14Bold",
     prefixCls = import_constants.cssClasses.PREFIX + "-text",
     style,
     breakpoint = "Mobile"
   } = _a, attr = __objRest(_a, [
+    "color",
     "children",
     "className",
     "size",
@@ -81,56 +86,55 @@ var Text = (props) => {
     "style",
     "breakpoint"
   ]);
+  const otherDesignTokens = (0, import_designTokens.useOtherDesignTokens)();
   const {
     fontSizeDesktopTitleT23,
-    // fontSizeDesktopContentC15,
-    // fontSizeDesktopContentC21,
+    fontSizeDesktopContentC15,
+    fontSizeDesktopContentC21,
+    fontSizeDesktopContentC23,
     fontSizeDesktopTitleT21,
+    fontSizeDesktopTitleT34,
+    fontSizeDesktopTitleT16,
     fontSizeDesktopTitleT15,
+    fontSizeDesktopTitleT14,
+    fontSizeDesktopTitleT13,
+    fontSizeDesktopTitleT12,
     fontSizeDesktopContentC13,
-    // fontSizeDesktopContentC11,
     fontSizeDesktopContentC12,
     fontSizeDesktopContentC14,
-    // fontSizeDesktopTitleT1,
     fontSizeDesktopTitleT32,
     fontSizeDesktopTitleT41,
-    // fontSizeDesktopContentC05,
-    // fontSizeDesktopContentC04,
-    // fontSizeDesktopTitleT7,
-    // fontSizeDesktopTitleT8,
-    // fontSizeDesktopTitleT2,
-    // fontSizeDesktopTitleT5,
-    // fontSizeDesktopTitleT3,
-    // fontSizeDesktopTitleT4,
-    // fontSizeDesktopTitleT10,
-    // fontSizeMobileContentC04,
-    // fontSizeMobileContentC05,
-    // fontSizeMobileContentC11,
     fontSizeMobileContentC12,
     fontSizeMobileContentC13,
     fontSizeMobileContentC14,
-    // fontSizeMobileContentC15,
-    // fontSizeMobileContentC21,
-    // fontSizeMobileTitleT12,
-    // fontSizeMobileTitleT13,
-    // fontSizeMobileTitleT14,
+    fontSizeMobileContentC15,
+    fontSizeMobileContentC21,
+    fontSizeMobileContentC23,
+    fontSizeMobileTitleT12,
+    fontSizeMobileTitleT13,
+    fontSizeMobileTitleT14,
     fontSizeMobileTitleT15,
+    fontSizeMobileTitleT16,
     fontSizeMobileTitleT21,
     fontSizeMobileTitleT23,
-    // fontSizeMobileTitleT24,
-    // fontSizeMobileTitleT25,
     fontSizeMobileTitleT32,
-    // fontSizeMobileTitleT34,
+    fontSizeMobileTitleT34,
     fontSizeMobileTitleT41,
-    // fontSizeMobileTitleT45,
-    // fontSizeMobileNavigation,
-    // fontFamilyPromaryRegular,
-    // fontFamilyPromarySemiBold,
+    fontSizeMobileNavigation,
     fontFamilyPromaryBold,
     fontFamilySecondaryRegular,
     fontFamilySecondarySemiBold,
-    fontFamilySecondaryBold
-  } = import_designTokens.otherDesignTokens;
+    fontFamilySecondaryBold,
+    lineHeightT15M,
+    lineHeightT16M,
+    lineHeightC21M,
+    lineHeightC14,
+    lineHeightC15M,
+    lineHeightC15,
+    lineHeightC21,
+    lineHeightT15,
+    lineHeightT16
+  } = otherDesignTokens;
   const fontFamilyMap = {
     fontFamilyPromaryRegular: "Regular",
     fontFamilyPromarySemiBold: "SemiBold",
@@ -142,271 +146,376 @@ var Text = (props) => {
   const useCustomButtonStyle = () => {
     const hashId = (0, import_cssinjs.useStyleRegister)({
       theme: import_theme.theme,
-      token: { baseColor: "blue" },
+      token: {},
       path: [`${prefixCls}-size`]
     }, () => `
-      .${prefixCls}-mobile.${prefixCls}-size-TitleT41Bold {
-        font-size: ${fontSizeMobileTitleT41};
-        line-height: 1.2;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        // font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-TitleT32Bold {
-        font-size: ${fontSizeMobileTitleT32};
-        line-height: 1.2;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-TitleT23Bold {
-        font-size: ${fontSizeMobileTitleT23};
-        line-height: 1.2;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-TitleT21Bold {
-        font-size: ${fontSizeMobileTitleT21};
-        line-height: 1.25;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-TitleT15Bold {
-        font-size: ${fontSizeMobileTitleT15};
-        line-height: 1.25;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC14Bold {
-        font-size: ${fontSizeMobileContentC14};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC14Regular {
-        font-size: ${fontSizeMobileContentC14};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC14Strikethrough {
-        color: #757575;
-        font-size: ${fontSizeMobileContentC14};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        text-decoration: line-through;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC14TextLink {
-        color: #4E28E8;
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeMobileContentC14};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC13Bold {
-        font-size: ${fontSizeMobileContentC13};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC13Regular {
-        font-size: ${fontSizeMobileContentC13};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC13Strikethrough {
-        color: #757575;
-        font-size: ${fontSizeMobileContentC13};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        text-decoration: line-through;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC13TextLink {
-        color: #4E28E8;
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeMobileContentC13};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC12Regular {
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        font-size: ${fontSizeMobileContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC12Strikethrough {
-        color: #757575;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        font-size: ${fontSizeMobileContentC12};
-        line-height: 1.5;
-        text-decoration: line-through;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC12SemiBold {
-        font-family: ${fontFamilySecondarySemiBold}-${fontFamilyMap.fontFamilySecondarySemiBold};
-        font-weight: bold;
-        font-size: ${fontSizeMobileContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC12Bold {
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeMobileContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-mobile.${prefixCls}-size-ContentC12TextLink  {
-        color: #4E28E8;
-        font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeMobileContentC12};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-TitleT41Bold {
-        font-size: ${fontSizeDesktopTitleT41};
-        line-height: 1.2;
-        font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-TitleT32Bold {
-        font-size: ${fontSizeDesktopTitleT32};
-        line-height: 1.2;
-        font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-TitleT23Bold {
-        font-size: ${fontSizeDesktopTitleT23};
-        line-height: 1.2;
-        font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-TitleT21Bold {
-        font-size: ${fontSizeDesktopTitleT21};
-        line-height: 1.25;
-        font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-TitleT15Bold {
-        font-size: ${fontSizeDesktopTitleT15};
-        line-height: 1.25;
-        font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC14Bold {
-        font-size: ${fontSizeDesktopContentC14};
-        line-height: 1.5;
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC14Regular {
-        font-size: ${fontSizeDesktopContentC14};
-        line-height: 1.5;
-        font-family:  ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC14Strikethrough {
-        color: #757575;
-        font-size: ${fontSizeDesktopContentC14};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        text-decoration: line-through;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC14TextLink {
-        color: #4E28E8;
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeDesktopContentC14};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC13Bold {
-        font-size: ${fontSizeDesktopContentC13};
-        line-height: 1.5;
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC13Regular {
-        font-size: ${fontSizeDesktopContentC13};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC13Strikethrough {
-        color: #757575;
-        font-size: ${fontSizeDesktopContentC13};
-        line-height: 1.5;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        text-decoration: line-through;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC13TextLink {
-        color: #4E28E8;
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeDesktopContentC13};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC12Regular {
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        font-size: ${fontSizeDesktopContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.1px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC12Strikethrough {
-        color: #757575;
-        font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
-        font-weight: normal;
-        font-size: ${fontSizeDesktopContentC12};
-        line-height: 1.5;
-        text-decoration: line-through;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC12SemiBold {
-        font-family: ${fontFamilySecondarySemiBold}-${fontFamilyMap.fontFamilySecondarySemiBold};
-        font-weight: bold;
-        font-size: ${fontSizeDesktopContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC12Bold {
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeDesktopContentC12};
-        line-height: 1.5;
-        letter-spacing: 0.2px;
-      }
-      .${prefixCls}-desktop.${prefixCls}-size-ContentC12TextLink  {
-        color: #4E28E8;
-        font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
-        font-weight: bold;
-        font-size: ${fontSizeDesktopContentC12};
-        line-height: 1.5;
-        text-decoration: underline;
-        letter-spacing: 0.2px;
+      .${prefixCls}-mobile {
+        &.${prefixCls}-size-NavigationBold {
+          font-size: ${fontSizeMobileNavigation};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT41Bold {
+          font-size: ${fontSizeMobileTitleT41};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT34Bold {
+          font-size: ${fontSizeMobileTitleT34};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT32Bold {
+          font-size: ${fontSizeMobileTitleT32};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT23Bold {
+          font-size: ${fontSizeMobileTitleT23};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT21Bold {
+          font-size: ${fontSizeMobileTitleT21};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT16Bold {
+          font-size: ${fontSizeMobileTitleT16};
+          line-height: ${lineHeightT16M};
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT15Bold {
+          font-size: ${fontSizeMobileTitleT15};
+          line-height: ${lineHeightT15M};
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT14Bold {
+          font-size: ${fontSizeMobileTitleT14};
+          line-height: 1.5;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT13Bold {
+          font-size: ${fontSizeMobileTitleT13};
+          line-height: 1.5;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT12Bold {
+          font-size: ${fontSizeMobileTitleT12};
+          line-height: 1.5;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC23Bold {
+          font-size: ${fontSizeMobileContentC23};
+          line-height: 1.25;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC21Bold {
+          font-size: ${fontSizeMobileContentC21};
+          line-height: ${lineHeightC21M};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC15Bold {
+          font-size: ${fontSizeMobileContentC15};
+          line-height: ${lineHeightC15M};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC14Bold {
+          font-size: ${fontSizeMobileContentC14};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC14Regular {
+          font-size: ${fontSizeMobileContentC14};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC14Strikethrough {
+          color: #757575;
+          font-size: ${fontSizeMobileContentC14};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          text-decoration: line-through;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC14TextLink {
+          color: #4E28E8;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeMobileContentC14};
+          line-height: 1.5;
+          text-decoration: underline;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13Bold {
+          font-size: ${fontSizeMobileContentC13};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC13Regular {
+          font-size: ${fontSizeMobileContentC13};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13Strikethrough {
+          color: #757575;
+          font-size: ${fontSizeMobileContentC13};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          text-decoration: line-through;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13TextLink {
+          color: #4E28E8;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeMobileContentC13};
+          line-height: 1.5;
+          text-decoration: underline;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC12Regular {
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          font-size: ${fontSizeMobileContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC12Strikethrough {
+          color: #757575;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          font-size: ${fontSizeMobileContentC12};
+          line-height: 1.5;
+          text-decoration: line-through;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12SemiBold {
+          font-family: ${fontFamilySecondarySemiBold}-${fontFamilyMap.fontFamilySecondarySemiBold};
+          font-weight: bold;
+          font-size: ${fontSizeMobileContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12Bold {
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeMobileContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12TextLink  {
+          color: #4E28E8;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeMobileContentC12};
+          line-height: 1.5;
+          text-decoration: underline;
+          letter-spacing: 0.2px;
+        }
+      }
+      .${prefixCls}-desktop {
+        &.${prefixCls}-size-TitleT41Bold {
+          font-size: ${fontSizeDesktopTitleT41};
+          line-height: 1.25;
+          font-family: ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT34Bold {
+          font-size: ${fontSizeDesktopTitleT34};
+          line-height: 1.25;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT32Bold {
+          font-size: ${fontSizeDesktopTitleT32};
+          line-height: 1.25;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT23Bold {
+          font-size: ${fontSizeDesktopTitleT23};
+          line-height: 1.25;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT21Bold {
+          font-size: ${fontSizeDesktopTitleT21};
+          line-height: 1.25;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT16Bold {
+          font-size: ${fontSizeDesktopTitleT16};
+          line-height: ${lineHeightT16};
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT15Bold {
+          font-size: ${fontSizeDesktopTitleT15};
+          line-height: ${lineHeightT15};
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT14Bold {
+          font-size: ${fontSizeDesktopTitleT14};
+          line-height: 1.5;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT13Bold {
+          font-size: ${fontSizeDesktopTitleT13};
+          line-height: 1.5;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-TitleT12Bold {
+          font-size: ${fontSizeDesktopTitleT12};
+          line-height: 1.5;
+          font-family:  ${fontFamilyPromaryBold}-${fontFamilyMap.fontFamilyPromaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC23Bold {
+          font-size: ${fontSizeDesktopContentC23};
+          line-height: 1.25;
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC21Bold {
+          font-size: ${fontSizeDesktopContentC21};
+          line-height: ${lineHeightC21};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC15Bold {
+          font-size: ${fontSizeDesktopContentC15};
+          line-height: ${lineHeightC15};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC14Bold {
+          font-size: ${fontSizeDesktopContentC14};
+          line-height: ${lineHeightC14};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC14Regular {
+          font-size: ${fontSizeDesktopContentC14};
+          line-height: ${lineHeightC14};
+          font-family:  ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC14Strikethrough {
+          color: #757575;
+          font-size: ${fontSizeDesktopContentC14};
+          line-height: ${lineHeightC14};
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          text-decoration: line-through;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC14TextLink {
+          color: #4E28E8;
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeDesktopContentC14};
+          line-height: ${lineHeightC14};
+          text-decoration: underline;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13Bold {
+          font-size: ${fontSizeDesktopContentC13};
+          line-height: 1.5;
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+        }
+        &.${prefixCls}-size-ContentC13Regular {
+          font-size: ${fontSizeDesktopContentC13};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13Strikethrough {
+          color: #757575;
+          font-size: ${fontSizeDesktopContentC13};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          text-decoration: line-through;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC13TextLink {
+          color: #4E28E8;
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeDesktopContentC13};
+          line-height: 1.5;
+          text-decoration: underline;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC12Regular {
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          font-size: ${fontSizeDesktopContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.1px;
+        }
+        &.${prefixCls}-size-ContentC12Strikethrough {
+          color: #757575;
+          font-family: ${fontFamilySecondaryRegular}-${fontFamilyMap.fontFamilySecondaryRegular};
+          font-weight: normal;
+          font-size: ${fontSizeDesktopContentC12};
+          line-height: 1.5;
+          text-decoration: line-through;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12SemiBold {
+          font-family: ${fontFamilySecondarySemiBold}-${fontFamilyMap.fontFamilySecondarySemiBold};
+          font-weight: bold;
+          font-size: ${fontSizeDesktopContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12Bold {
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeDesktopContentC12};
+          line-height: 1.5;
+          letter-spacing: 0.2px;
+        }
+        &.${prefixCls}-size-ContentC12TextLink  {
+          color: #4E28E8;
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-weight: bold;
+          font-size: ${fontSizeDesktopContentC12};
+          line-height: 1.5;
+          text-decoration: underline;
+          letter-spacing: 0.2px;
+        }
       }
     `);
     return hashId;
@@ -420,12 +529,13 @@ var Text = (props) => {
       },
       breakpoint === "Desktop" ? `${prefixCls}-desktop` : `${prefixCls}-mobile`,
       className
-    ),
-    style
+    )
   };
   return /* @__PURE__ */ import_react.default.createElement(
     "span",
-    __spreadValues(__spreadValues({}, baseProps), attr),
+    __spreadValues(__spreadProps(__spreadValues({}, baseProps), {
+      style: __spreadValues({ color }, style)
+    }), attr),
     children
   );
 };