@builder.io/sdk-qwik 0.17.7 → 0.17.8

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 (41) hide show
  1. package/lib/browser/blocks/custom-code/custom-code.qwik.cjs +1 -1
  2. package/lib/browser/blocks/custom-code/custom-code.qwik.mjs +1 -1
  3. package/lib/browser/components/block/components/block-styles.qwik.cjs +10 -2
  4. package/lib/browser/components/block/components/block-styles.qwik.mjs +10 -2
  5. package/lib/browser/components/content/components/enable-editor.qwik.cjs +2 -2
  6. package/lib/browser/components/content/components/enable-editor.qwik.mjs +3 -3
  7. package/lib/browser/constants/device-sizes.qwik.cjs +19 -3
  8. package/lib/browser/constants/device-sizes.qwik.mjs +19 -3
  9. package/lib/browser/constants/sdk-version.qwik.cjs +1 -1
  10. package/lib/browser/constants/sdk-version.qwik.mjs +1 -1
  11. package/lib/browser/scripts/init-editing.qwik.cjs +1 -0
  12. package/lib/browser/scripts/init-editing.qwik.mjs +1 -0
  13. package/lib/edge/blocks/custom-code/custom-code.qwik.cjs +1 -1
  14. package/lib/edge/blocks/custom-code/custom-code.qwik.mjs +1 -1
  15. package/lib/edge/components/block/components/block-styles.qwik.cjs +10 -2
  16. package/lib/edge/components/block/components/block-styles.qwik.mjs +10 -2
  17. package/lib/edge/components/content/components/enable-editor.qwik.cjs +2 -2
  18. package/lib/edge/components/content/components/enable-editor.qwik.mjs +3 -3
  19. package/lib/edge/constants/device-sizes.qwik.cjs +19 -3
  20. package/lib/edge/constants/device-sizes.qwik.mjs +19 -3
  21. package/lib/edge/constants/sdk-version.qwik.cjs +1 -1
  22. package/lib/edge/constants/sdk-version.qwik.mjs +1 -1
  23. package/lib/edge/scripts/init-editing.qwik.cjs +1 -0
  24. package/lib/edge/scripts/init-editing.qwik.mjs +1 -0
  25. package/lib/node/blocks/custom-code/custom-code.qwik.cjs +1 -1
  26. package/lib/node/blocks/custom-code/custom-code.qwik.mjs +1 -1
  27. package/lib/node/components/block/components/block-styles.qwik.cjs +10 -2
  28. package/lib/node/components/block/components/block-styles.qwik.mjs +10 -2
  29. package/lib/node/components/content/components/enable-editor.qwik.cjs +2 -2
  30. package/lib/node/components/content/components/enable-editor.qwik.mjs +3 -3
  31. package/lib/node/constants/device-sizes.qwik.cjs +19 -3
  32. package/lib/node/constants/device-sizes.qwik.mjs +19 -3
  33. package/lib/node/constants/sdk-version.qwik.cjs +1 -1
  34. package/lib/node/constants/sdk-version.qwik.mjs +1 -1
  35. package/lib/node/scripts/init-editing.qwik.cjs +1 -0
  36. package/lib/node/scripts/init-editing.qwik.mjs +1 -0
  37. package/package.json +1 -1
  38. package/types/src/constants/device-sizes.d.ts +3 -2
  39. package/types/src/constants/sdk-version.d.ts +1 -1
  40. package/types/src/types/builder-block.d.ts +0 -1
  41. package/types/src/types/builder-content.d.ts +1 -0
@@ -7,7 +7,7 @@ const CustomCode = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inline
7
7
  scriptsInserted: [],
8
8
  scriptsRun: []
9
9
  });
10
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
10
+ qwik.useOn("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
11
11
  const [state2] = qwik.useLexicalScope();
12
12
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
13
13
  return;
@@ -5,7 +5,7 @@ const CustomCode = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((prop
5
5
  scriptsInserted: [],
6
6
  scriptsRun: []
7
7
  });
8
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
8
+ useOn("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
9
9
  const [state2] = useLexicalScope();
10
10
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
11
11
  return;
@@ -21,15 +21,17 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
21
21
  props
22
22
  ]));
23
23
  const css$1 = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
