@builder.io/sdk-qwik 0.1.8 → 0.1.10

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 (32) hide show
  1. package/README.md +32 -27
  2. package/lib/index.qwik.cjs +151 -138
  3. package/lib/index.qwik.mjs +151 -138
  4. package/package.json +1 -1
  5. package/types/blocks/columns/columns.d.ts +2 -2
  6. package/types/components/render-block/block-styles.d.ts +1 -1
  7. package/types/components/render-block/render-block.d.ts +1 -1
  8. package/types/components/render-block/render-component.d.ts +1 -1
  9. package/types/components/render-block/render-repeated-block.d.ts +1 -1
  10. package/types/components/render-blocks.d.ts +1 -1
  11. package/types/components/render-content/render-content.d.ts +0 -1
  12. package/types/components/render-content/render-content.types.d.ts +1 -1
  13. package/types/constants/device-sizes.d.ts +1 -1
  14. package/types/context/types.d.ts +4 -4
  15. package/types/functions/get-block-actions.d.ts +1 -1
  16. package/types/functions/get-block-tag.d.ts +1 -1
  17. package/types/functions/get-builder-search-params/index.d.ts +1 -1
  18. package/types/functions/get-global-this.d.ts +0 -1
  19. package/types/functions/if-target.d.ts +1 -1
  20. package/types/functions/sanitize-react-native-block-styles.d.ts +1 -1
  21. package/types/functions/set-editor-settings.d.ts +1 -1
  22. package/types/functions/track/index.d.ts +2 -2
  23. package/types/functions/track/interaction.d.ts +1 -1
  24. package/types/helpers/nullable.d.ts +1 -1
  25. package/types/index.d.ts +0 -1
  26. package/types/types/builder-block.d.ts +1 -1
  27. package/types/types/can-track.d.ts +1 -1
  28. package/types/types/components.d.ts +1 -1
  29. package/types/types/deep-partial.d.ts +1 -1
  30. package/types/types/element.d.ts +1 -1
  31. package/types/types/targets.d.ts +2 -2
  32. package/types/types/typescript.d.ts +3 -3
package/README.md CHANGED
@@ -34,38 +34,43 @@ npm add --save @builder.io/sdk-qwik
34
34
  Add Qwik SDK code to a particular route (such as `src/routes/index.tsx`)
35
35
 
