@builder.io/sdk-solid 0.0.15 → 0.0.17

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.
Files changed (119) hide show
  1. package/README.md +5 -1
  2. package/package.json +17 -5
  3. package/solid-index.jsx +5 -0
  4. package/src/blocks/BaseText.jsx +9 -0
  5. package/src/blocks/button/button.jsx +9 -6
  6. package/src/blocks/columns/columns.jsx +54 -52
  7. package/src/blocks/columns/component-info.js +26 -1
  8. package/src/blocks/custom-code/custom-code.jsx +35 -38
  9. package/src/blocks/embed/component-info.js +21 -1
  10. package/src/blocks/embed/embed.jsx +37 -42
  11. package/src/blocks/embed/helpers.js +9 -0
  12. package/src/blocks/form/form.jsx +175 -176
  13. package/src/blocks/image/component-info.js +48 -1
  14. package/src/blocks/image/image.helpers.js +48 -0
  15. package/src/blocks/image/image.jsx +44 -13
  16. package/src/blocks/img/img.jsx +1 -1
  17. package/src/blocks/symbol/component-info.js +1 -0
  18. package/src/blocks/symbol/symbol.jsx +40 -13
  19. package/src/blocks/text/text.jsx +1 -1
  20. package/src/blocks/util.js +7 -0
  21. package/src/blocks/video/video.jsx +21 -2
  22. package/src/components/render-block/block-styles.jsx +41 -31
  23. package/src/components/render-block/render-block.helpers.js +23 -0
  24. package/src/components/render-block/render-block.jsx +205 -90
  25. package/src/components/render-block/render-component-with-context.jsx +36 -0
  26. package/src/components/render-block/render-component.jsx +28 -0
  27. package/src/components/render-block/render-repeated-block.jsx +36 -0
  28. package/src/components/render-block/types.js +0 -0
  29. package/src/components/render-blocks.jsx +42 -33
  30. package/src/components/render-content/components/render-styles.jsx +39 -42
  31. package/src/components/render-content/index.js +4 -0
  32. package/src/components/render-content/render-content.jsx +200 -129
  33. package/src/components/render-inlined-styles.jsx +21 -5
  34. package/src/constants/builder-registered-components.js +54 -0
  35. package/src/constants/device-sizes.js +3 -21
  36. package/src/context/builder.context.js +3 -1
  37. package/src/context/types.js +0 -0
  38. package/src/functions/camel-to-kebab-case.js +4 -0
  39. package/src/functions/convert-style-object.js +14 -0
  40. package/src/functions/evaluate.js +1 -1
  41. package/src/functions/extract-text-styles.js +22 -0
  42. package/src/functions/fast-clone.js +4 -0
  43. package/src/functions/get-block-actions-handler.js +12 -0
  44. package/src/functions/get-block-actions.js +2 -7
  45. package/src/functions/get-block-component-options.js +6 -1
  46. package/src/functions/get-block-styles.js +27 -19
  47. package/src/functions/get-builder-search-params/index.js +17 -2
  48. package/src/functions/get-content/ab-testing.js +99 -0
  49. package/src/functions/get-content/fn.test.js +1 -1
  50. package/src/functions/get-content/index.js +20 -62
  51. package/src/functions/get-content/types.js +0 -0
  52. package/src/functions/get-fetch.js +2 -2
  53. package/src/functions/get-processed-block.js +24 -11
  54. package/src/functions/get-processed-block.test.js +2 -1
  55. package/src/functions/mark-mutable.js +10 -0
  56. package/src/functions/register-component.js +45 -26
  57. package/src/functions/sanitize-styles.js +4 -0
  58. package/src/functions/track.js +108 -13
  59. package/src/helpers/ab-tests.js +16 -0
  60. package/src/helpers/cookie.js +79 -0
  61. package/src/helpers/css.js +28 -0
  62. package/src/helpers/flatten.js +34 -0
  63. package/src/helpers/localStorage.js +34 -0
  64. package/src/helpers/nullable.js +4 -0
  65. package/src/helpers/sessionId.js +49 -0
  66. package/src/helpers/time.js +5 -0
  67. package/src/helpers/url.js +10 -0
  68. package/src/helpers/url.test.js +15 -0
  69. package/src/helpers/uuid.js +13 -0
  70. package/src/helpers/visitorId.js +33 -0
  71. package/src/index-helpers/blocks-exports.js +11 -9
  72. package/src/scripts/init-editing.js +4 -5
  73. package/src/types/can-track.js +0 -0
  74. package/src/types/components.js +0 -0
  75. package/src/types/element.js +0 -0
  76. package/src/blocks/button/button.lite.tsx +0 -20
  77. package/src/blocks/button/index.js +0 -7
  78. package/src/blocks/columns/columns.lite.tsx +0 -102
  79. package/src/blocks/columns/index.js +0 -7
  80. package/src/blocks/custom-code/custom-code.lite.tsx +0 -67
  81. package/src/blocks/custom-code/index.js +0 -7
  82. package/src/blocks/embed/embed.lite.tsx +0 -59
  83. package/src/blocks/embed/index.js +0 -7
  84. package/src/blocks/form/form.lite.tsx +0 -293
  85. package/src/blocks/form/index.js +0 -7
  86. package/src/blocks/fragment/fragment.lite.tsx +0 -5
  87. package/src/blocks/fragment/index.js +0 -7
  88. package/src/blocks/image/image.lite.tsx +0 -83
  89. package/src/blocks/image/index.js +0 -7
  90. package/src/blocks/img/img.lite.tsx +0 -18
  91. package/src/blocks/img/index.js +0 -7
  92. package/src/blocks/input/index.js +0 -7
  93. package/src/blocks/input/input.lite.tsx +0 -20
  94. package/src/blocks/raw-text/index.js +0 -7
  95. package/src/blocks/raw-text/raw-text.lite.tsx +0 -10
  96. package/src/blocks/section/index.js +0 -7
  97. package/src/blocks/section/section.lite.tsx +0 -18
  98. package/src/blocks/select/index.js +0 -7
  99. package/src/blocks/select/select.lite.tsx +0 -28
  100. package/src/blocks/submit-button/index.js +0 -7
  101. package/src/blocks/submit-button/submit-button.lite.tsx +0 -9
  102. package/src/blocks/symbol/index.js +0 -7
  103. package/src/blocks/symbol/symbol.lite.tsx +0 -39
  104. package/src/blocks/text/index.js +0 -7
  105. package/src/blocks/text/text.lite.tsx +0 -5
  106. package/src/blocks/textarea/index.js +0 -7
  107. package/src/blocks/textarea/textarea.lite.tsx +0 -13
  108. package/src/blocks/video/index.js +0 -7
  109. package/src/blocks/video/video.lite.tsx +0 -26
  110. package/src/components/error-boundary.jsx +0 -5
  111. package/src/components/error-boundary.lite.tsx +0 -5
  112. package/src/components/render-block/block-styles.lite.tsx +0 -38
  113. package/src/components/render-block/render-block.lite.tsx +0 -119
  114. package/src/components/render-blocks.lite.tsx +0 -75
  115. package/src/components/render-content/components/render-styles.lite.tsx +0 -76
  116. package/src/components/render-content/render-content.lite.tsx +0 -232
  117. package/src/components/render-inlined-styles.lite.tsx +0 -5
  118. package/src/functions/macro-eval.js +0 -5
  119. package/src/functions/previewing-model-name.js +0 -11
