@builder.io/sdk-react-native 0.2.2 → 0.2.3

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.
@@ -32,8 +32,9 @@ const react_native_1 = require("react-native");
32
32
  function Button(props) {
33
33
  return (React.createElement(React.Fragment, null, props.link ? (React.createElement(React.Fragment, null,
34
34
  React.createElement(react_native_1.View, { role: "button", ...props.attributes, href: props.link, target: props.openLinkInNewTab ? "_blank" : undefined },
35
- React.createElement(BaseText_1.default, null, props.text)))) : (React.createElement(react_native_1.View, { ...props.attributes, style: styles.view1 },
36
- React.createElement(BaseText_1.default, null, props.text)))));
35
+ React.createElement(BaseText_1.default, null, props.text)))) : (React.createElement(React.Fragment, null,
36
+ React.createElement(react_native_1.View, { ...props.attributes, style: styles.view1 },
37
+ React.createElement(BaseText_1.default, null, props.text))))));
37
38
  }
38
39
  const styles = react_native_1.StyleSheet.create({ view1: { all: "unset" } });
39
40
  exports.default = Button;
@@ -111,30 +111,30 @@ function Columns(props) {
111
111
  }
112
112
  function columnsStyles() {
113
113
  return `
114
- @media (max-width: ${getWidthForBreakpointSize("medium")}px) {
115
- .${props.builderBlock.id}-breakpoints {
116
- flex-direction: var(--flex-dir-tablet);
117
- align-items: stretch;
118
- }
114
+ @media (max-width: ${getWidthForBreakpointSize("medium")}px) {
115
+ .${props.builderBlock.id}-breakpoints {
116
+ flex-direction: var(--flex-dir-tablet);
117
+ align-items: stretch;
118
+ }
119
119
 
120
- .${props.builderBlock.id}-breakpoints > .builder-column {
121
- width: var(--column-width-tablet) !important;
122
- margin-left: var(--column-margin-left-tablet) !important;
123
- }
124
- }
120
+ .${props.builderBlock.id}-breakpoints > .builder-column {
121
+ width: var(--column-width-tablet) !important;
122
+ margin-left: var(--column-margin-left-tablet) !important;
123
+ }
124
+ }
125
125
 
126
- @media (max-width: ${getWidthForBreakpointSize("small")}px) {
127
- .${props.builderBlock.id}-breakpoints {
128
- flex-direction: var(--flex-dir);
129
- align-items: stretch;
130
- }
126
+ @media (max-width: ${getWidthForBreakpointSize("small")}px) {
127
+ .${props.builderBlock.id}-breakpoints {
128
+ flex-direction: var(--flex-dir);
129
+ align-items: stretch;
130
+ }
131
131
 
132
- .${props.builderBlock.id}-breakpoints > .builder-column {
133
- width: var(--column-width-mobile) !important;
134
- margin-left: var(--column-margin-left-mobile) !important;
135
- }
136
- },
137
- `;
132
+ .${props.builderBlock.id}-breakpoints > .builder-column {
133
+ width: var(--column-width-mobile) !important;
134
+ margin-left: var(--column-margin-left-mobile) !important;
135
+ }
136
+ },
137
+ `;
138
138
  }
139
139
  const builderContext = (0, react_1.useContext)(builder_context_js_1.default);
140
140
  return (React.createElement(react_native_1.View, { style: columnsCssVars(), dataSet: {
@@ -157,6 +157,7 @@ function RenderBlock(props) {
157
157
  React.createElement(react_native_1.View, { ...attributes(), ...actions() },
158
158
  React.createElement(render_component_1.default, { ...renderComponentProps() }), (_a = childrenWithoutParentComponent()) === null || _a === void 0 ? void 0 :
159
159
  _a.map((child) => (React.createElement(RenderBlock, { key: "render-block-" + child.id, block: child, context: childrenContext() }))), (_b = childrenWithoutParentComponent()) === null || _b === void 0 ? void 0 :
160
- _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() })))) : null));
160
+ _b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: childrenContext() })))))) : null)) : (React.createElement(React.Fragment, null,
161
+ React.createElement(render_component_1.default, { ...renderComponentProps() }))))) : null));
161
162
  }
162
163
  exports.default = RenderBlock;
@@ -40,6 +40,7 @@ function RenderRepeatedBlock(props) {
40
40
  apiKey: props.repeatContext.apiKey,
41
41
  registeredComponents: props.repeatContext.registeredComponents,
42
42
  inheritedStyles: props.repeatContext.inheritedStyles,
43
+ apiVersion: props.repeatContext.apiVersion,
43
44
  } },
44
45
  React.createElement(render_block_1.default, { block: props.block, context: props.repeatContext })));
45
46
  }
@@ -43,16 +43,16 @@ ${(0, render_styles_helpers_2.getFontCss)({
43
43
  })}
44
44
 
45
45
  .builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
46
- margin: 0;
46
+ margin: 0;
47
47
  }
48
48
  .builder-text > p, .builder-text > .builder-paragraph {
49
- color: inherit;
50
- line-height: inherit;
51
- letter-spacing: inherit;
52
- font-weight: inherit;
53
- font-size: inherit;
54
- text-align: inherit;
55
- font-family: inherit;
49
+ color: inherit;
50
+ line-height: inherit;
51
+ letter-spacing: inherit;
52
+ font-weight: inherit;
53
+ font-size: inherit;
54
+ text-align: inherit;
55
+ font-family: inherit;
56
56
  }
57
57
  `);
