pb-sxp-ui 1.0.34 → 1.0.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +111 -111
- package/dist/index.cjs +23 -17
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +23 -17
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +23 -17
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/DiyPortalPreview/index.d.ts +3 -1
- package/es/core/components/DiyPortalPreview/index.js +10 -8
- package/es/core/components/SxpPageRender/VideoWidget/index.js +4 -0
- package/es/materials/sxp/popup/CommodityDetail/index.js +4 -4
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +1 -1
- package/lib/core/components/DiyPortalPreview/index.d.ts +3 -1
- package/lib/core/components/DiyPortalPreview/index.js +10 -8
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +4 -0
- package/lib/materials/sxp/popup/CommodityDetail/index.js +4 -4
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +1 -1
- package/package.json +115 -115
package/dist/index.js
CHANGED
@@ -8366,10 +8366,10 @@ const CommodityDetail$1 = (_a) => {
|
|
8366
8366
|
React.createElement("div", { className: 'pb-commondity-content-title', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!product && !(product === null || product === void 0 ? void 0 : product.title) }, (_b = product === null || product === void 0 ? void 0 : product.title) !== null && _b !== void 0 ? _b : 'Pendant in Yellow Gold with Diamonds, Medium'),
|
8367
8367
|
React.createElement("div", { className: 'pb-commondity-content-price', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price, hidden: !!product && !(product === null || product === void 0 ? void 0 : product.price) }, priceText),
|
8368
8368
|
React.createElement("div", { hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.info) || (product === null || product === void 0 ? void 0 : product.info) === '') },
|
8369
|
-
React.createElement(ExpandableText$1, { foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, onClick: () => setShowModal(true), isPost: isPost, text: (_c = product === null || product === void 0 ? void 0 : product.info) !== null && _c !== void 0 ? _c : `The design inspiration of Tiffany Lock series comes from the power of connection and inclusiveness, and the
|
8370
|
-
bold and avant-garde visual design interprets the emotional bond connecting my heart. The Tiffany Lock
|
8371
|
-
collection is unisex and is inspired by the padlock pattern found in the Tiffany Antique Collection. This
|
8372
|
-
necklace features a stylish and eye-catching oval clasp chain decorated with a lock pattern. Crafted from
|
8369
|
+
React.createElement(ExpandableText$1, { foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, onClick: () => setShowModal(true), isPost: isPost, text: (_c = product === null || product === void 0 ? void 0 : product.info) !== null && _c !== void 0 ? _c : `The design inspiration of Tiffany Lock series comes from the power of connection and inclusiveness, and the
|
8370
|
+
bold and avant-garde visual design interprets the emotional bond connecting my heart. The Tiffany Lock
|
8371
|
+
collection is unisex and is inspired by the padlock pattern found in the Tiffany Antique Collection. This
|
8372
|
+
necklace features a stylish and eye-catching oval clasp chain decorated with a lock pattern. Crafted from
|
8373
8373
|
18-karat gold, this necklace is embellished with hand-set diamonds.`, maxStr: 79, className: 'pb-commondity-content-info', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.info }))));
|
8374
8374
|
};
|
8375
8375
|
const renderBtn = () => {
|
@@ -8820,7 +8820,7 @@ const CommodityDetailDiroNew$1 = (_a) => {
|
|
8820
8820
|
const productInfoText = ({ isPost }) => {
|
8821
8821
|
return (React.createElement("div", { hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.info) || (product === null || product === void 0 ? void 0 : product.info) === '') },
|
8822
8822
|
React.createElement(ExpandableText$1, { isPost: isPost, onClick: () => setShowModal(true), className: 'pb-commondityDiroNew-info', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.info, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (product === null || product === void 0 ? void 0 : product.info) ||
|
8823
|
-
`Unveiled at the Spring-Summer 2023 fashion show, the Dior Toujours bag is distinguished by a casual and practical design. Crafted in black calfskin with Macrocannage topstitching, it showcases a spacious interior compartment with a matching pouch to organize essentials. Its leather strap closure keeps items secure while the D of the CD Lock closure twists to adjust the sides and enhance the bag's silhouette. The leather handles can be adjusted using the small notches in order to be able to carry the large bag by hand or wear it over the shoulder. CD Lock and strap closures D.I.O.R. charms Removable interior pouch Adjustable leather handles Dust bag included
|
8823
|
+
`Unveiled at the Spring-Summer 2023 fashion show, the Dior Toujours bag is distinguished by a casual and practical design. Crafted in black calfskin with Macrocannage topstitching, it showcases a spacious interior compartment with a matching pouch to organize essentials. Its leather strap closure keeps items secure while the D of the CD Lock closure twists to adjust the sides and enhance the bag's silhouette. The leather handles can be adjusted using the small notches in order to be able to carry the large bag by hand or wear it over the shoulder. CD Lock and strap closures D.I.O.R. charms Removable interior pouch Adjustable leather handles Dust bag included
|
8824
8824
|
Made in Italy` })));
|
8825
8825
|
};
|
8826
8826
|
return (React.createElement("div", { className: 'pb-commondityDiroNew' },
|
@@ -11905,14 +11905,14 @@ var _materials_ = /*#__PURE__*/Object.freeze({
|
|
11905
11905
|
Prompt: Prompt
|
11906
11906
|
});
|
11907
11907
|
|
11908
|
-
const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
|
11909
|
-
const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
|
11908
|
+
const defaultUnLikeIconPath$1 = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
|
11909
|
+
const defaultLikeIconPath$1 = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
|
11910
11910
|
const LikeButton = (_a) => {
|
11911
11911
|
var { active, activeIcon, unActicveIcon, recData, position } = _a, props = __rest(_a, ["active", "activeIcon", "unActicveIcon", "recData", "position"]);
|
11912
11912
|
const { mutateLike, mutateUnlike, bffEventReport } = useSxpDataSource();
|
11913
11913
|
const [state, setState] = useState(active);
|
11914
|
-
const likeIcon = useIconLink(defaultLikeIconPath);
|
11915
|
-
const unlikeIcon = useIconLink(defaultUnLikeIconPath);
|
11914
|
+
const likeIcon = useIconLink(defaultLikeIconPath$1);
|
11915
|
+
const unlikeIcon = useIconLink(defaultUnLikeIconPath$1);
|
11916
11916
|
const handleClick = debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
11917
11917
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
11918
11918
|
if (state) {
|
@@ -12109,6 +12109,10 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12109
12109
|
const hls = new Hls();
|
12110
12110
|
hls.loadSource(videoSrc);
|
12111
12111
|
hls.attachMedia(videoRef.current);
|
12112
|
+
hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
12113
|
+
var _a;
|
12114
|
+
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
12115
|
+
});
|
12112
12116
|
}
|
12113
12117
|
else if (videoRef.current.canPlayType('application/vnd.apple.mpegurl')) {
|
12114
12118
|
videoRef.current.src = videoSrc;
|
@@ -13190,9 +13194,9 @@ const RESOLVER$1 = {};
|
|
13190
13194
|
Object.values(_materials_).forEach((v) => {
|
13191
13195
|
RESOLVER$1[v.extend.type] = v;
|
13192
13196
|
});
|
13193
|
-
const
|
13194
|
-
|
13195
|
-
|
13197
|
+
const defaultUnLikeIconPath = '/pb_static/f71266d2c64446c5ae6a5a7f5489cc0a.png';
|
13198
|
+
const defaultLikeIconPath = '/pb_static/f07900fe3f0f4ae188ea1611d4801a44.png';
|
13199
|
+
const DiyPortalPreview = ({ data, globalConfig, tipText, nudge, tempMap, descStyle, hashTagStyle, containerHeight = 664, containerWidth = 375, appDomain }) => {
|
13196
13200
|
const height = useMemo(() => {
|
13197
13201
|
return (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo) ? containerHeight - 45 : containerHeight;
|
13198
13202
|
}, [globalConfig, containerHeight]);
|
@@ -13242,8 +13246,10 @@ const DiyPortalPreview = ({ data, globalConfig, tipText, nudge, tempMap, descSty
|
|
13242
13246
|
}
|
13243
13247
|
return null;
|
13244
13248
|
};
|
13249
|
+
const likeIcon = useIconLink(defaultLikeIconPath, appDomain);
|
13250
|
+
const unlikeIcon = useIconLink(defaultUnLikeIconPath, appDomain);
|
13245
13251
|
const renderLikeButton = (rec, index) => {
|
13246
|
-
var _a, _b;
|
13252
|
+
var _a, _b, _c, _d;
|
13247
13253
|
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike))
|
13248
13254
|
return;
|
13249
13255
|
let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
|
@@ -13251,15 +13257,15 @@ const DiyPortalPreview = ({ data, globalConfig, tipText, nudge, tempMap, descSty
|
|
13251
13257
|
top += 40;
|
13252
13258
|
}
|
13253
13259
|
if (rec.video) {
|
13254
|
-
return (React.createElement(LikeButton$1, { key: rec.position, activeIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIcon, unActicveIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unlikeIcon, position: index, active: rec.isCollected, recData: rec, className: 'clc-sxp-like-button', style: {
|
13260
|
+
return (React.createElement(LikeButton$1, { key: rec.position, activeIcon: (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIcon) !== null && _b !== void 0 ? _b : likeIcon, unActicveIcon: (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unlikeIcon) !== null && _c !== void 0 ? _c : unlikeIcon, position: index, active: rec.isCollected, recData: rec, className: 'clc-sxp-like-button', style: {
|
13255
13261
|
top,
|
13256
|
-
right: (
|
13262
|
+
right: (_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconX) !== null && _d !== void 0 ? _d : 0
|
13257
13263
|
} }));
|
13258
13264
|
}
|
13259
13265
|
return null;
|
13260
13266
|
};
|
13261
|
-
const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
|
13262
|
-
const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
|
13267
|
+
const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png', appDomain);
|
13268
|
+
const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png', appDomain);
|
13263
13269
|
const renderView = (rec, index) => {
|
13264
13270
|
var _a, _b, _c, _d;
|
13265
13271
|
return (React.createElement("div", { style: { position: 'relative' } },
|