@@ -1,232 +0,0 @@
1
- import { useContext, Show, onMount } from "solid-js";
2
- import { Dynamic } from "solid-js/web";
3
- import { createMutable } from "solid-js/store";
4
-
5
- import { TARGET } from "../../constants/target.js";
6
- import BuilderContext from "../../context/builder.context..js";
7
- import { evaluate } from "../../functions/evaluate.js";
8
- import {
9
- convertSearchParamsToQueryObject,
10
- getBuilderSearchParams,
11
- } from "../../functions/get-builder-search-params/index.js";
12
- import { getContent } from "../../functions/get-content/index.js";
13
- import { getFetch } from "../../functions/get-fetch.js";
14
- import { isBrowser } from "../../functions/is-browser.js";
15
- import { isEditing } from "../../functions/is-editing.js";
16
- import { isPreviewing } from "../../functions/is-previewing.js";
17
- import { previewingModelName } from "../../functions/previewing-model-name.js";
18
- import { track } from "../../functions/track.js";
19
- import RenderBlocks from "../render-blocks..js";
20
- import RenderContentStyles from "./components/render-styles..js";
21
-
22
- function RenderContent(props) {
23
- const state = createMutable({
24
- get useContent() {
25
- const mergedContent: BuilderContent = {
26
- ...props.content,
27
- ...state.overrideContent,
28
- data: {
29
- ...props.content?.data,
30
- ...props.data,
31
- ...state.overrideContent?.data,
32
- },
33
- };
34
- return mergedContent;
35
- },
36
- overrideContent: null,
37
- update: 0,
38
- overrideState: {},
39
- get contentState() {
40
- return {
41
- ...props.content?.data?.state,
42
- ...props.data,
43
- ...state.overrideState,
44
- };
45
- },
46
- get context() {
47
- return {} as {
48
- [index: string]: any;
49
- };
50
- },
51
- processMessage(event: MessageEvent) {
52
- const { data } = event;
53
-
54
- if (data) {
55
- switch (data.type) {
56
- case "builder.contentUpdate": {
57
- const messageContent = data.data;
58
- const key =
59
- messageContent.key ||
60
- messageContent.alias ||
61
- messageContent.entry ||
62
- messageContent.modelName;
63
- const contentData = messageContent.data;
64
-
65
- if (key === props.model) {
66
- state.overrideContent = contentData;
67
- }
68
-
69
- break;
70
- }
71
-
72
- case "builder.patchUpdates": {
73
- // TODO
74
- break;
75
- }
76
- }
77
- }
78
- },
79
- evaluateJsCode() {
80
- // run any dynamic JS code attached to content
81
- const jsCode = state.useContent?.data?.jsCode;
82
-
83
- if (jsCode) {
84
- evaluate({
85
- code: jsCode,
86
- context: state.context,
87
- state: state.contentState,
88
- });
89
- }
90
- },
91
- get httpReqsData() {
92
- return {};
93
- },
94
- evalExpression(expression: string) {
95
- return expression.replace(/{{([^}]+)}}/g, (_match, group) =>
96
- evaluate({
97
- code: group,
98
- context: state.context,
99
- state: state.contentState,
100
- })
101
- );
102
- },
103
- handleRequest({ url, key }: { key: string; url: string }) {
104
- const fetchAndSetState = async () => {
105
- const fetch = await getFetch();
106
- const response = await fetch(url);
107
- const json = await response.json();
108
- const newOverrideState = { ...state.overrideState, [key]: json };
109
- state.overrideState = newOverrideState;
110
- };
111
-
112
- fetchAndSetState();
113
- },
114
- runHttpRequests() {
115
- const requests = state.useContent?.data?.httpRequests ?? {};
116
- Object.entries(requests).forEach(([key, url]) => {
117
- if (url && (!state.httpReqsData[key] || isEditing())) {
118
- const evaluatedUrl = state.evalExpression(url);
119
- state.handleRequest({
120
- url: evaluatedUrl,
121
- key,
122
- });
123
- }
124
- });
125
- },
126
- emitStateUpdate() {
127
- window.dispatchEvent(
128
- new CustomEvent<BuilderComponentStateChange>(
129
- "builder:component:stateChange",
130
- {
131
- detail: {
132
- state: state.contentState,
133
- ref: {
134
- name: props.model,
135
- },
136
- },
137
- }
138
- )
139
- );
140
- },
141
- });
142
-
143
- onMount(() => {
144
- if (isBrowser()) {
145
- if (isEditing()) {
146
- window.addEventListener("message", state.processMessage);
147
- window.addEventListener(
148
- "builder:component:stateChangeListenerActivated",
149
- state.emitStateUpdate
150
- );
151
- }
152
-
153
- if (state.useContent) {
154
- track("impression", {
155
- contentId: state.useContent.id,
156
- });
157
- } // override normal content in preview mode
158
-
159
- if (isPreviewing()) {
160
- if (props.model && previewingModelName() === props.model) {
161
- const currentUrl = new URL(location.href);
162
- const previewApiKey = currentUrl.searchParams.get("apiKey");
163
-
164
- if (previewApiKey) {
165
- getContent({
166
- model: props.model,
167
- apiKey: previewApiKey,
168
- options: getBuilderSearchParams(
169
- convertSearchParamsToQueryObject(currentUrl.searchParams)
170
- ),
171
- }).then((content) => {
172
- if (content) {
173
- state.overrideContent = content;
174
- }
175
- });
176
- }
177
- }
178
- }
179
-
180
- state.evaluateJsCode();
181
- state.runHttpRequests();
182
- state.emitStateUpdate();
183
- }
184
- });
185
-
186
- return (
187
- <Dynamic
188
- value={{
189
- get content() {
190
- return state.useContent;
191
- },
192
- get state() {
193
- return state.contentState;
194
- },
195
- get context() {
196
- return state.context;
197
- },
198
- get apiKey() {
199
- return props.apiKey;
200
- },
201
- }}
202
- component={BuilderContext.Provider}
203
- >
204
- <Show when={state.useContent}>
205
- <div
206
- onClick={(event) =>
207
- track("click", {
208
- contentId: state.useContent.id,
209
- })
210
- }
211
- data-builder-content-id={state.useContent?.id}
212
- >
213
- <Show
214
- when={
215
- (state.useContent?.data?.cssCode ||
216
- state.useContent?.data?.customFonts?.length) &&
217
- TARGET !== "reactNative"
218
- }
219
- >
220
- <RenderContentStyles
221
- cssCode={state.useContent.data.cssCode}
222
- customFonts={state.useContent.data.customFonts}
223
- ></RenderContentStyles>
224
- </Show>
225
- <RenderBlocks blocks={state.useContent?.data?.blocks}></RenderBlocks>
226
- </div>
227
- </Show>
228
- </Dynamic>
229
- );
230
- }
231
-
232
- export default RenderContent;
@@ -1,5 +0,0 @@
1
- // HACK: this file isn't being generated, it may be an error being eated.
2
- // This is just a short term workaround
3
- export default function RenderInlinedStyles() {
4
- return null;
5
- }
@@ -1,5 +0,0 @@
1
- function macroEval(items, string) {
2
- }
3
- export {
4
- macroEval
5
- };
@@ -1,11 +0,0 @@
1
- import { isPreviewing } from "./is-previewing.js";
2
- function previewingModelName() {
3
- if (!isPreviewing()) {
4
- return null;
5
- }
6
- const url = new URL(location.href);
7
- return url.searchParams.get("builder.preview");
8
- }
9
- export {
10
- previewingModelName
11
- };