58
58
  return React.createElement(render_inlined_styles_1.default, { styles: injectedStyles });
@@ -319,6 +319,7 @@ function RenderContent(props) {
319
319
  apiKey: props.apiKey,
320
320
  apiVersion: props.apiVersion,
321
321
  registeredComponents: allRegisteredComponents,
322
+ inheritedStyles: {},
322
323
  } }, useContent ? (React.createElement(React.Fragment, null,
323
324
  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 },
324
325
  target_js_1.TARGET !== "reactNative" ? (React.createElement(React.Fragment, null,
@@ -63,7 +63,7 @@ function getAllContent(options) {
63
63
  const res = yield (0, get_fetch_js_1.fetch)(url.href);
64
64
  const content = yield res.json();
65
65
  if ("status" in content && !("results" in content)) {
66
- logger_js_1.logger.error("Error fetching data. ", content, options);
66
+ logger_js_1.logger.error("Error fetching data. ", { url, content, options });
67
67
  return content;
68
68
  }
69
69
  const canTrack = options.canTrack !== false;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@builder.io/sdk-react-native",
3
3
  "description": "Builder.io SDK for React Native",
4
- "version": "0.2.2",
4
+ "version": "0.2.3",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
7
7
  "module": "./dist/index.js",
@@ -24,9 +24,11 @@ function Button(props) {
24
24
  </View>
25
25
  </>
26
26
  ) : (
27
- <View {...props.attributes} style={styles.view1}>
28
- <BaseText>{props.text}</BaseText>
29
- </View>
27
+ <>
28
+ <View {...props.attributes} style={styles.view1}>
29
+ <BaseText>{props.text}</BaseText>
30
+ </View>
31
+ </>
30
32
  )}
31
33
  </>
32
34
  );
@@ -107,30 +107,30 @@ function Columns(props) {
107
107
 
108
108
  function columnsStyles() {
109
109
  return `
110
- @media (max-width: ${getWidthForBreakpointSize("medium")}px) {
111
- .${props.builderBlock.id}-breakpoints {
112
- flex-direction: var(--flex-dir-tablet);
113
- align-items: stretch;
114
- }
115
-
116
- .${props.builderBlock.id}-breakpoints > .builder-column {
117
- width: var(--column-width-tablet) !important;
118
- margin-left: var(--column-margin-left-tablet) !important;
119
- }
120
- }
121
-
122
- @media (max-width: ${getWidthForBreakpointSize("small")}px) {
123
- .${props.builderBlock.id}-breakpoints {
124
- flex-direction: var(--flex-dir);
125
- align-items: stretch;
126
- }
127
-
128
- .${props.builderBlock.id}-breakpoints > .builder-column {
129
- width: var(--column-width-mobile) !important;
130
- margin-left: var(--column-margin-left-mobile) !important;
131
- }
132
- },
133
- `;
110
+ @media (max-width: ${getWidthForBreakpointSize("medium")}px) {
111
+ .${props.builderBlock.id}-breakpoints {
112
+ flex-direction: var(--flex-dir-tablet);
113
+ align-items: stretch;
114
+ }
115
+
116
+ .${props.builderBlock.id}-breakpoints > .builder-column {
117
+ width: var(--column-width-tablet) !important;
118
+ margin-left: var(--column-margin-left-tablet) !important;
119
+ }
120
+ }
121
+
122
+ @media (max-width: ${getWidthForBreakpointSize("small")}px) {
123
+ .${props.builderBlock.id}-breakpoints {
124
+ flex-direction: var(--flex-dir);
125
+ align-items: stretch;
126
+ }
127
+
128
+ .${props.builderBlock.id}-breakpoints > .builder-column {
129
+ width: var(--column-width-mobile) !important;
130
+ margin-left: var(--column-margin-left-mobile) !important;
131
+ }
132
+ },
133
+ `;
134
134
  }
135
135
 
136
136
  const builderContext = useContext(BuilderContext);
@@ -198,7 +198,9 @@ function RenderBlock(props) {
198
198
  ) : null}
199
199
  </>
200
200
  ) : (
201
- <RenderComponent {...renderComponentProps()} />
201
+ <>
202
+ <RenderComponent {...renderComponentProps()} />
203
+ </>
202
204
  )}
203
205
  </>
204
206
  ) : null}
@@ -22,6 +22,7 @@ function RenderRepeatedBlock(props) {
22
22
  apiKey: props.repeatContext.apiKey,
23
23
  registeredComponents: props.repeatContext.registeredComponents,
24
24
  inheritedStyles: props.repeatContext.inheritedStyles,
25
+ apiVersion: props.repeatContext.apiVersion,
25
26
  }}
26
27
  >
27
28
  <RenderBlock block={props.block} context={props.repeatContext} />
@@ -24,16 +24,16 @@ ${getFontCss({
24
24
  })}
25
25
 
26
26
  .builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
27
- margin: 0;
27
+ margin: 0;
28
28
  }
29
29
  .builder-text > p, .builder-text > .builder-paragraph {
30
- color: inherit;
31
- line-height: inherit;
32
- letter-spacing: inherit;
33
- font-weight: inherit;
34
- font-size: inherit;
35
- text-align: inherit;
36
- font-family: inherit;
30
+ color: inherit;
31
+ line-height: inherit;
32
+ letter-spacing: inherit;
33
+ font-weight: inherit;
34
+ font-size: inherit;
35
+ text-align: inherit;
36
+ font-family: inherit;
37
37
  }
38
38
  `
39
39
  );
@@ -362,6 +362,7 @@ function RenderContent(props) {
362
362
  apiKey: props.apiKey,
363
363
  apiVersion: props.apiVersion,
364
364
  registeredComponents: allRegisteredComponents,
365
+ inheritedStyles: {},
365
366
  }}
366
367
  >
367
368
  {useContent ? (
@@ -57,7 +57,7 @@ function getAllContent(options) {
57
57
  const res = yield fetch(url.href);
58
58
  const content = yield res.json();
59
59
  if ("status" in content && !("results" in content)) {
60
- logger.error("Error fetching data. ", content, options);
60
+ logger.error("Error fetching data. ", { url, content, options });
61
61
  return content;
62
62
  }
63
63
  const canTrack = options.canTrack !== false;