36
36
  ```typscript
37
- import { component$, Resource, useResource$ } from "@builder.io/qwik";
38
- import { useLocation } from "@builder.io/qwik-city";
39
- import { getContent, RenderContent, RegisteredComponent, getBuilderSearchParams } from "@builder.io/sdk-qwik";
37
+ import { component$ } from "@builder.io/qwik";
38
+ import { loader$ } from "@builder.io/qwik-city";
39
+ import {
40
+ getBuilderSearchParams,
41
+ getContent,
42
+ RenderContent,
43
+ } from "@builder.io/sdk-qwik";
40
44
 
41
45
  export const BUILDER_PUBLIC_API_KEY = "YOUR_API_KEY_GOES_HERE"; // ggignore
42
- export default component$(() => {
43
- const location = useLocation();
44
- const builderContentRsrc = useResource$<any>(() => {
45
- return getContent({
46
- model: "page",
47
- apiKey: BUILDER_PUBLIC_API_KEY,
48
- options: getBuilderSearchParams(location.query),
49
- userAttributes: {
50
- urlPath: location.pathname || "/",
51
- },
52
- });
46
+ export const MODEL = 'page';
47
+
48
+ export const builderContentLoader = loader$(({ url }) => {
49
+ return getContent({
50
+ model: MODEL,
51
+ apiKey: BUILDER_PUBLIC_API_KEY,
52
+ options: {
53
+ ...getBuilderSearchParams(url.searchParams),
54
+ cachebust: true,
55
+ },
56
+ userAttributes: {
57
+ urlPath: url.pathname || "/",
58
+ },
53
59
  });
60
+ });
54
61
 
62
+ export default component$(() => {
63
+ const builderContent = builderContentLoader.use();
55
64
  return (
56
- <Resource
57
- resource={builderContentRsrc}
58
- onPending={() => <div>Loading...</div>}
59
- onResolved={(content) => (
60
- <RenderContent
61
- model="page"
62
- content={content}
63
- apiKey={BUILDER_PUBLIC_API_KEY}
64
- // Optional: pass in a custom component registry
65
- // customComponents={CUSTOM_COMPONENTS}
66
- />
67
- )}
68
- />
65
+ <div>
66
+ <RenderContent
67
+ model={MODEL}
68
+ content={builderContent.value}
69
+ apiKey={BUILDER_PUBLIC_API_KEY}
70
+ // Optional: pass in a custom component registry
71
+ // customComponents={CUSTOM_COMPONENTS}
72
+ />
73
+ </div>
69
74
  );
70
75
  });
71
76
 
@@ -2,136 +2,6 @@
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
3
  const qwik = require("@builder.io/qwik");
4
4
  const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
5
- const TARGET = "qwik";
6
- function isBrowser() {
7
- return typeof window !== "undefined" && typeof document !== "undefined";
8
- }
9
- const registry = {};
10
- function register(type, info) {
11
- let typeList = registry[type];
12
- if (!typeList)
13
- typeList = registry[type] = [];
14
- typeList.push(info);
15
- if (isBrowser()) {
16
- const message = {
17
- type: "builder.register",
18
- data: {
19
- type,
20
- info
21
- }
22
- };
23
- try {
24
- parent.postMessage(message, "*");
25
- if (parent !== window)
26
- window.postMessage(message, "*");
27
- } catch (err) {
28
- console.debug("Could not postmessage", err);
29
- }
30
- }
31
- }
32
- const registerInsertMenu = () => {
33
- register("insertMenu", {
34
- name: "_default",
35
- default: true,
36
- items: [
37
- {
38
- name: "Box"
39
- },
40
- {
41
- name: "Text"
42
- },
43
- {
44
- name: "Image"
45
- },
46
- {
47
- name: "Columns"
48
- },
49
- ...[
50
- {
51
- name: "Core:Section"
52
- },
53
- {
54
- name: "Core:Button"
55
- },
56
- {
57
- name: "Embed"
58
- },
59
- {
60
- name: "Custom Code"
61
- }
62
- ]
63
- ]
64
- });
65
- };
66
- let isSetupForEditing = false;
67
- const setupBrowserForEditing = (options = {}) => {
68
- if (isSetupForEditing)
69
- return;
70
- isSetupForEditing = true;
71
- if (isBrowser()) {
72
- window.parent?.postMessage({
73
- type: "builder.sdkInfo",
74
- data: {
75
- target: TARGET,
76
- supportsPatchUpdates: false,
77
- supportsAddBlockScoping: true,
78
- supportsCustomBreakpoints: true
79
- }
80
- }, "*");
81
- window.parent?.postMessage({
82
- type: "builder.updateContent",
83
- data: {
84
- options
85
- }
86
- }, "*");
87
- window.addEventListener("message", ({ data }) => {
88
- if (!data?.type)
89
- return;
90
- switch (data.type) {
91
- case "builder.evaluate": {
92
- const text = data.data.text;
93
- const args = data.data.arguments || [];
94
- const id = data.data.id;
95
- const fn = new Function(text);
96
- let result;
97
- let error = null;
98
- try {
99
- result = fn.apply(null, args);
100
- } catch (err) {
101
- error = err;
102
- }
103
- if (error)
104
- window.parent?.postMessage({
105
- type: "builder.evaluateError",
106
- data: {
107
- id,
108
- error: error.message
109
- }
110
- }, "*");
111
- else if (result && typeof result.then === "function")
112
- result.then((finalResult) => {
113
- window.parent?.postMessage({
114
- type: "builder.evaluateResult",
115
- data: {
116
- id,
117
- result: finalResult
118
- }
119
- }, "*");
120
- }).catch(console.error);
121
- else
122
- window.parent?.postMessage({
123
- type: "builder.evaluateResult",
124
- data: {
125
- result,
126
- id
127
- }
128
- }, "*");
129
- break;
130
- }
131
- }
132
- });
133
- }
134
- };
135
5
  const Button = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
136
6
  qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$3, "Button_component_useStylesScoped_a1JZ0Q0Q2Oc"));
137
7
  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
@@ -161,6 +31,10 @@ const STYLES$3 = `
161
31
  all: unset;
