@builder.io/sdk-react-native 0.1.3 → 0.1.5
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/columns/columns.js +4 -4
- package/dist/blocks/form/form.js +6 -6
- package/dist/blocks/symbol/symbol.js +2 -2
- package/dist/components/render-block/block-styles.js +2 -2
- package/dist/components/render-block/render-block.js +25 -7
- package/dist/components/render-block/render-component.js +4 -4
- package/dist/components/render-block/render-repeated-block.js +3 -2
- package/dist/components/render-blocks.js +4 -4
- package/dist/components/render-content/components/render-styles.helpers.js +55 -0
- package/dist/components/render-content/components/render-styles.js +14 -58
- package/dist/components/render-content/index.js +2 -2
- package/dist/components/render-content/render-content.helpers.js +42 -0
- package/dist/components/render-content/render-content.js +72 -73
- package/dist/components/render-content/render-content.types.js +1 -0
- package/dist/components/render-inlined-styles.js +2 -2
- package/dist/constants/builder-registered-components.js +14 -14
- package/dist/context/builder.context.js +2 -0
- package/dist/index-helpers/blocks-exports.js +16 -16
- package/dist/types/input.js +1 -0
- package/package.json +1 -1
- package/src/blocks/columns/columns.jsx +2 -2
- package/src/blocks/form/form.jsx +2 -2
- package/src/blocks/symbol/symbol.jsx +1 -1
- package/src/components/render-block/block-styles.jsx +1 -1
- package/src/components/render-block/render-block.jsx +25 -4
- package/src/components/render-block/render-component.jsx +2 -2
- package/src/components/render-block/render-repeated-block.jsx +2 -1
- package/src/components/render-blocks.jsx +2 -2
- package/src/components/render-content/components/render-styles.helpers.js +57 -0
- package/src/components/render-content/components/render-styles.jsx +14 -57
- package/src/components/render-content/index.js +1 -1
- package/src/components/render-content/render-content.helpers.js +48 -0
- package/src/components/render-content/render-content.jsx +78 -69
- package/src/components/render-content/render-content.types.js +0 -0
- package/src/components/render-inlined-styles.jsx +2 -2
- package/src/constants/builder-registered-components.js +7 -7
- package/src/context/builder.context.js +2 -0
- package/src/index-helpers/blocks-exports.js +8 -8
- package/src/types/input.js +0 -0
|
@@ -28,9 +28,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
const React = __importStar(require("react"));
|
|
30
30
|
const react_native_1 = require("react-native");
|
|
31
|
-
const
|
|
31
|
+
const render_blocks_1 = __importDefault(require("../../components/render-blocks"));
|
|
32
32
|
const device_sizes_1 = require("../../constants/device-sizes");
|
|
33
|
-
const
|
|
33
|
+
const render_inlined_styles_1 = __importDefault(require("../../components/render-inlined-styles"));
|
|
34
34
|
const target_js_1 = require("../../constants/target.js");
|
|
35
35
|
const css_1 = require("../../helpers/css");
|
|
36
36
|
function Columns(props) {
|
|
@@ -136,9 +136,9 @@ function Columns(props) {
|
|
|
136
136
|
}
|
|
137
137
|
return (React.createElement(react_native_1.View, { style: styles.view1 },
|
|
138
138
|
target_js_1.TARGET !== "reactNative" ? (React.createElement(React.Fragment, null,
|
|
139
|
-
React.createElement(
|
|
139
|
+
React.createElement(render_inlined_styles_1.default, { styles: columnsStyles() }))) : null, (_a = props.columns) === null || _a === void 0 ? void 0 :
|
|
140
140
|
_a.map((column, index) => (React.createElement(react_native_1.View, { style: styles.view2, key: index },
|
|
141
|
-
React.createElement(
|
|
141
|
+
React.createElement(render_blocks_1.default, { blocks: column.blocks, path: `component.options.columns.${index}.blocks`, parent: props.builderBlock.id, styleProp: {
|
|
142
142
|
flexGrow: "1",
|
|
143
143
|
} }))))));
|
|
144
144
|
}
|
package/dist/blocks/form/form.js
CHANGED
|
@@ -30,8 +30,8 @@ const BaseText_1 = __importDefault(require("../BaseText"));
|
|
|
30
30
|
const React = __importStar(require("react"));
|
|
31
31
|
const react_native_1 = require("react-native");
|
|
32
32
|
const react_1 = require("react");
|
|
33
|
-
const
|
|
34
|
-
const
|
|
33
|
+
const render_block_1 = __importDefault(require("../../components/render-block/render-block"));
|
|
34
|
+
const render_blocks_1 = __importDefault(require("../../components/render-blocks"));
|
|
35
35
|
const is_editing_js_1 = require("../../functions/is-editing.js");
|
|
36
36
|
function FormComponent(props) {
|
|
37
37
|
var _a, _b;
|
|
@@ -208,13 +208,13 @@ function FormComponent(props) {
|
|
|
208
208
|
const builderContext = (0, react_1.useContext)(BuilderContext);
|
|
209
209
|
return (React.createElement(react_native_1.View, { validate: props.validate, ref: formRef, action: !props.sendWithJs && props.action, method: props.method, name: props.name, onSubmit: (event) => onSubmit(event), ...props.attributes },
|
|
210
210
|
" ",
|
|
211
|
-
props.builderBlock && props.builderBlock.children ? (React.createElement(React.Fragment, null, (_b = (_a = props.builderBlock) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b.map((block) => (React.createElement(
|
|
211
|
+
props.builderBlock && props.builderBlock.children ? (React.createElement(React.Fragment, null, (_b = (_a = props.builderBlock) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b.map((block) => (React.createElement(render_block_1.default, { block: block, context: builderContext }))))) : null,
|
|
212
212
|
" ",
|
|
213
213
|
submissionState() === "error" ? (React.createElement(React.Fragment, null,
|
|
214
|
-
React.createElement(
|
|
214
|
+
React.createElement(render_blocks_1.default, { dataPath: "errorMessage", blocks: props.errorMessage }))) : null,
|
|
215
215
|
" ",
|
|
216
216
|
submissionState() === "sending" ? (React.createElement(React.Fragment, null,
|
|
217
|
-
React.createElement(
|
|
217
|
+
React.createElement(render_blocks_1.default, { dataPath: "sendingMessage", blocks: props.sendingMessage }))) : null,
|
|
218
218
|
" ",
|
|
219
219
|
submissionState() === "error" && responseData ? (React.createElement(React.Fragment, null,
|
|
220
220
|
React.createElement(react_native_1.View, { style: styles.view1 },
|
|
@@ -223,7 +223,7 @@ function FormComponent(props) {
|
|
|
223
223
|
" "))) : null,
|
|
224
224
|
" ",
|
|
225
225
|
submissionState() === "success" ? (React.createElement(React.Fragment, null,
|
|
226
|
-
React.createElement(
|
|
226
|
+
React.createElement(render_blocks_1.default, { dataPath: "successMessage", blocks: props.successMessage }))) : null,
|
|
227
227
|
" "));
|
|
228
228
|
}
|
|
229
229
|
exports.default = FormComponent;
|
|
@@ -29,7 +29,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
29
29
|
const React = __importStar(require("react"));
|
|
30
30
|
const react_native_1 = require("react-native");
|
|
31
31
|
const react_1 = require("react");
|
|
32
|
-
const
|
|
32
|
+
const render_content_1 = __importDefault(require("../../components/render-content/render-content"));
|
|
33
33
|
const builder_context_js_1 = __importDefault(require("../../context/builder.context.js"));
|
|
34
34
|
const index_js_1 = require("../../functions/get-content/index.js");
|
|
35
35
|
const target_1 = require("../../constants/target");
|
|
@@ -88,7 +88,7 @@ function Symbol(props) {
|
|
|
88
88
|
return (React.createElement(react_native_1.View, { ...props.attributes, dataSet: {
|
|
89
89
|
class: className(),
|
|
90
90
|
} },
|
|
91
|
-
React.createElement(
|
|
91
|
+
React.createElement(render_content_1.default, { apiKey: builderContext.apiKey, context: builderContext.context, customComponents: Object.values(builderContext.registeredComponents), data: {
|
|
92
92
|
...(_a = props.symbol) === null || _a === void 0 ? void 0 : _a.data,
|
|
93
93
|
...builderContext.state,
|
|
94
94
|
...(_d = (_c = (_b = props.symbol) === null || _b === void 0 ? void 0 : _b.content) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.state,
|
|
@@ -32,7 +32,7 @@ const device_sizes_js_1 = require("../../constants/device-sizes.js");
|
|
|
32
32
|
const target_js_1 = require("../../constants/target.js");
|
|
33
33
|
const get_processed_block_js_1 = require("../../functions/get-processed-block.js");
|
|
34
34
|
const css_js_1 = require("../../helpers/css.js");
|
|
35
|
-
const
|
|
35
|
+
const render_inlined_styles_1 = __importDefault(require("../render-inlined-styles"));
|
|
36
36
|
function BlockStyles(props) {
|
|
37
37
|
function useBlock() {
|
|
38
38
|
return (0, get_processed_block_js_1.getProcessedBlock)({
|
|
@@ -74,6 +74,6 @@ function BlockStyles(props) {
|
|
|
74
74
|
return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
|
|
75
75
|
}
|
|
76
76
|
return (React.createElement(React.Fragment, null, target_js_1.TARGET !== "reactNative" && css() ? (React.createElement(React.Fragment, null,
|
|
77
|
-
React.createElement(
|
|
77
|
+
React.createElement(render_inlined_styles_1.default, { styles: css() }))) : null));
|
|
78
78
|
}
|
|
79
79
|
exports.default = BlockStyles;
|
|
@@ -34,12 +34,12 @@ const get_block_component_options_js_1 = require("../../functions/get-block-comp
|
|
|
34
34
|
const get_block_properties_js_1 = require("../../functions/get-block-properties.js");
|
|
35
35
|
const get_block_tag_js_1 = require("../../functions/get-block-tag.js");
|
|
36
36
|
const get_processed_block_js_1 = require("../../functions/get-processed-block.js");
|
|
37
|
-
const
|
|
37
|
+
const block_styles_1 = __importDefault(require("./block-styles"));
|
|
38
38
|
const render_block_helpers_js_1 = require("./render-block.helpers.js");
|
|
39
|
-
const
|
|
39
|
+
const render_repeated_block_1 = __importDefault(require("./render-repeated-block"));
|
|
40
40
|
const target_js_1 = require("../../constants/target.js");
|
|
41
41
|
const extract_text_styles_js_1 = require("../../functions/extract-text-styles.js");
|
|
42
|
-
const
|
|
42
|
+
const render_component_1 = __importDefault(require("./render-component"));
|
|
43
43
|
const get_react_native_block_styles_js_1 = require("../../functions/get-react-native-block-styles.js");
|
|
44
44
|
function RenderBlock(props) {
|
|
45
45
|
var _a, _b;
|
|
@@ -60,10 +60,27 @@ function RenderBlock(props) {
|
|
|
60
60
|
shouldEvaluateBindings: true,
|
|
61
61
|
});
|
|
62
62
|
}
|
|
63
|
+
function proxyState() {
|
|
64
|
+
if (typeof Proxy === "undefined") {
|
|
65
|
+
console.error("no Proxy available in this environment, cannot proxy state.");
|
|
66
|
+
return props.context.state;
|
|
67
|
+
}
|
|
68
|
+
const useState = new Proxy(props.context.state, {
|
|
69
|
+
set: (obj, prop, value) => {
|
|
70
|
+
var _a, _b;
|
|
71
|
+
// set the value on the state object, so that the event handler instantly gets the update.
|
|
72
|
+
obj[prop] = value;
|
|
73
|
+
// set the value in the context, so that the rest of the app gets the update.
|
|
74
|
+
(_b = (_a = props.context).setState) === null || _b === void 0 ? void 0 : _b.call(_a, obj);
|
|
75
|
+
return true;
|
|
76
|
+
},
|
|
77
|
+
});
|
|
78
|
+
return useState;
|
|
79
|
+
}
|
|
63
80
|
function actions() {
|
|
64
81
|
return (0, get_block_actions_js_1.getBlockActions)({
|
|
65
82
|
block: useBlock(),
|
|
66
|
-
state:
|
|
83
|
+
state: proxyState(),
|
|
67
84
|
context: props.context.context,
|
|
68
85
|
});
|
|
69
86
|
}
|
|
@@ -137,6 +154,7 @@ function RenderBlock(props) {
|
|
|
137
154
|
state: props.context.state,
|
|
138
155
|
content: props.context.content,
|
|
139
156
|
context: props.context.context,
|
|
157
|
+
setState: props.context.setState,
|
|
140
158
|
registeredComponents: props.context.registeredComponents,
|
|
141
159
|
inheritedStyles: getInheritedTextStyles(),
|
|
142
160
|
};
|
|
@@ -144,11 +162,11 @@ function RenderBlock(props) {
|
|
|
144
162
|
return (React.createElement(React.Fragment, null, !(component === null || component === void 0 ? void 0 : component.noWrap) ? (React.createElement(React.Fragment, null,
|
|
145
163
|
(0, render_block_helpers_js_1.isEmptyHtmlElement)(tag()) ? (React.createElement(React.Fragment, null,
|
|
146
164
|
React.createElement(react_native_1.View, { ...attributes(), ...actions() }))) : null,
|
|
147
|
-
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(tag()) && repeatItemData ? (React.createElement(React.Fragment, null, repeatItemData === null || repeatItemData === void 0 ? void 0 : repeatItemData.map((data, index) => (React.createElement(
|
|
165
|
+
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(tag()) && repeatItemData ? (React.createElement(React.Fragment, null, repeatItemData === null || repeatItemData === void 0 ? void 0 : repeatItemData.map((data, index) => (React.createElement(render_repeated_block_1.default, { key: index, repeatContext: data.context, block: data.block }))))) : null,
|
|
148
166
|
!(0, render_block_helpers_js_1.isEmptyHtmlElement)(tag()) && !repeatItemData ? (React.createElement(React.Fragment, null,
|
|
149
167
|
React.createElement(react_native_1.View, { ...attributes(), ...actions() },
|
|
150
|
-
React.createElement(
|
|
168
|
+
React.createElement(render_component_1.default, { ...renderComponentProps() }), (_a = childrenWithoutParentComponent()) === null || _a === void 0 ? void 0 :
|
|
151
169
|
_a.map((child) => (React.createElement(RenderBlock, { key: "render-block-" + child.id, block: child, context: childrenContext() }))), (_b = childrenWithoutParentComponent()) === null || _b === void 0 ? void 0 :
|
|
152
|
-
_b.map((child) => (React.createElement(
|
|
170
|
+
_b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: childrenContext() })))))) : null)) : (React.createElement(render_component_1.default, { ...renderComponentProps() }))));
|
|
153
171
|
}
|
|
154
172
|
exports.default = RenderBlock;
|
|
@@ -29,8 +29,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
29
29
|
const React = __importStar(require("react"));
|
|
30
30
|
const react_native_1 = require("react-native");
|
|
31
31
|
const react_1 = require("react");
|
|
32
|
-
const
|
|
33
|
-
const
|
|
32
|
+
const block_styles_1 = __importDefault(require("./block-styles"));
|
|
33
|
+
const render_block_1 = __importDefault(require("./render-block"));
|
|
34
34
|
const builder_context_js_1 = __importDefault(require("../../context/builder.context.js"));
|
|
35
35
|
function RenderComponent(props) {
|
|
36
36
|
var _a, _b;
|
|
@@ -44,7 +44,7 @@ function RenderComponent(props) {
|
|
|
44
44
|
inheritedStyles: props.context.inheritedStyles,
|
|
45
45
|
} }, props.componentRef ? (React.createElement(React.Fragment, null,
|
|
46
46
|
React.createElement(ComponentRefRef, { ...props.componentOptions }, (_a = props.blockChildren) === null || _a === void 0 ? void 0 :
|
|
47
|
-
_a.map((child) => (React.createElement(
|
|
48
|
-
_b.map((child) => (React.createElement(
|
|
47
|
+
_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 :
|
|
48
|
+
_b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: props.context })))))) : null));
|
|
49
49
|
}
|
|
50
50
|
exports.default = RenderComponent;
|
|
@@ -30,16 +30,17 @@ const React = __importStar(require("react"));
|
|
|
30
30
|
const react_native_1 = require("react-native");
|
|
31
31
|
const react_1 = require("react");
|
|
32
32
|
const builder_context_js_1 = __importDefault(require("../../context/builder.context.js"));
|
|
33
|
-
const
|
|
33
|
+
const render_block_1 = __importDefault(require("./render-block"));
|
|
34
34
|
function RenderRepeatedBlock(props) {
|
|
35
35
|
return (React.createElement(builder_context_js_1.default.Provider, { value: {
|
|
36
36
|
content: props.repeatContext.content,
|
|
37
37
|
state: props.repeatContext.state,
|
|
38
|
+
setState: props.repeatContext.setState,
|
|
38
39
|
context: props.repeatContext.context,
|
|
39
40
|
apiKey: props.repeatContext.apiKey,
|
|
40
41
|
registeredComponents: props.repeatContext.registeredComponents,
|
|
41
42
|
inheritedStyles: props.repeatContext.inheritedStyles,
|
|
42
43
|
} },
|
|
43
|
-
React.createElement(
|
|
44
|
+
React.createElement(render_block_1.default, { block: props.block, context: props.repeatContext })));
|
|
44
45
|
}
|
|
45
46
|
exports.default = RenderRepeatedBlock;
|
|
@@ -31,8 +31,8 @@ const react_native_1 = require("react-native");
|
|
|
31
31
|
const react_1 = require("react");
|
|
32
32
|
const builder_context_js_1 = __importDefault(require("../context/builder.context.js"));
|
|
33
33
|
const is_editing_js_1 = require("../functions/is-editing.js");
|
|
34
|
-
const
|
|
35
|
-
const
|
|
34
|
+
const block_styles_1 = __importDefault(require("./render-block/block-styles"));
|
|
35
|
+
const render_block_1 = __importDefault(require("./render-block/render-block"));
|
|
36
36
|
function RenderBlocks(props) {
|
|
37
37
|
var _a, _b;
|
|
38
38
|
function className() {
|
|
@@ -67,8 +67,8 @@ function RenderBlocks(props) {
|
|
|
67
67
|
return (React.createElement(react_native_1.View, { "builder-path": props.path, "builder-parent-id": props.parent, dataSet: {
|
|
68
68
|
class: className(),
|
|
69
69
|
}, style: styles.view1, onClick: (event) => onClick(), onMouseEnter: (event) => onMouseEnter() },
|
|
70
|
-
props.blocks ? (React.createElement(React.Fragment, null, (_a = props.blocks) === null || _a === void 0 ? void 0 : _a.map((block) => (React.createElement(
|
|
71
|
-
props.blocks ? (React.createElement(React.Fragment, null, (_b = props.blocks) === null || _b === void 0 ? void 0 : _b.map((block) => (React.createElement(
|
|
70
|
+
props.blocks ? (React.createElement(React.Fragment, null, (_a = props.blocks) === null || _a === void 0 ? void 0 : _a.map((block) => (React.createElement(render_block_1.default, { key: "render-block-" + block.id, block: block, context: builderContext }))))) : null,
|
|
71
|
+
props.blocks ? (React.createElement(React.Fragment, null, (_b = props.blocks) === null || _b === void 0 ? void 0 : _b.map((block) => (React.createElement(block_styles_1.default, { key: "block-style-" + block.id, block: block, context: builderContext }))))) : null));
|
|
72
72
|
}
|
|
73
73
|
exports.default = RenderBlocks;
|
|
74
74
|
const styles = react_native_1.StyleSheet.create({
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getFontCss = exports.getCss = void 0;
|
|
4
|
+
const getCssFromFont = (font) => {
|
|
5
|
+
var _a, _b;
|
|
6
|
+
const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
|
|
7
|
+
const name = family.split(",")[0];
|
|
8
|
+
const url = (_b = font.fileUrl) != null ? _b : (_a = font == null ? void 0 : font.files) == null ? void 0 : _a.regular;
|
|
9
|
+
let str = "";
|
|
10
|
+
if (url && family && name) {
|
|
11
|
+
str += `
|
|
12
|
+
@font-face {
|
|
13
|
+
font-family: "${family}";
|
|
14
|
+
src: local("${name}"), url('${url}') format('woff2');
|
|
15
|
+
font-display: fallback;
|
|
16
|
+
font-weight: 400;
|
|
17
|
+
}
|
|
18
|
+
`.trim();
|
|
19
|
+
}
|
|
20
|
+
if (font.files) {
|
|
21
|
+
for (const weight in font.files) {
|
|
22
|
+
const isNumber = String(Number(weight)) === weight;
|
|
23
|
+
if (!isNumber) {
|
|
24
|
+
continue;
|
|
25
|
+
}
|
|
26
|
+
const weightUrl = font.files[weight];
|
|
27
|
+
if (weightUrl && weightUrl !== url) {
|
|
28
|
+
str += `
|
|
29
|
+
@font-face {
|
|
30
|
+
font-family: "${family}";
|
|
31
|
+
src: url('${weightUrl}') format('woff2');
|
|
32
|
+
font-display: fallback;
|
|
33
|
+
font-weight: ${weight};
|
|
34
|
+
}
|
|
35
|
+
`.trim();
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
return str;
|
|
40
|
+
};
|
|
41
|
+
const getFontCss = ({ customFonts }) => {
|
|
42
|
+
var _a;
|
|
43
|
+
return ((_a = customFonts == null ? void 0 : customFonts.map((font) => getCssFromFont(font))) == null ? void 0 : _a.join(" ")) || "";
|
|
44
|
+
};
|
|
45
|
+
exports.getFontCss = getFontCss;
|
|
46
|
+
const getCss = ({ cssCode, contentId }) => {
|
|
47
|
+
if (!cssCode) {
|
|
48
|
+
return "";
|
|
49
|
+
}
|
|
50
|
+
if (!contentId) {
|
|
51
|
+
return cssCode;
|
|
52
|
+
}
|
|
53
|
+
return (cssCode == null ? void 0 : cssCode.replace(/&/g, `div[builder-content-id="${contentId}"]`)) || "";
|
|
54
|
+
};
|
|
55
|
+
exports.getCss = getCss;
|
|
@@ -28,64 +28,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
const React = __importStar(require("react"));
|
|
30
30
|
const react_native_1 = require("react-native");
|
|
31
|
-
const
|
|
31
|
+
const react_1 = require("react");
|
|
32
|
+
const render_inlined_styles_1 = __importDefault(require("../../render-inlined-styles"));
|
|
33
|
+
const render_styles_helpers_1 = require("./render-styles.helpers");
|
|
34
|
+
const render_styles_helpers_2 = require("./render-styles.helpers");
|
|
32
35
|
function RenderContentStyles(props) {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
@font-face {
|
|
44
|
-
font-family: "${family}";
|
|
45
|
-
src: local("${name}"), url('${url}') format('woff2');
|
|
46
|
-
font-display: fallback;
|
|
47
|
-
font-weight: 400;
|
|
48
|
-
}
|
|
49
|
-
`.trim();
|
|
50
|
-
}
|
|
51
|
-
if (font.files) {
|
|
52
|
-
for (const weight in font.files) {
|
|
53
|
-
const isNumber = String(Number(weight)) === weight;
|
|
54
|
-
if (!isNumber) {
|
|
55
|
-
continue;
|
|
56
|
-
}
|
|
57
|
-
// TODO: maybe limit number loaded
|
|
58
|
-
const weightUrl = font.files[weight];
|
|
59
|
-
if (weightUrl && weightUrl !== url) {
|
|
60
|
-
str += `
|
|
61
|
-
@font-face {
|
|
62
|
-
font-family: "${family}";
|
|
63
|
-
src: url('${weightUrl}') format('woff2');
|
|
64
|
-
font-display: fallback;
|
|
65
|
-
font-weight: ${weight};
|
|
66
|
-
}
|
|
67
|
-
`.trim();
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
return str;
|
|
72
|
-
}
|
|
73
|
-
function getFontCss({ customFonts }) {
|
|
74
|
-
var _a;
|
|
75
|
-
// TODO: flag for this
|
|
76
|
-
// if (!builder.allowCustomFonts) {
|
|
77
|
-
// return '';
|
|
78
|
-
// }
|
|
79
|
-
// TODO: separate internal data from external
|
|
80
|
-
return ((_a = customFonts === null || customFonts === void 0 ? void 0 : customFonts.map((font) => getCssFromFont(font))) === null || _a === void 0 ? void 0 : _a.join(" ")) || "";
|
|
81
|
-
}
|
|
82
|
-
function injectedStyles() {
|
|
83
|
-
return `
|
|
84
|
-
${props.cssCode || ""}
|
|
85
|
-
${getFontCss({
|
|
86
|
-
customFonts: props.customFonts,
|
|
87
|
-
})}`;
|
|
88
|
-
}
|
|
89
|
-
return React.createElement(render_inlined_styles_js_1.default, { styles: injectedStyles() });
|
|
36
|
+
const [injectedStyles, setInjectedStyles] = (0, react_1.useState)(() => `
|
|
37
|
+
${(0, render_styles_helpers_1.getCss)({
|
|
38
|
+
cssCode: props.cssCode,
|
|
39
|
+
contentId: props.contentId,
|
|
40
|
+
})}
|
|
41
|
+
${(0, render_styles_helpers_2.getFontCss)({
|
|
42
|
+
customFonts: props.customFonts,
|
|
43
|
+
})}
|
|
44
|
+
`);
|
|
45
|
+
return React.createElement(render_inlined_styles_1.default, { styles: injectedStyles });
|
|
90
46
|
}
|
|
91
47
|
exports.default = RenderContentStyles;
|
|
@@ -4,5 +4,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
const
|
|
8
|
-
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return
|
|
7
|
+
const render_content_1 = __importDefault(require("./render-content"));
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return render_content_1.default; } });
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getContextStateInitialValue = exports.getContentInitialValue = void 0;
|
|
4
|
+
var __defProp = Object.defineProperty;
|
|
5
|
+
var __defProps = Object.defineProperties;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
+
var __spreadValues = (a, b) => {
|
|
12
|
+
for (var prop in b || (b = {}))
|
|
13
|
+
if (__hasOwnProp.call(b, prop))
|
|
14
|
+
__defNormalProp(a, prop, b[prop]);
|
|
15
|
+
if (__getOwnPropSymbols)
|
|
16
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
+
if (__propIsEnum.call(b, prop))
|
|
18
|
+
__defNormalProp(a, prop, b[prop]);
|
|
19
|
+
}
|
|
20
|
+
return a;
|
|
21
|
+
};
|
|
22
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
23
|
+
const getContextStateInitialValue = ({ content, data, locale }) => {
|
|
24
|
+
var _a, _b, _c;
|
|
25
|
+
const defaultValues = {};
|
|
26
|
+
(_b = (_a = content == null ? void 0 : content.data) == null ? void 0 : _a.inputs) == null ? void 0 : _b.forEach((input) => {
|
|
27
|
+
var _a2;
|
|
28
|
+
if (input.name && input.defaultValue !== void 0 && ((_a2 = content == null ? void 0 : content.data) == null ? void 0 : _a2.state) && content.data.state[input.name] === void 0) {
|
|
29
|
+
defaultValues[input.name] = input.defaultValue;
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
const stateToUse = __spreadValues(__spreadValues(__spreadValues({}, (_c = content == null ? void 0 : content.data) == null ? void 0 : _c.state), data), locale ? { locale } : {});
|
|
33
|
+
return __spreadValues(__spreadValues({}, defaultValues), stateToUse);
|
|
34
|
+
};
|
|
35
|
+
exports.getContextStateInitialValue = getContextStateInitialValue;
|
|
36
|
+
const getContentInitialValue = ({ content, data }) => {
|
|
37
|
+
return !content ? void 0 : __spreadProps(__spreadValues({}, content), {
|
|
38
|
+
data: __spreadValues(__spreadValues({}, content == null ? void 0 : content.data), data),
|
|
39
|
+
meta: content == null ? void 0 : content.meta
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
exports.getContentInitialValue = getContentInitialValue;
|