24
- var _a, _b, _c;
24
+ var _a, _b, _c, _d, _e;
25
25
  const [props2] = qwik.useLexicalScope();
26
26
  const processedBlock = props2.block;
27
27
  const styles = processedBlock.responsiveStyles;
28
28
  const content = props2.context.content;
29
29
  const sizesWithUpdatedBreakpoints = deviceSizes.getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
30
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
30
31
  const largeStyles = styles == null ? void 0 : styles.large;
31
32
  const mediumStyles = styles == null ? void 0 : styles.medium;
32
33
  const smallStyles = styles == null ? void 0 : styles.small;
34
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
33
35
  const className = processedBlock.id;
34
36
  if (!className)
35
37
  return "";
@@ -47,10 +49,15 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
47
49
  styles: smallStyles,
48
50
  mediaQuery: deviceSizes.getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
49
51
  }) : "";
52
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? css.createCssClass({
53
+ className,
54
+ styles: xsmallStyles,
55
+ mediaQuery: deviceSizes.getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
56
+ }) : "";
50
57
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
51
58
  let hoverStylesClass = "";
52
59
  if (hoverAnimation) {
53
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
60
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
54
61
  hoverStylesClass = css.createCssClass({
55
62
  className: `${className}:hover`,
56
63
  styles: {
@@ -64,6 +71,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
64
71
  largeStylesClass,
65
72
  mediumStylesClass,
66
73
  smallStylesClass,
74
+ xsmallStylesClass,
67
75
  hoverStylesClass
68
76
  ].join(" ");
69
77
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -19,15 +19,17 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
19
19
  props
20
20
  ]));
21
21
  const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
22
- var _a, _b, _c;
22
+ var _a, _b, _c, _d, _e;
23
23
  const [props2] = useLexicalScope();
24
24
  const processedBlock = props2.block;
25
25
  const styles = processedBlock.responsiveStyles;
26
26
  const content = props2.context.content;
27
27
  const sizesWithUpdatedBreakpoints = getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
28
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
28
29
  const largeStyles = styles == null ? void 0 : styles.large;
29
30
  const mediumStyles = styles == null ? void 0 : styles.medium;
30
31
  const smallStyles = styles == null ? void 0 : styles.small;
32
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
31
33
  const className = processedBlock.id;
32
34
  if (!className)
33
35
  return "";
@@ -45,10 +47,15 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
45
47
  styles: smallStyles,
46
48
  mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
47
49
  }) : "";
50
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? createCssClass({
51
+ className,
52
+ styles: xsmallStyles,
53
+ mediaQuery: getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
54
+ }) : "";
48
55
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
49
56
  let hoverStylesClass = "";
50
57
  if (hoverAnimation) {
51
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
58
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
52
59
  hoverStylesClass = createCssClass({
53
60
  className: `${className}:hover`,
54
61
  styles: {
@@ -62,6 +69,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
62
69
  largeStylesClass,
63
70
  mediumStylesClass,
64
71
  smallStylesClass,
72
+ xsmallStylesClass,
65
73
  hoverStylesClass
66
74
  ].join(" ");
67
75
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -211,7 +211,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
211
211
  showContentProps,
212
212
  state
213
213
  ]));
214
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
214
+ qwik.useOnDocument("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
215
215
  var _a2, _b2, _c, _d;
216
216
  const [props2] = qwik.useLexicalScope();
217
217
  if (isBrowser.isBrowser()) {
@@ -238,7 +238,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
238
238
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
239
239
  }
240
240
  }
241
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
241
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
242
242
  props
243
243
  ]));
244
244
  qwik.useContextProvider(builder_context, props.builderContextSignal);
@@ -1,4 +1,4 @@
1
- import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
1
+ import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useOnDocument, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
2
2
  import { Fragment } from "@builder.io/qwik/jsx-runtime";
3
3
  import builderContext from "../../../context/builder.context.qwik.mjs";
4
4
  import { evaluate } from "../../../functions/evaluate/evaluate.qwik.mjs";
@@ -209,7 +209,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
209
209
  showContentProps,
210
210
  state
211
211
  ]));
212
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
212
+ useOnDocument("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
213
213
  var _a2, _b2, _c, _d;
214
214
  const [props2] = useLexicalScope();
215
215
  if (isBrowser()) {
@@ -236,7 +236,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
236
236
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
237
237
  }
238
238
  }
