pb-sxp-ui 1.0.3 → 1.0.4

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

@@ -9,19 +9,30 @@ const Scroll_1 = tslib_1.__importDefault(require("../components/Scroll"));
 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 MultiCommodityDiroNew = (_a) => {
     var _b, _c;
-    var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles"]);
+    var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink"]);
     const { ctaEvent, setPopupDetailData, sxpParameter } = (0, hooks_1.useSxpDataSource)();
     const { popupAni } = (0, hooks_1.useEditor)();
+    const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
     const [products, setProducts] = (0, react_1.useState)((_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [1, 2]);
     const handleClick = (0, lodash_1.throttle)((item) => {
+        var _a;
         ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
             eventSubject: 'clickCta',
             eventDescription: 'User clicked the CTA'
         }, recData, item);
         setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { video: Object.assign(Object.assign({}, recData === null || recData === void 0 ? void 0 : recData.video), { bindProduct: item }) }));
-        onClick === null || onClick === void 0 ? void 0 : onClick();
+        if (isExternalLink) {
+            if ((_a = item === null || item === void 0 ? void 0 : item.bindCta) === null || _a === void 0 ? void 0 : _a.link) {
+                jumpToWeb(recData, item, item.bindCta);
+                window.location.href = item.bindCta.link;
+            }
+        }
+        else {
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+        }
     }, popupAni === null || popupAni === void 0 ? void 0 : popupAni.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;

package/lib/materials/sxp/template/components/EventProvider.d.ts

@@ -6,6 +6,7 @@ export interface IImgProps {
     className?: any;
     onClick?: any;
     style?: CSSProperties;
+    isExternalLink?: boolean;
 }
 declare const _default: React.NamedExoticComponent<IImgProps>;
 export default _default;

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

@@ -5,12 +5,14 @@ const react_1 = tslib_1.__importStar(require("react"));
 const lodash_1 = require("lodash");
 const useOnScreen_1 = tslib_1.__importDefault(require("../../../../core/hooks/useOnScreen"));
 const hooks_1 = require("../../../../core/hooks");
+const useEventReport_1 = require("../../../../core/hooks/useEventReport");
 const EventProvider = (_a) => {
-    var { rec, children, className, onClick, style } = _a, props = tslib_1.__rest(_a, ["rec", "children", "className", "onClick", "style"]);
+    var { rec, children, className, onClick, style, isExternalLink = false } = _a, props = tslib_1.__rest(_a, ["rec", "children", "className", "onClick", "style", "isExternalLink"]);
     const ref = (0, react_1.useRef)(null);
     const isOnScreen = (0, useOnScreen_1.default)(ref);
     const { popupAni } = (0, hooks_1.useEditor)();
     const { setPopupDetailData, ctaEvent } = (0, hooks_1.useSxpDataSource)();
+    const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
     (0, react_1.useEffect)(() => {
         var _a, _b;
         if (isOnScreen && (ref === null || ref === void 0 ? void 0 : ref.current)) {
@@ -22,14 +24,24 @@ const EventProvider = (_a) => {
         }
     }, [isOnScreen, ref, rec, ctaEvent]);
     const handleClick = (0, lodash_1.throttle)(() => {
-        var _a, _b;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const item = (_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) !== null && _b !== void 0 ? _b : rec === null || rec === void 0 ? void 0 : rec.video;
         ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
             eventSubject: 'clickCta',
             eventDescription: 'User clicked the CTA'
         }, rec, item);
         setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(rec);
-        onClick === null || onClick === void 0 ? void 0 : onClick();
+        if (isExternalLink) {
+            if ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindCta) === null || _d === void 0 ? void 0 : _d.link) {
+                const cta = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta;
+                const product = (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct;
+                jumpToWeb(rec, product, cta);
+                window.location.href = (_h = (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) === null || _h === void 0 ? void 0 : _h.link;
+            }
+        }
+        else {
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+        }
     }, popupAni === null || popupAni === void 0 ? void 0 : popupAni.duration);
     return (react_1.default.createElement("div", { ref: ref, className: className, style: style, onClick: handleClick }, children));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pb-sxp-ui",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "React enterprise-class UI components",
   "main": "dist/index.cjs",
   "module": "dist/index.js",