@digitalc/dxp-ui 0.0.6-alpha.2 → 0.0.6-alpha.4

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

@@ -4,6 +4,5 @@ declare const useDesignTokens: () => {
     spacingCardPaddingHorizontal: any;
     borderRadius: string;
     colorBackgroundSubtle2: any;
-    colorTextAmount: any;
 };
 export { useDesignTokens };

package/es/components/Card/designTokens.js

@@ -6,8 +6,7 @@ var useDesignTokens = function useDesignTokens() {
     spacingCardPaddingVertical: getToken('spacingCardPaddingVertical'),
     spacingCardPaddingHorizontal: getToken('spacingCardPaddingHorizontal'),
     borderRadius: "".concat(getToken('borderRadiusCardSm'), "px"),
-    colorBackgroundSubtle2: getToken('colorBackgroundSubtle2'),
-    colorTextAmount: getToken('colorAmountTextAmount')
+    colorBackgroundSubtle2: getToken('colorBackgroundSubtle2')
   };
   return designTokens;
 };

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

@@ -4,15 +4,10 @@ export interface CardProps {
     type?: 'default' | 'whiteDivider' | 'grayDivider';
     className?: string;
     children?: ReactNode;
-    list?: {
-        key: number;
-        content: ReactNode;
-    }[];
     style?: React.CSSProperties;
     showShadow?: boolean;
     showBg?: boolean;
     showBorder?: boolean;
-    extraTop?: ReactNode;
     extraBottom?: ReactNode;
     amountLabel?: string;
     amountValue?: ReactNode;

package/es/components/Card/index.js

@@ -1,6 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["className", "prefixCls", "type", "children", "extraTop", "extraBottom", "amountLabel", "amountValue", "showShadow", "showBg", "showBorder", "bgColor", "style"];
+var _excluded = ["className", "prefixCls", "type", "children", "extraBottom", "amountLabel", "amountValue", "showShadow", "showBg", "showBorder", "bgColor", "style"];
 import React from 'react';
 import { useStyleRegister } from '@ant-design/cssinjs';
 import cl from 'classnames';
@@ -18,7 +18,6 @@ var Card = function Card(props) {
     _props$type = props.type,
     type = _props$type === void 0 ? 'default' : _props$type,
     children = props.children,
-    extraTop = props.extraTop,
     extraBottom = props.extraBottom,
     amountLabel = props.amountLabel,
     amountValue = props.amountValue,
@@ -36,8 +35,7 @@ var Card = function Card(props) {
     spacingCardPaddingVertical = designTokens.spacingCardPaddingVertical,
     spacingCardPaddingHorizontal = designTokens.spacingCardPaddingHorizontal,
     borderRadius = designTokens.borderRadius,
-    colorBackgroundSubtle2 = designTokens.colorBackgroundSubtle2,
-    colorTextAmount = designTokens.colorTextAmount;
+    colorBackgroundSubtle2 = designTokens.colorBackgroundSubtle2;
   var useCustomButtonStyle = function useCustomButtonStyle() {
     var hashId = useStyleRegister({
       theme: theme,
@@ -78,7 +76,7 @@ var Card = function Card(props) {
   return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
     className: "".concat(prefixCls, " ").concat(prefixCls, "-").concat(type, " ").concat(className)
   }, attr), {}, {
-    children: [extraTop, /*#__PURE__*/_jsx("div", {
+    children: [/*#__PURE__*/_jsx("div", {
       className: "".concat(prefixCls, "-list"),
       children: children
     }), getAmount()]

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import './style/index.less';
 export type DrawerType = 'DrawerTypeHandler' | 'DrawerTypeCloseBtn' | 'DrawerTypeDefault';
+export type placementType = 'right' | 'bottom';
 export declare const DrawerTypeEnum: Record<string, DrawerType>;
 export interface BottomDrawerProps {
     showClose?: boolean;
@@ -9,7 +10,7 @@ export interface BottomDrawerProps {
     visible: boolean;
     onClose: () => void;
     children: React.ReactNode;
-    height?: number | string;
+    height?: string;
     title?: string;
     drawerType?: DrawerType;
     bottomBtnText?: string;
@@ -22,6 +23,8 @@ export interface BottomDrawerProps {
     onBottomBtnClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
     btnDisabled?: boolean;
     extra?: React.ReactNode;
+    placement?: placementType;
+    width?: string;
 }
 declare const BottomDrawer: React.FC<BottomDrawerProps>;
 export default BottomDrawer;

package/es/components/Drawer/index.js

@@ -24,7 +24,10 @@ var BottomDrawer = function BottomDrawer(_ref) {
     visible = _ref.visible,
     onClose = _ref.onClose,
     children = _ref.children,
-    height = _ref.height,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? '400px' : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 'auto' : _ref$height,
     title = _ref.title,
     _ref$drawerType = _ref.drawerType,
     drawerType = _ref$drawerType === void 0 ? DrawerTypeEnum.DrawerTypeDefault : _ref$drawerType,
@@ -37,7 +40,9 @@ var BottomDrawer = function BottomDrawer(_ref) {
     onLinkClick = _ref.onLinkClick,
     onBottomBtnClick = _ref.onBottomBtnClick,
     btnDisabled = _ref.btnDisabled,
-    extra = _ref.extra;
+    extra = _ref.extra,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'bottom' : _ref$placement;
   var originalBodyOverflow = useRef('');
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -112,7 +117,7 @@ var BottomDrawer = function BottomDrawer(_ref) {
       token: {},
       path: ["".concat(prefix)]
     }, function () {
-      return "\n      .".concat(prefix, "-mask {\n        background: ").concat(colorDrawerBackgroundOverlay, ";\n      }\n      .").concat(prefix, "-content {\n        background: ").concat(colorDrawerBackgroundStandard, ";\n        border-top-left-radius: ").concat(borderTopLeftRadius, "px;\n        border-top-right-radius:").concat(borderTopRightRadius, "px;\n        height:").concat(height, "px;\n      }\n      .").concat(prefix, "-inner {\n        padding-left: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-right: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-bottom:").concat(spacingDrawerPaddingBottom, "px;\n      }\n      .").concat(prefix, "-header {\n        .").concat(prefix, "-header-text {\n          color: ").concat(colorDrawerTextHeader, ";\n          margin-bottom: ").concat(spacingDrawerListOptionHorizontalGap, "px;\n          display: block;\n        }\n        &.center{\n          width: 100%;\n          text-align: center;\n        }\n      }\n      .").concat(prefix, "-handle-bar {\n          width:").concat(sizingDrawerHandle || 0, "px;\n          background: ").concat(colorDrawerHandle, ";\n          margin-top: ").concat(spacingDrawerHandlePaddingTop, "px !important;\n          margin-bottom: ").concat(spacingDrawerHandlePaddingBottom, "px !important;     \n      }\n      .").concat(prefix, "-close-warp {\n        padding-top: ").concat(spacingDrawerPaddingTop, "px;\n        padding-left: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-right: ").concat(spacingDrawerPaddingHorizontal, "px;\n      }\n    ");
+      return "\n      .".concat(prefix, "-mask {\n        background: ").concat(colorDrawerBackgroundOverlay, ";\n      }\n      .").concat(prefix, "-content {\n        background: ").concat(colorDrawerBackgroundStandard, ";\n      }\n      .").concat(prefix, "-inner {\n        padding-left: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-right: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-bottom:").concat(spacingDrawerPaddingBottom, "px;\n      }\n      .").concat(prefix, "-header {\n        .").concat(prefix, "-header-text {\n          color: ").concat(colorDrawerTextHeader, ";\n          margin-bottom: ").concat(spacingDrawerListOptionHorizontalGap, "px;\n          display: block;\n        }\n        &.center{\n          width: 100%;\n          text-align: center;\n        }\n      }\n      .").concat(prefix, "-handle-bar {\n          width:").concat(sizingDrawerHandle || 0, "px;\n          background: ").concat(colorDrawerHandle, ";\n          margin-top: ").concat(spacingDrawerHandlePaddingTop, "px !important;\n          margin-bottom: ").concat(spacingDrawerHandlePaddingBottom, "px !important;     \n      }\n      .").concat(prefix, "-close-warp {\n        padding-top: ").concat(spacingDrawerPaddingTop, "px;\n        padding-left: ").concat(spacingDrawerPaddingHorizontal, "px;\n        padding-right: ").concat(spacingDrawerPaddingHorizontal, "px;\n      }\n      .").concat(prefix, "-bottom {\n        .").concat(prefix, "-content {\n          border-top-left-radius: ").concat(borderTopLeftRadius, "px;\n          border-top-right-radius: ").concat(borderTopRightRadius, "px;\n          height: ").concat(height, ";\n        }\n      }\n      .").concat(prefix, "-right {\n        .").concat(prefix, "-content {\n          border-radius: 0;\n          height: 100%;\n          width: ").concat(width, ";\n          right: 0;\n          left: auto;\n          top: 0;\n          bottom: auto;\n          max-height: 100%;\n        }\n        .dxp-stickyFooter {\n          position: absolute;\n        }\n      }\n    ");
     });
     return hashId;
   };
@@ -136,7 +141,7 @@ var BottomDrawer = function BottomDrawer(_ref) {
     })
   }) : /*#__PURE__*/_jsx("div", {});
   return /*#__PURE__*/_jsx("div", {
-    className: "".concat(prefix, "-mask ").concat(visible ? 'visible' : '', " ").concat(className || ''),
+    className: "".concat(prefix, "-mask ").concat(visible ? 'visible' : '', " ").concat(className || '', " ").concat(prefix, "-").concat(placement),
     onClick: onClose,
     children: /*#__PURE__*/_jsxs("div", {
       className: "".concat(prefix, "-content ").concat(visible ? 'active' : ''),

package/es/components/Modal/index.js

@@ -27,7 +27,7 @@ var Modal = function Modal(props) {
     _props$prefix = props.prefix,
     prefix = _props$prefix === void 0 ? "".concat(cssClasses.PREFIX, "-modal") : _props$prefix,
     _props$footerAlign = props.footerAlign,
-    footerAlign = _props$footerAlign === void 0 ? 'right' : _props$footerAlign,
+    footerAlign = _props$footerAlign === void 0 ? 'center' : _props$footerAlign,
     _props$footer = props.footer,
     footer = _props$footer === void 0 ? null : _props$footer,
     _props$className = props.className,

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

@@ -74,7 +74,6 @@
       background: #fff;
       border-bottom-right-radius: var(~"--@{prefix}-border-radius-lg");
       border-bottom-left-radius: var(~"--@{prefix}-border-radius-lg");
-      text-align: center;
     }
   }
 

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

@@ -9,6 +9,7 @@ export interface ISelectorItemProps {
     children?: React.ReactNode;
     prefix?: string;
     onChange?: () => void;
+    style?: React.CSSProperties;
 }
 declare const SelectorItem: React.FC<ISelectorItemProps>;
 export default SelectorItem;

package/es/components/SelectorItem/index.js

@@ -19,6 +19,7 @@ var SelectorItem = function SelectorItem(props) {
     children = props.children,
     _props$prefix = props.prefix,
     prefix = _props$prefix === void 0 ? "".concat(cssClasses.PREFIX, "-selectorItem") : _props$prefix,
+    style = props.style,
     onChange = props.onChange;
   var designTokens = useDesignTokens();
   var colorSelectorBackground = designTokens.colorSelectorBackground,
@@ -56,6 +57,7 @@ var SelectorItem = function SelectorItem(props) {
         onChange();
       }
     },
+    style: style,
     children: [/*#__PURE__*/_jsx(Icon, {
       className: "select-tick",
       type: "icon-Tick",

package/es/components/Text/index.js

@@ -88,7 +88,7 @@ var Text = function Text(props) {
       token: {},
       path: ["".concat(prefixCls, "-size")]
     }, function () {
-      return "\n      .".concat(prefixCls, "-mobile {\n        &.").concat(prefixCls, "-size-NavigationBold {\n          font-size: ").concat(fontSizeMobileNavigation, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT41Bold {\n          font-size: ").concat(fontSizeMobileTitleT41, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT34Bold {\n          font-size: ").concat(fontSizeMobileTitleT34, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT32Bold {\n          font-size: ").concat(fontSizeMobileTitleT32, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT23Bold {\n          font-size: ").concat(fontSizeMobileTitleT23, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT21Bold {\n          font-size: ").concat(fontSizeMobileTitleT21, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT16Bold {\n          font-size: ").concat(fontSizeMobileTitleT16, ";\n          line-height: ").concat(lineHeightT16M, ";\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT15Bold {\n          font-size: ").concat(fontSizeMobileTitleT15, ";\n          line-height: ").concat(lineHeightT15M, ";\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT14Bold {\n          font-size: ").concat(fontSizeMobileTitleT14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT13Bold {\n          font-size: ").concat(fontSizeMobileTitleT13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT12Bold {\n          font-size: ").concat(fontSizeMobileTitleT12, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC23Bold {\n          font-size: ").concat(fontSizeMobileContentC23, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC21Bold {\n          font-size: ").concat(fontSizeMobileContentC21, ";\n          line-height: ").concat(lineHeightC21M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC16Bold {\n          font-size: ").concat(fontSizeMobileContentC16, ";\n          line-height: ").concat(lineHeightC16M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC15Bold {\n          font-size: ").concat(fontSizeMobileContentC15, ";\n          line-height: ").concat(lineHeightC15M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Bold {\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Regular {\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14TextLink {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Bold {\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Regular {\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13TextLink {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Regular {\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Strikethrough {\n          color: #757575;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          text-decoration: line-through;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12SemiBold {\n          font-family: ").concat(fontFamilySecondarySemiBold, "-").concat(fontFamilyMap.fontFamilySecondarySemiBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Bold {\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12TextLink  {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.2px;\n        }\n      }\n      .").concat(prefixCls, "-desktop {\n        &.").concat(prefixCls, "-size-TitleT41Bold {\n          font-size: ").concat(fontSizeDesktopTitleT41, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT34Bold {\n          font-size: ").concat(fontSizeDesktopTitleT34, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT32Bold {\n          font-size: ").concat(fontSizeDesktopTitleT32, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT23Bold {\n          font-size: ").concat(fontSizeDesktopTitleT23, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT21Bold {\n          font-size: ").concat(fontSizeDesktopTitleT21, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT16Bold {\n          font-size: ").concat(fontSizeDesktopTitleT16, ";\n          line-height: ").concat(lineHeightT16, ";\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT15Bold {\n          font-size: ").concat(fontSizeDesktopTitleT15, ";\n          line-height: ").concat(lineHeightT15, ";\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT14Bold {\n          font-size: ").concat(fontSizeDesktopTitleT14, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT13Bold {\n          font-size: ").concat(fontSizeDesktopTitleT13, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT12Bold {\n          font-size: ").concat(fontSizeDesktopTitleT12, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC23Bold {\n          font-size: ").concat(fontSizeDesktopContentC23, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC21Bold {\n          font-size: ").concat(fontSizeDesktopContentC21, ";\n          line-height: ").concat(lineHeightC21, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC16Bold {\n          font-size: ").concat(fontSizeDesktopContentC16, ";\n          line-height: ").concat(lineHeightC16, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC15Bold {\n          font-size: ").concat(fontSizeDesktopContentC15, ";\n          line-height: ").concat(lineHeightC15, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Bold {\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Regular {\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family:  ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14TextLink {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Bold {\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Regular {\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13TextLink {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Regular {\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Strikethrough {\n          color: #757575;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          text-decoration: line-through;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12SemiBold {\n          font-family: ").concat(fontFamilySecondarySemiBold, "-").concat(fontFamilyMap.fontFamilySecondarySemiBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Bold {\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12TextLink  {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.2px;\n        }\n      }\n    ");
+      return "\n      .".concat(prefixCls, "-mobile {\n        &.").concat(prefixCls, "-size-NavigationBold {\n          font-size: ").concat(fontSizeMobileNavigation, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT41Bold {\n          font-size: ").concat(fontSizeMobileTitleT41, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT34Bold {\n          font-size: ").concat(fontSizeMobileTitleT34, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT32Bold {\n          font-size: ").concat(fontSizeMobileTitleT32, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT23Bold {\n          font-size: ").concat(fontSizeMobileTitleT23, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT21Bold {\n          font-size: ").concat(fontSizeMobileTitleT21, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT16Bold {\n          font-size: ").concat(fontSizeMobileTitleT16, ";\n          line-height: ").concat(lineHeightT16M, ";\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT15Bold {\n          font-size: ").concat(fontSizeMobileTitleT15, ";\n          line-height: ").concat(lineHeightT15M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT14Bold {\n          font-size: ").concat(fontSizeMobileTitleT14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT13Bold {\n          font-size: ").concat(fontSizeMobileTitleT13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT12Bold {\n          font-size: ").concat(fontSizeMobileTitleT12, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC23Bold {\n          font-size: ").concat(fontSizeMobileContentC23, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC21Bold {\n          font-size: ").concat(fontSizeMobileContentC21, ";\n          line-height: ").concat(lineHeightC21M, ";\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC16Bold {\n          font-size: ").concat(fontSizeMobileContentC16, ";\n          line-height: ").concat(lineHeightC16M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC15Bold {\n          font-size: ").concat(fontSizeMobileContentC15, ";\n          line-height: ").concat(lineHeightC15M, ";\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Bold {\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Regular {\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14TextLink {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC14, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Bold {\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Regular {\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13TextLink {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC13, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Regular {\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Strikethrough {\n          color: #757575;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          text-decoration: line-through;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12SemiBold {\n          font-family: ").concat(fontFamilySecondarySemiBold, "-").concat(fontFamilyMap.fontFamilySecondarySemiBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Bold {\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12TextLink  {\n          color: #4E28E8;\n          font-family: ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeMobileContentC12, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.2px;\n        }\n      }\n      .").concat(prefixCls, "-desktop {\n        &.").concat(prefixCls, "-size-TitleT41Bold {\n          font-size: ").concat(fontSizeDesktopTitleT41, ";\n          line-height: 1.25;\n          font-family: ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT34Bold {\n          font-size: ").concat(fontSizeDesktopTitleT34, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT32Bold {\n          font-size: ").concat(fontSizeDesktopTitleT32, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT23Bold {\n          font-size: ").concat(fontSizeDesktopTitleT23, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT21Bold {\n          font-size: ").concat(fontSizeDesktopTitleT21, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT16Bold {\n          font-size: ").concat(fontSizeDesktopTitleT16, ";\n          line-height: ").concat(lineHeightT16, ";\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT15Bold {\n          font-size: ").concat(fontSizeDesktopTitleT15, ";\n          line-height: ").concat(lineHeightT15, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT14Bold {\n          font-size: ").concat(fontSizeDesktopTitleT14, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT13Bold {\n          font-size: ").concat(fontSizeDesktopTitleT13, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-TitleT12Bold {\n          font-size: ").concat(fontSizeDesktopTitleT12, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC23Bold {\n          font-size: ").concat(fontSizeDesktopContentC23, ";\n          line-height: 1.25;\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC21Bold {\n          font-size: ").concat(fontSizeDesktopContentC21, ";\n          line-height: ").concat(lineHeightC21, ";\n          font-family:  ").concat(fontFamilyPrimaryBold, "-").concat(fontFamilyMap.fontFamilyPrimaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC16Bold {\n          font-size: ").concat(fontSizeDesktopContentC16, ";\n          line-height: ").concat(lineHeightC16, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC15Bold {\n          font-size: ").concat(fontSizeDesktopContentC15, ";\n          line-height: ").concat(lineHeightC15, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Bold {\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Regular {\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family:  ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC14TextLink {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC14, ";\n          line-height: ").concat(lineHeightC14, ";\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Bold {\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Regular {\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13Strikethrough {\n          color: #757575;\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          text-decoration: line-through;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC13TextLink {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC13, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Regular {\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.1px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Strikethrough {\n          color: #757575;\n          font-family: ").concat(fontFamilySecondaryRegular, "-").concat(fontFamilyMap.fontFamilySecondaryRegular, ";\n          font-weight: normal;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          text-decoration: line-through;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12SemiBold {\n          font-family: ").concat(fontFamilySecondarySemiBold, "-").concat(fontFamilyMap.fontFamilySecondarySemiBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12Bold {\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          letter-spacing: 0.2px;\n        }\n        &.").concat(prefixCls, "-size-ContentC12TextLink  {\n          color: #4E28E8;\n          font-family:  ").concat(fontFamilySecondaryBold, "-").concat(fontFamilyMap.fontFamilySecondaryBold, ";\n          font-weight: bold;\n          font-size: ").concat(fontSizeDesktopContentC12, ";\n          line-height: 1.5;\n          text-decoration: underline;\n          letter-spacing: 0.2px;\n        }\n      }\n    ");
     });
     return hashId;
   };

package/lib/components/Card/designTokens.d.ts

@@ -4,6 +4,5 @@ declare const useDesignTokens: () => {
     spacingCardPaddingHorizontal: any;
     borderRadius: string;
     colorBackgroundSubtle2: any;
-    colorTextAmount: any;
 };
 export { useDesignTokens };

package/lib/components/Card/designTokens.js

@@ -30,8 +30,7 @@ var useDesignTokens = () => {
     spacingCardPaddingVertical: getToken("spacingCardPaddingVertical"),
     spacingCardPaddingHorizontal: getToken("spacingCardPaddingHorizontal"),
     borderRadius: `${getToken("borderRadiusCardSm")}px`,
-    colorBackgroundSubtle2: getToken("colorBackgroundSubtle2"),
-    colorTextAmount: getToken("colorAmountTextAmount")
+    colorBackgroundSubtle2: getToken("colorBackgroundSubtle2")
   };
   return designTokens;
 };

package/lib/components/Card/index.d.ts

@@ -4,15 +4,10 @@ export interface CardProps {
     type?: 'default' | 'whiteDivider' | 'grayDivider';
     className?: string;
     children?: ReactNode;
-    list?: {
-        key: number;
-        content: ReactNode;
-    }[];
     style?: React.CSSProperties;
     showShadow?: boolean;
     showBg?: boolean;
     showBorder?: boolean;
-    extraTop?: ReactNode;
     extraBottom?: ReactNode;
     amountLabel?: string;
     amountValue?: ReactNode;

package/lib/components/Card/index.js

@@ -72,7 +72,6 @@ var Card = (props) => {
     prefixCls = import_constants.cssClasses.PREFIX + "-card",
     type = "default",
     children,
-    extraTop,
     extraBottom,
     amountLabel,
     amountValue,
@@ -86,7 +85,6 @@ var Card = (props) => {
     "prefixCls",
     "type",
     "children",
-    "extraTop",
     "extraBottom",
     "amountLabel",
     "amountValue",
@@ -102,8 +100,7 @@ var Card = (props) => {
     spacingCardPaddingVertical,
     spacingCardPaddingHorizontal,
     borderRadius,
-    colorBackgroundSubtle2,
-    colorTextAmount
+    colorBackgroundSubtle2
   } = designTokens;
   const useCustomButtonStyle = () => {
     const hashId = (0, import_cssinjs.useStyleRegister)({
@@ -187,6 +184,6 @@ var Card = (props) => {
       children
     );
   }
-  return /* @__PURE__ */ import_react.default.createElement("div", __spreadValues({ className: `${prefixCls} ${prefixCls}-${type} ${className}` }, attr), extraTop, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-list` }, children), getAmount());
+  return /* @__PURE__ */ import_react.default.createElement("div", __spreadValues({ className: `${prefixCls} ${prefixCls}-${type} ${className}` }, attr), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-list` }, children), getAmount());
 };
 var Card_default = Card;

package/lib/components/Drawer/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import './style/index.less';
 export type DrawerType = 'DrawerTypeHandler' | 'DrawerTypeCloseBtn' | 'DrawerTypeDefault';
+export type placementType = 'right' | 'bottom';
 export declare const DrawerTypeEnum: Record<string, DrawerType>;
 export interface BottomDrawerProps {
     showClose?: boolean;
@@ -9,7 +10,7 @@ export interface BottomDrawerProps {
     visible: boolean;
     onClose: () => void;
     children: React.ReactNode;
-    height?: number | string;
+    height?: string;
     title?: string;
     drawerType?: DrawerType;
     bottomBtnText?: string;
@@ -22,6 +23,8 @@ export interface BottomDrawerProps {
     onBottomBtnClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
     btnDisabled?: boolean;
     extra?: React.ReactNode;
+    placement?: placementType;
+    width?: string;
 }
 declare const BottomDrawer: React.FC<BottomDrawerProps>;
 export default BottomDrawer;

package/lib/components/Drawer/index.js

@@ -67,7 +67,8 @@ var BottomDrawer = ({
   visible,
   onClose,
   children,
-  height,
+  width = "400px",
+  height = "auto",
   title,
   drawerType = DrawerTypeEnum.DrawerTypeDefault,
   bottomBtnText,
@@ -79,7 +80,8 @@ var BottomDrawer = ({
   onLinkClick,
   onBottomBtnClick,
   btnDisabled,
-  extra
+  extra,
+  placement = "bottom"
 }) => {
   const originalBodyOverflow = (0, import_react.useRef)("");
   const [isMounted, setIsMounted] = (0, import_react.useState)(false);
@@ -142,9 +144,6 @@ var BottomDrawer = ({
       }
       .${prefix}-content {
         background: ${colorDrawerBackgroundStandard};
-        border-top-left-radius: ${borderTopLeftRadius}px;
-        border-top-right-radius:${borderTopRightRadius}px;
-        height:${height}px;
       }
       .${prefix}-inner {
         padding-left: ${spacingDrawerPaddingHorizontal}px;
@@ -173,6 +172,28 @@ var BottomDrawer = ({
         padding-left: ${spacingDrawerPaddingHorizontal}px;
         padding-right: ${spacingDrawerPaddingHorizontal}px;
       }
+      .${prefix}-bottom {
+        .${prefix}-content {
+          border-top-left-radius: ${borderTopLeftRadius}px;
+          border-top-right-radius: ${borderTopRightRadius}px;
+          height: ${height};
+        }
+      }
+      .${prefix}-right {
+        .${prefix}-content {
+          border-radius: 0;
+          height: 100%;
+          width: ${width};
+          right: 0;
+          left: auto;
+          top: 0;
+          bottom: auto;
+          max-height: 100%;
+        }
+        .dxp-stickyFooter {
+          position: absolute;
+        }
+      }
     `);
     return hashId;
   };
@@ -195,7 +216,7 @@ var BottomDrawer = ({
   return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: `${prefix}-mask ${visible ? "visible" : ""} ${className || ""}`,
+      className: `${prefix}-mask ${visible ? "visible" : ""} ${className || ""} ${prefix}-${placement}`,
       onClick: onClose
     },
     /* @__PURE__ */ import_react.default.createElement(

package/lib/components/Modal/index.js

@@ -78,7 +78,7 @@ var Modal = (props) => {
     breakpoint = "mobile",
     size = "50%",
     prefix = `${import_constants.cssClasses.PREFIX}-modal`,
-    footerAlign = "right",
+    footerAlign = "center",
     footer = null,
     className = "",
     centered

package/lib/components/Modal/style/index.less

@@ -74,7 +74,6 @@
       background: #fff;
       border-bottom-right-radius: var(~"--@{prefix}-border-radius-lg");
       border-bottom-left-radius: var(~"--@{prefix}-border-radius-lg");
-      text-align: center;
     }
   }
 

package/lib/components/SelectorItem/index.d.ts

@@ -9,6 +9,7 @@ export interface ISelectorItemProps {
     children?: React.ReactNode;
     prefix?: string;
     onChange?: () => void;
+    style?: React.CSSProperties;
 }
 declare const SelectorItem: React.FC<ISelectorItemProps>;
 export default SelectorItem;

package/lib/components/SelectorItem/index.js

@@ -48,6 +48,7 @@ var SelectorItem = (props) => {
     showActiveIcon = false,
     children,
     prefix = `${import_constants.cssClasses.PREFIX}-selectorItem`,
+    style,
     onChange
   } = props;
   const designTokens = (0, import_designTokens.useDesignTokens)();
@@ -112,7 +113,8 @@ var SelectorItem = (props) => {
         if (!disabled && onChange) {
           onChange();
         }
-      }
+      },
+      style
     },
     /* @__PURE__ */ import_react.default.createElement(import_Icon.default, { className: "select-tick", type: "icon-Tick", size: 14, color: "#fff" }),
     children

package/lib/components/Text/index.js

@@ -156,8 +156,8 @@ var Text = (props) => {
       .${prefixCls}-mobile {
         &.${prefixCls}-size-NavigationBold {
           font-size: ${fontSizeMobileNavigation};
-          line-height: 1.25;
-          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          line-height: 1.5;
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT41Bold {
@@ -199,37 +199,37 @@ var Text = (props) => {
         &.${prefixCls}-size-TitleT15Bold {
           font-size: ${fontSizeMobileTitleT15};
           line-height: ${lineHeightT15M};
-          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT14Bold {
           font-size: ${fontSizeMobileTitleT14};
           line-height: 1.5;
-          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT13Bold {
           font-size: ${fontSizeMobileTitleT13};
           line-height: 1.5;
-          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT12Bold {
           font-size: ${fontSizeMobileTitleT12};
           line-height: 1.5;
-          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC23Bold {
           font-size: ${fontSizeMobileContentC23};
           line-height: 1.25;
-          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC21Bold {
           font-size: ${fontSizeMobileContentC21};
           line-height: ${lineHeightC21M};
-          font-family: ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-family: ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC16Bold {
@@ -386,37 +386,37 @@ var Text = (props) => {
         &.${prefixCls}-size-TitleT15Bold {
           font-size: ${fontSizeDesktopTitleT15};
           line-height: ${lineHeightT15};
-          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT14Bold {
           font-size: ${fontSizeDesktopTitleT14};
           line-height: 1.5;
-          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT13Bold {
           font-size: ${fontSizeDesktopTitleT13};
           line-height: 1.5;
-          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-TitleT12Bold {
           font-size: ${fontSizeDesktopTitleT12};
           line-height: 1.5;
-          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
+          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC23Bold {
           font-size: ${fontSizeDesktopContentC23};
           line-height: 1.25;
-          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC21Bold {
           font-size: ${fontSizeDesktopContentC21};
           line-height: ${lineHeightC21};
-          font-family:  ${fontFamilySecondaryBold}-${fontFamilyMap.fontFamilySecondaryBold};
+          font-family:  ${fontFamilyPrimaryBold}-${fontFamilyMap.fontFamilyPrimaryBold};
           font-weight: bold;
         }
         &.${prefixCls}-size-ContentC16Bold {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digitalc/dxp-ui",
-  "version": "0.0.6-alpha.2",
+  "version": "0.0.6-alpha.4",
   "description": "A UI library of Digitalc Design React Component",
   "type": "module",
   "keywords": [
@@ -132,4 +132,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}