162
32
  }`;
163
33
  const builderContext = qwik.createContext("Builder");
34
+ const TARGET = "qwik";
35
+ function isBrowser() {
36
+ return typeof window !== "undefined" && typeof document !== "undefined";
37
+ }
164
38
  function isIframe() {
165
39
  return isBrowser() && window.self !== window.top;
166
40
  }
@@ -1415,7 +1289,7 @@ const componentInfo$7 = {
1415
1289
  "svg"
1416
1290
  ],
1417
1291
  required: true,
1418
- defaultValue: "https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
1292
+ defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
1419
1293
  onChange: serializeFn((options) => {
1420
1294
  const DEFAULT_ASPECT_RATIO = 0.7041;
1421
1295
  options.delete("srcset");
@@ -1591,9 +1465,9 @@ const SectionComponent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((prop
1591
1465
  style: {
1592
1466
  width: "100%",
1593
1467
  alignSelf: "stretch",
1594
- flexGrow: "1",
1468
+ flexGrow: 1,
1595
1469
  boxSizing: "border-box",
1596
- maxWidth: `${props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : 1200}px`,
1470
+ maxWidth: props.maxWidth || 1200,
1597
1471
  display: "flex",
1598
1472
  flexDirection: "column",
1599
1473
  alignItems: "stretch",
@@ -1994,6 +1868,9 @@ const Text = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
1994
1868
  get dangerouslySetInnerHTML() {
1995
1869
  return props.text;
1996
1870
  },
1871
+ style: {
1872
+ outline: "none"
1873
+ },
1997
1874
  [qwik._IMMUTABLE]: {
1998
1875
  dangerouslySetInnerHTML: qwik._wrapSignal(props, "text")
1999
1876
  }
@@ -2678,6 +2555,132 @@ const getInteractionPropertiesForEvent = (event) => {
2678
2555
  }
2679
2556
  };
2680
2557
  };
2558
+ const registry = {};
2559
+ function register(type, info) {
2560
+ let typeList = registry[type];
2561
+ if (!typeList)
2562
+ typeList = registry[type] = [];
2563
+ typeList.push(info);
2564
+ if (isBrowser()) {
2565
+ const message = {
2566
+ type: "builder.register",
2567
+ data: {
2568
+ type,
2569
+ info
2570
+ }
2571
+ };
2572
+ try {
2573
+ parent.postMessage(message, "*");
2574
+ if (parent !== window)
2575
+ window.postMessage(message, "*");
2576
+ } catch (err) {
2577
+ console.debug("Could not postmessage", err);
2578
+ }
2579
+ }
2580
+ }
2581
+ const registerInsertMenu = () => {
2582
+ register("insertMenu", {
2583
+ name: "_default",
2584
+ default: true,
2585
+ items: [
2586
+ {
2587
+ name: "Box"
2588
+ },
2589
+ {
2590
+ name: "Text"
2591
+ },
2592
+ {
2593
+ name: "Image"
2594
+ },
2595
+ {
2596
+ name: "Columns"
2597
+ },
2598
+ ...[
2599
+ {
2600
+ name: "Core:Section"
2601
+ },
2602
+ {
2603
+ name: "Core:Button"
2604
+ },
2605
+ {
2606
+ name: "Embed"
2607
+ },
2608
+ {
2609
+ name: "Custom Code"
2610
+ }
2611
+ ]
2612
+ ]
2613
+ });
2614
+ };
2615
+ let isSetupForEditing = false;
2616
+ const setupBrowserForEditing = (options = {}) => {
2617
+ if (isSetupForEditing)
2618
+ return;
2619
+ isSetupForEditing = true;
2620
+ if (isBrowser()) {
2621
+ window.parent?.postMessage({
2622
+ type: "builder.sdkInfo",
2623
+ data: {
2624
+ target: TARGET,
2625
+ supportsPatchUpdates: false,
2626
+ supportsAddBlockScoping: true,
2627
+ supportsCustomBreakpoints: true
2628
+ }
2629
+ }, "*");
2630
+ window.parent?.postMessage({
2631
+ type: "builder.updateContent",
2632
+ data: {
2633
+ options
2634
+ }
2635
+ }, "*");
2636
+ window.addEventListener("message", ({ data }) => {
2637
+ if (!data?.type)
2638
+ return;
2639
+ switch (data.type) {
2640
+ case "builder.evaluate": {
2641
+ const text = data.data.text;
2642
+ const args = data.data.arguments || [];
2643
+ const id = data.data.id;
2644
+ const fn = new Function(text);
2645
+ let result;
2646
+ let error = null;
2647
+ try {
2648
+ result = fn.apply(null, args);
2649
+ } catch (err) {
2650
+ error = err;
2651
+ }
2652
+ if (error)
2653
+ window.parent?.postMessage({
2654
+ type: "builder.evaluateError",
2655
+ data: {
2656
+ id,
2657
+ error: error.message
2658
+ }
2659
+ }, "*");
2660
+ else if (result && typeof result.then === "function")
2661
+ result.then((finalResult) => {
2662
+ window.parent?.postMessage({
2663
+ type: "builder.evaluateResult",
2664
+ data: {
2665
+ id,
2666
+ result: finalResult
2667
+ }
2668
+ }, "*");
2669
+ }).catch(console.error);
2670
+ else
2671
+ window.parent?.postMessage({
2672
+ type: "builder.evaluateResult",
2673
+ data: {
2674
+ result,
2675
+ id
2676
+ }
2677
+ }, "*");
2678
+ break;
2679
+ }
2680
+ }
2681
+ });
2682
+ }
2683
+ };
2681
2684
  const getCssFromFont = (font) => {
2682
2685
  const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
2683
2686
  const name = family.split(",")[0];
@@ -2730,6 +2733,19 @@ ${getCss({
2730
2733
  ${getFontCss({
2731
2734
  customFonts: props.customFonts
2732
2735
  })}
2736
+
2737
+ .builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
2738
+ margin: 0;
2739
+ }
2740
+ .builder-text > p, .builder-text > .builder-paragraph {
2741
+ color: inherit;
2742
+ line-height: inherit;
2743
+ letter-spacing: inherit;
2744
+ font-weight: inherit;
2745
+ font-size: inherit;
2746
+ text-align: inherit;
2747
+ font-family: inherit;
2748
+ }
2733
2749
  `
2734
2750
  });