239
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
239
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
240
240
  props
241
241
  ]));
242
242
  useContextProvider(builderContext, props.builderContextSignal);
@@ -2,8 +2,13 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const fastClone = require("../functions/fast-clone.qwik.cjs");
4
4
  const SIZES = {
5
+ xsmall: {
6
+ min: 0,
7
+ default: 160,
8
+ max: 320
9
+ },
5
10
  small: {
6
- min: 320,
11
+ min: 321,
7
12
  default: 321,
8
13
  max: 640
9
14
  },
@@ -19,11 +24,22 @@ const SIZES = {
19
24
  }
20
25
  };
21
26
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
22
- const getSizesForBreakpoints = ({ small, medium }) => {
27
+ const getSizesForBreakpoints = (breakpoints) => {
23
28
  const newSizes = fastClone.fastClone(SIZES);
29
+ if (!breakpoints)
30
+ return newSizes;
31
+ const { xsmall, small, medium } = breakpoints;
32
+ if (xsmall) {
33
+ const xsmallMin = Math.floor(xsmall / 2);
34
+ newSizes.xsmall = {
35
+ max: xsmall,
36
+ min: xsmallMin,
37
+ default: xsmallMin + 1
38
+ };
39
+ }
24
40
  if (!small || !medium)
25
41
  return newSizes;
26
- const smallMin = Math.floor(small / 2);
42
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
27
43
  newSizes.small = {
28
44
  max: small,
29
45
  min: smallMin,
@@ -1,7 +1,12 @@
1
1
  import { fastClone } from "../functions/fast-clone.qwik.mjs";
2
2
  const SIZES = {
3
+ xsmall: {
4
+ min: 0,
5
+ default: 160,
6
+ max: 320
7
+ },
3
8
  small: {
4
- min: 320,
9
+ min: 321,
5
10
  default: 321,
6
11
  max: 640
7
12
  },
@@ -17,11 +22,22 @@ const SIZES = {
17
22
  }
18
23
  };
19
24
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
20
- const getSizesForBreakpoints = ({ small, medium }) => {
25
+ const getSizesForBreakpoints = (breakpoints) => {
21
26
  const newSizes = fastClone(SIZES);
27
+ if (!breakpoints)
28
+ return newSizes;
29
+ const { xsmall, small, medium } = breakpoints;
30
+ if (xsmall) {
31
+ const xsmallMin = Math.floor(xsmall / 2);
32
+ newSizes.xsmall = {
33
+ max: xsmall,
34
+ min: xsmallMin,
35
+ default: xsmallMin + 1
36
+ };
37
+ }
22
38
  if (!small || !medium)
23
39
  return newSizes;
24
- const smallMin = Math.floor(small / 2);
40
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
25
41
  newSizes.small = {
26
42
  max: small,
27
43
  min: smallMin,
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const SDK_VERSION = "0.17.7";
3
+ const SDK_VERSION = "0.17.8";
4
4
  exports.SDK_VERSION = SDK_VERSION;
@@ -1,4 +1,4 @@
1
- const SDK_VERSION = "0.17.7";
1
+ const SDK_VERSION = "0.17.8";
2
2
  export {
3
3
  SDK_VERSION
4
4
  };
@@ -56,6 +56,7 @@ const setupBrowserForEditing = (options = {}) => {
56
56
  // scope our '+ add block' button styling
57
57
  supportsAddBlockScoping: true,
58
58
  supportsCustomBreakpoints: true,
59
+ supportsXSmallBreakpoint: true,
59
60
  blockLevelPersonalization: true
60
61
  }
61
62
  }, "*");
@@ -54,6 +54,7 @@ const setupBrowserForEditing = (options = {}) => {
54
54
  // scope our '+ add block' button styling
55
55
  supportsAddBlockScoping: true,
56
56
  supportsCustomBreakpoints: true,
57
+ supportsXSmallBreakpoint: true,
57
58
  blockLevelPersonalization: true
58
59
  }
59
60
  }, "*");
@@ -7,7 +7,7 @@ const CustomCode = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inline
7
7
  scriptsInserted: [],
8
8
  scriptsRun: []
9
9
  });
