pb-sxp-ui 1.0.59 → 1.0.61

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 CHANGED
@@ -1,21 +1,21 @@
1
- MIT License
2
-
3
- Copyright (c) 2023 ChatLabs
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
1
+ MIT License
2
+
3
+ Copyright (c) 2023 ChatLabs
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,111 +1,111 @@
1
- <!--
2
- * @Author : haocanweng@chatlabs.cn
3
- * @Date : 2023-08-23 18:25:31
4
- * @LastEditors: binruan@chatlabs.com
5
- * @LastEditTime: 2024-03-20 16:26:29
6
- * @FilePath: \pb-sxp-ui\README.md
7
- -->
8
- <h1 align="center">Page Builder SXP UI</h1>
9
-
10
- <div align="center">
11
- React enterprise-class UI components
12
- </div>
13
-
14
- ## 📦 安装
15
-
16
- ```bash
17
- npm install pb-sxp-ui
18
- # or
19
- yarn add pb-sxp-ui
20
- ```
21
-
22
- ## 🔨 使用
23
- 以 Next.js 框架为例子:
24
-
25
- ```jsx
26
- import { GetServerSideProps } from 'next';
27
- import React, { FC } from 'react'
28
- import Pagebuilder, { PageView } from 'pb-sxp-ui';
29
-
30
- // 初始化 PageBuilder 配置
31
- Pagebuilder.init({
32
- tenantId: 'xxxxxxxxxx',
33
- appId: 'xxxxxxxxx',
34
- env: 'live' // 可选参数,默认是 live 环境
35
- });
36
-
37
-
38
- interface IProps {
39
- path: string;
40
- data: any
41
- }
42
-
43
- const ContentPage: FC<IProps> = ({ data ,path}) => {
44
- return (
45
- <PageView data={data?.data} isSsr path={path}/>
46
- )
47
- }
48
-
49
- export const getServerSideProps: GetServerSideProps<IProps> = async (
50
- context
51
- ) => {
52
- // 接收传来的路径
53
- const path = context.query.path as string;
54
- // 获取页面数据
55
- const result = await Pagebuilder.getDetail(path)
56
- return {
57
- props: {
58
- path,
59
- data: result.data
60
- },
61
- };
62
- };
63
-
64
- export default ContentPage;
65
-
66
- ```
67
-
68
- ## ⌨️ 本地调试
69
-
70
- ### 运行开发环境
71
-
72
- ```bash
73
- $ npm install
74
- $ npm run start
75
- ```
76
-
77
- ### 生成本地开发全局链接
78
-
79
- ```bash
80
- npm link
81
- # or
82
- yarn link
83
- ```
84
-
85
- ### 在使用该包的项目中安装调试
86
-
87
- ```bash
88
- npm link pb-sxp-ui
89
- # or
90
- yarn link pb-sxp-ui
91
- ```
92
-
93
- ## 👾 发布
94
-
95
- ### 打包线上安装包
96
-
97
- ```bash
98
- npm run package
99
- # or
100
- yarn package
101
- ```
102
-
103
- ### 发布 npm
104
-
105
- ```bash
106
- $ npm version patch|minor|major
107
- $ npm publish
108
-
109
- # 自动化发布包
110
- $ npm run pub patch|minor|major|xx.xx.xx
111
- ```
1
+ <!--
2
+ * @Author : haocanweng@chatlabs.cn
3
+ * @Date : 2023-08-23 18:25:31
4
+ * @LastEditors: binruan@chatlabs.com
5
+ * @LastEditTime: 2024-03-20 16:26:29
6
+ * @FilePath: \pb-sxp-ui\README.md
7
+ -->
8
+ <h1 align="center">Page Builder SXP UI</h1>
9
+
10
+ <div align="center">
11
+ React enterprise-class UI components
12
+ </div>
13
+
14
+ ## 📦 安装
15
+
16
+ ```bash
17
+ npm install pb-sxp-ui
18
+ # or
19
+ yarn add pb-sxp-ui
20
+ ```
21
+
22
+ ## 🔨 使用
23
+ 以 Next.js 框架为例子:
24
+
25
+ ```jsx
26
+ import { GetServerSideProps } from 'next';
27
+ import React, { FC } from 'react'
28
+ import Pagebuilder, { PageView } from 'pb-sxp-ui';
29
+
30
+ // 初始化 PageBuilder 配置
31
+ Pagebuilder.init({
32
+ tenantId: 'xxxxxxxxxx',
33
+ appId: 'xxxxxxxxx',
34
+ env: 'live' // 可选参数,默认是 live 环境
35
+ });
36
+
37
+
38
+ interface IProps {
39
+ path: string;
40
+ data: any
41
+ }
42
+
43
+ const ContentPage: FC<IProps> = ({ data ,path}) => {
44
+ return (
45
+ <PageView data={data?.data} isSsr path={path}/>
46
+ )
47
+ }
48
+
49
+ export const getServerSideProps: GetServerSideProps<IProps> = async (
50
+ context
51
+ ) => {
52
+ // 接收传来的路径
53
+ const path = context.query.path as string;
54
+ // 获取页面数据
55
+ const result = await Pagebuilder.getDetail(path)
56
+ return {
57
+ props: {
58
+ path,
59
+ data: result.data
60
+ },
61
+ };
62
+ };
63
+
64
+ export default ContentPage;
65
+
66
+ ```
67
+
68
+ ## ⌨️ 本地调试
69
+
70
+ ### 运行开发环境
71
+
72
+ ```bash
73
+ $ npm install
74
+ $ npm run start
75
+ ```
76
+
77
+ ### 生成本地开发全局链接
78
+
79
+ ```bash
80
+ npm link
81
+ # or
82
+ yarn link
83
+ ```
84
+
85
+ ### 在使用该包的项目中安装调试
86
+
87
+ ```bash
88
+ npm link pb-sxp-ui
89
+ # or
90
+ yarn link pb-sxp-ui
91
+ ```
92
+
93
+ ## 👾 发布
94
+
95
+ ### 打包线上安装包
96
+
97
+ ```bash
98
+ npm run package
99
+ # or
100
+ yarn package
101
+ ```
102
+
103
+ ### 发布 npm
104
+
105
+ ```bash
106
+ $ npm version patch|minor|major
107
+ $ npm publish
108
+
109
+ # 自动化发布包
110
+ $ npm run pub patch|minor|major|xx.xx.xx
111
+ ```
package/dist/index.cjs CHANGED
@@ -8452,10 +8452,10 @@ const CommodityDetail$1 = (_a) => {
8452
8452
  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'),
8453
8453
  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),
