@builder.io/sdk-react-native 0.3.1 → 0.4.1
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/dist/blocks/button/button.js +1 -0
- package/dist/blocks/columns/columns.js +1 -0
- package/dist/blocks/custom-code/custom-code.js +1 -0
- package/dist/blocks/embed/embed.js +1 -0
- package/dist/blocks/form/form.js +1 -0
- package/dist/blocks/fragment/fragment.js +1 -0
- package/dist/blocks/img/img.js +1 -0
- package/dist/blocks/input/input.js +1 -0
- package/dist/blocks/raw-text/raw-text.js +1 -0
- package/dist/blocks/section/section.js +1 -0
- package/dist/blocks/select/select.js +1 -0
- package/dist/blocks/submit-button/submit-button.js +1 -0
- package/dist/blocks/symbol/symbol.js +1 -0
- package/dist/blocks/textarea/textarea.js +1 -0
- package/dist/components/render-block/block-styles.js +1 -0
- package/dist/components/render-block/render-block.js +7 -6
- package/dist/components/render-block/render-component.js +2 -2
- package/dist/components/render-block/render-repeated-block.js +1 -0
- package/dist/components/render-blocks.js +1 -0
- package/dist/components/render-content/builder-editing.js +1 -0
- package/dist/components/render-content/components/render-styles.js +2 -1
- package/dist/components/render-content/render-content.js +36 -3
- package/dist/components/render-content/wrap-component-ref.js +5 -0
- package/dist/components/render-content-variants/helpers.js +137 -0
- package/dist/components/render-content-variants/render-content-variants.js +73 -0
- package/dist/components/render-inlined-styles.js +2 -12
- package/dist/constants/sdk-version.js +1 -1
- package/dist/functions/get-content/generate-content-url.js +2 -2
- package/dist/functions/get-content/generate-content-url.test.js +15 -0
- package/dist/functions/get-content/index.js +36 -19
- package/dist/helpers/ab-tests.js +123 -6
- package/dist/helpers/canTrack.js +6 -0
- package/dist/helpers/cookie.js +9 -2
- package/dist/helpers/logger.js +2 -1
- package/dist/index.js +19 -10
- package/package.json +1 -1
- package/src/blocks/button/button.jsx +1 -0
- package/src/blocks/columns/columns.jsx +1 -0
- package/src/blocks/custom-code/custom-code.jsx +1 -0
- package/src/blocks/embed/embed.jsx +1 -0
- package/src/blocks/form/form.jsx +1 -0
- package/src/blocks/fragment/fragment.jsx +1 -0
- package/src/blocks/img/img.jsx +1 -0
- package/src/blocks/input/input.jsx +1 -0
- package/src/blocks/raw-text/raw-text.jsx +1 -0
- package/src/blocks/section/section.jsx +1 -0
- package/src/blocks/select/select.jsx +1 -0
- package/src/blocks/submit-button/submit-button.jsx +1 -0
- package/src/blocks/symbol/symbol.jsx +1 -0
- package/src/blocks/textarea/textarea.jsx +1 -0
- package/src/components/render-block/block-styles.jsx +1 -0
- package/src/components/render-block/render-block.jsx +8 -7
- package/src/components/render-block/render-component.jsx +3 -4
- package/src/components/render-block/render-repeated-block.jsx +1 -0
- package/src/components/render-blocks.jsx +1 -0
- package/src/components/render-content/builder-editing.jsx +1 -0
- package/src/components/render-content/components/render-styles.jsx +4 -3
- package/src/components/render-content/render-content.jsx +42 -2
- package/src/components/render-content/wrap-component-ref.js +4 -0
- package/src/components/render-content-variants/helpers.js +139 -0
- package/src/components/render-content-variants/render-content-variants.jsx +101 -0
- package/src/components/render-inlined-styles.jsx +2 -22
- package/src/constants/sdk-version.js +1 -1
- package/src/functions/get-content/generate-content-url.js +2 -1
- package/src/functions/get-content/generate-content-url.test.js +15 -0
- package/src/functions/get-content/index.js +35 -18
- package/src/helpers/ab-tests.js +132 -10
- package/src/helpers/canTrack.js +5 -0
- package/src/helpers/cookie.js +9 -2
- package/src/helpers/logger.js +2 -1
- package/src/index.js +20 -7
- package/src/functions/get-content/ab-testing.js +0 -99
package/dist/blocks/form/form.js
CHANGED
package/dist/blocks/img/img.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
4
|
if (k2 === undefined) k2 = k;
|
|
4
5
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -64,7 +65,7 @@ function RenderBlock(props) {
|
|
|
64
65
|
shouldEvaluateBindings: true,
|
|
65
66
|
});
|
|
66
67
|
}
|
|
67
|
-
const [
|
|
68
|
+
const [Tag, setTag] = (0, react_1.useState)(() => props.block.tagName || "div");
|
|
68
69
|
function canShowBlock() {
|
|
69
70
|
if ("hide" in useBlock()) {
|
|
70
71
|
return !useBlock().hide;
|
|
@@ -156,11 +157,11 @@ function RenderBlock(props) {
|
|
|
156
157
|
};
|
|
157
158
|
}
|
|
158
159
|
return (React.createElement(React.Fragment, null, canShowBlock() ? (React.createElement(React.Fragment, null, !(component === null || component === void 0 ? void 0 : component.noWrap) ? (React.createElement(React.Fragment, null,
|
|
159
|
-
(0, render_block_helpers_js_1.isEmptyHtmlElement)(
|
|
160
|
-
React.createElement(
|
|
161
|
-
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(
|
|
162
|
-
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(
|
|
163
|
-
React.createElement(
|
|
160
|
+
(0, render_block_helpers_js_1.isEmptyHtmlElement)(Tag) ? (React.createElement(React.Fragment, null,
|
|
161
|
+
React.createElement(Tag, { ...attributes(), ...actions() }))) : null,
|
|
162
|
+
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(Tag) && repeatItem() ? (React.createElement(React.Fragment, null, (_a = repeatItem()) === null || _a === void 0 ? void 0 : _a.map((data, index) => (React.createElement(render_repeated_block_1.default, { key: index, repeatContext: data.context, block: data.block }))))) : null,
|
|
163
|
+
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(Tag) && !repeatItem() ? (React.createElement(React.Fragment, null,
|
|
164
|
+
React.createElement(Tag, { ...attributes(), ...actions() },
|
|
164
165
|
React.createElement(render_component_1.default, { ...renderComponentProps() }), (_b = childrenWithoutParentComponent()) === null || _b === void 0 ? void 0 :
|
|
165
166
|
_b.map((child) => (React.createElement(RenderBlock, { key: "render-block-" + child.id, block: child, context: childrenContext() }))), (_c = childrenWithoutParentComponent()) === null || _c === void 0 ? void 0 :
|
|
166
167
|
_c.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: childrenContext() })))))) : null)) : (React.createElement(React.Fragment, null,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
4
|
if (k2 === undefined) k2 = k;
|
|
4
5
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -34,7 +35,6 @@ const render_block_1 = __importDefault(require("./render-block"));
|
|
|
34
35
|
const builder_context_js_1 = __importDefault(require("../../context/builder.context.js"));
|
|
35
36
|
function RenderComponent(props) {
|
|
36
37
|
var _a, _b;
|
|
37
|
-
const ComponentRefRef = props.componentRef;
|
|
38
38
|
return (React.createElement(builder_context_js_1.default.Provider, { value: {
|
|
39
39
|
content: props.context.content,
|
|
40
40
|
rootState: props.context.rootState,
|
|
@@ -45,7 +45,7 @@ function RenderComponent(props) {
|
|
|
45
45
|
inheritedStyles: props.context.inheritedStyles,
|
|
46
46
|
apiVersion: props.context.apiVersion,
|
|
47
47
|
} }, props.componentRef ? (React.createElement(React.Fragment, null,
|
|
48
|
-
React.createElement(
|
|
48
|
+
React.createElement(props.componentRef, { ...props.componentOptions }, (_a = props.blockChildren) === null || _a === void 0 ? void 0 :
|
|
49
49
|
_a.map((child) => (React.createElement(render_block_1.default, { key: "render-block-" + child.id, block: child, context: props.context }))), (_b = props.blockChildren) === null || _b === void 0 ? void 0 :
|
|
50
50
|
_b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: props.context })))))) : null));
|
|
51
51
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
4
|
if (k2 === undefined) k2 = k;
|
|
4
5
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -54,7 +55,7 @@ ${(0, render_styles_helpers_2.getFontCss)({
|
|
|
54
55
|
text-align: inherit;
|
|
55
56
|
font-family: inherit;
|
|
56
57
|
}
|
|
57
|
-
|
|
58
|
+
`.trim());
|
|
58
59
|
return React.createElement(render_inlined_styles_1.default, { styles: injectedStyles });
|
|
59
60
|
}
|
|
60
61
|
exports.default = RenderContentStyles;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
4
|
if (k2 === undefined) k2 = k;
|
|
4
5
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -47,6 +48,8 @@ const interaction_js_1 = require("../../functions/track/interaction.js");
|
|
|
47
48
|
const render_content_helpers_js_1 = require("./render-content.helpers.js");
|
|
48
49
|
const target_js_1 = require("../../constants/target.js");
|
|
49
50
|
const logger_js_1 = require("../../helpers/logger.js");
|
|
51
|
+
const helpers_js_1 = require("../render-content-variants/helpers.js");
|
|
52
|
+
const wrap_component_ref_js_1 = require("./wrap-component-ref.js");
|
|
50
53
|
function RenderContent(props) {
|
|
51
54
|
var _a, _b, _c, _d, _e;
|
|
52
55
|
const elementRef = (0, react_1.useRef)(null);
|
|
@@ -100,9 +103,12 @@ function RenderContent(props) {
|
|
|
100
103
|
// which is the new standard way of providing custom components, and must therefore take precedence.
|
|
101
104
|
...register_component_js_1.components,
|
|
102
105
|
...(props.customComponents || []),
|
|
103
|
-
].reduce((acc, curr) => ({
|
|
106
|
+
].reduce((acc, { component, ...curr }) => ({
|
|
104
107
|
...acc,
|
|
105
|
-
[curr.name]:
|
|
108
|
+
[curr.name]: {
|
|
109
|
+
component: target_js_1.TARGET === "vue3" ? (0, wrap_component_ref_js_1.wrapComponentRef)(component) : component,
|
|
110
|
+
...curr,
|
|
111
|
+
},
|
|
106
112
|
}), {}));
|
|
107
113
|
function processMessage(event) {
|
|
108
114
|
const { data } = event;
|
|
@@ -222,6 +228,14 @@ function RenderContent(props) {
|
|
|
222
228
|
}));
|
|
223
229
|
}
|
|
224
230
|
}
|
|
231
|
+
const [scriptStr, setScriptStr] = (0, react_1.useState)(() => {
|
|
232
|
+
var _a;
|
|
233
|
+
return (0, helpers_js_1.getRenderContentScriptString)({
|
|
234
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
235
|
+
contentId: (_a = props.content) === null || _a === void 0 ? void 0 : _a.id,
|
|
236
|
+
parentContentId: props.parentContentId,
|
|
237
|
+
});
|
|
238
|
+
});
|
|
225
239
|
(0, react_1.useEffect)(() => {
|
|
226
240
|
if (!props.apiKey) {
|
|
227
241
|
logger_js_1.logger.error("No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop.");
|
|
@@ -241,6 +255,11 @@ function RenderContent(props) {
|
|
|
241
255
|
includeRefs: props.includeRefs,
|
|
242
256
|
}
|
|
243
257
|
: {}),
|
|
258
|
+
...(props.enrich
|
|
259
|
+
? {
|
|
260
|
+
enrich: props.enrich,
|
|
261
|
+
}
|
|
262
|
+
: {}),
|
|
244
263
|
});
|
|
245
264
|
Object.values(allRegisteredComponents).forEach((registeredComponent) => {
|
|
246
265
|
var _a;
|
|
@@ -326,7 +345,21 @@ function RenderContent(props) {
|
|
|
326
345
|
registeredComponents: allRegisteredComponents,
|
|
327
346
|
inheritedStyles: {},
|
|
328
347
|
} }, useContent ? (React.createElement(React.Fragment, null,
|
|
329
|
-
React.createElement(react_native_1.ScrollView, { ref: elementRef, onClick: (event) => onClick(event), "builder-content-id": useContent === null || useContent === void 0 ? void 0 : useContent.id, "builder-model": props.model
|
|
348
|
+
React.createElement(react_native_1.ScrollView, { ref: elementRef, onClick: (event) => onClick(event), "builder-content-id": useContent === null || useContent === void 0 ? void 0 : useContent.id, "builder-model": props.model, ...(target_js_1.TARGET === "reactNative"
|
|
349
|
+
? {
|
|
350
|
+
dataSet: {
|
|
351
|
+
// currently, we can't set the actual ID here. // we don't need it right now, we just need to identify content divs for testing.
|
|
352
|
+
"builder-content-id": "",
|
|
353
|
+
},
|
|
354
|
+
}
|
|
355
|
+
: {}), ...(props.hideContent
|
|
356
|
+
? {
|
|
357
|
+
hidden: true,
|
|
358
|
+
"aria-hidden": true,
|
|
359
|
+
}
|
|
360
|
+
: {}) },
|
|
361
|
+
props.isSsrAbTest ? (React.createElement(React.Fragment, null,
|
|
362
|
+
React.createElement(react_native_1.ScrollView, { dangerouslySetInnerHTML: { __html: scriptStr } }))) : null,
|
|
330
363
|
target_js_1.TARGET !== "reactNative" ? (React.createElement(React.Fragment, null,
|
|
331
364
|
React.createElement(render_styles_1.default, { contentId: useContent === null || useContent === void 0 ? void 0 : useContent.id, cssCode: (_c = useContent === null || useContent === void 0 ? void 0 : useContent.data) === null || _c === void 0 ? void 0 : _c.cssCode, customFonts: (_d = useContent === null || useContent === void 0 ? void 0 : useContent.data) === null || _d === void 0 ? void 0 : _d.customFonts }))) : null,
|
|
332
365
|
React.createElement(render_blocks_1.default, { blocks: (_e = useContent === null || useContent === void 0 ? void 0 : useContent.data) === null || _e === void 0 ? void 0 : _e.blocks, key: forceReRenderCount })))) : null));
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getVariantsScriptString = exports.getVariants = exports.getRenderContentScriptString = exports.checkShouldRunVariants = void 0;
|
|
4
|
+
const is_browser_1 = require("../../functions/is-browser");
|
|
5
|
+
const getVariants = (content) => Object.values((content == null ? void 0 : content.variations) || {});
|
|
6
|
+
exports.getVariants = getVariants;
|
|
7
|
+
const checkShouldRunVariants = ({ canTrack, content }) => {
|
|
8
|
+
const hasVariants = getVariants(content).length > 0;
|
|
9
|
+
if (!hasVariants) {
|
|
10
|
+
return false;
|
|
11
|
+
}
|
|
12
|
+
if (!canTrack) {
|
|
13
|
+
return false;
|
|
14
|
+
}
|
|
15
|
+
if ((0, is_browser_1.isBrowser)()) {
|
|
16
|
+
return false;
|
|
17
|
+
}
|
|
18
|
+
return true;
|
|
19
|
+
};
|
|
20
|
+
exports.checkShouldRunVariants = checkShouldRunVariants;
|
|
21
|
+
function bldrAbTest(contentId, variants, isHydrationTarget2) {
|
|
22
|
+
function getAndSetVariantId() {
|
|
23
|
+
function setCookie(name, value, days) {
|
|
24
|
+
let expires = "";
|
|
25
|
+
if (days) {
|
|
26
|
+
const date = new Date();
|
|
27
|
+
date.setTime(date.getTime() + days * 24 * 60 * 60 * 1e3);
|
|
28
|
+
expires = "; expires=" + date.toUTCString();
|
|
29
|
+
}
|
|
30
|
+
document.cookie = name + "=" + (value || "") + expires + "; path=/; Secure; SameSite=None";
|
|
31
|
+
}
|
|
32
|
+
function getCookie(name) {
|
|
33
|
+
const nameEQ = name + "=";
|
|
34
|
+
const ca = document.cookie.split(";");
|
|
35
|
+
for (let i = 0; i < ca.length; i++) {
|
|
36
|
+
let c = ca[i];
|
|
37
|
+
while (c.charAt(0) === " ")
|
|
38
|
+
c = c.substring(1, c.length);
|
|
39
|
+
if (c.indexOf(nameEQ) === 0)
|
|
40
|
+
return c.substring(nameEQ.length, c.length);
|
|
41
|
+
}
|
|
42
|
+
return null;
|
|
43
|
+
}
|
|
44
|
+
const cookieName = `builder.tests.${contentId}`;
|
|
45
|
+
const variantInCookie = getCookie(cookieName);
|
|
46
|
+
const availableIDs = variants.map((vr) => vr.id).concat(contentId);
|
|
47
|
+
if (variantInCookie && availableIDs.includes(variantInCookie)) {
|
|
48
|
+
return variantInCookie;
|
|
49
|
+
}
|
|
50
|
+
let n = 0;
|
|
51
|
+
const random = Math.random();
|
|
52
|
+
for (let i = 0; i < variants.length; i++) {
|
|
53
|
+
const variant = variants[i];
|
|
54
|
+
const testRatio = variant.testRatio;
|
|
55
|
+
n += testRatio;
|
|
56
|
+
if (random < n) {
|
|
57
|
+
setCookie(cookieName, variant.id);
|
|
58
|
+
return variant.id;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
setCookie(cookieName, contentId);
|
|
62
|
+
return contentId;
|
|
63
|
+
}
|
|
64
|
+
const winningVariantId = getAndSetVariantId();
|
|
65
|
+
const styleEl = document.getElementById(`variants-styles-${contentId}`);
|
|
66
|
+
if (isHydrationTarget2) {
|
|
67
|
+
styleEl.remove();
|
|
68
|
+
const thisScriptEl = document.getElementById(`variants-script-${contentId}`);
|
|
69
|
+
thisScriptEl == null ? void 0 : thisScriptEl.remove();
|
|
70
|
+
}
|
|
71
|
+
else {
|
|
72
|
+
const newStyleStr = variants.concat({ id: contentId }).filter((variant) => variant.id !== winningVariantId).map((value) => {
|
|
73
|
+
return `.variant-${value.id} { display: none; }
|
|
74
|
+
`;
|
|
75
|
+
}).join("");
|
|
76
|
+
styleEl.innerHTML = newStyleStr;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
function bldrCntntScrpt(variantContentId, defaultContentId, isHydrationTarget2) {
|
|
80
|
+
if (!navigator.cookieEnabled) {
|
|
81
|
+
return;
|
|
82
|
+
}
|
|
83
|
+
function getCookie(name) {
|
|
84
|
+
const nameEQ = name + "=";
|
|
85
|
+
const ca = document.cookie.split(";");
|
|
86
|
+
for (let i = 0; i < ca.length; i++) {
|
|
87
|
+
let c = ca[i];
|
|
88
|
+
while (c.charAt(0) === " ")
|
|
89
|
+
c = c.substring(1, c.length);
|
|
90
|
+
if (c.indexOf(nameEQ) === 0)
|
|
91
|
+
return c.substring(nameEQ.length, c.length);
|
|
92
|
+
}
|
|
93
|
+
return null;
|
|
94
|
+
}
|
|
95
|
+
const cookieName = `builder.tests.${defaultContentId}`;
|
|
96
|
+
const variantId = getCookie(cookieName);
|
|
97
|
+
const parentDiv = document.querySelector(`[builder-content-id="${variantContentId}"]`);
|
|
98
|
+
const variantIsDefaultContent = variantContentId === defaultContentId;
|
|
99
|
+
if (variantId === variantContentId) {
|
|
100
|
+
if (variantIsDefaultContent) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
parentDiv == null ? void 0 : parentDiv.removeAttribute("hidden");
|
|
104
|
+
parentDiv == null ? void 0 : parentDiv.removeAttribute("aria-hidden");
|
|
105
|
+
}
|
|
106
|
+
else {
|
|
107
|
+
if (variantIsDefaultContent) {
|
|
108
|
+
if (isHydrationTarget2) {
|
|
109
|
+
parentDiv == null ? void 0 : parentDiv.remove();
|
|
110
|
+
}
|
|
111
|
+
else {
|
|
112
|
+
parentDiv == null ? void 0 : parentDiv.setAttribute("hidden", "true");
|
|
113
|
+
parentDiv == null ? void 0 : parentDiv.setAttribute("aria-hidden", "true");
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
120
|
+
const isHydrationTarget = (target) => target === "react" || target === "reactNative" || target === "vue3" || target === "vue2";
|
|
121
|
+
const AB_TEST_FN_NAME = "bldrAbTest";
|
|
122
|
+
const CONTENT_FN_NAME = "bldrCntntScrpt";
|
|
123
|
+
const getVariantsScriptString = (variants, contentId) => {
|
|
124
|
+
const fnStr = bldrAbTest.toString().replace(/\s+/g, " ");
|
|
125
|
+
const fnStr2 = bldrCntntScrpt.toString().replace(/\s+/g, " ");
|
|
126
|
+
return `
|
|
127
|
+
const ${AB_TEST_FN_NAME} = ${fnStr}
|
|
128
|
+
const ${CONTENT_FN_NAME} = ${fnStr2}
|
|
129
|
+
${AB_TEST_FN_NAME}("${contentId}", ${JSON.stringify(variants)}, ${isHydrationTarget})
|
|
130
|
+
`;
|
|
131
|
+
};
|
|
132
|
+
exports.getVariantsScriptString = getVariantsScriptString;
|
|
133
|
+
const getRenderContentScriptString = ({ parentContentId, contentId }) => {
|
|
134
|
+
return `
|
|
135
|
+
${CONTENT_FN_NAME}("${contentId}", "${parentContentId}", ${isHydrationTarget})`;
|
|
136
|
+
};
|
|
137
|
+
exports.getRenderContentScriptString = getRenderContentScriptString;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
+
if (k2 === undefined) k2 = k;
|
|
5
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
+
}
|
|
9
|
+
Object.defineProperty(o, k2, desc);
|
|
10
|
+
}) : (function(o, m, k, k2) {
|
|
11
|
+
if (k2 === undefined) k2 = k;
|
|
12
|
+
o[k2] = m[k];
|
|
13
|
+
}));
|
|
14
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
+
}) : function(o, v) {
|
|
17
|
+
o["default"] = v;
|
|
18
|
+
});
|
|
19
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
20
|
+
if (mod && mod.__esModule) return mod;
|
|
21
|
+
var result = {};
|
|
22
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
23
|
+
__setModuleDefault(result, mod);
|
|
24
|
+
return result;
|
|
25
|
+
};
|
|
26
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
27
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
28
|
+
};
|
|
29
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
|
+
const React = __importStar(require("react"));
|
|
31
|
+
const react_native_1 = require("react-native");
|
|
32
|
+
const react_1 = require("react");
|
|
33
|
+
const helpers_1 = require("./helpers");
|
|
34
|
+
const render_content_1 = __importDefault(require("../render-content/render-content"));
|
|
35
|
+
const canTrack_1 = require("../../helpers/canTrack");
|
|
36
|
+
const render_inlined_styles_1 = __importDefault(require("../render-inlined-styles"));
|
|
37
|
+
const ab_tests_1 = require("../../helpers/ab-tests");
|
|
38
|
+
function RenderContentVariants(props) {
|
|
39
|
+
var _a, _b, _c, _d, _e;
|
|
40
|
+
const [variantScriptStr, setVariantScriptStr] = (0, react_1.useState)(() => {
|
|
41
|
+
var _a;
|
|
42
|
+
return (0, helpers_1.getVariantsScriptString)((0, helpers_1.getVariants)(props.content).map((value) => ({
|
|
43
|
+
id: value.id,
|
|
44
|
+
testRatio: value.testRatio,
|
|
45
|
+
})), ((_a = props.content) === null || _a === void 0 ? void 0 : _a.id) || "");
|
|
46
|
+
});
|
|
47
|
+
const [shouldRenderVariants, setShouldRenderVariants] = (0, react_1.useState)(() => (0, helpers_1.checkShouldRunVariants)({
|
|
48
|
+
canTrack: (0, canTrack_1.getDefaultCanTrack)(props.canTrack),
|
|
49
|
+
content: props.content,
|
|
50
|
+
}));
|
|
51
|
+
const [hideVariantsStyleString, setHideVariantsStyleString] = (0, react_1.useState)(() => (0, helpers_1.getVariants)(props.content)
|
|
52
|
+
.map((value) => `.variant-${value.id} { display: none; } `)
|
|
53
|
+
.join(""));
|
|
54
|
+
const [contentToRender, setContentToRender] = (0, react_1.useState)(() => (0, helpers_1.checkShouldRunVariants)({
|
|
55
|
+
canTrack: (0, canTrack_1.getDefaultCanTrack)(props.canTrack),
|
|
56
|
+
content: props.content,
|
|
57
|
+
})
|
|
58
|
+
? props.content
|
|
59
|
+
: (0, ab_tests_1.handleABTestingSync)({
|
|
60
|
+
item: props.content,
|
|
61
|
+
canTrack: (0, canTrack_1.getDefaultCanTrack)(props.canTrack),
|
|
62
|
+
}));
|
|
63
|
+
return (React.createElement(React.Fragment, null,
|
|
64
|
+
shouldRenderVariants ? (React.createElement(React.Fragment, null,
|
|
65
|
+
React.createElement(render_inlined_styles_1.default, { id: `variants-styles-${(_a = props.content) === null || _a === void 0 ? void 0 : _a.id}`, styles: hideVariantsStyleString }),
|
|
66
|
+
React.createElement(react_native_1.View, { id: `variants-script-${(_b = props.content) === null || _b === void 0 ? void 0 : _b.id}`, dangerouslySetInnerHTML: { __html: variantScriptStr } }), (_c = (0, helpers_1.getVariants)(props.content)) === null || _c === void 0 ? void 0 :
|
|
67
|
+
_c.map((variant) => {
|
|
68
|
+
var _a;
|
|
69
|
+
return (React.createElement(render_content_1.default, { key: variant.id, content: variant, apiKey: props.apiKey, apiVersion: props.apiVersion, canTrack: props.canTrack, customComponents: props.customComponents, hideContent: true, parentContentId: (_a = props.content) === null || _a === void 0 ? void 0 : _a.id, isSsrAbTest: shouldRenderVariants }));
|
|
70
|
+
}))) : null,
|
|
71
|
+
React.createElement(render_content_1.default, { model: props.model, content: contentToRender, apiKey: props.apiKey, apiVersion: props.apiVersion, canTrack: props.canTrack, customComponents: props.customComponents, classNameProp: `variant-${(_d = props.content) === null || _d === void 0 ? void 0 : _d.id}`, parentContentId: (_e = props.content) === null || _e === void 0 ? void 0 : _e.id, isSsrAbTest: shouldRenderVariants })));
|
|
72
|
+
}
|
|
73
|
+
exports.default = RenderContentVariants;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
4
|
if (k2 === undefined) k2 = k;
|
|
4
5
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -25,18 +26,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
25
26
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
27
|
const React = __importStar(require("react"));
|
|
27
28
|
const react_native_1 = require("react-native");
|
|
28
|
-
const target_js_1 = require("../constants/target.js");
|
|
29
29
|
function RenderInlinedStyles(props) {
|
|
30
|
-
|
|
31
|
-
// NOTE: we have to obfuscate the name of the tag due to a limitation in the svelte-preprocessor plugin.
|
|
32
|
-
// https://github.com/sveltejs/vite-plugin-svelte/issues/315#issuecomment-1109000027
|
|
33
|
-
return "sty" + "le";
|
|
34
|
-
}
|
|
35
|
-
function injectedStyleScript() {
|
|
36
|
-
return `<${tag()}>${props.styles}</${tag()}>`;
|
|
37
|
-
}
|
|
38
|
-
return (React.createElement(React.Fragment, null, target_js_1.TARGET === "svelte" || target_js_1.TARGET === "qwik" ? (React.createElement(React.Fragment, null,
|
|
39
|
-
React.createElement(react_native_1.View, { dangerouslySetInnerHTML: { __html: props.styles } }))) : (React.createElement(react_native_1.View, null,
|
|
40
|
-
React.createElement(react_native_1.Text, null, props.styles)))));
|
|
30
|
+
return (React.createElement(react_native_1.View, { dangerouslySetInnerHTML: { __html: props.styles }, id: props.id }));
|
|
41
31
|
}
|
|
42
32
|
exports.default = RenderInlinedStyles;
|
|
@@ -21,14 +21,14 @@ const flatten_js_1 = require("../../helpers/flatten.js");
|
|
|
21
21
|
const index_js_1 = require("../get-builder-search-params/index.js");
|
|
22
22
|
const api_version_1 = require("../../types/api-version");
|
|
23
23
|
const generateContentUrl = (options) => {
|
|
24
|
-
const { limit = 30, userAttributes, query, noTraverse = false, model, apiKey, includeRefs = true, locale, apiVersion = api_version_1.DEFAULT_API_VERSION } = options;
|
|
24
|
+
const { limit = 30, userAttributes, query, noTraverse = false, model, apiKey, includeRefs = true, enrich, locale, apiVersion = api_version_1.DEFAULT_API_VERSION } = options;
|
|
25
25
|
if (!apiKey) {
|
|
26
26
|
throw new Error("Missing API key");
|
|
27
27
|
}
|
|
28
28
|
if (!["v2", "v3"].includes(apiVersion)) {
|
|
29
29
|
throw new Error(`Invalid apiVersion: expected 'v2' or 'v3', received '${apiVersion}'`);
|
|
30
30
|
}
|
|
31
|
-
const url = new URL(`https://cdn.builder.io/api/${apiVersion}/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}${locale ? `&locale=${locale}` : ""}`);
|
|
31
|
+
const url = new URL(`https://cdn.builder.io/api/${apiVersion}/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}${locale ? `&locale=${locale}` : ""}${enrich ? `&enrich=${enrich}` : ""}`);
|
|
32
32
|
const queryOptions = __spreadValues(__spreadValues({}, (0, index_js_1.getBuilderSearchParamsFromWindow)()), (0, index_js_1.normalizeSearchParams)(options.options || {}));
|
|
33
33
|
const flattened = (0, flatten_js_1.flatten)(queryOptions);
|
|
34
34
|
for (const key in flattened) {
|
|
@@ -81,4 +81,19 @@ describe("Generate Content URL", () => {
|
|
|
81
81
|
});
|
|
82
82
|
}).toThrow(`Invalid apiVersion: expected 'v2' or 'v3', received 'INVALID_API_VERSION'`);
|
|
83
83
|
});
|
|
84
|
+
test("generate content url with enrich option true", () => {
|
|
85
|
+
const output = (0, generate_content_url_1.generateContentUrl)({
|
|
86
|
+
apiKey: testKey,
|
|
87
|
+
model: testModel,
|
|
88
|
+
enrich: true
|
|
89
|
+
});
|
|
90
|
+
expect(output).toMatchSnapshot();
|
|
91
|
+
});
|
|
92
|
+
test("generate content url with enrich option not present", () => {
|
|
93
|
+
const output = (0, generate_content_url_1.generateContentUrl)({
|
|
94
|
+
apiKey: testKey,
|
|
95
|
+
model: testModel
|
|
96
|
+
});
|
|
97
|
+
expect(output).toMatchSnapshot();
|
|
98
|
+
});
|
|
84
99
|
});
|