10
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
10
+ qwik.useOn("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
11
11
  const [state2] = qwik.useLexicalScope();
12
12
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
13
13
  return;
@@ -5,7 +5,7 @@ const CustomCode = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((prop
5
5
  scriptsInserted: [],
6
6
  scriptsRun: []
7
7
  });
8
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
8
+ useOn("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
9
9
  const [state2] = useLexicalScope();
10
10
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
11
11
  return;
@@ -21,15 +21,17 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
21
21
  props
22
22
  ]));
23
23
  const css$1 = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
24
- var _a, _b, _c;
24
+ var _a, _b, _c, _d, _e;
25
25
  const [props2] = qwik.useLexicalScope();
26
26
  const processedBlock = props2.block;
27
27
  const styles = processedBlock.responsiveStyles;
28
28
  const content = props2.context.content;
29
29
  const sizesWithUpdatedBreakpoints = deviceSizes.getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
30
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
30
31
  const largeStyles = styles == null ? void 0 : styles.large;
31
32
  const mediumStyles = styles == null ? void 0 : styles.medium;
32
33
  const smallStyles = styles == null ? void 0 : styles.small;
34
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
33
35
  const className = processedBlock.id;
34
36
  if (!className)
35
37
  return "";
@@ -47,10 +49,15 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
47
49
  styles: smallStyles,
48
50
  mediaQuery: deviceSizes.getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
49
51
  }) : "";
52
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? css.createCssClass({
53
+ className,
54
+ styles: xsmallStyles,
55
+ mediaQuery: deviceSizes.getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
56
+ }) : "";
50
57
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
51
58
  let hoverStylesClass = "";
52
59
  if (hoverAnimation) {
53
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
60
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
54
61
  hoverStylesClass = css.createCssClass({
55
62
  className: `${className}:hover`,
56
63
  styles: {
@@ -64,6 +71,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
64
71
  largeStylesClass,
65
72
  mediumStylesClass,
66
73
  smallStylesClass,
74
+ xsmallStylesClass,
67
75
  hoverStylesClass
68
76
  ].join(" ");
69
77
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -19,15 +19,17 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
19
19
  props
20
20
  ]));
21
21
  const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
22
- var _a, _b, _c;
22
+ var _a, _b, _c, _d, _e;
23
23
  const [props2] = useLexicalScope();
24
24
  const processedBlock = props2.block;
25
25
  const styles = processedBlock.responsiveStyles;
26
26
  const content = props2.context.content;
27
27
  const sizesWithUpdatedBreakpoints = getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
28
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
28
29
  const largeStyles = styles == null ? void 0 : styles.large;
29
30
  const mediumStyles = styles == null ? void 0 : styles.medium;
30
31
  const smallStyles = styles == null ? void 0 : styles.small;
32
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
31
33
  const className = processedBlock.id;
32
34
  if (!className)
33
35
  return "";
@@ -45,10 +47,15 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
45
47
  styles: smallStyles,
46
48
  mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
47
49
  }) : "";
50
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? createCssClass({
51
+ className,
52
+ styles: xsmallStyles,
53
+ mediaQuery: getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
54
+ }) : "";
48
55
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
49
56
  let hoverStylesClass = "";
50
57
  if (hoverAnimation) {
51
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
58
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
52
59
  hoverStylesClass = createCssClass({
53
60
  className: `${className}:hover`,
54
61
  styles: {
@@ -62,6 +69,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
62
69
  largeStylesClass,
63
70
  mediumStylesClass,
64
71
  smallStylesClass,
72
+ xsmallStylesClass,
65
73
  hoverStylesClass
66
74
  ].join(" ");
67
75
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -211,7 +211,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
211
211
  showContentProps,
212
212
  state
213
213
  ]));
214
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
214
+ qwik.useOnDocument("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
215
215
  var _a2, _b2, _c, _d;
216
216
  const [props2] = qwik.useLexicalScope();
217
217
  if (isBrowser.isBrowser()) {
@@ -238,7 +238,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
238
238
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
239
239
  }
240
240
  }
241
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
241
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
242
242
  props
243
243
  ]));
244
244
  qwik.useContextProvider(builder_context, props.builderContextSignal);
@@ -1,4 +1,4 @@
1
- import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
1
+ import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useOnDocument, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
2
2
  import { Fragment } from "@builder.io/qwik/jsx-runtime";