8454
8454
  React.createElement("div", { hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.info) || (product === null || product === void 0 ? void 0 : product.info) === '') },
8455
- 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
8456
- bold and avant-garde visual design interprets the emotional bond connecting my heart. The Tiffany Lock
8457
- collection is unisex and is inspired by the padlock pattern found in the Tiffany Antique Collection. This
8458
- necklace features a stylish and eye-catching oval clasp chain decorated with a lock pattern. Crafted from
8455
+ 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
8456
+ bold and avant-garde visual design interprets the emotional bond connecting my heart. The Tiffany Lock
8457
+ collection is unisex and is inspired by the padlock pattern found in the Tiffany Antique Collection. This
8458
+ necklace features a stylish and eye-catching oval clasp chain decorated with a lock pattern. Crafted from
8459
8459
  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 }))));
8460
8460
  };
8461
8461
  const renderBtn = () => {
@@ -8633,9 +8633,19 @@ const getMediaValueByMode = (obj) => {
8633
8633
  };
8634
8634
 
8635
8635
  const Prompt$1 = (_a) => {
8636
- var { content, btnText, style, icon, isPopup, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "onClose", "onClick"]);
8636
+ var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick"]);
8637
+ const { popupDetailData } = useSxpDataSource();
8638
+ const { jumpToWeb } = useEventReport();
8637
8639
  const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
8638
8640
  const handleOk = () => {
8641
+ var _a, _b, _c;
8642
+ if (isExternalLink) {
8643
+ const data = popupDetailData;
8644
+ const product = (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.bindProduct;
8645
+ const cta = (_c = (_b = data === null || data === void 0 ? void 0 : data.video) === null || _b === void 0 ? void 0 : _b.bindProduct) === null || _c === void 0 ? void 0 : _c.bindCta;
8646
+ const position = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
8647
+ jumpToWeb(data, product, cta, position);
8648
+ }
8639
8649
  if (!isPopup) {
8640
8650
  onClose === null || onClose === void 0 ? void 0 : onClose();
8641
8651
  }
@@ -8915,7 +8925,7 @@ const CommodityDetailDiroNew$1 = (_a) => {
8915
8925
  const productInfoText = ({ isPost }) => {
8916
8926
  return (React.createElement("div", { hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.info) || (product === null || product === void 0 ? void 0 : product.info) === '') },
8917
8927
  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) ||
8918
- `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
8928
+ `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
8919
8929
  Made in Italy` })));
8920
8930
  };
8921
8931
  return (React.createElement("div", { className: 'pb-commondityDiroNew' },
@@ -12720,12 +12730,12 @@ const Tagbar = ({ tagList = [], setActiveIndex }) => {
12720
12730
  const handleSelectTag = (tag) => () => {
12721
12731
  if (tag === selectTag)
12722
12732
  return;
12723
- let hashTag;
12733
+ let themeTag;
12724
12734
  if (tag !== DEFAULT_TAG) {
12725
- hashTag = tag;
12735
+ themeTag = tag;
12726
12736
  }
12727
12737
  setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
12728
- getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
12738
+ getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ themeTag }).then((res) => {
12729
12739
  var _a, _b, _c, _d;
12730
12740
  setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
12731
12741
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);