2735
2751
  return /* @__PURE__ */ jsxRuntime.jsx(RenderInlinedStyles, {
@@ -2889,9 +2905,6 @@ const emitStateUpdate = function emitStateUpdate2(props, state, elementRef) {
2889
2905
  }
2890
2906
  }));
2891
2907
  };
2892
- const shouldRenderContentStyles = function shouldRenderContentStyles2(props, state, elementRef) {
2893
- return Boolean((state.useContent?.data?.cssCode || state.useContent?.data?.customFonts?.length) && TARGET !== "reactNative");
2894
- };
2895
2908
  const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
2896
2909
  const elementRef = qwik.useRef();
2897
2910
  const state = qwik.useStore({
@@ -3037,11 +3050,11 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
3037
3050
  return props.model;
3038
3051
  },
3039
3052
  children: [
3040
- shouldRenderContentStyles(props, state) ? /* @__PURE__ */ jsxRuntime.jsx(RenderContentStyles, {
3053
+ /* @__PURE__ */ jsxRuntime.jsx(RenderContentStyles, {
3041
3054
  contentId: state.useContent?.id,
3042
3055
  cssCode: state.useContent?.data?.cssCode,
3043
3056
  customFonts: state.useContent?.data?.customFonts
3044
- }, "03_0") : null,
3057
+ }, "03_0"),
3045
3058
  /* @__PURE__ */ jsxRuntime.jsx(RenderBlocks, {
3046
3059
  blocks: state.useContent?.data?.blocks
3047
3060
  }, state.forceReRenderCount)
@@ -1,135 +1,5 @@
1
1
  import { componentQrl, inlinedQrl, useStylesScopedQrl, _wrapSignal, _IMMUTABLE, createContext, useLexicalScope, useContextProvider, useStore, useContext, Slot, Fragment as Fragment$1, useTaskQrl, useRef, useClientEffectQrl, useCleanupQrl } from "@builder.io/qwik";
2
2
  import { jsx, Fragment, jsxs } from "@builder.io/qwik/jsx-runtime";
3
- const TARGET = "qwik";
4
- function isBrowser() {
5
- return typeof window !== "undefined" && typeof document !== "undefined";
6
- }
7
- const registry = {};
8
- function register(type, info) {
9
- let typeList = registry[type];
10
- if (!typeList)
11
- typeList = registry[type] = [];
12
- typeList.push(info);
13
- if (isBrowser()) {
14
- const message = {
15
- type: "builder.register",
16
- data: {
17
- type,
18
- info
19
- }
20
- };
21
- try {
22
- parent.postMessage(message, "*");
23
- if (parent !== window)
24
- window.postMessage(message, "*");
25
- } catch (err) {
26
- console.debug("Could not postmessage", err);
27
- }
28
- }
29
- }
30
- const registerInsertMenu = () => {
31
- register("insertMenu", {
32
- name: "_default",
33
- default: true,
34
- items: [
35
- {
36
- name: "Box"
37
- },
38
- {
39
- name: "Text"
40
- },
41
- {
42
- name: "Image"
43
- },
44
- {
45
- name: "Columns"
46
- },
47
- ...[
48
- {
49
- name: "Core:Section"
50
- },
51
- {
52
- name: "Core:Button"
53
- },
54
- {
55
- name: "Embed"
56
- },
57
- {
58
- name: "Custom Code"
59
- }
60
- ]
61
- ]
62
- });
63
- };
64
- let isSetupForEditing = false;
65
- const setupBrowserForEditing = (options = {}) => {
66
- if (isSetupForEditing)
67
- return;
68
- isSetupForEditing = true;
69
- if (isBrowser()) {
70
- window.parent?.postMessage({
71
- type: "builder.sdkInfo",
72
- data: {
73
- target: TARGET,
74
- supportsPatchUpdates: false,
75
- supportsAddBlockScoping: true,
76
- supportsCustomBreakpoints: true
77
- }
78
- }, "*");
79
- window.parent?.postMessage({
80
- type: "builder.updateContent",
81
- data: {
82
- options
83
- }
84
- }, "*");
85
- window.addEventListener("message", ({ data }) => {
86
- if (!data?.type)
87
- return;
88
- switch (data.type) {
89
- case "builder.evaluate": {
90
- const text = data.data.text;
91
- const args = data.data.arguments || [];
92
- const id = data.data.id;
93
- const fn = new Function(text);
94
- let result;
95
- let error = null;
96
- try {
97
- result = fn.apply(null, args);
98
- } catch (err) {
99
- error = err;
100
- }
101
- if (error)
102
- window.parent?.postMessage({
103
- type: "builder.evaluateError",
104
- data: {
105
- id,
106
- error: error.message
107
- }
108
- }, "*");
109
- else if (result && typeof result.then === "function")
110
- result.then((finalResult) => {
111
- window.parent?.postMessage({
112
- type: "builder.evaluateResult",
113
- data: {
114
- id,
115
- result: finalResult
116
- }
117
- }, "*");
118
- }).catch(console.error);
119
- else
120
- window.parent?.postMessage({
121
- type: "builder.evaluateResult",
122
- data: {
123
- result,
124
- id
125
- }
126
- }, "*");
127
- break;
128
- }
129
- }
130
- });
131
- }
132
- };
133
3
  const Button = /* @__PURE__ */ componentQrl(inlinedQrl((props) => {
134
4
  useStylesScopedQrl(inlinedQrl(STYLES$3, "Button_component_useStylesScoped_a1JZ0Q0Q2Oc"));
135
5
  return /* @__PURE__ */ jsx(Fragment, {
@@ -159,6 +29,10 @@ const STYLES$3 = `
159
29
  all: unset;
160
30
  }`;
161
31
  const builderContext = createContext("Builder");
32
+ const TARGET = "qwik";
33
+ function isBrowser() {
34
+ return typeof window !== "undefined" && typeof document !== "undefined";
35
+ }
162
36
  function isIframe() {
163
37
  return isBrowser() && window.self !== window.top;
164
38
  }
@@ -1413,7 +1287,7 @@ const componentInfo$7 = {
1413
1287
  "svg"
1414
1288
  ],
1415
1289
  required: true,
1416
- defaultValue: "https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
1290
+ defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
1417
1291
  onChange: serializeFn((options) => {
1418
1292
  const DEFAULT_ASPECT_RATIO = 0.7041;
1419
1293
  options.delete("srcset");
@@ -1589,9 +1463,9 @@ const SectionComponent = /* @__PURE__ */ componentQrl(inlinedQrl((props) => {
1589
1463
  style: {
1590
1464
  width: "100%",
1591
1465
  alignSelf: "stretch",
1592
- flexGrow: "1",
1466
+ flexGrow: 1,
1593
1467
  boxSizing: "border-box",
1594
- maxWidth: `${props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : 1200}px`,
1468
+ maxWidth: props.maxWidth || 1200,
1595
1469
  display: "flex",
1596
1470
  flexDirection: "column",
1597
1471
  alignItems: "stretch",
@@ -1992,6 +1866,9 @@ const Text = /* @__PURE__ */ componentQrl(inlinedQrl((props) => {
1992
1866
  get dangerouslySetInnerHTML() {
1993
1867
  return props.text;
1994
1868
  },
1869
+ style: {
1870
+ outline: "none"
1871
+ },
1995
1872
  [_IMMUTABLE]: {
1996
1873
  dangerouslySetInnerHTML: _wrapSignal(props, "text")
1997
1874
  }
@@ -2676,6 +2553,132 @@ const getInteractionPropertiesForEvent = (event) => {
2676
2553
  }
2677
2554
  };
2678
2555
  };
2556
+ const registry = {};
2557
+ function register(type, info) {
2558
+ let typeList = registry[type];
2559
+ if (!typeList)
2560
+ typeList = registry[type] = [];
2561
+ typeList.push(info);
2562
+ if (isBrowser()) {
2563
+ const message = {
2564
+ type: "builder.register",
2565
+ data: {
2566
+ type,
2567
+ info
2568
+ }
2569
+ };
2570
+ try {
2571
+ parent.postMessage(message, "*");
2572
+ if (parent !== window)
2573
+ window.postMessage(message, "*");
2574
+ } catch (err) {
2575
+ console.debug("Could not postmessage", err);
2576
+ }
2577
+ }
2578
+ }
2579
+ const registerInsertMenu = () => {
2580
+ register("insertMenu", {
2581
+ name: "_default",
2582
+ default: true,
2583
+ items: [
2584
+ {
2585
+ name: "Box"
2586
+ },
2587
+ {
2588
+ name: "Text"
2589
+ },
2590
+ {
2591
+ name: "Image"
2592
+ },
2593
+ {
2594
+ name: "Columns"
2595
+ },
2596
+ ...[
2597
+ {
2598
+ name: "Core:Section"
2599
+ },
2600
+ {
2601
+ name: "Core:Button"
2602
+ },
2603
+ {
2604
+ name: "Embed"
2605
+ },
2606
+ {
2607
+ name: "Custom Code"
2608
+ }
2609
+ ]
2610
+ ]
2611
+ });
2612
+ };
2613
+ let isSetupForEditing = false;
2614
+ const setupBrowserForEditing = (options = {}) => {
2615
+ if (isSetupForEditing)
2616
+ return;
2617
+ isSetupForEditing = true;
2618
+ if (isBrowser()) {
2619
+ window.parent?.postMessage({
2620
+ type: "builder.sdkInfo",
2621
+ data: {
2622
+ target: TARGET,
2623
+ supportsPatchUpdates: false,
2624
+ supportsAddBlockScoping: true,
2625
+ supportsCustomBreakpoints: true
2626
+ }
2627
+ }, "*");
2628
+ window.parent?.postMessage({
2629
+ type: "builder.updateContent",
2630
+ data: {
2631
+ options
2632
+ }
2633
+ }, "*");
2634
+ window.addEventListener("message", ({ data }) => {
2635
+ if (!data?.type)
2636
+ return;
2637
+ switch (data.type) {
2638
+ case "builder.evaluate": {
2639
+ const text = data.data.text;
2640
+ const args = data.data.arguments || [];
2641
+ const id = data.data.id;
2642
+ const fn = new Function(text);
2643
+ let result;
2644
+ let error = null;
2645
+ try {
2646
+ result = fn.apply(null, args);
2647
+ } catch (err) {
2648
+ error = err;
2649
+ }
2650
+ if (error)
2651
+ window.parent?.postMessage({
2652
+ type: "builder.evaluateError",
2653
+ data: {
2654
+ id,
2655
+ error: error.message
2656
+ }
2657
+ }, "*");
2658
+ else if (result && typeof result.then === "function")
2659
+ result.then((finalResult) => {
2660
+ window.parent?.postMessage({
2661
+ type: "builder.evaluateResult",
2662
+ data: {
2663
+ id,
2664
+ result: finalResult
2665
+ }
2666
+ }, "*");
2667
+ }).catch(console.error);
2668
+ else
2669
+ window.parent?.postMessage({
2670
+ type: "builder.evaluateResult",
2671
+ data: {
2672
+ result,
2673
+ id
2674
+ }
2675
+ }, "*");
2676
+ break;
2677
+ }
2678
+ }
2679
+ });
2680
+ }
2681
+ };
2679
2682
  const getCssFromFont = (font) => {
2680
2683
  const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
2681
2684
  const name = family.split(",")[0];
@@ -2728,6 +2731,19 @@ ${getCss({
2728
2731
  ${getFontCss({
2729
2732
  customFonts: props.customFonts
2730
2733
  })}
2734
+
2735
+ .builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
2736
+ margin: 0;
2737
+ }
2738
+ .builder-text > p, .builder-text > .builder-paragraph {
2739
+ color: inherit;
2740
+ line-height: inherit;
2741
+ letter-spacing: inherit;
2742
+ font-weight: inherit;
2743
+ font-size: inherit;
2744
+ text-align: inherit;
2745
+ font-family: inherit;
2746
+ }
2731
2747
  `
2732
2748
  });
2733
2749
  return /* @__PURE__ */ jsx(RenderInlinedStyles, {
@@ -2887,9 +2903,6 @@ const emitStateUpdate = function emitStateUpdate2(props, state, elementRef) {
2887
2903
  }
2888
2904
  }));
2889
2905
  };
2890
- const shouldRenderContentStyles = function shouldRenderContentStyles2(props, state, elementRef) {
2891
- return Boolean((state.useContent?.data?.cssCode || state.useContent?.data?.customFonts?.length) && TARGET !== "reactNative");
2892
- };
2893
2906
  const RenderContent = /* @__PURE__ */ componentQrl(inlinedQrl((props) => {
2894
2907
  const elementRef = useRef();
2895
2908
  const state = useStore({
@@ -3035,11 +3048,11 @@ const RenderContent = /* @__PURE__ */ componentQrl(inlinedQrl((props) => {
3035
3048
  return props.model;
3036
3049
  },
3037
3050
  children: [
3038
- shouldRenderContentStyles(props, state) ? /* @__PURE__ */ jsx(RenderContentStyles, {
3051
+ /* @__PURE__ */ jsx(RenderContentStyles, {
3039
3052
  contentId: state.useContent?.id,
3040
3053
  cssCode: state.useContent?.data?.cssCode,
3041
3054
  customFonts: state.useContent?.data?.customFonts
3042
- }, "03_0") : null,
3055
+ }, "03_0"),
3043
3056
  /* @__PURE__ */ jsx(RenderBlocks, {
3044
3057
  blocks: state.useContent?.data?.blocks
3045
3058
  }, state.forceReRenderCount)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@builder.io/sdk-qwik",
3
- "version": "0.1.8",
3
+ "version": "0.1.10",
4
4
  "description": "Builder.io Qwik SDK",
5
5
  "type": "module",
6
6
  "main": "./lib/index.qwik.cjs",
@@ -1,10 +1,10 @@
1
1
  import type { BuilderBlock } from "../../types/builder-block";
2
2
  import type { SizeName } from "../../constants/device-sizes";
3
- declare type Column = {
3
+ type Column = {
4
4
  blocks: any;
5
5
  width?: number;
6
6
  };
7
- declare type StackColumnsAt = "tablet" | "mobile" | "never";
7
+ type StackColumnsAt = "tablet" | "mobile" | "never";
8
8
  export interface ColumnProps {
9
9
  columns?: Column[];
10
10
  builderBlock: BuilderBlock;
@@ -1,6 +1,6 @@
1
1
  import type { BuilderContextInterface } from "../../context/types.js";
2
2
  import type { BuilderBlock } from "../../types/builder-block.js";
3
- export declare type BlockStylesProps = {
3
+ export type BlockStylesProps = {
4
4
  block: BuilderBlock;
5
5
  context: BuilderContextInterface;
6
6
  };
@@ -1,6 +1,6 @@
1
1
  import type { BuilderContextInterface } from "../../context/types.js";
2
2
  import type { BuilderBlock } from "../../types/builder-block.js";
3
- export declare type RenderBlockProps = {
3
+ export type RenderBlockProps = {
4
4
  block: BuilderBlock;
5
5
  context: BuilderContextInterface;
6
6
  };
@@ -1,6 +1,6 @@
1
1
  import type { BuilderBlock } from "../../types/builder-block.js";
2
2
  import type { BuilderContextInterface } from "../../context/types.js";
3
- declare type ComponentOptions = {
3
+ type ComponentOptions = {
4
4
  [index: string]: any;
5
5
  attributes?: {
6
6
  [index: string]: any;
@@ -1,6 +1,6 @@
1
1
  import type { BuilderContextInterface } from "../../context/types.js";
2
2
  import type { BuilderBlock } from "../../types/builder-block";
3
- declare type Props = {
3
+ type Props = {
4
4
  block: BuilderBlock;
5
5
  repeatContext: BuilderContextInterface;
6
6
  };
@@ -1,5 +1,5 @@
1
1
  import type { BuilderBlock } from "../types/builder-block.js";
2
- export declare type RenderBlockProps = {
2
+ export type RenderBlockProps = {
3
3
  blocks?: BuilderBlock[];
4
4
  parent?: string;
5
5
  path?: string;
@@ -14,6 +14,5 @@ export declare const handleRequest: (props: any, state: any, elementRef: any, {
14
14
  }) => void;
15
15
  export declare const runHttpRequests: (props: any, state: any, elementRef: any) => void;
16
16
  export declare const emitStateUpdate: (props: any, state: any, elementRef: any) => void;
17
- export declare const shouldRenderContentStyles: (props: any, state: any, elementRef: any) => boolean;
18
17
  export declare const RenderContent: import("@builder.io/qwik").Component<RenderContentProps>;
19
18
  export default RenderContent;
@@ -1,7 +1,7 @@
1
1
  import type { BuilderRenderContext, RegisteredComponent, BuilderRenderState } from '../../context/types';
2
2
  import type { BuilderContent } from '../../types/builder-content';
3
3
  import type { Nullable } from '../../types/typescript';
4
- export declare type RenderContentProps = {
4
+ export type RenderContentProps = {
5
5
  content?: Nullable<BuilderContent>;
6
6
  model?: string;
7
7
  data?: {
@@ -1,4 +1,4 @@
1
- export declare type SizeName = 'large' | 'medium' | 'small';
1
+ export type SizeName = 'large' | 'medium' | 'small';
2
2
  interface Size {
3
3
  min: number;
4
4
  default: number;
@@ -1,12 +1,12 @@
1
1
  import type { BuilderContent } from '../types/builder-content.js';
2
2
  import type { ComponentInfo } from '../types/components.js';
3
3
  import type { Dictionary, Nullable } from '../types/typescript.js';
4
- export declare type RegisteredComponent = ComponentInfo & {
4
+ export type RegisteredComponent = ComponentInfo & {
5
5
  component: any;
6
6
  };
7
- export declare type RegisteredComponents = Dictionary<RegisteredComponent>;
8
- export declare type BuilderRenderState = Record<string, unknown>;
9
- export declare type BuilderRenderContext = Record<string, unknown>;
7
+ export type RegisteredComponents = Dictionary<RegisteredComponent>;
8
+ export type BuilderRenderState = Record<string, unknown>;
9
+ export type BuilderRenderContext = Record<string, unknown>;
10
10
  export interface BuilderContextInterface {
11
11
  content: Nullable<BuilderContent>;
12
12
  context: BuilderRenderContext;
@@ -1,6 +1,6 @@
1
1
  import type { BuilderContextInterface } from '../context/types.js';
2
2
  import type { BuilderBlock } from '../types/builder-block.js';
3
- declare type Actions = {
3
+ type Actions = {
4
4
  [index: string]: (event: Event) => any;
5
5
  };
6
6
  export declare function getBlockActions(options: {
@@ -1,3 +1,3 @@
1
1
  import type { BuilderBlock } from '../types/builder-block.js';
2
- export declare type TagName = string;
2
+ export type TagName = string;
3
3
  export declare function getBlockTag(block: BuilderBlock): TagName;
@@ -1,4 +1,4 @@
1
- declare type QueryObject = Record<string, string | string[]>;
1
+ type QueryObject = Record<string, string | string[]>;
2
2
  export declare const convertSearchParamsToQueryObject: (searchParams: URLSearchParams) => QueryObject;
3
3
  export declare const getBuilderSearchParams: (_options: QueryObject | URLSearchParams | undefined) => QueryObject;
4
4
  export declare const getBuilderSearchParamsFromWindow: () => QueryObject;
@@ -1,3 +1,2 @@
1
1
  /// <reference types="@types/node" />
2
- /// <reference types="node" />
3
2
  export declare function getGlobalThis(): typeof global;
@@ -1,4 +1,4 @@
1
- declare type Target = import('../types/targets').Target;
1
+ type Target = import('../types/targets').Target;
2
2
  export declare function ifTarget<A, B>({ targets, doThing, elseThing, }: {
3
3
  targets: Target[];
4
4
  doThing: () => A;
@@ -1,3 +1,3 @@
1
- declare type Styles = Record<string, string | number>;
1
+ type Styles = Record<string, string | number>;
2
2
  export declare const sanitizeReactNativeBlockStyles: (styles: Styles) => Styles;
3
3
  export {};
@@ -1,4 +1,4 @@
1
- export declare type Settings = {
1
+ export type Settings = {
2
2
  customInsertMenu?: boolean;
3
3
  };
4
4
  export declare function setEditorSettings(newSettings: Settings): void;
@@ -35,7 +35,7 @@ interface Event {
35
35
  [index: string]: any;
36
36
  };
37
37
  }
38
- declare type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'contentId' | 'variationId' | 'metadata'> & {
38
+ type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'contentId' | 'variationId' | 'metadata'> & {
39
39
  /**
40
40
  * Your organization's API key.
41
41
  */
@@ -45,7 +45,7 @@ declare type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'conten
45
45
  */
46
46
  [index: string]: any;
47
47
  };
48
- export declare type EventProps = EventProperties & CanTrack;
48
+ export type EventProps = EventProperties & CanTrack;
49
49
  export declare function _track(eventProps: EventProps): Promise<void | Response>;
50
50
  export declare const track: (args: EventProperties) => Promise<void | Response>;
51
51
  export {};
@@ -1,4 +1,4 @@
1
- declare type Offset = {
1
+ type Offset = {
2
2
  x: number;
3
3
  y: number;
4
4
  };
@@ -1,2 +1,2 @@
1
- export declare type Nullable<T> = T | null | undefined;
1
+ export type Nullable<T> = T | null | undefined;
2
2
  export declare const checkIsDefined: <T>(maybeT: Nullable<T>) => maybeT is T;
package/types/index.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  export * from './index-helpers/top-of-file.js';
2
- import './scripts/init-editing.js';
3
2
  export * from './index-helpers/blocks-exports.js';
4
3
  export * from './functions/is-editing.js';
5
4
  export * from './functions/is-previewing.js';
@@ -1,4 +1,4 @@
1
- declare type JSONValue = string | number | boolean | JSONObject | JSONArray;
1
+ type JSONValue = string | number | boolean | JSONObject | JSONArray;
2
2
  interface JSONObject {
3
3
  [x: string]: JSONValue;
4
4
  }
@@ -1,3 +1,3 @@
1
- export declare type CanTrack = {
1
+ export type CanTrack = {
2
2
  canTrack: boolean;
3
3
  };
@@ -172,5 +172,5 @@ export interface ComponentInfo {
172
172
  requiredPermissions?: Array<Permission>;
173
173
  hidden?: boolean;
174
174
  }
175
- declare type Permission = 'read' | 'publish' | 'editCode' | 'editDesigns' | 'admin' | 'create';
175
+ type Permission = 'read' | 'publish' | 'editCode' | 'editDesigns' | 'admin' | 'create';
176
176
  export {};
@@ -1,3 +1,3 @@
1
- export declare type DeepPartial<T> = {
1
+ export type DeepPartial<T> = {
2
2
  [P in keyof T]?: T[P] extends Array<infer U> ? Array<DeepPartial<U>> : T[P] extends ReadonlyArray<infer U> ? ReadonlyArray<DeepPartial<U>> : DeepPartial<T[P]>;
3
3
  };
@@ -1,4 +1,4 @@
1
- declare type JSONValue = string | number | boolean | JSONObject | JSONArray;
1
+ type JSONValue = string | number | boolean | JSONObject | JSONArray;
2
2
  interface JSONObject {
3
3
  [x: string]: JSONValue;
4
4
  }
@@ -1,3 +1,3 @@
1
- declare type MitosisTargets = import('@builder.io/mitosis').Target;
2
- export declare type Target = Extract<MitosisTargets, 'vue3' | 'vue2' | 'reactNative' | 'svelte' | 'qwik' | 'react' | 'solid'>;
1
+ type MitosisTargets = import('@builder.io/mitosis').Target;
2
+ export type Target = Extract<MitosisTargets, 'vue3' | 'vue2' | 'reactNative' | 'svelte' | 'qwik' | 'react' | 'solid'>;
3
3
  export {};
@@ -1,5 +1,5 @@
1
- export declare type Nullable<T> = T | null | undefined;
2
- export declare type Dictionary<T> = {
1
+ export type Nullable<T> = T | null | undefined;
2
+ export type Dictionary<T> = {
3
3
  [key: string]: T;
4
4
  };
5
- export declare type Overwrite<T, U> = keyof U extends keyof T ? Pick<T, Exclude<keyof T, keyof U>> & U : never;
5
+ export type Overwrite<T, U> = keyof U extends keyof T ? Pick<T, Exclude<keyof T, keyof U>> & U : never;