3
3
  import builderContext from "../../../context/builder.context.qwik.mjs";
4
4
  import { evaluate } from "../../../functions/evaluate/evaluate.qwik.mjs";
@@ -209,7 +209,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
209
209
  showContentProps,
210
210
  state
211
211
  ]));
212
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
212
+ useOnDocument("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
213
213
  var _a2, _b2, _c, _d;
214
214
  const [props2] = useLexicalScope();
215
215
  if (isBrowser()) {
@@ -236,7 +236,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
236
236
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
237
237
  }
238
238
  }
239
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
239
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
240
240
  props
241
241
  ]));
242
242
  useContextProvider(builderContext, props.builderContextSignal);
@@ -2,8 +2,13 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const fastClone = require("../functions/fast-clone.qwik.cjs");
4
4
  const SIZES = {
5
+ xsmall: {
6
+ min: 0,
7
+ default: 160,
8
+ max: 320
9
+ },
5
10
  small: {
6
- min: 320,
11
+ min: 321,
7
12
  default: 321,
8
13
  max: 640
9
14
  },
@@ -19,11 +24,22 @@ const SIZES = {
19
24
  }
20
25
  };
21
26
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
22
- const getSizesForBreakpoints = ({ small, medium }) => {
27
+ const getSizesForBreakpoints = (breakpoints) => {
23
28
  const newSizes = fastClone.fastClone(SIZES);
29
+ if (!breakpoints)
30
+ return newSizes;
31
+ const { xsmall, small, medium } = breakpoints;
32
+ if (xsmall) {
33
+ const xsmallMin = Math.floor(xsmall / 2);
34
+ newSizes.xsmall = {
35
+ max: xsmall,
36
+ min: xsmallMin,
37
+ default: xsmallMin + 1
38
+ };
39
+ }
24
40
  if (!small || !medium)
25
41
  return newSizes;
26
- const smallMin = Math.floor(small / 2);
42
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
27
43
  newSizes.small = {
28
44
  max: small,
29
45
  min: smallMin,
@@ -1,7 +1,12 @@
1
1
  import { fastClone } from "../functions/fast-clone.qwik.mjs";
2
2
  const SIZES = {
3
+ xsmall: {
4
+ min: 0,
5
+ default: 160,
6
+ max: 320
7
+ },
3
8
  small: {
4
- min: 320,
9
+ min: 321,
5
10
  default: 321,
6
11
  max: 640
7
12
  },
@@ -17,11 +22,22 @@ const SIZES = {
17
22
  }
18
23
  };
19
24
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
20
- const getSizesForBreakpoints = ({ small, medium }) => {
25
+ const getSizesForBreakpoints = (breakpoints) => {
21
26
  const newSizes = fastClone(SIZES);
27
+ if (!breakpoints)
28
+ return newSizes;
29
+ const { xsmall, small, medium } = breakpoints;
30
+ if (xsmall) {
31
+ const xsmallMin = Math.floor(xsmall / 2);
32
+ newSizes.xsmall = {
33
+ max: xsmall,
34
+ min: xsmallMin,
35
+ default: xsmallMin + 1
36
+ };
37
+ }
22
38
  if (!small || !medium)
23
39
  return newSizes;
24
- const smallMin = Math.floor(small / 2);
40
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
25
41
  newSizes.small = {
26
42
  max: small,
27
43
  min: smallMin,
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const SDK_VERSION = "0.17.7";
3
+ const SDK_VERSION = "0.17.8";
4
4
  exports.SDK_VERSION = SDK_VERSION;
@@ -1,4 +1,4 @@
1
- const SDK_VERSION = "0.17.7";
1
+ const SDK_VERSION = "0.17.8";
2
2
  export {
3
3
  SDK_VERSION
4
4
  };
@@ -56,6 +56,7 @@ const setupBrowserForEditing = (options = {}) => {
56
56
  // scope our '+ add block' button styling
57
57
  supportsAddBlockScoping: true,
58
58
  supportsCustomBreakpoints: true,
59
+ supportsXSmallBreakpoint: true,
59
60
  blockLevelPersonalization: true
60
61
  }
61
62
  }, "*");
@@ -54,6 +54,7 @@ const setupBrowserForEditing = (options = {}) => {
54
54
  // scope our '+ add block' button styling
55
55
  supportsAddBlockScoping: true,
56
56
  supportsCustomBreakpoints: true,
57
+ supportsXSmallBreakpoint: true,
57
58
  blockLevelPersonalization: true
58
59
  }
59
60
  }, "*");
@@ -7,7 +7,7 @@ const CustomCode = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inline
7
7
  scriptsInserted: [],
8
8
  scriptsRun: []
9
9
  });
