pb-sxp-ui 1.0.98 → 1.0.100

package/lib/materials/sxp/popup/CommodityDetail/settingRender.js

@@ -1,7 +1,5 @@
 "use strict";
-var _a, _b;
 Object.defineProperty(exports, "__esModule", { value: true });
-const defaultSetting_1 = require("../../defaultSetting");
 exports.default = [
     {
         title: '商品图片',
@@ -94,14 +92,24 @@ exports.default = [
                         label: '标题字体',
                         child: [
                             {
-                                type: 'Color',
-                                name: ['color']
+                                type: 'Select',
+                                name: ['fontFamily-cn'],
+                                bottomText: '中文字体'
                             },
                             {
                                 type: 'Select',
-                                options: defaultSetting_1.fontOptions,
-                                name: ['fontFamily'],
-                                initialValue: (_a = defaultSetting_1.fontOptions === null || defaultSetting_1.fontOptions === void 0 ? void 0 : defaultSetting_1.fontOptions[0]) === null || _a === void 0 ? void 0 : _a.value
+                                name: ['fontFamily-en'],
+                                bottomText: '英文/其他字体'
+                            }
+                        ]
+                    },
+                    {
+                        type: 'Group',
+                        label: '',
+                        child: [
+                            {
+                                type: 'Color',
+                                name: ['color']
                             },
                             {
                                 type: 'Number',
@@ -173,15 +181,25 @@ exports.default = [
                 label: '字体',
                 child: [
                     {
-                        type: 'Color',
-                        name: ['props', 'buttonStyle', 'color'],
-                        initialValue: '#fff'
+                        type: 'Select',
+                        name: ['props', 'buttonStyle', 'fontFamily-cn'],
+                        bottomText: '中文字体'
                     },
                     {
                         type: 'Select',
-                        name: ['props', 'buttonStyle', 'fontFamily'],
-                        options: defaultSetting_1.fontOptions,
-                        initialValue: (_b = defaultSetting_1.fontOptions === null || defaultSetting_1.fontOptions === void 0 ? void 0 : defaultSetting_1.fontOptions[0]) === null || _b === void 0 ? void 0 : _b.value
+                        name: ['props', 'buttonStyle', 'fontFamily-en'],
+                        bottomText: '英文/其他字体'
+                    }
+                ]
+            },
+            {
+                type: 'Group',
+                label: '',
+                child: [
+                    {
+                        type: 'Color',
+                        name: ['props', 'buttonStyle', 'color'],
+                        initialValue: '#fff'
                     },
                     {
                         type: 'Number',

package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js

@@ -11,6 +11,7 @@ const Modal_1 = tslib_1.__importDefault(require("../../../../core/components/Sxp
 const ExpandableText_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/ExpandableText"));
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
 const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/components/SxpPageRender/FormatImage"));
+const tool_1 = require("../../../../core/utils/tool");
 const CommodityDetailDiroNew = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index"]);
@@ -144,12 +145,22 @@ Made in Italy` })));
             react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content' },
                 react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
                     react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
-                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title) }, (_l = product === null || product === void 0 ? void 0 : product.title) !== null && _l !== void 0 ? _l : 'Large Dior Toujours BagLarge'),
-                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-collection', hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.collection) || (product === null || product === void 0 ? void 0 : product.collection) === ''), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection) }, (product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge')),
+                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
+                                __html: (0, tool_1.setFontForText)((_l = product === null || product === void 0 ? void 0 : product.title) !== null && _l !== void 0 ? _l : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
+                            } }),
+                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-collection', hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.collection) || (product === null || product === void 0 ? void 0 : product.collection) === ''), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection), dangerouslySetInnerHTML: {
+                                __html: (0, tool_1.setFontForText)((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
+                            } })),
                     react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-right' },
-                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.price), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) }, priceText),
-                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.taxInfo), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo) }, (_m = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _m !== void 0 ? _m : '税费'))),
-                (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.createElement("button", { "aria-label": (_o = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _o !== void 0 ? _o : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle }, (_p = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _p !== void 0 ? _p : 'Shop now')),
+                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.price), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price), dangerouslySetInnerHTML: {
+                                __html: (0, tool_1.setFontForText)(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
+                            } }),
+                        react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.taxInfo), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo), dangerouslySetInnerHTML: {
+                                __html: (0, tool_1.setFontForText)((_m = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _m !== void 0 ? _m : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
+                            } }))),
+                (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.createElement("button", { "aria-label": (_o = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _o !== void 0 ? _o : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle, dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_p = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _p !== void 0 ? _p : 'Shop now', buttonStyle)
+                    } })),
                 productInfoText({ isPost }))),
         react_1.default.createElement(Modal_1.default, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false }))));
 };

package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.d.ts

@@ -50,27 +50,25 @@ declare const _default: ({
         } | {
             type: string;
             label: string;
-            child: ({
+            child: {
                 type: string;
                 name: string[];
-                options?: undefined;
-                initialValue?: undefined;
-                addonAfter?: undefined;
-            } | {
+                bottomText: string;
+            }[];
+            options?: undefined;
+            name?: undefined;
+            initialValue?: undefined;
+        } | {
+            type: string;
+            label: string;
+            child: ({
                 type: string;
-                options: {
-                    label: string;
-                    value: string;
-                }[];
                 name: string[];
-                initialValue: string;
                 addonAfter?: undefined;
             } | {
                 type: string;
                 addonAfter: string;
                 name: string[];
-                options?: undefined;
-                initialValue?: undefined;
             })[];
             options?: undefined;
             name?: undefined;
@@ -124,19 +122,19 @@ declare const _default: ({
     } | {
         type: string;
         label: string;
-        child: ({
+        child: {
             type: string;
             name: string[];
-            initialValue: string;
-            options?: undefined;
-            addonAfter?: undefined;
-        } | {
+            bottomText: string;
+        }[];
+        name?: undefined;
+        initialValue?: undefined;
+    } | {
+        type: string;
+        label: string;
+        child: ({
             type: string;
             name: string[];
-            options: {
-                label: string;
-                value: string;
-            }[];
             initialValue: string;
             addonAfter?: undefined;
         } | {
@@ -144,7 +142,6 @@ declare const _default: ({
             name: string[];
             addonAfter: string;
             initialValue?: undefined;
-            options?: undefined;
         })[];
         name?: undefined;
         initialValue?: undefined;

package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.js

@@ -1,7 +1,5 @@
 "use strict";
-var _a, _b;
 Object.defineProperty(exports, "__esModule", { value: true });
-const defaultSetting_1 = require("../../defaultSetting");
 exports.default = [
     {
         title: '商品图片',
@@ -81,14 +79,24 @@ exports.default = [
                         label: '标题字体',
                         child: [
                             {
-                                type: 'Color',
-                                name: ['color']
+                                type: 'Select',
+                                name: ['fontFamily-cn'],
+                                bottomText: '中文字体'
                             },
                             {
                                 type: 'Select',
-                                options: defaultSetting_1.fontOptions,
-                                name: ['fontFamily'],
-                                initialValue: (_a = defaultSetting_1.fontOptions === null || defaultSetting_1.fontOptions === void 0 ? void 0 : defaultSetting_1.fontOptions[0]) === null || _a === void 0 ? void 0 : _a.value
+                                name: ['fontFamily-en'],
+                                bottomText: '英文/其他字体'
+                            }
+                        ]
+                    },
+                    {
+                        type: 'Group',
+                        label: '',
+                        child: [
+                            {
+                                type: 'Color',
+                                name: ['color']
                             },
                             {
                                 type: 'Number',
@@ -160,15 +168,25 @@ exports.default = [
                 label: '字体',
                 child: [
                     {
-                        type: 'Color',
-                        name: ['props', 'buttonStyle', 'color'],
-                        initialValue: '#fff'
+                        type: 'Select',
+                        name: ['props', 'buttonStyle', 'fontFamily-cn'],
+                        bottomText: '中文字体'
                     },
                     {
                         type: 'Select',
-                        name: ['props', 'buttonStyle', 'fontFamily'],
-                        options: defaultSetting_1.fontOptions,
-                        initialValue: (_b = defaultSetting_1.fontOptions === null || defaultSetting_1.fontOptions === void 0 ? void 0 : defaultSetting_1.fontOptions[0]) === null || _b === void 0 ? void 0 : _b.value
+                        name: ['props', 'buttonStyle', 'fontFamily-en'],
+                        bottomText: '英文/其他字体'
+                    }
+                ]
+            },
+            {
+                type: 'Group',
+                label: '',
+                child: [
+                    {
+                        type: 'Color',
+                        name: ['props', 'buttonStyle', 'color'],
+                        initialValue: '#fff'
                     },
                     {
                         type: 'Number',

package/lib/materials/sxp/popup/Prompt/index.js

@@ -8,6 +8,7 @@ const materials_1 = require("../../../../core/utils/materials");
 require("./index.less");
 const hooks_1 = require("../../../../core/hooks");
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
+const tool_1 = require("../../../../core/utils/tool");
 const Prompt = (_a) => {
     var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle } = _a, props = tslib_1.__rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle"]);
     const { popupDetailData } = (0, hooks_1.useSxpDataSource)();
@@ -31,6 +32,8 @@ const Prompt = (_a) => {
         react_1.default.createElement("div", { className: 'pb-prompt-icon' },
             react_1.default.createElement("img", { width: '100%', src: iconSrc !== null && iconSrc !== void 0 ? iconSrc : success_png_1.default, alt: 'success image' })),
         react_1.default.createElement("div", { className: 'pb-prompt-content' }, content),
-        react_1.default.createElement("button", { "aria-label": btnText, className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk }, btnText)));
+        react_1.default.createElement("button", { "aria-label": btnText, className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk, dangerouslySetInnerHTML: {
+                __html: (0, tool_1.setFontForText)(btnText, submitButtonStyle)
+            } })));
 };
 exports.default = (0, react_1.memo)(Prompt);

package/lib/materials/sxp/popup/Prompt/settingRender.d.ts

@@ -15,24 +15,26 @@ declare const _default: {
     } | {
         type: string;
         label: string;
-        child: ({
+        child: {
             type: string;
             name: string[];
-            initialValue: string;
-            options?: undefined;
-            addonAfter?: undefined;
-        } | {
+            bottomText: string;
+        }[];
+        name?: undefined;
+        mediaType?: undefined;
+    } | {
+        type: string;
+        label: string;
+        child: ({
             type: string;
             name: string[];
-            options: any[];
-            initialValue: any;
+            initialValue: string;
             addonAfter?: undefined;
         } | {
             type: string;
             name: string[];
             addonAfter: string;
             initialValue: number;
-            options?: undefined;
         })[];
         name?: undefined;
         mediaType?: undefined;

package/lib/materials/sxp/popup/Prompt/settingRender.js

@@ -1,8 +1,5 @@
 "use strict";
-var _a, _b;
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const defaultSetting_1 = tslib_1.__importDefault(require("../../defaultSetting"));
 exports.default = [
     {
         title: '',
@@ -28,15 +25,25 @@ exports.default = [
                 label: '提交按钮字体',
                 child: [
                     {
-                        type: 'Color',
-                        name: ['props', 'submitButtonStyle', 'color'],
-                        initialValue: '#fff'
+                        type: 'Select',
+                        name: ['props', 'submitButtonStyle', 'fontFamily-cn'],
+                        bottomText: '中文字体'
                     },
                     {
                         type: 'Select',
-                        name: ['props', 'submitButtonStyle', 'fontFamily'],
-                        options: defaultSetting_1.default === null || defaultSetting_1.default === void 0 ? void 0 : defaultSetting_1.default.fontOptions,
-                        initialValue: (_b = (_a = defaultSetting_1.default === null || defaultSetting_1.default === void 0 ? void 0 : defaultSetting_1.default.fontOptions) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.value
+                        name: ['props', 'submitButtonStyle', 'fontFamily-en'],
+                        bottomText: '英文/其他字体'
+                    }
+                ]
+            },
+            {
+                type: 'Group',
+                label: '',
+                child: [
+                    {
+                        type: 'Color',
+                        name: ['props', 'submitButtonStyle', 'color'],
+                        initialValue: '#fff'
                     },
                     {
                         type: 'Number',

package/lib/materials/sxp/template/Appoint/index.js

@@ -6,6 +6,7 @@ const react_1 = tslib_1.__importStar(require("react"));
 const EventProvider_1 = tslib_1.__importDefault(require("../components/EventProvider"));
 const hooks_1 = require("../../../../core/hooks");
 const Img_1 = tslib_1.__importDefault(require("../components/Img"));
+const tool_1 = require("../../../../core/utils/tool");
 const Appoint = (_a) => {
     var _b, _c, _d, _e, _f, _g;
     var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
@@ -14,6 +15,8 @@ const Appoint = (_a) => {
     const src = (_d = (_c = cta === null || cta === void 0 ? void 0 : cta.icon) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image;
     return (react_1.default.createElement(EventProvider_1.default, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: (0, css_1.css)(Object.assign({ alignItems: 'center' }, style)), style: { display: 'flex' }, index: index }, props),
         react_1.default.createElement(Img_1.default, { src: src, rec: recData, item: (_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) !== null && _f !== void 0 ? _f : recData === null || recData === void 0 ? void 0 : recData.video, index: index, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
-        react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ overflow: 'hidden', textOverflow: 'ellipsis' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_g = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _g !== void 0 ? _g : 'Product Name')));
+        react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ overflow: 'hidden', textOverflow: 'ellipsis' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                __html: (0, tool_1.setFontForText)((_g = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _g !== void 0 ? _g : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+            } })));
 };
 exports.default = (0, react_1.memo)(Appoint);

package/lib/materials/sxp/template/Commodity/index.js

@@ -7,6 +7,7 @@ const EventProvider_1 = tslib_1.__importDefault(require("../components/EventProv
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const Img_1 = tslib_1.__importDefault(require("../components/Img"));
+const tool_1 = require("../../../../core/utils/tool");
 const Commodity = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0, index } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY", "index"]);
@@ -23,7 +24,11 @@ const Commodity = (_a) => {
                 width: '100%',
                 overflow: 'hidden'
             }) },
-            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name'),
-            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap', lineHeight: ((_k = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _k === void 0 ? void 0 : _k.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_m = (_l = product === null || product === void 0 ? void 0 : product.bindCta) === null || _l === void 0 ? void 0 : _l.enTitle) !== null && _m !== void 0 ? _m : 'Shop Now'))));
+            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                } }),
+            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap', lineHeight: ((_k = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _k === void 0 ? void 0 : _k.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_m = (_l = product === null || product === void 0 ? void 0 : product.bindCta) === null || _l === void 0 ? void 0 : _l.enTitle) !== null && _m !== void 0 ? _m : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                } }))));
 };
 exports.default = (0, react_1.memo)(Commodity);

package/lib/materials/sxp/template/CommodityDiro/index.js

@@ -7,8 +7,9 @@ const EventProvider_1 = tslib_1.__importDefault(require("../components/EventProv
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const Img_1 = tslib_1.__importDefault(require("../components/Img"));
+const tool_1 = require("../../../../core/utils/tool");
 const CommodityDiro = (_a) => {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0, index } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY", "index"]);
     const { sxpParameter } = (0, hooks_1.useSxpDataSource)();
     const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
@@ -23,7 +24,11 @@ const CommodityDiro = (_a) => {
                 width: '100%',
                 overflow: 'hidden'
             }) },
-            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name'),
-            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '2px 7px', textOverflow: 'ellipsis', overflow: 'hidden', borderRadius: '25px', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_l = (_k = product === null || product === void 0 ? void 0 : product.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now'))));
+            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                } }),
+            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', borderRadius: '25px', whiteSpace: 'nowrap', lineHeight: ((_k = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _k === void 0 ? void 0 : _k.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_m = (_l = product === null || product === void 0 ? void 0 : product.bindCta) === null || _l === void 0 ? void 0 : _l.enTitle) !== null && _m !== void 0 ? _m : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                } }))));
 };
 exports.default = (0, react_1.memo)(CommodityDiro);

package/lib/materials/sxp/template/CommodityDiroNew/index.js

@@ -7,6 +7,7 @@ const EventProvider_1 = tslib_1.__importDefault(require("../components/EventProv
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const Img_1 = tslib_1.__importDefault(require("../components/Img"));
+const tool_1 = require("../../../../core/utils/tool");
 const CommodityDiroNew = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0, index } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY", "index"]);
@@ -23,7 +24,11 @@ const CommodityDiroNew = (_a) => {
                 width: '100%',
                 overflow: 'hidden'
             }) },
-            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name'),
-            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_l = (_k = product === null || product === void 0 ? void 0 : product.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop now'))));
+            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_j = product === null || product === void 0 ? void 0 : product.title) !== null && _j !== void 0 ? _j : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                } }),
+            react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_l = (_k = product === null || product === void 0 ? void 0 : product.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                } }))));
 };
 exports.default = (0, react_1.memo)(CommodityDiroNew);

package/lib/materials/sxp/template/Link/index.js

@@ -8,6 +8,7 @@ const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less
 const hooks_1 = require("../../../../core/hooks");
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
 const Img_1 = tslib_1.__importDefault(require("../components/Img"));
+const tool_1 = require("../../../../core/utils/tool");
 const Link = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h;
     var { content, style, bgImg, recData, bottom_image, ctaTempStyles, index } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "index"]);
@@ -30,6 +31,8 @@ const Link = (_a) => {
                 width: '100%',
                 overflow: 'hidden'
             }) },
-            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle }, (_h = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _h !== void 0 ? _h : 'Product Name'))));
+            react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle, dangerouslySetInnerHTML: {
+                    __html: (0, tool_1.setFontForText)((_h = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _h !== void 0 ? _h : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                } }))));
 };
 exports.default = (0, react_1.memo)(Link);

package/lib/materials/sxp/template/MultiCommodity/index.js

@@ -10,6 +10,7 @@ const Scroll_1 = tslib_1.__importDefault(require("../components/Scroll"));
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
+const tool_1 = require("../../../../core/utils/tool");
 const MultiCommodity = (_a) => {
     var _b, _c;
     var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
@@ -46,8 +47,12 @@ const MultiCommodity = (_a) => {
                     width: '100%',
                     overflow: 'hidden'
                 }) },
-                react_1.default.createElement("div", { className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name'),
-                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap', lineHeight: ((_f = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _f === void 0 ? void 0 : _f.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now'))))));
+                react_1.default.createElement("div", { className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                    } }),
+                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap', lineHeight: ((_f = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _f === void 0 ? void 0 : _f.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                    } }))))));
     })));
 };
 exports.default = (0, react_1.memo)(MultiCommodity);

package/lib/materials/sxp/template/MultiCommodityDiro/index.js

@@ -10,6 +10,7 @@ const Img_1 = tslib_1.__importDefault(require("../components/Img"));
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
+const tool_1 = require("../../../../core/utils/tool");
 const MultiCommodityDiro = (_a) => {
     var _b, _c;
     var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
@@ -34,7 +35,7 @@ const MultiCommodityDiro = (_a) => {
         }
     }, popup === null || popup === void 0 ? void 0 : popup.duration);
     return (react_1.default.createElement(Scroll_1.default, { isPadding: !!recData }, products === null || products === void 0 ? void 0 : products.map((item) => {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         return (react_1.default.createElement(react_1.default.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (react_1.default.createElement(react_2.SwiperSlide, Object.assign({ key: item === null || item === void 0 ? void 0 : item.itemId, className: (0, css_1.css)(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
             react_1.default.createElement(Img_1.default, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
             react_1.default.createElement("div", { className: (0, css_1.css)({
@@ -45,8 +46,12 @@ const MultiCommodityDiro = (_a) => {
                     width: '100%',
                     overflow: 'hidden'
                 }) },
-                react_1.default.createElement("div", { className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name'),
-                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '2px 7px', textOverflow: 'ellipsis', overflow: 'hidden', borderRadius: '25px', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_g = (_f = item === null || item === void 0 ? void 0 : item.bindCta) === null || _f === void 0 ? void 0 : _f.enTitle) !== null && _g !== void 0 ? _g : 'Shop Now'))))));
+                react_1.default.createElement("div", { className: index_module_less_1.default['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                    } }),
+                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ padding: '0 7px', textOverflow: 'ellipsis', overflow: 'hidden', borderRadius: '25px', whiteSpace: 'nowrap', lineHeight: ((_f = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _f === void 0 ? void 0 : _f.height) + 'px' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                    } }))))));
     })));
 };
 exports.default = (0, react_1.memo)(MultiCommodityDiro);

package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js

@@ -10,6 +10,7 @@ const Img_1 = tslib_1.__importDefault(require("../components/Img"));
 const index_module_less_1 = tslib_1.__importDefault(require("./index.module.less"));
 const hooks_1 = require("../../../../core/hooks");
 const useEventReport_1 = require("../../../../core/hooks/useEventReport");
+const tool_1 = require("../../../../core/utils/tool");
 const MultiCommodityDiroNew = (_a) => {
     var _b, _c;
     var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
@@ -46,8 +47,12 @@ const MultiCommodityDiroNew = (_a) => {
                     overflow: 'hidden',
                     lineHeight: '20px'
                 }) },
-                react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title }, (_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name'),
-                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)) }, (_g = (_f = item === null || item === void 0 ? void 0 : item.bindCta) === null || _f === void 0 ? void 0 : _f.enTitle) !== null && _g !== void 0 ? _g : 'Shop now'))))));
+                react_1.default.createElement("div", { className: index_module_less_1.default['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
+                    } }),
+                react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ textOverflow: 'ellipsis', overflow: 'hidden', whiteSpace: 'nowrap' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)), dangerouslySetInnerHTML: {
+                        __html: (0, tool_1.setFontForText)((_g = (_f = item === null || item === void 0 ? void 0 : item.bindCta) === null || _f === void 0 ? void 0 : _f.enTitle) !== null && _g !== void 0 ? _g : 'Shop Now', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
+                    } }))))));
     })));
 };
 exports.default = (0, react_1.memo)(MultiCommodityDiroNew);

package/lib/materials/sxp/template/components/Img.js

@@ -23,6 +23,6 @@ const Img = ({ src, rec, item, index, style, translateY, imgStyle }) => {
     }, [src]);
     return (react_1.default.createElement("div", { className: (0, css_1.css)(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, imgStyle)) },
         react_1.default.createElement("div", { ref: ref, hidden: !src, className: (0, css_1.css)({ width: '100%', height: '100%' }) },
-            react_1.default.createElement(FormatImage_1.default, { className: (0, css_1.css)(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block', objectPosition: `50% ${translateY ? -translateY + 50 : 50}%` }, style)), src: imgSrc }))));
+            react_1.default.createElement(FormatImage_1.default, { className: (0, css_1.css)(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block', objectPosition: `50% ${translateY ? -translateY + 50 : 50}%` }, style)), src: src }))));
 };
 exports.default = (0, react_1.memo)(Img);