@builder.io/sdk-react-native 0.0.13 → 0.0.14
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/package.json +2 -1
- package/src/components/render-block/render-block.js +9 -6
- package/src/components/render-content/render-content.js +13 -4
- package/src/functions/evaluate.js +4 -3
- package/src/functions/get-block-actions-handler.js +8 -9
- package/src/functions/get-block-actions.js +2 -2
- package/src/functions/get-builder-search-params/index.js +2 -1
- package/src/functions/get-content/index.js +4 -3
- package/src/functions/track.js +4 -0
- package/src/scripts/init-editing.js +10 -4
- package/src/functions/mark-mutable.js +0 -10
package/package.json
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@builder.io/sdk-react-native",
|
|
3
3
|
"description": "Builder.io SDK for React Native",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.14",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"files": [
|
|
7
7
|
"src"
|
|
8
8
|
],
|
|
9
9
|
"scripts": {
|
|
10
|
+
"build": "echo 'no need to build react-native SDK'",
|
|
10
11
|
"release:patch": "npm version patch --no-git-tag-version && npm publish --access public",
|
|
11
12
|
"release:dev": "npm version prerelease --no-git-tag-version && npm publish --tag dev --access public"
|
|
12
13
|
},
|
|
@@ -80,12 +80,15 @@ function RenderBlock(props) {
|
|
|
80
80
|
shouldEvaluateBindings: true
|
|
81
81
|
});
|
|
82
82
|
}
|
|
83
|
-
function
|
|
84
|
-
return
|
|
83
|
+
function actions() {
|
|
84
|
+
return getBlockActions({
|
|
85
85
|
block: useBlock(),
|
|
86
86
|
state: props.context.state,
|
|
87
87
|
context: props.context.context
|
|
88
|
-
})
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
function attributes() {
|
|
91
|
+
return __spreadValues(__spreadValues({}, getBlockProperties(useBlock())), TARGET === "reactNative" ? {
|
|
89
92
|
style: getReactNativeBlockStyles({
|
|
90
93
|
block: useBlock(),
|
|
91
94
|
context: props.context
|
|
@@ -102,7 +105,7 @@ function RenderBlock(props) {
|
|
|
102
105
|
blockChildren: useChildren(),
|
|
103
106
|
componentRef: (_a2 = component == null ? void 0 : component()) == null ? void 0 : _a2.component,
|
|
104
107
|
componentOptions: __spreadValues(__spreadValues({}, getBlockComponentOptions(useBlock())), shouldWrap() ? {} : {
|
|
105
|
-
attributes: attributes()
|
|
108
|
+
attributes: __spreadValues(__spreadValues({}, attributes()), actions())
|
|
106
109
|
}),
|
|
107
110
|
context: childrenContext()
|
|
108
111
|
};
|
|
@@ -175,11 +178,11 @@ function RenderBlock(props) {
|
|
|
175
178
|
}
|
|
176
179
|
const [componentInfo, setComponentInfo] = useState(() => null);
|
|
177
180
|
const RenderComponentTagRef = renderComponentTag();
|
|
178
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, shouldWrap() ? /* @__PURE__ */ React.createElement(React.Fragment, null, isEmptyHtmlElement(tag()) ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues({}, attributes()))) : null, !isEmptyHtmlElement(tag()) && repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = repeatItemData()) == null ? void 0 : _a.map((data, index) => /* @__PURE__ */ React.createElement(RenderRepeatedBlock, {
|
|
181
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, shouldWrap() ? /* @__PURE__ */ React.createElement(React.Fragment, null, isEmptyHtmlElement(tag()) ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues(__spreadValues({}, attributes()), actions()))) : null, !isEmptyHtmlElement(tag()) && repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = repeatItemData()) == null ? void 0 : _a.map((data, index) => /* @__PURE__ */ React.createElement(RenderRepeatedBlock, {
|
|
179
182
|
key: index,
|
|
180
183
|
repeatContext: data.context,
|
|
181
184
|
block: data.block
|
|
182
|
-
}))) : null, !isEmptyHtmlElement(tag()) && !repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues({}, attributes()), /* @__PURE__ */ React.createElement(RenderComponentTagRef, __spreadValues({}, renderComponentProps())), (_b = childrenWithoutParentComponent()) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
|
|
185
|
+
}))) : null, !isEmptyHtmlElement(tag()) && !repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues(__spreadValues({}, attributes()), actions()), /* @__PURE__ */ React.createElement(RenderComponentTagRef, __spreadValues({}, renderComponentProps())), (_b = childrenWithoutParentComponent()) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
|
|
183
186
|
key: "render-block-" + child.id,
|
|
184
187
|
block: child,
|
|
185
188
|
context: childrenContext()
|
|
@@ -22,7 +22,6 @@ import { View } from "react-native";
|
|
|
22
22
|
import { useState, useRef, useEffect } from "react";
|
|
23
23
|
import { getDefaultRegisteredComponents } from "../../constants/builder-registered-components.js";
|
|
24
24
|
import { TARGET } from "../../constants/target.js";
|
|
25
|
-
import BuilderContext from "../../context/builder.context.js";
|
|
26
25
|
import { evaluate } from "../../functions/evaluate.js";
|
|
27
26
|
import { getContent } from "../../functions/get-content/index.js";
|
|
28
27
|
import { getFetch } from "../../functions/get-fetch.js";
|
|
@@ -36,6 +35,7 @@ import {
|
|
|
36
35
|
import { _track } from "../../functions/track.js";
|
|
37
36
|
import RenderBlocks from "../render-blocks.js";
|
|
38
37
|
import RenderContentStyles from "./components/render-styles.js";
|
|
38
|
+
import BuilderContext from "../../context/builder.context.js";
|
|
39
39
|
import {
|
|
40
40
|
registerInsertMenu,
|
|
41
41
|
setupBrowserForEditing
|
|
@@ -62,7 +62,9 @@ function RenderContent(props) {
|
|
|
62
62
|
const [overrideState, setOverrideState] = useState(() => ({}));
|
|
63
63
|
function contentState() {
|
|
64
64
|
var _a2, _b2;
|
|
65
|
-
return __spreadValues(__spreadValues(__spreadValues({}, (_b2 = (_a2 = props.content) == null ? void 0 : _a2.data) == null ? void 0 : _b2.state), props.data),
|
|
65
|
+
return __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, (_b2 = (_a2 = props.content) == null ? void 0 : _a2.data) == null ? void 0 : _b2.state), props.data), props.locale ? {
|
|
66
|
+
locale: props.locale
|
|
67
|
+
} : {}), overrideState);
|
|
66
68
|
}
|
|
67
69
|
function contextContext() {
|
|
68
70
|
return props.context || {};
|
|
@@ -174,11 +176,18 @@ function RenderContent(props) {
|
|
|
174
176
|
}
|
|
175
177
|
useEffect(() => {
|
|
176
178
|
var _a2, _b2;
|
|
179
|
+
if (!props.apiKey) {
|
|
180
|
+
console.error("[Builder.io]: No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop.");
|
|
181
|
+
}
|
|
177
182
|
if (isBrowser()) {
|
|
178
183
|
if (isEditing()) {
|
|
179
184
|
setForceReRenderCount(forceReRenderCount + 1);
|
|
180
185
|
registerInsertMenu();
|
|
181
|
-
setupBrowserForEditing(
|
|
186
|
+
setupBrowserForEditing(__spreadValues(__spreadValues({}, props.locale ? {
|
|
187
|
+
locale: props.locale
|
|
188
|
+
} : {}), props.includeRefs ? {
|
|
189
|
+
includeRefs: props.includeRefs
|
|
190
|
+
} : {}));
|
|
182
191
|
Object.values(allRegisteredComponents()).forEach((registeredComponent) => {
|
|
183
192
|
var _a3;
|
|
184
193
|
const message = createRegisterComponentMessage(registeredComponent);
|
|
@@ -221,7 +230,7 @@ function RenderContent(props) {
|
|
|
221
230
|
}, []);
|
|
222
231
|
useEffect(() => {
|
|
223
232
|
evaluateJsCode();
|
|
224
|
-
}, [(_b = (_a = useContent == null ? void 0 : useContent()) == null ? void 0 : _a.data) == null ? void 0 : _b.jsCode]);
|
|
233
|
+
}, [(_b = (_a = useContent == null ? void 0 : useContent()) == null ? void 0 : _a.data) == null ? void 0 : _b.jsCode, contentState()]);
|
|
225
234
|
useEffect(() => {
|
|
226
235
|
runHttpRequests();
|
|
227
236
|
}, [(_d = (_c = useContent == null ? void 0 : useContent()) == null ? void 0 : _c.data) == null ? void 0 : _d.httpRequests]);
|
|
@@ -4,7 +4,8 @@ function evaluate({
|
|
|
4
4
|
code,
|
|
5
5
|
context,
|
|
6
6
|
state,
|
|
7
|
-
event
|
|
7
|
+
event,
|
|
8
|
+
isExpression = true
|
|
8
9
|
}) {
|
|
9
10
|
if (code === "") {
|
|
10
11
|
console.warn("Skipping evaluation of empty code block.");
|
|
@@ -15,12 +16,12 @@ function evaluate({
|
|
|
15
16
|
isBrowser: isBrowser(),
|
|
16
17
|
isServer: !isBrowser()
|
|
17
18
|
};
|
|
18
|
-
const useReturn = !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "));
|
|
19
|
+
const useReturn = isExpression && !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "));
|
|
19
20
|
const useCode = useReturn ? `return (${code});` : code;
|
|
20
21
|
try {
|
|
21
22
|
return new Function("builder", "Builder", "state", "context", "event", useCode)(builder, builder, state, context, event);
|
|
22
23
|
} catch (e) {
|
|
23
|
-
console.warn("Builder custom code error: \n While Evaluating: \n ", useCode, "\n", e
|
|
24
|
+
console.warn("Builder custom code error: \n While Evaluating: \n ", useCode, "\n", e);
|
|
24
25
|
}
|
|
25
26
|
}
|
|
26
27
|
export {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { evaluate } from "./evaluate.js";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
}
|
|
2
|
+
const createEventHandler = (value, options) => (event) => evaluate({
|
|
3
|
+
code: value,
|
|
4
|
+
context: options.context,
|
|
5
|
+
state: options.state,
|
|
6
|
+
event,
|
|
7
|
+
isExpression: false
|
|
8
|
+
});
|
|
10
9
|
export {
|
|
11
|
-
|
|
10
|
+
createEventHandler
|
|
12
11
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getEventHandlerName } from "./event-handler-name.js";
|
|
2
|
-
import {
|
|
2
|
+
import { createEventHandler } from "./get-block-actions-handler.js";
|
|
3
3
|
function getBlockActions(options) {
|
|
4
4
|
var _a;
|
|
5
5
|
const obj = {};
|
|
@@ -9,7 +9,7 @@ function getBlockActions(options) {
|
|
|
9
9
|
continue;
|
|
10
10
|
}
|
|
11
11
|
const value = optionActions[key];
|
|
12
|
-
obj[getEventHandlerName(key)] =
|
|
12
|
+
obj[getEventHandlerName(key)] = createEventHandler(value, options);
|
|
13
13
|
}
|
|
14
14
|
return obj;
|
|
15
15
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { isBrowser } from "../is-browser.js";
|
|
2
2
|
const BUILDER_SEARCHPARAMS_PREFIX = "builder.";
|
|
3
|
+
const BUILDER_OPTIONS_PREFIX = "options.";
|
|
3
4
|
const convertSearchParamsToQueryObject = (searchParams) => {
|
|
4
5
|
const options = {};
|
|
5
6
|
searchParams.forEach((value, key) => {
|
|
@@ -15,7 +16,7 @@ const getBuilderSearchParams = (_options) => {
|
|
|
15
16
|
const newOptions = {};
|
|
16
17
|
Object.keys(options).forEach((key) => {
|
|
17
18
|
if (key.startsWith(BUILDER_SEARCHPARAMS_PREFIX)) {
|
|
18
|
-
const trimmedKey = key.replace(BUILDER_SEARCHPARAMS_PREFIX, "");
|
|
19
|
+
const trimmedKey = key.replace(BUILDER_SEARCHPARAMS_PREFIX, "").replace(BUILDER_OPTIONS_PREFIX, "");
|
|
19
20
|
newOptions[trimmedKey] = options[key];
|
|
20
21
|
}
|
|
21
22
|
});
|
|
@@ -57,12 +57,13 @@ const generateContentUrl = (options) => {
|
|
|
57
57
|
noTraverse = false,
|
|
58
58
|
model,
|
|
59
59
|
apiKey,
|
|
60
|
-
includeRefs = true
|
|
60
|
+
includeRefs = true,
|
|
61
|
+
locale
|
|
61
62
|
} = options;
|
|
62
63
|
if (!apiKey) {
|
|
63
64
|
throw new Error("Missing API key");
|
|
64
65
|
}
|
|
65
|
-
const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}`);
|
|
66
|
+
const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}${locale ? `&locale=${locale}` : ""}`);
|
|
66
67
|
const queryOptions = __spreadValues(__spreadValues({}, getBuilderSearchParamsFromWindow()), normalizeSearchParams(options.options || {}));
|
|
67
68
|
const flattened = flatten(queryOptions);
|
|
68
69
|
for (const key in flattened) {
|
|
@@ -85,7 +86,7 @@ function getAllContent(options) {
|
|
|
85
86
|
const fetch = yield getFetch();
|
|
86
87
|
const content = yield fetch(url.href).then((res) => res.json());
|
|
87
88
|
const canTrack = options.canTrack !== false;
|
|
88
|
-
if (canTrack) {
|
|
89
|
+
if (canTrack && Array.isArray(content.results)) {
|
|
89
90
|
for (const item of content.results) {
|
|
90
91
|
yield handleABTesting({ item, canTrack });
|
|
91
92
|
}
|
package/src/functions/track.js
CHANGED
|
@@ -90,6 +90,10 @@ const createEvent = (_a) => __async(void 0, null, function* () {
|
|
|
90
90
|
});
|
|
91
91
|
function _track(eventProps) {
|
|
92
92
|
return __async(this, null, function* () {
|
|
93
|
+
if (!eventProps.apiKey) {
|
|
94
|
+
console.error("[Builder.io]: Missing API key for track call. Please provide your API key.");
|
|
95
|
+
return;
|
|
96
|
+
}
|
|
93
97
|
if (!eventProps.canTrack) {
|
|
94
98
|
return;
|
|
95
99
|
}
|
|
@@ -20,8 +20,8 @@ const registerInsertMenu = () => {
|
|
|
20
20
|
});
|
|
21
21
|
};
|
|
22
22
|
let isSetupForEditing = false;
|
|
23
|
-
const setupBrowserForEditing = () => {
|
|
24
|
-
var _a;
|
|
23
|
+
const setupBrowserForEditing = (options = {}) => {
|
|
24
|
+
var _a, _b;
|
|
25
25
|
if (isSetupForEditing) {
|
|
26
26
|
return;
|
|
27
27
|
}
|
|
@@ -36,8 +36,14 @@ const setupBrowserForEditing = () => {
|
|
|
36
36
|
supportsCustomBreakpoints: true
|
|
37
37
|
}
|
|
38
38
|
}, "*");
|
|
39
|
+
(_b = window.parent) == null ? void 0 : _b.postMessage({
|
|
40
|
+
type: "builder.updateContent",
|
|
41
|
+
data: {
|
|
42
|
+
options
|
|
43
|
+
}
|
|
44
|
+
}, "*");
|
|
39
45
|
window.addEventListener("message", ({ data }) => {
|
|
40
|
-
var _a2,
|
|
46
|
+
var _a2, _b2;
|
|
41
47
|
if (!(data == null ? void 0 : data.type)) {
|
|
42
48
|
return;
|
|
43
49
|
}
|
|
@@ -69,7 +75,7 @@ const setupBrowserForEditing = () => {
|
|
|
69
75
|
}, "*");
|
|
70
76
|
}).catch(console.error);
|
|
71
77
|
} else {
|
|
72
|
-
(
|
|
78
|
+
(_b2 = window.parent) == null ? void 0 : _b2.postMessage({
|
|
73
79
|
type: "builder.evaluateResult",
|
|
74
80
|
data: { result, id }
|
|
75
81
|
}, "*");
|