10
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
10
+ qwik.useOn("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
11
11
  const [state2] = qwik.useLexicalScope();
12
12
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
13
13
  return;
@@ -5,7 +5,7 @@ const CustomCode = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((prop
5
5
  scriptsInserted: [],
6
6
  scriptsRun: []
7
7
  });
8
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
8
+ useOn("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
9
9
  const [state2] = useLexicalScope();
10
10
  if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
11
11
  return;
@@ -21,15 +21,17 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
21
21
  props
22
22
  ]));
23
23
  const css$1 = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
24
- var _a, _b, _c;
24
+ var _a, _b, _c, _d, _e;
25
25
  const [props2] = qwik.useLexicalScope();
26
26
  const processedBlock = props2.block;
27
27
  const styles = processedBlock.responsiveStyles;
28
28
  const content = props2.context.content;
29
29
  const sizesWithUpdatedBreakpoints = deviceSizes.getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
30
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
30
31
  const largeStyles = styles == null ? void 0 : styles.large;
31
32
  const mediumStyles = styles == null ? void 0 : styles.medium;
32
33
  const smallStyles = styles == null ? void 0 : styles.small;
34
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
33
35
  const className = processedBlock.id;
34
36
  if (!className)
35
37
  return "";
@@ -47,10 +49,15 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
47
49
  styles: smallStyles,
48
50
  mediaQuery: deviceSizes.getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
49
51
  }) : "";
52
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? css.createCssClass({
53
+ className,
54
+ styles: xsmallStyles,
55
+ mediaQuery: deviceSizes.getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
56
+ }) : "";
50
57
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
51
58
  let hoverStylesClass = "";
52
59
  if (hoverAnimation) {
53
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
60
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
54
61
  hoverStylesClass = css.createCssClass({
55
62
  className: `${className}:hover`,
56
63
  styles: {
@@ -64,6 +71,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
64
71
  largeStylesClass,
65
72
  mediumStylesClass,
66
73
  smallStylesClass,
74
+ xsmallStylesClass,
67
75
  hoverStylesClass
68
76
  ].join(" ");
69
77
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -19,15 +19,17 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
19
19
  props
20
20
  ]));
21
21
  const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
22
- var _a, _b, _c;
22
+ var _a, _b, _c, _d, _e;
23
23
  const [props2] = useLexicalScope();
24
24
  const processedBlock = props2.block;
25
25
  const styles = processedBlock.responsiveStyles;
26
26
  const content = props2.context.content;
27
27
  const sizesWithUpdatedBreakpoints = getSizesForBreakpoints(((_a = content == null ? void 0 : content.meta) == null ? void 0 : _a.breakpoints) || {});
28
+ const contentHasXSmallBreakpoint = Boolean((_c = (_b = content == null ? void 0 : content.meta) == null ? void 0 : _b.breakpoints) == null ? void 0 : _c.xsmall);
28
29
  const largeStyles = styles == null ? void 0 : styles.large;
29
30
  const mediumStyles = styles == null ? void 0 : styles.medium;
30
31
  const smallStyles = styles == null ? void 0 : styles.small;
32
+ const xsmallStyles = styles == null ? void 0 : styles.xsmall;
31
33
  const className = processedBlock.id;
32
34
  if (!className)
33
35
  return "";
@@ -45,10 +47,15 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
45
47
  styles: smallStyles,
46
48
  mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
47
49
  }) : "";
50
+ const xsmallStylesClass = xsmallStyles && contentHasXSmallBreakpoint ? createCssClass({
51
+ className,
52
+ styles: xsmallStyles,
53
+ mediaQuery: getMaxWidthQueryForSize("xsmall", sizesWithUpdatedBreakpoints)
54
+ }) : "";
48
55
  const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
49
56
  let hoverStylesClass = "";
50
57
  if (hoverAnimation) {
51
- const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.styles) || {};
58
+ const hoverStyles = ((_e = (_d = hoverAnimation.steps) == null ? void 0 : _d[1]) == null ? void 0 : _e.styles) || {};
52
59
  hoverStylesClass = createCssClass({
53
60
  className: `${className}:hover`,
54
61
  styles: {
@@ -62,6 +69,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
62
69
  largeStylesClass,
63
70
  mediumStylesClass,
64
71
  smallStylesClass,
72
+ xsmallStylesClass,
65
73
  hoverStylesClass
66
74
  ].join(" ");
67
75
  }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
@@ -211,7 +211,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
211
211
  showContentProps,
212
212
  state
213
213
  ]));
214
- qwik.useOn("qvisible", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
214
+ qwik.useOnDocument("readystatechange", /* @__PURE__ */ qwik.inlinedQrl((event, element) => {
215
215
  var _a2, _b2, _c, _d;
216
216
  const [props2] = qwik.useLexicalScope();
217
217
  if (isBrowser.isBrowser()) {
@@ -238,7 +238,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
238
238
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
239
239
  }
240
240
  }
241
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
241
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
242
242
  props
243
243
  ]));
244
244
  qwik.useContextProvider(builder_context, props.builderContextSignal);
@@ -1,4 +1,4 @@
1
- import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
1
+ import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope, useSignal, useStore, useOn, useOnDocument, useContextProvider, useTaskQrl, _jsxC, Slot, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
2
2
  import { Fragment } from "@builder.io/qwik/jsx-runtime";
3
3
  import builderContext from "../../../context/builder.context.qwik.mjs";
4
4
  import { evaluate } from "../../../functions/evaluate/evaluate.qwik.mjs";
@@ -209,7 +209,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
209
209
  showContentProps,
210
210
  state
211
211
  ]));
212
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
212
+ useOnDocument("readystatechange", /* @__PURE__ */ inlinedQrl((event, element) => {
213
213
  var _a2, _b2, _c, _d;
214
214
  const [props2] = useLexicalScope();
215
215
  if (isBrowser()) {
@@ -236,7 +236,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
236
236
  element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
237
237
  }
238
238
  }
239
- }, "EnableEditor_component_useOn_2_FyR0YPSlJlw", [
239
+ }, "EnableEditor_component_useOnDocument_H7syEGJXM4Y", [
240
240
  props
241
241
  ]));
242
242
  useContextProvider(builderContext, props.builderContextSignal);
@@ -2,8 +2,13 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const fastClone = require("../functions/fast-clone.qwik.cjs");
4
4
  const SIZES = {
5
+ xsmall: {
6
+ min: 0,
7
+ default: 160,
8
+ max: 320
9
+ },
5
10
  small: {
6
- min: 320,
11
+ min: 321,
7
12
  default: 321,
8
13
  max: 640
9
14
  },
@@ -19,11 +24,22 @@ const SIZES = {
19
24
  }
20
25
  };
21
26
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
22
- const getSizesForBreakpoints = ({ small, medium }) => {
27
+ const getSizesForBreakpoints = (breakpoints) => {
23
28
  const newSizes = fastClone.fastClone(SIZES);
29
+ if (!breakpoints)
30
+ return newSizes;
31
+ const { xsmall, small, medium } = breakpoints;
32
+ if (xsmall) {
33
+ const xsmallMin = Math.floor(xsmall / 2);
34
+ newSizes.xsmall = {
35
+ max: xsmall,
36
+ min: xsmallMin,
37
+ default: xsmallMin + 1
38
+ };
39
+ }
24
40
  if (!small || !medium)
25
41
  return newSizes;
26
- const smallMin = Math.floor(small / 2);
42
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
27
43
  newSizes.small = {
28
44
  max: small,
29
45
  min: smallMin,
@@ -1,7 +1,12 @@
1
1
  import { fastClone } from "../functions/fast-clone.qwik.mjs";
2
2
  const SIZES = {
3
+ xsmall: {
4
+ min: 0,
5
+ default: 160,
6
+ max: 320
7
+ },
3
8
  small: {
4
- min: 320,
9
+ min: 321,
5
10
  default: 321,
6
11
  max: 640
7
12
  },
@@ -17,11 +22,22 @@ const SIZES = {
17
22
  }
18
23
  };
19
24
  const getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
20
- const getSizesForBreakpoints = ({ small, medium }) => {
25
+ const getSizesForBreakpoints = (breakpoints) => {
21
26
  const newSizes = fastClone(SIZES);
27
+ if (!breakpoints)
28
+ return newSizes;
29
+ const { xsmall, small, medium } = breakpoints;
30
+ if (xsmall) {
31
+ const xsmallMin = Math.floor(xsmall / 2);
32
+ newSizes.xsmall = {
33
+ max: xsmall,
34
+ min: xsmallMin,
35
+ default: xsmallMin + 1
36
+ };
37
+ }
22
38
  if (!small || !medium)
23
39
  return newSizes;
24
- const smallMin = Math.floor(small / 2);
40
+ const smallMin = xsmall ? newSizes.xsmall.max + 1 : Math.floor(small / 2);
25
41
  newSizes.small = {
26
42
  max: small,
27
43
  min: smallMin,
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const SDK_VERSION = "0.17.7";
3
+ const SDK_VERSION = "0.17.8";
4
4
  exports.SDK_VERSION = SDK_VERSION;
@@ -1,4 +1,4 @@
1
- const SDK_VERSION = "0.17.7";
1
+ const SDK_VERSION = "0.17.8";
2
2
  export {
3
3
  SDK_VERSION
4
4
  };
@@ -56,6 +56,7 @@ const setupBrowserForEditing = (options = {}) => {
56
56
  // scope our '+ add block' button styling
57
57
  supportsAddBlockScoping: true,
58
58
  supportsCustomBreakpoints: true,
59
+ supportsXSmallBreakpoint: true,
59
60
  blockLevelPersonalization: true
60
61
  }
61
62
  }, "*");
@@ -54,6 +54,7 @@ const setupBrowserForEditing = (options = {}) => {
54
54
  // scope our '+ add block' button styling
55
55
  supportsAddBlockScoping: true,
56
56
  supportsCustomBreakpoints: true,
57
+ supportsXSmallBreakpoint: true,
57
58
  blockLevelPersonalization: true
58
59
  }
59
60
  }, "*");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@builder.io/sdk-qwik",
3
- "version": "0.17.7",
3
+ "version": "0.17.8",
4
4
  "homepage": "https://github.com/BuilderIO/builder/tree/main/packages/sdks/output/qwik",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1,4 +1,4 @@
1
- export type SizeName = 'large' | 'medium' | 'small';
1
+ export type SizeName = 'large' | 'medium' | 'small' | 'xsmall';
2
2
  interface Size {
3
3
  min: number;
4
4
  default: number;
@@ -6,8 +6,9 @@ interface Size {
6
6
  }
7
7
  export declare const getMaxWidthQueryForSize: (size: SizeName, sizeValues?: Record<SizeName, Size>) => string;
8
8
  interface Breakpoints {
9
+ xsmall?: number;
9
10
  small?: number;
10
11
  medium?: number;
11
12
  }
12
- export declare const getSizesForBreakpoints: ({ small, medium }: Breakpoints) => Record<SizeName, Size>;
13
+ export declare const getSizesForBreakpoints: (breakpoints: Breakpoints) => Record<SizeName, Size>;
13
14
  export {};
@@ -1 +1 @@
1
- export declare const SDK_VERSION = "0.17.7";
1
+ export declare const SDK_VERSION = "0.17.8";
@@ -37,7 +37,6 @@ export interface BuilderBlock {
37
37
  large?: Partial<CSSStyleDeclaration>;
38
38
  medium?: Partial<CSSStyleDeclaration>;
39
39
  small?: Partial<CSSStyleDeclaration>;
40
- /** @deprecated */
41
40
  xsmall?: Partial<CSSStyleDeclaration>;
42
41
  };
43
42
  component?: {
@@ -2,6 +2,7 @@ import type { BuilderBlock } from './builder-block';
2
2
  import type { Input } from './input';
3
3
  import type { Nullable } from './typescript';
4
4
  export interface Breakpoints {
5
+ xsmall?: number;
5
6
  small: number;
6
7
  medium: number;
7
8
  }