@makeswift/runtime 0.23.5 → 0.23.6-canary.1

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Descendant } from 'slate'\nimport { Slate } from '@makeswift/controls'\n\nimport { getBaseBreakpoint, DefaultBreakpointID } from '../../../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../hooks/use-breakpoints'\nimport { RichTextV2Definition, RichText } from '../../../../../controls'\n\nexport function usePresetValue(definition: RichTextV2Definition): Descendant[] {\n  const breakpoints = useBreakpoints()\n  return useMemo(\n    () => [\n      {\n        type: Slate.BlockType.Default,\n        children: [\n          {\n            text: definition.config.defaultValue ?? '',\n            ...(definition.config.mode === RichText.Mode.Inline\n              ? {}\n              : {\n                  typography: {\n                    style: [\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: {\n                          fontWeight: 400,\n                          fontSize: { value: 18, unit: 'px' },\n                          lineHeight: 1.5,\n                        },\n                      },\n                      ...(breakpoints.some(({ id }) => id === DefaultBreakpointID.Mobile)\n                        ? [\n                            {\n                              deviceId: DefaultBreakpointID.Mobile,\n                              value: { fontSize: { value: 16, unit: 'px' } },\n                            },\n                          ]\n                        : []),\n                    ],\n                  },\n                }),\n          },\n        ],\n      },\n    ],\n    [definition.config.mode, definition.config.defaultValue, breakpoints],\n  )\n}\n\nexport const defaultValue = [\n  {\n    type: Slate.BlockType.Default,\n    children: [\n      {\n        text: '',\n      },\n    ],\n  },\n]\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAExB,sBAAsB;AAEtB,yBAAuD;AACvD,6BAA+B;AAC/B,IAAAA,mBAA+C;AAExC,SAAS,eAAe,YAAgD;AAC7E,QAAM,kBAAc,uCAAe;AACnC,aAAO;AAAA,IACL,MAAM;AAAA,MACJ;AAAA,QACE,MAAM,sBAAM,UAAU;AAAA,QACtB,UAAU;AAAA,UACR;AAAA,YACE,MAAM,WAAW,OAAO,gBAAgB;AAAA,YACxC,GAAI,WAAW,OAAO,SAAS,0BAAS,KAAK,SACzC,CAAC,IACD;AAAA,cACE,YAAY;AAAA,gBACV,OAAO;AAAA,kBACL;AAAA,oBACE,cAAU,sCAAkB,WAAW,EAAE;AAAA,oBACzC,OAAO;AAAA,sBACL,YAAY;AAAA,sBACZ,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,sBAClC,YAAY;AAAA,oBACd;AAAA,kBACF;AAAA,kBACA,GAAI,YAAY,KAAK,CAAC,EAAE,GAAG,MAAM,OAAO,uCAAoB,MAAM,IAC9D;AAAA,oBACE;AAAA,sBACE,UAAU,uCAAoB;AAAA,sBAC9B,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK,EAAE;AAAA,oBAC/C;AAAA,kBACF,IACA,CAAC;AAAA,gBACP;AAAA,cACF;AAAA,YACF;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO,MAAM,WAAW,OAAO,cAAc,WAAW;AAAA,EACtE;AACF;AAEO,MAAM,eAAe;AAAA,EAC1B;AAAA,IACE,MAAM,sBAAM,UAAU;AAAA,IACtB,UAAU;AAAA,MACR;AAAA,QACE,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;","names":["import_controls"]}
+{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Descendant } from 'slate'\nimport { Slate, getBaseBreakpoint } from '@makeswift/controls'\n\nimport { DefaultBreakpointID } from '../../../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../hooks/use-breakpoints'\nimport { RichTextV2Definition, RichText } from '../../../../../controls'\n\nexport function usePresetValue(definition: RichTextV2Definition): Descendant[] {\n  const breakpoints = useBreakpoints()\n  return useMemo(\n    () => [\n      {\n        type: Slate.BlockType.Default,\n        children: [\n          {\n            text: definition.config.defaultValue ?? '',\n            ...(definition.config.mode === RichText.Mode.Inline\n              ? {}\n              : {\n                  typography: {\n                    style: [\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: {\n                          fontWeight: 400,\n                          fontSize: { value: 18, unit: 'px' },\n                          lineHeight: 1.5,\n                        },\n                      },\n                      ...(breakpoints.some(({ id }) => id === DefaultBreakpointID.Mobile)\n                        ? [\n                            {\n                              deviceId: DefaultBreakpointID.Mobile,\n                              value: { fontSize: { value: 16, unit: 'px' } },\n                            },\n                          ]\n                        : []),\n                    ],\n                  },\n                }),\n          },\n        ],\n      },\n    ],\n    [definition.config.mode, definition.config.defaultValue, breakpoints],\n  )\n}\n\nexport const defaultValue = [\n  {\n    type: Slate.BlockType.Default,\n    children: [\n      {\n        text: '',\n      },\n    ],\n  },\n]\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAExB,sBAAyC;AAEzC,yBAAoC;AACpC,6BAA+B;AAC/B,IAAAA,mBAA+C;AAExC,SAAS,eAAe,YAAgD;AAC7E,QAAM,kBAAc,uCAAe;AACnC,aAAO;AAAA,IACL,MAAM;AAAA,MACJ;AAAA,QACE,MAAM,sBAAM,UAAU;AAAA,QACtB,UAAU;AAAA,UACR;AAAA,YACE,MAAM,WAAW,OAAO,gBAAgB;AAAA,YACxC,GAAI,WAAW,OAAO,SAAS,0BAAS,KAAK,SACzC,CAAC,IACD;AAAA,cACE,YAAY;AAAA,gBACV,OAAO;AAAA,kBACL;AAAA,oBACE,cAAU,mCAAkB,WAAW,EAAE;AAAA,oBACzC,OAAO;AAAA,sBACL,YAAY;AAAA,sBACZ,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,sBAClC,YAAY;AAAA,oBACd;AAAA,kBACF;AAAA,kBACA,GAAI,YAAY,KAAK,CAAC,EAAE,GAAG,MAAM,OAAO,uCAAoB,MAAM,IAC9D;AAAA,oBACE;AAAA,sBACE,UAAU,uCAAoB;AAAA,sBAC9B,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK,EAAE;AAAA,oBAC/C;AAAA,kBACF,IACA,CAAC;AAAA,gBACP;AAAA,cACF;AAAA,YACF;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO,MAAM,WAAW,OAAO,cAAc,WAAW;AAAA,EACtE;AACF;AAEO,MAAM,eAAe;AAAA,EAC1B;AAAA,IACE,MAAM,sBAAM,UAAU;AAAA,IACtB,UAAU;AAAA,MACR;AAAA,QACE,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;","names":["import_controls"]}

package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js

@@ -25,7 +25,6 @@ var import_react = require("react");
 var import_serialize = require("@emotion/serialize");
 var import_controls = require("@makeswift/controls");
 var import_root_style_registry = require("../../../next/root-style-registry");
-var import_breakpoints = require("../../../state/modules/breakpoints");
 var import_style = require("../controls/style");
 var import_typography = require("../controls/typography");
 var import_use_breakpoints = require("./use-breakpoints");
@@ -88,7 +87,7 @@ function styleV2Css(breakpoints, style) {
     ...breakpoints.reduce(
       (styles, breakpoint) => ({
         ...styles,
-        [(0, import_breakpoints.getBreakpointMediaQuery)(breakpoint)]: style.getStyle(breakpoint)
+        [(0, import_controls.getBreakpointMediaQuery)(breakpoint)]: style.getStyle(breakpoint)
       }),
       {}
     )

package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-stylesheet-factory.ts"],"sourcesContent":["import { useMemo, useEffect, useRef } from 'react'\nimport { type CSSObject, serializeStyles } from '@emotion/serialize'\nimport { type EmotionCache } from '@emotion/cache'\nimport { type SerializedStyles } from '@emotion/utils'\n\nimport {\n  type Breakpoints,\n  type BoxModel,\n  type Stylesheet,\n  type ResolvedStyle,\n  type ResolvedStyleV2,\n  type ResolvedTypographyStyle,\n  isNotNil,\n  getBaseBreakpoint,\n} from '@makeswift/controls'\n\nimport { useCache } from '../../../next/root-style-registry'\nimport { getBreakpointMediaQuery } from '../../../state/modules/breakpoints'\n\nimport { styleV1Css } from '../controls/style'\nimport { typographyCss } from '../controls/typography'\n\nimport { useBreakpoints } from './use-breakpoints'\nimport { useCssId } from './use-css-id'\nimport { useStyles, serializedStyleClassName } from '../use-style'\nimport { pollBoxModel } from '../poll-box-model'\n\nexport type StylesheetFactory = {\n  get(propName: string): Stylesheet\n  useDefinedStyles(): void\n}\n\nexport function useStylesheetFactory(): StylesheetFactory {\n  const breakpoints = useBreakpoints()\n  const cache = useCache()\n  const componentUid = useCssId()\n\n  const computedStyles = useRef<Record<string, SerializedStyles>>({}).current\n  const boxModelCallbacks = useRef<Record<string, (boxModel: BoxModel | null) => void>>({}).current\n\n  return useMemo(() => {\n    const getStylesheet = (styleSheetId: string): Stylesheet => ({\n      breakpoints(): Breakpoints {\n        return breakpoints\n      },\n\n      defineStyle(\n        style: ResolvedStyle,\n        onBoxModelChange?: (boxModel: BoxModel | null) => void,\n      ): string {\n        const serialized = serializeStyle(breakpoints, style, cache)\n        const uid = `u-${componentUid}-${styleSheetId}`\n        computedStyles[uid] = serialized\n\n        const className = serializedStyleClassName(cache, serialized)\n        if (!onBoxModelChange) return className\n\n        boxModelCallbacks[uid] = onBoxModelChange\n        return `${className} ${uid}`\n      },\n\n      child(id: string): Stylesheet {\n        return getStylesheet(`${styleSheetId}-${id}`)\n      },\n    })\n\n    return {\n      get(propName: string): Stylesheet {\n        return getStylesheet(propName)\n      },\n\n      useDefinedStyles() {\n        useStyles(cache, Object.values(computedStyles))\n\n        useEffect(() => {\n          const unsubscribes = Object.entries(boxModelCallbacks)\n            .map(([uid, callback]) =>\n              callback != null\n                ? pollBoxModel({\n                    element: document.querySelector(`.${uid}`),\n                    onBoxModelChange: callback,\n                  })\n                : undefined,\n            )\n            .filter(isNotNil)\n\n          return () => unsubscribes.forEach(fn => fn())\n        }, [Object.keys(boxModelCallbacks).join(' ')])\n      },\n    }\n  }, [breakpoints, cache, componentUid])\n}\n\nfunction isTypographyStyle(style: ResolvedStyle): style is ResolvedTypographyStyle {\n  return Array.isArray(style)\n}\n\nfunction isStyleV2(style: ResolvedStyle): style is ResolvedStyleV2 {\n  return typeof style === 'object' && 'getStyle' in style && typeof style.getStyle === 'function'\n}\n\nfunction styleV2Css(breakpoints: Breakpoints, style: ResolvedStyleV2<CSSObject>): CSSObject {\n  return {\n    ...style.getStyle(getBaseBreakpoint(breakpoints)),\n    ...breakpoints.reduce(\n      (styles, breakpoint) => ({\n        ...styles,\n        [getBreakpointMediaQuery(breakpoint)]: style.getStyle(breakpoint),\n      }),\n      {},\n    ),\n  }\n}\n\nfunction resolvedStyleToCss(breakpoints: Breakpoints, style: ResolvedStyle) {\n  if (isTypographyStyle(style)) {\n    return typographyCss(breakpoints, style)\n  }\n\n  if (isStyleV2(style)) {\n    return styleV2Css(breakpoints, style as ResolvedStyleV2<CSSObject>)\n  }\n\n  const { properties, styleData } = style\n  return styleV1Css(breakpoints, styleData, properties)\n}\n\nfunction serializeStyle(\n  breakpoints: Breakpoints,\n  style: ResolvedStyle,\n  cache: EmotionCache,\n): SerializedStyles {\n  const css = resolvedStyleToCss(breakpoints, style)\n  return serializeStyles([css], cache.registered)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2C;AAC3C,uBAAgD;AAIhD,sBASO;AAEP,iCAAyB;AACzB,yBAAwC;AAExC,mBAA2B;AAC3B,wBAA8B;AAE9B,6BAA+B;AAC/B,wBAAyB;AACzB,uBAAoD;AACpD,4BAA6B;AAOtB,SAAS,uBAA0C;AACxD,QAAM,kBAAc,uCAAe;AACnC,QAAM,YAAQ,qCAAS;AACvB,QAAM,mBAAe,4BAAS;AAE9B,QAAM,qBAAiB,qBAAyC,CAAC,CAAC,EAAE;AACpE,QAAM,wBAAoB,qBAA4D,CAAC,CAAC,EAAE;AAE1F,aAAO,sBAAQ,MAAM;AACnB,UAAM,gBAAgB,CAAC,kBAAsC;AAAA,MAC3D,cAA2B;AACzB,eAAO;AAAA,MACT;AAAA,MAEA,YACE,OACA,kBACQ;AACR,cAAM,aAAa,eAAe,aAAa,OAAO,KAAK;AAC3D,cAAM,MAAM,KAAK,YAAY,IAAI,YAAY;AAC7C,uBAAe,GAAG,IAAI;AAEtB,cAAM,gBAAY,2CAAyB,OAAO,UAAU;AAC5D,YAAI,CAAC;AAAkB,iBAAO;AAE9B,0BAAkB,GAAG,IAAI;AACzB,eAAO,GAAG,SAAS,IAAI,GAAG;AAAA,MAC5B;AAAA,MAEA,MAAM,IAAwB;AAC5B,eAAO,cAAc,GAAG,YAAY,IAAI,EAAE,EAAE;AAAA,MAC9C;AAAA,IACF;AAEA,WAAO;AAAA,MACL,IAAI,UAA8B;AAChC,eAAO,cAAc,QAAQ;AAAA,MAC/B;AAAA,MAEA,mBAAmB;AACjB,wCAAU,OAAO,OAAO,OAAO,cAAc,CAAC;AAE9C,oCAAU,MAAM;AACd,gBAAM,eAAe,OAAO,QAAQ,iBAAiB,EAClD;AAAA,YAAI,CAAC,CAAC,KAAK,QAAQ,MAClB,YAAY,WACR,oCAAa;AAAA,cACX,SAAS,SAAS,cAAc,IAAI,GAAG,EAAE;AAAA,cACzC,kBAAkB;AAAA,YACpB,CAAC,IACD;AAAA,UACN,EACC,OAAO,wBAAQ;AAElB,iBAAO,MAAM,aAAa,QAAQ,QAAM,GAAG,CAAC;AAAA,QAC9C,GAAG,CAAC,OAAO,KAAK,iBAAiB,EAAE,KAAK,GAAG,CAAC,CAAC;AAAA,MAC/C;AAAA,IACF;AAAA,EACF,GAAG,CAAC,aAAa,OAAO,YAAY,CAAC;AACvC;AAEA,SAAS,kBAAkB,OAAwD;AACjF,SAAO,MAAM,QAAQ,KAAK;AAC5B;AAEA,SAAS,UAAU,OAAgD;AACjE,SAAO,OAAO,UAAU,YAAY,cAAc,SAAS,OAAO,MAAM,aAAa;AACvF;AAEA,SAAS,WAAW,aAA0B,OAA8C;AAC1F,SAAO;AAAA,IACL,GAAG,MAAM,aAAS,mCAAkB,WAAW,CAAC;AAAA,IAChD,GAAG,YAAY;AAAA,MACb,CAAC,QAAQ,gBAAgB;AAAA,QACvB,GAAG;AAAA,QACH,KAAC,4CAAwB,UAAU,CAAC,GAAG,MAAM,SAAS,UAAU;AAAA,MAClE;AAAA,MACA,CAAC;AAAA,IACH;AAAA,EACF;AACF;AAEA,SAAS,mBAAmB,aAA0B,OAAsB;AAC1E,MAAI,kBAAkB,KAAK,GAAG;AAC5B,eAAO,iCAAc,aAAa,KAAK;AAAA,EACzC;AAEA,MAAI,UAAU,KAAK,GAAG;AACpB,WAAO,WAAW,aAAa,KAAmC;AAAA,EACpE;AAEA,QAAM,EAAE,YAAY,UAAU,IAAI;AAClC,aAAO,yBAAW,aAAa,WAAW,UAAU;AACtD;AAEA,SAAS,eACP,aACA,OACA,OACkB;AAClB,QAAM,MAAM,mBAAmB,aAAa,KAAK;AACjD,aAAO,kCAAgB,CAAC,GAAG,GAAG,MAAM,UAAU;AAChD;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-stylesheet-factory.ts"],"sourcesContent":["import { useMemo, useEffect, useRef } from 'react'\nimport { type CSSObject, serializeStyles } from '@emotion/serialize'\nimport { type EmotionCache } from '@emotion/cache'\nimport { type SerializedStyles } from '@emotion/utils'\n\nimport {\n  type Breakpoints,\n  type BoxModel,\n  type Stylesheet,\n  type ResolvedStyle,\n  type ResolvedStyleV2,\n  type ResolvedTypographyStyle,\n  isNotNil,\n  getBaseBreakpoint,\n  getBreakpointMediaQuery,\n} from '@makeswift/controls'\n\nimport { useCache } from '../../../next/root-style-registry'\n\nimport { styleV1Css } from '../controls/style'\nimport { typographyCss } from '../controls/typography'\n\nimport { useBreakpoints } from './use-breakpoints'\nimport { useCssId } from './use-css-id'\nimport { useStyles, serializedStyleClassName } from '../use-style'\nimport { pollBoxModel } from '../poll-box-model'\n\nexport type StylesheetFactory = {\n  get(propName: string): Stylesheet\n  useDefinedStyles(): void\n}\n\nexport function useStylesheetFactory(): StylesheetFactory {\n  const breakpoints = useBreakpoints()\n  const cache = useCache()\n  const componentUid = useCssId()\n\n  const computedStyles = useRef<Record<string, SerializedStyles>>({}).current\n  const boxModelCallbacks = useRef<Record<string, (boxModel: BoxModel | null) => void>>({}).current\n\n  return useMemo(() => {\n    const getStylesheet = (styleSheetId: string): Stylesheet => ({\n      breakpoints(): Breakpoints {\n        return breakpoints\n      },\n\n      defineStyle(\n        style: ResolvedStyle,\n        onBoxModelChange?: (boxModel: BoxModel | null) => void,\n      ): string {\n        const serialized = serializeStyle(breakpoints, style, cache)\n        const uid = `u-${componentUid}-${styleSheetId}`\n        computedStyles[uid] = serialized\n\n        const className = serializedStyleClassName(cache, serialized)\n        if (!onBoxModelChange) return className\n\n        boxModelCallbacks[uid] = onBoxModelChange\n        return `${className} ${uid}`\n      },\n\n      child(id: string): Stylesheet {\n        return getStylesheet(`${styleSheetId}-${id}`)\n      },\n    })\n\n    return {\n      get(propName: string): Stylesheet {\n        return getStylesheet(propName)\n      },\n\n      useDefinedStyles() {\n        useStyles(cache, Object.values(computedStyles))\n\n        useEffect(() => {\n          const unsubscribes = Object.entries(boxModelCallbacks)\n            .map(([uid, callback]) =>\n              callback != null\n                ? pollBoxModel({\n                    element: document.querySelector(`.${uid}`),\n                    onBoxModelChange: callback,\n                  })\n                : undefined,\n            )\n            .filter(isNotNil)\n\n          return () => unsubscribes.forEach(fn => fn())\n        }, [Object.keys(boxModelCallbacks).join(' ')])\n      },\n    }\n  }, [breakpoints, cache, componentUid])\n}\n\nfunction isTypographyStyle(style: ResolvedStyle): style is ResolvedTypographyStyle {\n  return Array.isArray(style)\n}\n\nfunction isStyleV2(style: ResolvedStyle): style is ResolvedStyleV2 {\n  return typeof style === 'object' && 'getStyle' in style && typeof style.getStyle === 'function'\n}\n\nfunction styleV2Css(breakpoints: Breakpoints, style: ResolvedStyleV2<CSSObject>): CSSObject {\n  return {\n    ...style.getStyle(getBaseBreakpoint(breakpoints)),\n    ...breakpoints.reduce(\n      (styles, breakpoint) => ({\n        ...styles,\n        [getBreakpointMediaQuery(breakpoint)]: style.getStyle(breakpoint),\n      }),\n      {},\n    ),\n  }\n}\n\nfunction resolvedStyleToCss(breakpoints: Breakpoints, style: ResolvedStyle) {\n  if (isTypographyStyle(style)) {\n    return typographyCss(breakpoints, style)\n  }\n\n  if (isStyleV2(style)) {\n    return styleV2Css(breakpoints, style as ResolvedStyleV2<CSSObject>)\n  }\n\n  const { properties, styleData } = style\n  return styleV1Css(breakpoints, styleData, properties)\n}\n\nfunction serializeStyle(\n  breakpoints: Breakpoints,\n  style: ResolvedStyle,\n  cache: EmotionCache,\n): SerializedStyles {\n  const css = resolvedStyleToCss(breakpoints, style)\n  return serializeStyles([css], cache.registered)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2C;AAC3C,uBAAgD;AAIhD,sBAUO;AAEP,iCAAyB;AAEzB,mBAA2B;AAC3B,wBAA8B;AAE9B,6BAA+B;AAC/B,wBAAyB;AACzB,uBAAoD;AACpD,4BAA6B;AAOtB,SAAS,uBAA0C;AACxD,QAAM,kBAAc,uCAAe;AACnC,QAAM,YAAQ,qCAAS;AACvB,QAAM,mBAAe,4BAAS;AAE9B,QAAM,qBAAiB,qBAAyC,CAAC,CAAC,EAAE;AACpE,QAAM,wBAAoB,qBAA4D,CAAC,CAAC,EAAE;AAE1F,aAAO,sBAAQ,MAAM;AACnB,UAAM,gBAAgB,CAAC,kBAAsC;AAAA,MAC3D,cAA2B;AACzB,eAAO;AAAA,MACT;AAAA,MAEA,YACE,OACA,kBACQ;AACR,cAAM,aAAa,eAAe,aAAa,OAAO,KAAK;AAC3D,cAAM,MAAM,KAAK,YAAY,IAAI,YAAY;AAC7C,uBAAe,GAAG,IAAI;AAEtB,cAAM,gBAAY,2CAAyB,OAAO,UAAU;AAC5D,YAAI,CAAC;AAAkB,iBAAO;AAE9B,0BAAkB,GAAG,IAAI;AACzB,eAAO,GAAG,SAAS,IAAI,GAAG;AAAA,MAC5B;AAAA,MAEA,MAAM,IAAwB;AAC5B,eAAO,cAAc,GAAG,YAAY,IAAI,EAAE,EAAE;AAAA,MAC9C;AAAA,IACF;AAEA,WAAO;AAAA,MACL,IAAI,UAA8B;AAChC,eAAO,cAAc,QAAQ;AAAA,MAC/B;AAAA,MAEA,mBAAmB;AACjB,wCAAU,OAAO,OAAO,OAAO,cAAc,CAAC;AAE9C,oCAAU,MAAM;AACd,gBAAM,eAAe,OAAO,QAAQ,iBAAiB,EAClD;AAAA,YAAI,CAAC,CAAC,KAAK,QAAQ,MAClB,YAAY,WACR,oCAAa;AAAA,cACX,SAAS,SAAS,cAAc,IAAI,GAAG,EAAE;AAAA,cACzC,kBAAkB;AAAA,YACpB,CAAC,IACD;AAAA,UACN,EACC,OAAO,wBAAQ;AAElB,iBAAO,MAAM,aAAa,QAAQ,QAAM,GAAG,CAAC;AAAA,QAC9C,GAAG,CAAC,OAAO,KAAK,iBAAiB,EAAE,KAAK,GAAG,CAAC,CAAC;AAAA,MAC/C;AAAA,IACF;AAAA,EACF,GAAG,CAAC,aAAa,OAAO,YAAY,CAAC;AACvC;AAEA,SAAS,kBAAkB,OAAwD;AACjF,SAAO,MAAM,QAAQ,KAAK;AAC5B;AAEA,SAAS,UAAU,OAAgD;AACjE,SAAO,OAAO,UAAU,YAAY,cAAc,SAAS,OAAO,MAAM,aAAa;AACvF;AAEA,SAAS,WAAW,aAA0B,OAA8C;AAC1F,SAAO;AAAA,IACL,GAAG,MAAM,aAAS,mCAAkB,WAAW,CAAC;AAAA,IAChD,GAAG,YAAY;AAAA,MACb,CAAC,QAAQ,gBAAgB;AAAA,QACvB,GAAG;AAAA,QACH,KAAC,yCAAwB,UAAU,CAAC,GAAG,MAAM,SAAS,UAAU;AAAA,MAClE;AAAA,MACA,CAAC;AAAA,IACH;AAAA,EACF;AACF;AAEA,SAAS,mBAAmB,aAA0B,OAAsB;AAC1E,MAAI,kBAAkB,KAAK,GAAG;AAC5B,eAAO,iCAAc,aAAa,KAAK;AAAA,EACzC;AAEA,MAAI,UAAU,KAAK,GAAG;AACpB,WAAO,WAAW,aAAa,KAAmC;AAAA,EACpE;AAEA,QAAM,EAAE,YAAY,UAAU,IAAI;AAClC,aAAO,yBAAW,aAAa,WAAW,UAAU;AACtD;AAEA,SAAS,eACP,aACA,OACA,OACkB;AAClB,QAAM,MAAM,mBAAmB,aAAa,KAAK;AACjD,aAAO,kCAAgB,CAAC,GAAG,GAAG,MAAM,UAAU;AAChD;","names":[]}

package/dist/cjs/slate/BlockPlugin/setBlockKeyForDevice.js

@@ -24,7 +24,6 @@ module.exports = __toCommonJS(setBlockKeyForDevice_exports);
 var import_slate = require("slate");
 var import_controls = require("@makeswift/controls");
 var import_selectors = require("../selectors");
-var import_breakpoints = require("../../state/modules/breakpoints");
 function setBlockKeyForDevice(editor, breakpoints, deviceId, key, value, options) {
   const at = options?.at ?? editor.selection;
   if (!at)
@@ -33,7 +32,7 @@ function setBlockKeyForDevice(editor, breakpoints, deviceId, key, value, options
   for (const [node, path] of rootElements) {
     if (import_controls.Slate.isBlock(node)) {
       const deviceValues = node[key] ?? [];
-      const currentDeviceValue = (0, import_breakpoints.findBreakpointOverride)(breakpoints, deviceValues, deviceId, (v) => v);
+      const currentDeviceValue = (0, import_controls.findBreakpointOverride)(breakpoints, deviceValues, deviceId, (v) => v);
       const nextDeviceValue = {
         ...currentDeviceValue,
         deviceId,

package/dist/cjs/slate/BlockPlugin/setBlockKeyForDevice.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/slate/BlockPlugin/setBlockKeyForDevice.ts"],"sourcesContent":["import { Editor, Transforms, Location } from 'slate'\nimport { Slate } from '@makeswift/controls'\n\nimport { getBlocksInSelection } from '../selectors'\nimport { EditableBlockKey, EditableBlockValue } from './types'\nimport { Breakpoints, BreakpointId, findBreakpointOverride } from '../../state/modules/breakpoints'\n\ntype SetBlockKeyForDeviceOptions = {\n  at?: Location\n}\n\nexport function setBlockKeyForDevice(\n  editor: Editor,\n  breakpoints: Breakpoints,\n  deviceId: BreakpointId,\n  key: EditableBlockKey,\n  value: EditableBlockValue[number]['value'],\n  options?: SetBlockKeyForDeviceOptions,\n) {\n  const at = options?.at ?? editor.selection\n  if (!at) return\n\n  const rootElements = getBlocksInSelection(editor)\n\n  for (const [node, path] of rootElements) {\n    if (Slate.isBlock(node)) {\n      const deviceValues = node[key] ?? []\n      const currentDeviceValue = findBreakpointOverride(breakpoints, deviceValues, deviceId, v => v)\n      const nextDeviceValue = {\n        ...currentDeviceValue,\n        deviceId,\n        value,\n      }\n      Transforms.setNodes(\n        editor,\n        {\n          [key]: [...deviceValues.filter(v => v.deviceId !== deviceId), nextDeviceValue],\n        },\n        { at: path },\n      )\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA6C;AAC7C,sBAAsB;AAEtB,uBAAqC;AAErC,yBAAkE;AAM3D,SAAS,qBACd,QACA,aACA,UACA,KACA,OACA,SACA;AACA,QAAM,KAAK,SAAS,MAAM,OAAO;AACjC,MAAI,CAAC;AAAI;AAET,QAAM,mBAAe,uCAAqB,MAAM;AAEhD,aAAW,CAAC,MAAM,IAAI,KAAK,cAAc;AACvC,QAAI,sBAAM,QAAQ,IAAI,GAAG;AACvB,YAAM,eAAe,KAAK,GAAG,KAAK,CAAC;AACnC,YAAM,yBAAqB,2CAAuB,aAAa,cAAc,UAAU,OAAK,CAAC;AAC7F,YAAM,kBAAkB;AAAA,QACtB,GAAG;AAAA,QACH;AAAA,QACA;AAAA,MACF;AACA,8BAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,GAAG,GAAG,CAAC,GAAG,aAAa,OAAO,OAAK,EAAE,aAAa,QAAQ,GAAG,eAAe;AAAA,QAC/E;AAAA,QACA,EAAE,IAAI,KAAK;AAAA,MACb;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../../src/slate/BlockPlugin/setBlockKeyForDevice.ts"],"sourcesContent":["import { Editor, Transforms, Location } from 'slate'\nimport {\n  type Breakpoints,\n  type BreakpointId,\n  findBreakpointOverride,\n  Slate,\n} from '@makeswift/controls'\n\nimport { getBlocksInSelection } from '../selectors'\nimport { EditableBlockKey, EditableBlockValue } from './types'\n\ntype SetBlockKeyForDeviceOptions = {\n  at?: Location\n}\n\nexport function setBlockKeyForDevice(\n  editor: Editor,\n  breakpoints: Breakpoints,\n  deviceId: BreakpointId,\n  key: EditableBlockKey,\n  value: EditableBlockValue[number]['value'],\n  options?: SetBlockKeyForDeviceOptions,\n) {\n  const at = options?.at ?? editor.selection\n  if (!at) return\n\n  const rootElements = getBlocksInSelection(editor)\n\n  for (const [node, path] of rootElements) {\n    if (Slate.isBlock(node)) {\n      const deviceValues = node[key] ?? []\n      const currentDeviceValue = findBreakpointOverride(breakpoints, deviceValues, deviceId, v => v)\n      const nextDeviceValue = {\n        ...currentDeviceValue,\n        deviceId,\n        value,\n      }\n      Transforms.setNodes(\n        editor,\n        {\n          [key]: [...deviceValues.filter(v => v.deviceId !== deviceId), nextDeviceValue],\n        },\n        { at: path },\n      )\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA6C;AAC7C,sBAKO;AAEP,uBAAqC;AAO9B,SAAS,qBACd,QACA,aACA,UACA,KACA,OACA,SACA;AACA,QAAM,KAAK,SAAS,MAAM,OAAO;AACjC,MAAI,CAAC;AAAI;AAET,QAAM,mBAAe,uCAAqB,MAAM;AAEhD,aAAW,CAAC,MAAM,IAAI,KAAK,cAAc;AACvC,QAAI,sBAAM,QAAQ,IAAI,GAAG;AACvB,YAAM,eAAe,KAAK,GAAG,KAAK,CAAC;AACnC,YAAM,yBAAqB,wCAAuB,aAAa,cAAc,UAAU,OAAK,CAAC;AAC7F,YAAM,kBAAkB;AAAA,QACtB,GAAG;AAAA,QACH;AAAA,QACA;AAAA,MACF;AACA,8BAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,GAAG,GAAG,CAAC,GAAG,aAAa,OAAO,OAAK,EAAE,aAAa,QAAQ,GAAG,eAAe;AAAA,QAC/E;AAAA,QACA,EAAE,IAAI,KAAK;AAAA,MACb;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/cjs/slate/TypographyPlugin/setActiveTypographyStyle.js

@@ -22,7 +22,7 @@ __export(setActiveTypographyStyle_exports, {
 });
 module.exports = __toCommonJS(setActiveTypographyStyle_exports);
 var import_slate = require("slate");
-var import_breakpoints = require("../../state/modules/breakpoints");
+var import_controls = require("@makeswift/controls");
 function setActiveTypographyStyle(editor, breakpoints, deviceId, prop, value, options) {
   import_slate.Editor.withoutNormalizing(editor, () => {
     const at = options?.at ?? editor.selection;
@@ -52,7 +52,7 @@ function setActiveTypographyStyle(editor, breakpoints, deviceId, prop, value, op
       for (const [node, path] of textNodes) {
         if (import_slate.Text.isText(node)) {
           const deviceOverrides = node?.typography?.style ?? [];
-          const deviceStyle = (0, import_breakpoints.findBreakpointOverride)(
+          const deviceStyle = (0, import_controls.findBreakpointOverride)(
             breakpoints,
             deviceOverrides,
             deviceId,

package/dist/cjs/slate/TypographyPlugin/setActiveTypographyStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/slate/TypographyPlugin/setActiveTypographyStyle.ts"],"sourcesContent":["import { Editor, Transforms, Text, Range } from 'slate'\nimport { RichTextTypography } from '@makeswift/controls'\n\nimport { Breakpoints, findBreakpointOverride, BreakpointId } from '../../state/modules/breakpoints'\n\ntype SetActiveTypographyStyleOptions = {\n  at?: Range\n}\n\nexport function setActiveTypographyStyle(\n  editor: Editor,\n  breakpoints: Breakpoints,\n  deviceId: string,\n  prop: string,\n  value?: unknown,\n  options?: SetActiveTypographyStyleOptions,\n) {\n  Editor.withoutNormalizing(editor, () => {\n    const at = options?.at ?? editor.selection\n    if (!at) return\n    const atRef = Editor.rangeRef(editor, at)\n\n    if (atRef.current) {\n      Transforms.setNodes(\n        editor,\n        {\n          slice: true,\n        },\n        {\n          at: atRef.current,\n          match: node => Text.isText(node),\n          split: Range.isExpanded(atRef.current),\n        },\n      )\n    }\n\n    if (atRef.current) {\n      const textNodes = Array.from(\n        Editor.nodes(editor, {\n          at: atRef.current,\n          match: node => Text.isText(node) && node.slice === true,\n        }),\n      )\n\n      for (const [node, path] of textNodes) {\n        if (Text.isText(node)) {\n          const deviceOverrides = node?.typography?.style ?? []\n          const deviceStyle = findBreakpointOverride(\n            breakpoints,\n            deviceOverrides,\n            deviceId as BreakpointId,\n            v => v,\n          ) || {\n            value: {},\n          }\n          const nextDeviceStyle = {\n            deviceId,\n            value: { ...deviceStyle.value, [prop]: value },\n          }\n\n          const nextTypography: RichTextTypography = {\n            ...node.typography,\n            style: [...deviceOverrides.filter(v => v.deviceId !== deviceId), nextDeviceStyle],\n          }\n\n          Transforms.setNodes(\n            editor,\n            {\n              typography: nextTypography,\n            },\n            { at: path },\n          )\n        }\n      }\n    }\n\n    atRef.unref()\n  })\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgD;AAGhD,yBAAkE;AAM3D,SAAS,yBACd,QACA,aACA,UACA,MACA,OACA,SACA;AACA,sBAAO,mBAAmB,QAAQ,MAAM;AACtC,UAAM,KAAK,SAAS,MAAM,OAAO;AACjC,QAAI,CAAC;AAAI;AACT,UAAM,QAAQ,oBAAO,SAAS,QAAQ,EAAE;AAExC,QAAI,MAAM,SAAS;AACjB,8BAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,OAAO;AAAA,QACT;AAAA,QACA;AAAA,UACE,IAAI,MAAM;AAAA,UACV,OAAO,UAAQ,kBAAK,OAAO,IAAI;AAAA,UAC/B,OAAO,mBAAM,WAAW,MAAM,OAAO;AAAA,QACvC;AAAA,MACF;AAAA,IACF;AAEA,QAAI,MAAM,SAAS;AACjB,YAAM,YAAY,MAAM;AAAA,QACtB,oBAAO,MAAM,QAAQ;AAAA,UACnB,IAAI,MAAM;AAAA,UACV,OAAO,UAAQ,kBAAK,OAAO,IAAI,KAAK,KAAK,UAAU;AAAA,QACrD,CAAC;AAAA,MACH;AAEA,iBAAW,CAAC,MAAM,IAAI,KAAK,WAAW;AACpC,YAAI,kBAAK,OAAO,IAAI,GAAG;AACrB,gBAAM,kBAAkB,MAAM,YAAY,SAAS,CAAC;AACpD,gBAAM,kBAAc;AAAA,YAClB;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAK;AAAA,UACP,KAAK;AAAA,YACH,OAAO,CAAC;AAAA,UACV;AACA,gBAAM,kBAAkB;AAAA,YACtB;AAAA,YACA,OAAO,EAAE,GAAG,YAAY,OAAO,CAAC,IAAI,GAAG,MAAM;AAAA,UAC/C;AAEA,gBAAM,iBAAqC;AAAA,YACzC,GAAG,KAAK;AAAA,YACR,OAAO,CAAC,GAAG,gBAAgB,OAAO,OAAK,EAAE,aAAa,QAAQ,GAAG,eAAe;AAAA,UAClF;AAEA,kCAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,YAAY;AAAA,YACd;AAAA,YACA,EAAE,IAAI,KAAK;AAAA,UACb;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAEA,UAAM,MAAM;AAAA,EACd,CAAC;AACH;","names":[]}
+{"version":3,"sources":["../../../../src/slate/TypographyPlugin/setActiveTypographyStyle.ts"],"sourcesContent":["import { Editor, Transforms, Text, Range } from 'slate'\nimport {\n  type Breakpoints,\n  type BreakpointId,\n  findBreakpointOverride,\n  RichTextTypography,\n} from '@makeswift/controls'\n\ntype SetActiveTypographyStyleOptions = {\n  at?: Range\n}\n\nexport function setActiveTypographyStyle(\n  editor: Editor,\n  breakpoints: Breakpoints,\n  deviceId: string,\n  prop: string,\n  value?: unknown,\n  options?: SetActiveTypographyStyleOptions,\n) {\n  Editor.withoutNormalizing(editor, () => {\n    const at = options?.at ?? editor.selection\n    if (!at) return\n    const atRef = Editor.rangeRef(editor, at)\n\n    if (atRef.current) {\n      Transforms.setNodes(\n        editor,\n        {\n          slice: true,\n        },\n        {\n          at: atRef.current,\n          match: node => Text.isText(node),\n          split: Range.isExpanded(atRef.current),\n        },\n      )\n    }\n\n    if (atRef.current) {\n      const textNodes = Array.from(\n        Editor.nodes(editor, {\n          at: atRef.current,\n          match: node => Text.isText(node) && node.slice === true,\n        }),\n      )\n\n      for (const [node, path] of textNodes) {\n        if (Text.isText(node)) {\n          const deviceOverrides = node?.typography?.style ?? []\n          const deviceStyle = findBreakpointOverride(\n            breakpoints,\n            deviceOverrides,\n            deviceId as BreakpointId,\n            v => v,\n          ) || {\n            value: {},\n          }\n          const nextDeviceStyle = {\n            deviceId,\n            value: { ...deviceStyle.value, [prop]: value },\n          }\n\n          const nextTypography: RichTextTypography = {\n            ...node.typography,\n            style: [...deviceOverrides.filter(v => v.deviceId !== deviceId), nextDeviceStyle],\n          }\n\n          Transforms.setNodes(\n            editor,\n            {\n              typography: nextTypography,\n            },\n            { at: path },\n          )\n        }\n      }\n    }\n\n    atRef.unref()\n  })\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgD;AAChD,sBAKO;AAMA,SAAS,yBACd,QACA,aACA,UACA,MACA,OACA,SACA;AACA,sBAAO,mBAAmB,QAAQ,MAAM;AACtC,UAAM,KAAK,SAAS,MAAM,OAAO;AACjC,QAAI,CAAC;AAAI;AACT,UAAM,QAAQ,oBAAO,SAAS,QAAQ,EAAE;AAExC,QAAI,MAAM,SAAS;AACjB,8BAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,OAAO;AAAA,QACT;AAAA,QACA;AAAA,UACE,IAAI,MAAM;AAAA,UACV,OAAO,UAAQ,kBAAK,OAAO,IAAI;AAAA,UAC/B,OAAO,mBAAM,WAAW,MAAM,OAAO;AAAA,QACvC;AAAA,MACF;AAAA,IACF;AAEA,QAAI,MAAM,SAAS;AACjB,YAAM,YAAY,MAAM;AAAA,QACtB,oBAAO,MAAM,QAAQ;AAAA,UACnB,IAAI,MAAM;AAAA,UACV,OAAO,UAAQ,kBAAK,OAAO,IAAI,KAAK,KAAK,UAAU;AAAA,QACrD,CAAC;AAAA,MACH;AAEA,iBAAW,CAAC,MAAM,IAAI,KAAK,WAAW;AACpC,YAAI,kBAAK,OAAO,IAAI,GAAG;AACrB,gBAAM,kBAAkB,MAAM,YAAY,SAAS,CAAC;AACpD,gBAAM,kBAAc;AAAA,YAClB;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAK;AAAA,UACP,KAAK;AAAA,YACH,OAAO,CAAC;AAAA,UACV;AACA,gBAAM,kBAAkB;AAAA,YACtB;AAAA,YACA,OAAO,EAAE,GAAG,YAAY,OAAO,CAAC,IAAI,GAAG,MAAM;AAAA,UAC/C;AAEA,gBAAM,iBAAqC;AAAA,YACzC,GAAG,KAAK;AAAA,YACR,OAAO,CAAC,GAAG,gBAAgB,OAAO,OAAK,EAAE,aAAa,QAAQ,GAAG,eAAe;AAAA,UAClF;AAEA,kCAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,YAAY;AAAA,YACd;AAAA,YACA,EAAE,IAAI,KAAK;AAAA,UACb;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAEA,UAAM,MAAM;AAAA,EACd,CAAC;AACH;","names":[]}

package/dist/cjs/slate/selectors.js

@@ -43,7 +43,6 @@ var import_controls = require("@makeswift/controls");
 var import_unhangRange = __toESM(require("./utils/unhangRange"));
 var import_shallowEqual = __toESM(require("../utils/shallowEqual"));
 var import_isNonNullable = require("../utils/isNonNullable");
-var import_breakpoints = require("../state/modules/breakpoints");
 var import_deepEqual = __toESM(require("../utils/deepEqual"));
 var import_keys = __toESM(require("../utils/keys"));
 function getSelection(editor) {
@@ -88,7 +87,7 @@ function getActiveBlockDeviceOverrideValue(editor, key, breakpoints, deviceId) {
   const active = [];
   const blocks = getBlocksInSelection(editor);
   blocks.forEach(([block]) => {
-    const deviceOverride = (0, import_breakpoints.findBreakpointOverride)(breakpoints, block[key], deviceId) || null;
+    const deviceOverride = (0, import_controls.findBreakpointOverride)(breakpoints, block[key], deviceId) || null;
     active.push(deviceOverride?.value ?? null);
   });
   return active.length === 0 ? null : active.reduce((a, b) => (0, import_shallowEqual.default)(a, b) ? b : null);
@@ -117,7 +116,7 @@ const fuseTypographyMarks = (values, breakpoints) => {
     id: values.map((v) => v && v.id).reduce((a, b) => a === b ? a : void 0) ?? void 0,
     style: devices.map(
       (deviceId) => values.map(
-        (v) => v && (0, import_breakpoints.findBreakpointOverride)(breakpoints, v.style, deviceId) || {
+        (v) => v && (0, import_controls.findBreakpointOverride)(breakpoints, v.style, deviceId) || {
           deviceId,
           value: {}
         }

package/dist/cjs/slate/selectors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/slate/selectors.ts"],"sourcesContent":["import { Editor, NodeEntry, Range, Text } from 'slate'\nimport { Slate } from '@makeswift/controls'\n\nimport { EditableBlockKey } from './BlockPlugin/types'\n\nimport unhangRange from './utils/unhangRange'\nimport shallowEqual from '../utils/shallowEqual'\nimport { isNonNullable } from '../utils/isNonNullable'\n\nimport { Breakpoints, BreakpointId, findBreakpointOverride } from '../state/modules/breakpoints'\nimport deepEqual from '../utils/deepEqual'\nimport keys from '../utils/keys'\n\nexport function getSelection(editor: Editor): Range {\n  if (editor.selection) return unhangRange(editor, editor.selection)\n  return {\n    anchor: Editor.start(editor, []),\n    focus: Editor.end(editor, []),\n  }\n}\n\nexport function getBlocksInSelection(editor: Editor): NodeEntry<Slate.RootBlock>[] {\n  return Array.from(\n    Editor.nodes(editor, {\n      at: getSelection(editor),\n      match: node => Slate.isRootBlock(node),\n    }),\n  ).filter((entry): entry is NodeEntry<Slate.RootBlock> => Slate.isRootBlock(entry[0]))\n}\n\nexport function getInlinesInSelection(editor: Editor): NodeEntry<Slate.Inline>[] {\n  return Array.from(\n    Editor.nodes(editor, {\n      at: getSelection(editor),\n      match: node => Slate.isInline(node),\n    }),\n  ).filter((entry): entry is NodeEntry<Slate.Inline> => Slate.isInline(entry[0]))\n}\n\nexport function getActiveBlockType(editor: Editor): Slate.RootBlockType | null {\n  const rootBlocks = getBlocksInSelection(editor).map(([node]) => node.type)\n\n  return rootBlocks.reduce<Slate.RootBlockType | null>(\n    (a, b) => (a === b ? b : null),\n    rootBlocks.at(0) ?? null,\n  )\n}\n\nexport function getActiveBlockValue(editor: Editor, key: EditableBlockKey) {\n  const blocks = getBlocksInSelection(editor)\n\n  const active = blocks.map(\n    ([block]) => block[key] ?? null,\n  ) as (Slate.ResponsiveBlockTextAlignment | null)[]\n\n  return active.length === 0 ? null : active.reduce((a, b) => (shallowEqual(a, b) ? b : null))\n}\n\nexport function getActiveBlockDeviceOverrideValue(\n  editor: Editor,\n  key: EditableBlockKey,\n  breakpoints: Breakpoints,\n  deviceId: BreakpointId,\n) {\n  const active: (Slate.BlockTextAlignment | null)[] = []\n  const blocks = getBlocksInSelection(editor)\n\n  blocks.forEach(([block]) => {\n    const deviceOverride =\n      findBreakpointOverride<Slate.BlockTextAlignment>(breakpoints, block[key], deviceId) || null\n    active.push(deviceOverride?.value ?? null)\n  })\n\n  return active.length === 0 ? null : active.reduce((a, b) => (shallowEqual(a, b) ? b : null))\n}\n\n// Typography\n\nconst concat = (a: unknown[], b: unknown[]) => a.concat(b)\n\n// TODO: This is more cruft from trying to remove null from the typography type. This optimization is not worth it.\n/**\n * This is a c/p of the intersection of the utils from the root utils folder.\n * The only change is defaulting to undefined instead of to null.\n */\nexport default function intersection<A extends Record<string, unknown>, B extends A>(\n  a: A,\n  b: B,\n  isEqual: (a: unknown, b: unknown) => boolean = deepEqual,\n): { [K in keyof A]: A[K] | undefined } {\n  const allKeys = [...new Set([...keys(a), ...keys(b)])] as (keyof A)[]\n\n  return allKeys.reduce(\n    (acc, k) => {\n      if (isEqual(a[k], b[k])) acc[k] = a[k]\n      else acc[k] = undefined\n\n      return acc\n    },\n    {} as { [K in keyof A]: A[K] | undefined },\n  )\n}\n\nconst fuseTypographyMarks = (\n  values: Array<Slate.Typography | null | undefined>,\n  breakpoints: Breakpoints,\n): Slate.Typography => {\n  const devices = [\n    ...new Set(\n      values\n        .filter(isNonNullable)\n        .map(({ style }) => style.map(({ deviceId }) => deviceId))\n        .reduce(concat, []),\n    ),\n  ] as BreakpointId[]\n\n  return {\n    id: values.map(v => v && v.id).reduce((a, b) => (a === b ? a : undefined)) ?? undefined,\n    style: devices.map(deviceId =>\n      values\n        .map(\n          v =>\n            (v && findBreakpointOverride(breakpoints, v.style, deviceId)) || {\n              deviceId,\n              value: {},\n            },\n        )\n        .reduce((acc, { value }) => {\n          const a = intersection(acc.value, value)\n          return {\n            deviceId,\n            value: a,\n          }\n        }),\n    ),\n  }\n}\n\nexport function getActiveTypographyMark(\n  editor: Editor,\n  breakpoints: Breakpoints,\n): Slate.Typography {\n  const active: Slate.Typography[] = []\n\n  const textNodes = Editor.nodes(editor, {\n    at: getSelection(editor),\n    match: node => Text.isText(node),\n  })\n\n  for (const [node] of textNodes) {\n    if (Text.isText(node) && 'typography' in node && node.typography != undefined) {\n      active.push(node.typography)\n    }\n  }\n  return active.length === 0 ? { style: [] } : fuseTypographyMarks(active, breakpoints)\n}\n"],"mappings":"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","names":["unhangRange","shallowEqual","deepEqual","keys"]}
+{"version":3,"sources":["../../../src/slate/selectors.ts"],"sourcesContent":["import { Editor, NodeEntry, Range, Text } from 'slate'\nimport {\n  type Breakpoints,\n  type BreakpointId,\n  findBreakpointOverride,\n  Slate,\n} from '@makeswift/controls'\n\nimport { EditableBlockKey } from './BlockPlugin/types'\n\nimport unhangRange from './utils/unhangRange'\nimport shallowEqual from '../utils/shallowEqual'\nimport { isNonNullable } from '../utils/isNonNullable'\n\nimport deepEqual from '../utils/deepEqual'\nimport keys from '../utils/keys'\n\nexport function getSelection(editor: Editor): Range {\n  if (editor.selection) return unhangRange(editor, editor.selection)\n  return {\n    anchor: Editor.start(editor, []),\n    focus: Editor.end(editor, []),\n  }\n}\n\nexport function getBlocksInSelection(editor: Editor): NodeEntry<Slate.RootBlock>[] {\n  return Array.from(\n    Editor.nodes(editor, {\n      at: getSelection(editor),\n      match: node => Slate.isRootBlock(node),\n    }),\n  ).filter((entry): entry is NodeEntry<Slate.RootBlock> => Slate.isRootBlock(entry[0]))\n}\n\nexport function getInlinesInSelection(editor: Editor): NodeEntry<Slate.Inline>[] {\n  return Array.from(\n    Editor.nodes(editor, {\n      at: getSelection(editor),\n      match: node => Slate.isInline(node),\n    }),\n  ).filter((entry): entry is NodeEntry<Slate.Inline> => Slate.isInline(entry[0]))\n}\n\nexport function getActiveBlockType(editor: Editor): Slate.RootBlockType | null {\n  const rootBlocks = getBlocksInSelection(editor).map(([node]) => node.type)\n\n  return rootBlocks.reduce<Slate.RootBlockType | null>(\n    (a, b) => (a === b ? b : null),\n    rootBlocks.at(0) ?? null,\n  )\n}\n\nexport function getActiveBlockValue(editor: Editor, key: EditableBlockKey) {\n  const blocks = getBlocksInSelection(editor)\n\n  const active = blocks.map(\n    ([block]) => block[key] ?? null,\n  ) as (Slate.ResponsiveBlockTextAlignment | null)[]\n\n  return active.length === 0 ? null : active.reduce((a, b) => (shallowEqual(a, b) ? b : null))\n}\n\nexport function getActiveBlockDeviceOverrideValue(\n  editor: Editor,\n  key: EditableBlockKey,\n  breakpoints: Breakpoints,\n  deviceId: BreakpointId,\n) {\n  const active: (Slate.BlockTextAlignment | null)[] = []\n  const blocks = getBlocksInSelection(editor)\n\n  blocks.forEach(([block]) => {\n    const deviceOverride =\n      findBreakpointOverride<Slate.BlockTextAlignment>(breakpoints, block[key], deviceId) || null\n    active.push(deviceOverride?.value ?? null)\n  })\n\n  return active.length === 0 ? null : active.reduce((a, b) => (shallowEqual(a, b) ? b : null))\n}\n\n// Typography\n\nconst concat = (a: unknown[], b: unknown[]) => a.concat(b)\n\n// TODO: This is more cruft from trying to remove null from the typography type. This optimization is not worth it.\n/**\n * This is a c/p of the intersection of the utils from the root utils folder.\n * The only change is defaulting to undefined instead of to null.\n */\nexport default function intersection<A extends Record<string, unknown>, B extends A>(\n  a: A,\n  b: B,\n  isEqual: (a: unknown, b: unknown) => boolean = deepEqual,\n): { [K in keyof A]: A[K] | undefined } {\n  const allKeys = [...new Set([...keys(a), ...keys(b)])] as (keyof A)[]\n\n  return allKeys.reduce(\n    (acc, k) => {\n      if (isEqual(a[k], b[k])) acc[k] = a[k]\n      else acc[k] = undefined\n\n      return acc\n    },\n    {} as { [K in keyof A]: A[K] | undefined },\n  )\n}\n\nconst fuseTypographyMarks = (\n  values: Array<Slate.Typography | null | undefined>,\n  breakpoints: Breakpoints,\n): Slate.Typography => {\n  const devices = [\n    ...new Set(\n      values\n        .filter(isNonNullable)\n        .map(({ style }) => style.map(({ deviceId }) => deviceId))\n        .reduce(concat, []),\n    ),\n  ] as BreakpointId[]\n\n  return {\n    id: values.map(v => v && v.id).reduce((a, b) => (a === b ? a : undefined)) ?? undefined,\n    style: devices.map(deviceId =>\n      values\n        .map(\n          v =>\n            (v && findBreakpointOverride(breakpoints, v.style, deviceId)) || {\n              deviceId,\n              value: {},\n            },\n        )\n        .reduce((acc, { value }) => {\n          const a = intersection(acc.value, value)\n          return {\n            deviceId,\n            value: a,\n          }\n        }),\n    ),\n  }\n}\n\nexport function getActiveTypographyMark(\n  editor: Editor,\n  breakpoints: Breakpoints,\n): Slate.Typography {\n  const active: Slate.Typography[] = []\n\n  const textNodes = Editor.nodes(editor, {\n    at: getSelection(editor),\n    match: node => Text.isText(node),\n  })\n\n  for (const [node] of textNodes) {\n    if (Text.isText(node) && 'typography' in node && node.typography != undefined) {\n      active.push(node.typography)\n    }\n  }\n  return active.length === 0 ? { style: [] } : fuseTypographyMarks(active, breakpoints)\n}\n"],"mappings":"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","names":["unhangRange","shallowEqual","deepEqual","keys"]}

package/dist/cjs/state/modules/breakpoints.js

@@ -20,18 +20,12 @@ var breakpoints_exports = {};
 __export(breakpoints_exports, {
   DEFAULT_BREAKPOINTS: () => DEFAULT_BREAKPOINTS,
   DefaultBreakpointID: () => DefaultBreakpointID,
-  findBreakpointOverride: () => import_controls2.findBreakpointOverride,
-  findNextFallback: () => findNextFallback,
-  getBaseBreakpoint: () => import_controls2.getBaseBreakpoint,
-  getBreakpoint: () => getBreakpoint,
-  getBreakpointMediaQuery: () => getBreakpointMediaQuery,
+  getBreakpoint: () => import_controls2.getBreakpoint,
   getInitialState: () => getInitialState,
-  getViewportStyle: () => getViewportStyle,
   parseBreakpointsInput: () => parseBreakpointsInput,
   reducer: () => reducer
 });
 module.exports = __toCommonJS(breakpoints_exports);
-var import_controls = require("@makeswift/controls");
 var import_actions = require("../actions");
 var import_controls2 = require("@makeswift/controls");
 const DefaultBreakpointID = {
@@ -127,49 +121,12 @@ function validateBreakpointsInput(input) {
     }
   });
 }
-const getBreakpoint = (state, breakpointId) => {
-  const breakpoint = state.find(({ id }) => id === breakpointId);
-  if (breakpoint == null)
-    throw new Error(`Unrecognized breakpoint ID: "${breakpointId}".`);
-  return breakpoint;
-};
-const getBreakpointMediaQuery = (breakpoint) => {
-  const parts = ["@media only screen"];
-  if (breakpoint.minWidth != null) {
-    parts.push(`(min-width: ${breakpoint.minWidth}px)`);
-  }
-  if (breakpoint.maxWidth != null) {
-    parts.push(`(max-width: ${breakpoint.maxWidth}px)`);
-  }
-  return parts.join(" and ");
-};
-const getViewportStyle = (state, deviceId) => {
-  const device = getBreakpoint(state, deviceId);
-  return device && {
-    width: device.viewportWidth != null ? device.viewportWidth : "100%",
-    minWidth: device.minWidth
-  };
-};
-function findNextFallback(breakpoints, value, deviceId, activeDeviceId, fallbackStrategy) {
-  const deviceOverride = (0, import_controls.findBreakpointOverride)(
-    breakpoints,
-    value.filter((v) => v.deviceId !== activeDeviceId),
-    deviceId,
-    fallbackStrategy
-  );
-  return (deviceOverride && getBreakpoint(breakpoints, deviceOverride.deviceId)) ?? null;
-}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   DEFAULT_BREAKPOINTS,
   DefaultBreakpointID,
-  findBreakpointOverride,
-  findNextFallback,
-  getBaseBreakpoint,
   getBreakpoint,
-  getBreakpointMediaQuery,
   getInitialState,
-  getViewportStyle,
   parseBreakpointsInput,
   reducer
 });

package/dist/cjs/state/modules/breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/state/modules/breakpoints.ts"],"sourcesContent":["import { Viewport } from 'csstype'\n\nimport {\n  findBreakpointOverride,\n  type ResponsiveValue,\n  type BreakpointId,\n  type Breakpoint,\n  type Breakpoints,\n  type FallbackStrategy,\n} from '@makeswift/controls'\n\nimport { Action, ActionTypes } from '../actions'\n\nexport {\n  findBreakpointOverride,\n  getBaseBreakpoint,\n  type ResponsiveValue,\n  type DeviceOverride,\n  type Breakpoint,\n  type BreakpointId,\n  type Breakpoints,\n  type FallbackStrategy,\n} from '@makeswift/controls'\n\nexport type State = Breakpoints\n\nexport const DefaultBreakpointID = {\n  Desktop: 'desktop',\n  Tablet: 'tablet',\n  Mobile: 'mobile',\n} as const\n\ntype DefaultBreakpointID = (typeof DefaultBreakpointID)[keyof typeof DefaultBreakpointID]\n\nexport const DEFAULT_BREAKPOINTS: Breakpoints = [\n  {\n    id: DefaultBreakpointID.Desktop,\n    label: 'Desktop',\n    minWidth: 769,\n  },\n  {\n    id: DefaultBreakpointID.Tablet,\n    label: 'Tablet',\n    minWidth: 576,\n    maxWidth: 768,\n    viewportWidth: 760,\n  },\n  {\n    id: DefaultBreakpointID.Mobile,\n    label: 'Mobile',\n    maxWidth: 575,\n    viewportWidth: 390,\n  },\n]\n\nexport function getInitialState(breakpoints = DEFAULT_BREAKPOINTS): State {\n  return breakpoints\n}\n\nexport function reducer(state: State = getInitialState(), action: Action): State {\n  switch (action.type) {\n    case ActionTypes.SET_BREAKPOINTS: {\n      const breakpoints = action.payload.breakpoints\n\n      if (breakpoints.length === 0) throw new Error('Breakpoints cannot be empty.')\n\n      return breakpoints\n    }\n\n    default:\n      return state\n  }\n}\n\nexport type BreakpointsInput = Record<string, { width: number; label?: string; viewport?: number }>\n\nexport function parseBreakpointsInput(input: BreakpointsInput): Breakpoints {\n  validateBreakpointsInput(input)\n\n  const sorted = Object.entries(input)\n    .map(([id, value]) => ({ ...value, id }))\n    .sort((a, b) => b.width - a.width) // Sort by width in descending order\n\n  const transformed = sorted.reduce(\n    (prev, curr, index, array) => {\n      const { width, viewport, id, label } = curr\n      const next = array[index + 1]\n\n      const breakpoint: Breakpoint = {\n        id,\n        ...(label && { label }),\n        ...(next && { minWidth: next.width + 1 }),\n        maxWidth: width,\n        viewportWidth: viewport ?? width,\n      }\n\n      return [...prev, breakpoint]\n    },\n    [\n      { id: DefaultBreakpointID.Desktop, label: 'Desktop', minWidth: sorted[0].width + 1 },\n    ] as Breakpoints,\n  )\n\n  return transformed\n}\n\nfunction validateBreakpointsInput(input: BreakpointsInput) {\n  if (DefaultBreakpointID.Desktop in input) {\n    throw new Error(\n      `Cannot change the base breakpoint. \"${DefaultBreakpointID.Desktop}\" is reserved as the base breakpoint.`,\n    )\n  }\n\n  if (Object.keys(input).length === 0) {\n    throw new Error(`Breakpoints cannot be empty. You must provide at least one breakpoint.`)\n  }\n\n  const sorted = Object.entries(input)\n    .map(([id, value]) => ({ ...value, id }))\n    .sort((a, b) => b.width - a.width) // Sort by width in descending order\n\n  sorted.forEach(({ id, width, viewport }, index, array) => {\n    // This is only valid for desktop-first. We need to check the inverse for mobile-first.\n    if (viewport && viewport > width) {\n      throw new Error(\n        `Error on breakpoint \"${id}\". Viewport cannot be greater than its width.\n        \"${id}\" has a viewport of ${viewport}px and a width of ${width}px.`,\n      )\n    }\n\n    const next = array[index + 1]\n\n    if (viewport && next && viewport < next.width) {\n      throw new Error(\n        `Error on breakpoint \"${id}\". Viewport cannot be smaller than the next breakpoint's width. \n        \"${id}\" has a viewport of ${viewport}px and the next breakpoint \"${next.id}\" has a width of ${next.width}px.`,\n      )\n    }\n\n    if (next && width === next.width) {\n      throw new Error(\n        `Breakpoints cannot have the same width. \"${id}\" and \"${next.id}\" have the same width`,\n      )\n    }\n  })\n}\n\nexport const getBreakpoint = (state: State, breakpointId: Breakpoint['id']): Breakpoint => {\n  const breakpoint = state.find(({ id }) => id === breakpointId)\n\n  if (breakpoint == null) throw new Error(`Unrecognized breakpoint ID: \"${breakpointId}\".`)\n\n  return breakpoint\n}\n\nexport const getBreakpointMediaQuery = (breakpoint: Breakpoint): string => {\n  const parts = ['@media only screen']\n\n  if (breakpoint.minWidth != null) {\n    parts.push(`(min-width: ${breakpoint.minWidth}px)`)\n  }\n\n  if (breakpoint.maxWidth != null) {\n    parts.push(`(max-width: ${breakpoint.maxWidth}px)`)\n  }\n\n  return parts.join(' and ')\n}\n\nexport const getViewportStyle = (\n  state: State,\n  deviceId: string,\n): Viewport<string | number> | null | undefined => {\n  const device = getBreakpoint(state, deviceId)\n\n  return (\n    device && {\n      width: device.viewportWidth != null ? device.viewportWidth : '100%',\n      minWidth: device.minWidth,\n    }\n  )\n}\n\nexport function findNextFallback<V>(\n  breakpoints: Breakpoints,\n  value: ResponsiveValue<V>,\n  deviceId: BreakpointId,\n  activeDeviceId: BreakpointId,\n  fallbackStrategy?: FallbackStrategy<V>,\n): Breakpoint | null {\n  const deviceOverride = findBreakpointOverride(\n    breakpoints,\n    value.filter(v => v.deviceId !== activeDeviceId),\n    deviceId,\n    fallbackStrategy,\n  )\n\n  return (deviceOverride && getBreakpoint(breakpoints, deviceOverride.deviceId)) ?? null\n}\n"],"mappings":"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","names":["import_controls"]}
+{"version":3,"sources":["../../../../src/state/modules/breakpoints.ts"],"sourcesContent":["import { type Breakpoint, type Breakpoints } from '@makeswift/controls'\n\nimport { Action, ActionTypes } from '../actions'\n\nexport {\n  getBreakpoint,\n  type Breakpoint,\n  type BreakpointId,\n  type Breakpoints,\n} from '@makeswift/controls'\n\nexport type State = Breakpoints\n\nexport const DefaultBreakpointID = {\n  Desktop: 'desktop',\n  Tablet: 'tablet',\n  Mobile: 'mobile',\n} as const\n\ntype DefaultBreakpointID = (typeof DefaultBreakpointID)[keyof typeof DefaultBreakpointID]\n\nexport const DEFAULT_BREAKPOINTS: Breakpoints = [\n  {\n    id: DefaultBreakpointID.Desktop,\n    label: 'Desktop',\n    minWidth: 769,\n  },\n  {\n    id: DefaultBreakpointID.Tablet,\n    label: 'Tablet',\n    minWidth: 576,\n    maxWidth: 768,\n    viewportWidth: 760,\n  },\n  {\n    id: DefaultBreakpointID.Mobile,\n    label: 'Mobile',\n    maxWidth: 575,\n    viewportWidth: 390,\n  },\n]\n\nexport function getInitialState(breakpoints = DEFAULT_BREAKPOINTS): State {\n  return breakpoints\n}\n\nexport function reducer(state: State = getInitialState(), action: Action): State {\n  switch (action.type) {\n    case ActionTypes.SET_BREAKPOINTS: {\n      const breakpoints = action.payload.breakpoints\n\n      if (breakpoints.length === 0) throw new Error('Breakpoints cannot be empty.')\n\n      return breakpoints\n    }\n\n    default:\n      return state\n  }\n}\n\nexport type BreakpointsInput = Record<string, { width: number; label?: string; viewport?: number }>\n\nexport function parseBreakpointsInput(input: BreakpointsInput): Breakpoints {\n  validateBreakpointsInput(input)\n\n  const sorted = Object.entries(input)\n    .map(([id, value]) => ({ ...value, id }))\n    .sort((a, b) => b.width - a.width) // Sort by width in descending order\n\n  const transformed = sorted.reduce(\n    (prev, curr, index, array) => {\n      const { width, viewport, id, label } = curr\n      const next = array[index + 1]\n\n      const breakpoint: Breakpoint = {\n        id,\n        ...(label && { label }),\n        ...(next && { minWidth: next.width + 1 }),\n        maxWidth: width,\n        viewportWidth: viewport ?? width,\n      }\n\n      return [...prev, breakpoint]\n    },\n    [\n      { id: DefaultBreakpointID.Desktop, label: 'Desktop', minWidth: sorted[0].width + 1 },\n    ] as Breakpoints,\n  )\n\n  return transformed\n}\n\nfunction validateBreakpointsInput(input: BreakpointsInput) {\n  if (DefaultBreakpointID.Desktop in input) {\n    throw new Error(\n      `Cannot change the base breakpoint. \"${DefaultBreakpointID.Desktop}\" is reserved as the base breakpoint.`,\n    )\n  }\n\n  if (Object.keys(input).length === 0) {\n    throw new Error(`Breakpoints cannot be empty. You must provide at least one breakpoint.`)\n  }\n\n  const sorted = Object.entries(input)\n    .map(([id, value]) => ({ ...value, id }))\n    .sort((a, b) => b.width - a.width) // Sort by width in descending order\n\n  sorted.forEach(({ id, width, viewport }, index, array) => {\n    // This is only valid for desktop-first. We need to check the inverse for mobile-first.\n    if (viewport && viewport > width) {\n      throw new Error(\n        `Error on breakpoint \"${id}\". Viewport cannot be greater than its width.\n        \"${id}\" has a viewport of ${viewport}px and a width of ${width}px.`,\n      )\n    }\n\n    const next = array[index + 1]\n\n    if (viewport && next && viewport < next.width) {\n      throw new Error(\n        `Error on breakpoint \"${id}\". Viewport cannot be smaller than the next breakpoint's width. \n        \"${id}\" has a viewport of ${viewport}px and the next breakpoint \"${next.id}\" has a width of ${next.width}px.`,\n      )\n    }\n\n    if (next && width === next.width) {\n      throw new Error(\n        `Breakpoints cannot have the same width. \"${id}\" and \"${next.id}\" have the same width`,\n      )\n    }\n  })\n}\n"],"mappings":"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","names":["import_controls"]}

package/dist/esm/components/builtin/Box/register.js

@@ -15,7 +15,7 @@ import {
   Shadows,
   Width
 } from "@makeswift/prop-controllers";
-import { findBreakpointOverride, getBaseBreakpoint } from "../../../state/modules/breakpoints";
+import { findBreakpointOverride, getBaseBreakpoint } from "@makeswift/controls";
 import { MakeswiftComponentType } from "../constants";
 import {
   DEFAULT_BOX_ANIMATE_DELAY,

package/dist/esm/components/builtin/Box/register.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/builtin/Box/register.ts"],"sourcesContent":["import {\n  Backgrounds,\n  Border,\n  BorderRadius,\n  Checkbox,\n  ElementID,\n  GapX,\n  GapY,\n  Grid,\n  Margin,\n  Padding,\n  ResponsiveIconRadioGroup,\n  ResponsiveNumber,\n  ResponsiveSelect,\n  Shadows,\n  Width,\n  type PropData,\n} from '@makeswift/prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { findBreakpointOverride, getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_ITEM_ANIMATE_DELAY,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n  function isHiddenBasedOnAnimationType(\n    props: Record<string, unknown>,\n    deviceId: string,\n    property: 'boxAnimateType' | 'itemAnimateType',\n  ): boolean {\n    const animateIn = ResponsiveSelect.fromPropData<BoxAnimateIn>(\n      props[property] as PropData<typeof ResponsiveSelect> | undefined,\n    )\n    return (\n      (findBreakpointOverride<BoxAnimateIn>(runtime.getBreakpoints(), animateIn, deviceId)?.value ??\n        'none') === 'none'\n    )\n  }\n  const isHiddenBasedOnBoxAnimation = (props: Record<string, unknown>, deviceId: string) =>\n    isHiddenBasedOnAnimationType(props, deviceId, 'boxAnimateType')\n  const isHiddenBasedOnItemAnimation = (props: Record<string, unknown>, deviceId: string) =>\n    isHiddenBasedOnAnimationType(props, deviceId, 'itemAnimateType')\n\n  return runtime.registerComponent(\n    lazy(() => import('./Box')),\n    {\n      type: MakeswiftComponentType.Box,\n      label: 'Box',\n      props: {\n        id: ElementID(),\n        backgrounds: Backgrounds(),\n        width: Width({\n          format: Width.Format.ClassName,\n          defaultValue: { value: 100, unit: '%' },\n        }),\n        height: ResponsiveIconRadioGroup({\n          label: 'Height',\n          options: [\n            { value: 'auto', label: 'Auto', icon: 'HeightAuto16' },\n            { value: 'stretch', label: 'Stretch', icon: 'HeightMatch16' },\n          ],\n          defaultValue: 'auto',\n        }),\n        verticalAlign: ResponsiveIconRadioGroup({\n          label: 'Align items',\n          options: [\n            { value: 'flex-start', label: 'Top', icon: 'VerticalAlignStart16' },\n            { value: 'center', label: 'Middle', icon: 'VerticalAlignMiddle16' },\n            { value: 'flex-end', label: 'Bottom', icon: 'VerticalAlignEnd16' },\n            {\n              value: 'space-between',\n              label: 'Space between',\n              icon: 'VerticalAlignSpaceBetween16',\n            },\n          ],\n          defaultValue: 'flex-start',\n        }),\n        margin: Margin({ format: Margin.Format.ClassName }),\n        padding: Padding({\n          format: Padding.Format.ClassName,\n          preset: [\n            {\n              deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n              value: {\n                paddingTop: { value: 10, unit: 'px' },\n                paddingRight: { value: 10, unit: 'px' },\n                paddingBottom: { value: 10, unit: 'px' },\n                paddingLeft: { value: 10, unit: 'px' },\n              },\n            },\n          ],\n        }),\n        border: Border({ format: Border.Format.ClassName }),\n        borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n        boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n        rowGap: GapY(props => ({\n          hidden: props.children == null,\n        })),\n        columnGap: GapX(props => ({\n          hidden: props.children == null,\n        })),\n        boxAnimateType: ResponsiveSelect({\n          label: 'Animate box in',\n          labelOrientation: 'vertical',\n          options: [\n            { value: 'none', label: 'None' },\n            { value: 'fadeIn', label: 'Fade in' },\n            { value: 'fadeRight', label: 'Fade right' },\n            { value: 'fadeDown', label: 'Fade down' },\n            { value: 'fadeLeft', label: 'Fade left' },\n            { value: 'fadeUp', label: 'Fade up' },\n            { value: 'blurIn', label: 'Blur in' },\n            { value: 'scaleUp', label: 'Scale up' },\n            { value: 'scaleDown', label: 'Scale down' },\n          ],\n          defaultValue: 'none',\n        }),\n        boxAnimateDuration: ResponsiveNumber((props, device) => ({\n          label: 'Box duration',\n          defaultValue: DEFAULT_BOX_ANIMATE_DURATION,\n          min: 0.1,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnBoxAnimation(props, device),\n        })),\n        boxAnimateDelay: ResponsiveNumber((props, device) => ({\n          label: 'Box delay',\n          defaultValue: DEFAULT_BOX_ANIMATE_DELAY,\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnBoxAnimation(props, device),\n        })),\n        itemAnimateType: ResponsiveSelect({\n          label: 'Animate items in',\n          labelOrientation: 'vertical',\n          options: [\n            { value: 'none', label: 'None' },\n            { value: 'fadeIn', label: 'Fade in' },\n            { value: 'fadeRight', label: 'Fade right' },\n            { value: 'fadeDown', label: 'Fade down' },\n            { value: 'fadeLeft', label: 'Fade left' },\n            { value: 'fadeUp', label: 'Fade up' },\n            { value: 'blurIn', label: 'Blur in' },\n            { value: 'scaleUp', label: 'Scale up' },\n            { value: 'scaleDown', label: 'Scale down' },\n          ],\n          defaultValue: 'none',\n        }),\n        itemAnimateDuration: ResponsiveNumber((props, device) => ({\n          label: 'Items duration',\n          defaultValue: DEFAULT_BOX_ANIMATE_DURATION,\n          min: 0.1,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        itemAnimateDelay: ResponsiveNumber((props, device) => ({\n          label: 'Items delay',\n          defaultValue: DEFAULT_ITEM_ANIMATE_DELAY,\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        itemStaggerDuration: ResponsiveNumber((props, device) => ({\n          label: 'Stagger',\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          defaultValue: DEFAULT_ITEM_STAGGER_DURATION,\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        hidePlaceholder: Checkbox(props => ({\n          label: 'Hide placeholder',\n          hidden: props.children != null,\n        })),\n        children: Grid(),\n      },\n    },\n  )\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../../src/components/builtin/Box/register.ts"],"sourcesContent":["import {\n  Backgrounds,\n  Border,\n  BorderRadius,\n  Checkbox,\n  ElementID,\n  GapX,\n  GapY,\n  Grid,\n  Margin,\n  Padding,\n  ResponsiveIconRadioGroup,\n  ResponsiveNumber,\n  ResponsiveSelect,\n  Shadows,\n  Width,\n  type PropData,\n} from '@makeswift/prop-controllers'\nimport { findBreakpointOverride, getBaseBreakpoint } from '@makeswift/controls'\n\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_ITEM_ANIMATE_DELAY,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n  function isHiddenBasedOnAnimationType(\n    props: Record<string, unknown>,\n    deviceId: string,\n    property: 'boxAnimateType' | 'itemAnimateType',\n  ): boolean {\n    const animateIn = ResponsiveSelect.fromPropData<BoxAnimateIn>(\n      props[property] as PropData<typeof ResponsiveSelect> | undefined,\n    )\n    return (\n      (findBreakpointOverride<BoxAnimateIn>(runtime.getBreakpoints(), animateIn, deviceId)?.value ??\n        'none') === 'none'\n    )\n  }\n  const isHiddenBasedOnBoxAnimation = (props: Record<string, unknown>, deviceId: string) =>\n    isHiddenBasedOnAnimationType(props, deviceId, 'boxAnimateType')\n  const isHiddenBasedOnItemAnimation = (props: Record<string, unknown>, deviceId: string) =>\n    isHiddenBasedOnAnimationType(props, deviceId, 'itemAnimateType')\n\n  return runtime.registerComponent(\n    lazy(() => import('./Box')),\n    {\n      type: MakeswiftComponentType.Box,\n      label: 'Box',\n      props: {\n        id: ElementID(),\n        backgrounds: Backgrounds(),\n        width: Width({\n          format: Width.Format.ClassName,\n          defaultValue: { value: 100, unit: '%' },\n        }),\n        height: ResponsiveIconRadioGroup({\n          label: 'Height',\n          options: [\n            { value: 'auto', label: 'Auto', icon: 'HeightAuto16' },\n            { value: 'stretch', label: 'Stretch', icon: 'HeightMatch16' },\n          ],\n          defaultValue: 'auto',\n        }),\n        verticalAlign: ResponsiveIconRadioGroup({\n          label: 'Align items',\n          options: [\n            { value: 'flex-start', label: 'Top', icon: 'VerticalAlignStart16' },\n            { value: 'center', label: 'Middle', icon: 'VerticalAlignMiddle16' },\n            { value: 'flex-end', label: 'Bottom', icon: 'VerticalAlignEnd16' },\n            {\n              value: 'space-between',\n              label: 'Space between',\n              icon: 'VerticalAlignSpaceBetween16',\n            },\n          ],\n          defaultValue: 'flex-start',\n        }),\n        margin: Margin({ format: Margin.Format.ClassName }),\n        padding: Padding({\n          format: Padding.Format.ClassName,\n          preset: [\n            {\n              deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n              value: {\n                paddingTop: { value: 10, unit: 'px' },\n                paddingRight: { value: 10, unit: 'px' },\n                paddingBottom: { value: 10, unit: 'px' },\n                paddingLeft: { value: 10, unit: 'px' },\n              },\n            },\n          ],\n        }),\n        border: Border({ format: Border.Format.ClassName }),\n        borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n        boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n        rowGap: GapY(props => ({\n          hidden: props.children == null,\n        })),\n        columnGap: GapX(props => ({\n          hidden: props.children == null,\n        })),\n        boxAnimateType: ResponsiveSelect({\n          label: 'Animate box in',\n          labelOrientation: 'vertical',\n          options: [\n            { value: 'none', label: 'None' },\n            { value: 'fadeIn', label: 'Fade in' },\n            { value: 'fadeRight', label: 'Fade right' },\n            { value: 'fadeDown', label: 'Fade down' },\n            { value: 'fadeLeft', label: 'Fade left' },\n            { value: 'fadeUp', label: 'Fade up' },\n            { value: 'blurIn', label: 'Blur in' },\n            { value: 'scaleUp', label: 'Scale up' },\n            { value: 'scaleDown', label: 'Scale down' },\n          ],\n          defaultValue: 'none',\n        }),\n        boxAnimateDuration: ResponsiveNumber((props, device) => ({\n          label: 'Box duration',\n          defaultValue: DEFAULT_BOX_ANIMATE_DURATION,\n          min: 0.1,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnBoxAnimation(props, device),\n        })),\n        boxAnimateDelay: ResponsiveNumber((props, device) => ({\n          label: 'Box delay',\n          defaultValue: DEFAULT_BOX_ANIMATE_DELAY,\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnBoxAnimation(props, device),\n        })),\n        itemAnimateType: ResponsiveSelect({\n          label: 'Animate items in',\n          labelOrientation: 'vertical',\n          options: [\n            { value: 'none', label: 'None' },\n            { value: 'fadeIn', label: 'Fade in' },\n            { value: 'fadeRight', label: 'Fade right' },\n            { value: 'fadeDown', label: 'Fade down' },\n            { value: 'fadeLeft', label: 'Fade left' },\n            { value: 'fadeUp', label: 'Fade up' },\n            { value: 'blurIn', label: 'Blur in' },\n            { value: 'scaleUp', label: 'Scale up' },\n            { value: 'scaleDown', label: 'Scale down' },\n          ],\n          defaultValue: 'none',\n        }),\n        itemAnimateDuration: ResponsiveNumber((props, device) => ({\n          label: 'Items duration',\n          defaultValue: DEFAULT_BOX_ANIMATE_DURATION,\n          min: 0.1,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        itemAnimateDelay: ResponsiveNumber((props, device) => ({\n          label: 'Items delay',\n          defaultValue: DEFAULT_ITEM_ANIMATE_DELAY,\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        itemStaggerDuration: ResponsiveNumber((props, device) => ({\n          label: 'Stagger',\n          min: 0,\n          step: 0.05,\n          suffix: 's',\n          defaultValue: DEFAULT_ITEM_STAGGER_DURATION,\n          hidden: isHiddenBasedOnItemAnimation(props, device),\n        })),\n        hidePlaceholder: Checkbox(props => ({\n          label: 'Hide placeholder',\n          hidden: props.children != null,\n        })),\n        children: Grid(),\n      },\n    },\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components/builtin/Button/register.js

@@ -9,7 +9,7 @@ import {
   TextStyle,
   Width
 } from "@makeswift/prop-controllers";
-import { findBreakpointOverride } from "../../../state/modules/breakpoints";
+import { findBreakpointOverride } from "@makeswift/controls";
 import { MakeswiftComponentType } from "../constants";
 import { lazy } from "react";
 function registerComponent(runtime) {

package/dist/esm/components/builtin/Button/register.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/builtin/Button/register.ts"],"sourcesContent":["import {\n  ElementID,\n  Link,\n  Margin,\n  ResponsiveColor,\n  ResponsiveIconRadioGroup,\n  ResponsiveSelect,\n  TextInput,\n  TextStyle,\n  Width,\n  type PropData,\n} from '@makeswift/prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { findBreakpointOverride } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport { ButtonVariant } from './contants'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n  return runtime.registerComponent(\n    lazy(() => import('./Button')),\n    {\n      type: MakeswiftComponentType.Button,\n      label: 'Button',\n      props: {\n        id: ElementID(),\n        children: TextInput({ placeholder: 'Button text' }),\n        link: Link({\n          defaultValue: {\n            type: 'OPEN_PAGE',\n            payload: {\n              pageId: null,\n              openInNewTab: false,\n            },\n          },\n        }),\n        variant: ResponsiveSelect({\n          label: 'Style',\n          labelOrientation: 'horizontal',\n          options: [\n            { value: 'flat', label: 'Flat' },\n            { value: 'outline', label: 'Outline' },\n            { value: 'shadow', label: 'Floating' },\n            { value: 'clear', label: 'Clear' },\n            { value: 'blocky', label: 'Blocky' },\n            { value: 'bubbly', label: 'Bubbly' },\n            { value: 'skewed', label: 'Skewed' },\n          ],\n          defaultValue: 'flat',\n        }),\n        shape: ResponsiveIconRadioGroup({\n          label: 'Shape',\n          options: [\n            { label: 'Pill', value: 'pill', icon: 'ButtonPill16' },\n            { label: 'Rounded', value: 'rounded', icon: 'ButtonRounded16' },\n            { label: 'Square', value: 'square', icon: 'ButtonSquare16' },\n          ],\n          defaultValue: 'rounded',\n        }),\n        size: ResponsiveIconRadioGroup({\n          label: 'Size',\n          options: [\n            { label: 'Small', value: 'small', icon: 'SizeSmall16' },\n            { label: 'Medium', value: 'medium', icon: 'SizeMedium16' },\n            { label: 'Large', value: 'large', icon: 'SizeLarge16' },\n          ],\n          defaultValue: 'medium',\n        }),\n        color: ResponsiveColor((props, device) => {\n          const variant = ResponsiveSelect.fromPropData<ButtonVariant>(\n            props.variant as PropData<typeof ResponsiveSelect> | undefined,\n          )\n          const hidden =\n            findBreakpointOverride<ButtonVariant>(runtime.getBreakpoints(), variant, device)\n              ?.value === 'clear'\n\n          return { placeholder: 'black', hidden }\n        }),\n        textColor: ResponsiveColor({\n          label: 'Text color',\n          placeholder: 'white',\n        }),\n        textStyle: TextStyle(),\n        width: Width(),\n        margin: Margin({ format: Margin.Format.ClassName }),\n      },\n    },\n  )\n}\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAEP,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AAEvC,SAAS,YAAY;AAEd,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,UAAU,CAAC;AAAA,IAC7B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,UAAU;AAAA,QACd,UAAU,UAAU,EAAE,aAAa,cAAc,CAAC;AAAA,QAClD,MAAM,KAAK;AAAA,UACT,cAAc;AAAA,YACZ,MAAM;AAAA,YACN,SAAS;AAAA,cACP,QAAQ;AAAA,cACR,cAAc;AAAA,YAChB;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,SAAS,iBAAiB;AAAA,UACxB,OAAO;AAAA,UACP,kBAAkB;AAAA,UAClB,SAAS;AAAA,YACP,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,YAC/B,EAAE,OAAO,WAAW,OAAO,UAAU;AAAA,YACrC,EAAE,OAAO,UAAU,OAAO,WAAW;AAAA,YACrC,EAAE,OAAO,SAAS,OAAO,QAAQ;AAAA,YACjC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,YACnC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,YACnC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,UACrC;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,OAAO,yBAAyB;AAAA,UAC9B,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,eAAe;AAAA,YACrD,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,kBAAkB;AAAA,YAC9D,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,iBAAiB;AAAA,UAC7D;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,MAAM,yBAAyB;AAAA,UAC7B,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,YACtD,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,eAAe;AAAA,YACzD,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,UACxD;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,OAAO,gBAAgB,CAAC,OAAO,WAAW;AACxC,gBAAM,UAAU,iBAAiB;AAAA,YAC/B,MAAM;AAAA,UACR;AACA,gBAAM,SACJ,uBAAsC,QAAQ,eAAe,GAAG,SAAS,MAAM,GAC3E,UAAU;AAEhB,iBAAO,EAAE,aAAa,SAAS,OAAO;AAAA,QACxC,CAAC;AAAA,QACD,WAAW,gBAAgB;AAAA,UACzB,OAAO;AAAA,UACP,aAAa;AAAA,QACf,CAAC;AAAA,QACD,WAAW,UAAU;AAAA,QACrB,OAAO,MAAM;AAAA,QACb,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../../../src/components/builtin/Button/register.ts"],"sourcesContent":["import {\n  ElementID,\n  Link,\n  Margin,\n  ResponsiveColor,\n  ResponsiveIconRadioGroup,\n  ResponsiveSelect,\n  TextInput,\n  TextStyle,\n  Width,\n  type PropData,\n} from '@makeswift/prop-controllers'\nimport { findBreakpointOverride } from '@makeswift/controls'\n\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport { ButtonVariant } from './contants'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n  return runtime.registerComponent(\n    lazy(() => import('./Button')),\n    {\n      type: MakeswiftComponentType.Button,\n      label: 'Button',\n      props: {\n        id: ElementID(),\n        children: TextInput({ placeholder: 'Button text' }),\n        link: Link({\n          defaultValue: {\n            type: 'OPEN_PAGE',\n            payload: {\n              pageId: null,\n              openInNewTab: false,\n            },\n          },\n        }),\n        variant: ResponsiveSelect({\n          label: 'Style',\n          labelOrientation: 'horizontal',\n          options: [\n            { value: 'flat', label: 'Flat' },\n            { value: 'outline', label: 'Outline' },\n            { value: 'shadow', label: 'Floating' },\n            { value: 'clear', label: 'Clear' },\n            { value: 'blocky', label: 'Blocky' },\n            { value: 'bubbly', label: 'Bubbly' },\n            { value: 'skewed', label: 'Skewed' },\n          ],\n          defaultValue: 'flat',\n        }),\n        shape: ResponsiveIconRadioGroup({\n          label: 'Shape',\n          options: [\n            { label: 'Pill', value: 'pill', icon: 'ButtonPill16' },\n            { label: 'Rounded', value: 'rounded', icon: 'ButtonRounded16' },\n            { label: 'Square', value: 'square', icon: 'ButtonSquare16' },\n          ],\n          defaultValue: 'rounded',\n        }),\n        size: ResponsiveIconRadioGroup({\n          label: 'Size',\n          options: [\n            { label: 'Small', value: 'small', icon: 'SizeSmall16' },\n            { label: 'Medium', value: 'medium', icon: 'SizeMedium16' },\n            { label: 'Large', value: 'large', icon: 'SizeLarge16' },\n          ],\n          defaultValue: 'medium',\n        }),\n        color: ResponsiveColor((props, device) => {\n          const variant = ResponsiveSelect.fromPropData<ButtonVariant>(\n            props.variant as PropData<typeof ResponsiveSelect> | undefined,\n          )\n          const hidden =\n            findBreakpointOverride<ButtonVariant>(runtime.getBreakpoints(), variant, device)\n              ?.value === 'clear'\n\n          return { placeholder: 'black', hidden }\n        }),\n        textColor: ResponsiveColor({\n          label: 'Text color',\n          placeholder: 'white',\n        }),\n        textStyle: TextStyle(),\n        width: Width(),\n        margin: Margin({ format: Margin.Format.ClassName }),\n      },\n    },\n  )\n}\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP,SAAS,8BAA8B;AAGvC,SAAS,8BAA8B;AAEvC,SAAS,YAAY;AAEd,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,UAAU,CAAC;AAAA,IAC7B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,UAAU;AAAA,QACd,UAAU,UAAU,EAAE,aAAa,cAAc,CAAC;AAAA,QAClD,MAAM,KAAK;AAAA,UACT,cAAc;AAAA,YACZ,MAAM;AAAA,YACN,SAAS;AAAA,cACP,QAAQ;AAAA,cACR,cAAc;AAAA,YAChB;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,SAAS,iBAAiB;AAAA,UACxB,OAAO;AAAA,UACP,kBAAkB;AAAA,UAClB,SAAS;AAAA,YACP,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,YAC/B,EAAE,OAAO,WAAW,OAAO,UAAU;AAAA,YACrC,EAAE,OAAO,UAAU,OAAO,WAAW;AAAA,YACrC,EAAE,OAAO,SAAS,OAAO,QAAQ;AAAA,YACjC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,YACnC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,YACnC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,UACrC;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,OAAO,yBAAyB;AAAA,UAC9B,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,eAAe;AAAA,YACrD,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,kBAAkB;AAAA,YAC9D,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,iBAAiB;AAAA,UAC7D;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,MAAM,yBAAyB;AAAA,UAC7B,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,YACtD,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,eAAe;AAAA,YACzD,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,UACxD;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,OAAO,gBAAgB,CAAC,OAAO,WAAW;AACxC,gBAAM,UAAU,iBAAiB;AAAA,YAC/B,MAAM;AAAA,UACR;AACA,gBAAM,SACJ,uBAAsC,QAAQ,eAAe,GAAG,SAAS,MAAM,GAC3E,UAAU;AAEhB,iBAAO,EAAE,aAAa,SAAS,OAAO;AAAA,QACxC,CAAC;AAAA,QACD,WAAW,gBAAgB;AAAA,UACzB,OAAO;AAAA,UACP,aAAa;AAAA,QACf,CAAC;AAAA,QACD,WAAW,UAAU;AAAA,QACrB,OAAO,MAAM;AAAA,QACb,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/esm/components/builtin/Carousel/Carousel.js

@@ -10,13 +10,13 @@ import {
 import { motion, useAnimation } from "framer-motion";
 import { useGesture } from "@use-gesture/react";
 import { wrap } from "@popmotion/popcorn";
+import { getBaseBreakpoint } from "@makeswift/controls";
 import { colorToString } from "../../utils/colorToString";
 import { useMediaQuery } from "../../hooks";
 import Image from "../Image";
 import { useStyle } from "../../../runtimes/react/use-style";
 import { cx } from "@emotion/css";
 import { useResponsiveStyle } from "../../utils/responsive-style";
-import { getBaseBreakpoint } from "../../../state/modules/breakpoints";
 import { useBreakpoints } from "../../../runtimes/react/hooks/use-breakpoints";
 const LeftChevron = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "14", viewBox: "0 0 10 14", children: /* @__PURE__ */ jsx(
   "path",

package/dist/esm/components/builtin/Carousel/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/builtin/Carousel/Carousel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  forwardRef,\n  Ref,\n  ComponentPropsWithoutRef,\n} from 'react'\nimport { motion, useAnimation } from 'framer-motion'\nimport { useGesture } from '@use-gesture/react'\nimport { wrap } from '@popmotion/popcorn'\n\nimport { colorToString } from '../../utils/colorToString'\nimport { type ResponsiveColor } from '../../utils/types'\nimport { useMediaQuery } from '../../hooks'\n\nimport Image from '../Image'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport {\n  type ResponsiveGapData,\n  type ResponsiveNumberValue,\n  type ResponsiveIconRadioGroupValue,\n  type ImagesData,\n} from '@makeswift/prop-controllers'\n\nconst LeftChevron = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n    <path\n      d=\"M7,13,1,7,7,1\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n    />\n  </svg>\n)\n\nconst RightChevron = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n    <path\n      d=\"M3,1,9,7,3,13\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n    />\n  </svg>\n)\n\ntype Props = {\n  id?: string\n  images?: ImagesData\n  width?: string\n  margin?: string\n  pageSize?: ResponsiveNumberValue\n  step?: ResponsiveNumberValue\n  slideAlignment?: ResponsiveIconRadioGroupValue<'flex-start' | 'center' | 'flex-end'>\n  gap?: ResponsiveGapData\n  autoplay?: boolean\n  delay?: number\n  showArrows?: boolean\n  arrowPosition?: ResponsiveIconRadioGroupValue<'inside' | 'center' | 'outside'>\n  arrowColor?: ResponsiveColor | null\n  arrowBackground?: ResponsiveColor | null\n  showDots?: boolean\n  dotColor?: ResponsiveColor | null\n  slideBorder?: string\n  slideBorderRadius?: string\n}\n\nconst SWIPE_THRESHOLD = 20\nconst swipePower = (dx: number, velocity: number) => dx * (1 + velocity)\n\n// constructs a CSS [class selector](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors),\n// returns a compound class selector if the `classname` string includes multiple class names\nconst classSelector = (classname: string) => `.${classname.split(' ').join('.')}`\n\nconst Carousel = forwardRef(function Carousel(\n  {\n    images = [],\n    width,\n    margin,\n    pageSize: responsivePageSize,\n    step: responsiveStep,\n    gap,\n    slideAlignment,\n    showDots,\n    showArrows,\n    arrowPosition,\n    arrowColor,\n    arrowBackground,\n    dotColor,\n    autoplay = false,\n    delay = 5,\n    slideBorder,\n    slideBorderRadius,\n  }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  const breakpoints = useBreakpoints()\n  const [index, setIndex] = useState(0)\n  const swipe = useRef(0)\n  const startIndex = wrap(0, images.length, index)\n  const pageSize = useMediaQuery(responsivePageSize) || 1\n  const step = useMediaQuery(responsiveStep) || 1\n  const endIndex = startIndex + pageSize\n  const pageCount = Math.ceil((images.length - pageSize) / step + 1)\n  const pageIndex = Math.ceil(startIndex / step)\n  const isFirstPage = pageIndex === 0\n  const isLastPage = pageIndex === pageCount - 1\n  const paginate = useCallback(\n    (pageDistance: number) => {\n      if (pageDistance === 0) return\n\n      const direction = pageDistance / Math.abs(pageDistance)\n      const remaining = direction > 0 ? images.slice(endIndex) : images.slice(0, startIndex)\n      const distance = direction * Math.min(remaining.length, step * Math.abs(pageDistance))\n\n      setIndex(index + distance)\n    },\n    [images, index, startIndex, endIndex, step],\n  )\n  // @ts-expect-error: `useAnimation` types expect no arguments.\n  const animation = useAnimation({ x: 0, transition: { type: 'spring', stiffness: 100 } })\n  const bindPage = useGesture(\n    {\n      onDrag: ({ movement: [mx], delta: [dx], velocity: [vx] }) => {\n        animation.start({ x: mx })\n        swipe.current = swipePower(dx, vx)\n      },\n      onDragEnd: () => {\n        animation.start({ x: 0 })\n\n        if (swipe.current > SWIPE_THRESHOLD) paginate(1)\n        else if (swipe.current < -SWIPE_THRESHOLD) paginate(-1)\n      },\n    },\n    {\n      drag: {\n        axis: 'x',\n        bounds: { left: 0, right: 0 },\n        rubberband: true,\n      },\n    },\n  )\n\n  useEffect(() => {\n    if (!autoplay || pageSize !== 0) setIndex(0)\n  }, [autoplay, pageSize])\n\n  useEffect(() => {\n    if (!autoplay) return () => {}\n\n    const intervalId = setInterval(() => (isLastPage ? setIndex(0) : paginate(1)), delay * 1000)\n\n    return () => clearInterval(intervalId)\n  }, [autoplay, delay, paginate, isLastPage])\n\n  const clipMaskClassName = useStyle({ overflow: 'hidden' })\n  const pageClassName = useStyle({ position: 'relative', width: '100%' })\n  const slideClassName = cx(\n    useStyle({ display: 'flex' }),\n    useStyle(\n      useResponsiveStyle([responsivePageSize] as const, ([pageSize = 1]) => ({\n        flexBasis: `${100 / pageSize}%`,\n        maxWidth: `${100 / pageSize}%`,\n        minWidth: `${100 / pageSize}%`,\n      })),\n    ),\n    useStyle(\n      useResponsiveStyle([slideAlignment] as const, ([alignItems = 'center']) => ({ alignItems })),\n    ),\n  )\n\n  const reelClassName = cx(\n    useStyle({ display: 'flex', position: 'relative', flexWrap: 'nowrap' }),\n    useStyle(\n      useResponsiveStyle([gap] as const, ([gap = { value: 0, unit: 'px' }]) => ({\n        margin: `0 ${`${-gap.value / 2}${gap.unit}`}`,\n        [`& > ${classSelector(slideClassName)}`]: {\n          padding: `0 ${`${gap.value / 2}${gap.unit}`}`,\n        },\n      })),\n    ),\n  )\n\n  const arrowClassName = cx(\n    useStyle({\n      padding: 10,\n      borderRadius: '50%',\n      outline: 0,\n      border: 0,\n      width: 40,\n      height: 40,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      cursor: 'pointer',\n      userSelect: 'none',\n    }),\n    useStyle(\n      useResponsiveStyle(\n        [arrowBackground] as const,\n        ([background = { swatch: { hue: 0, saturation: 0, lightness: 100 }, alpha: 1 }]) => ({\n          background: colorToString(background),\n        }),\n      ),\n    ),\n    useStyle({ svg: { transition: 'transform 0.15s', stroke: 'currentcolor' } }),\n  )\n\n  const slopClassName = cx(\n    useStyle({\n      position: 'absolute',\n      top: 0,\n      bottom: 0,\n\n      display: 'flex',\n      '&[hidden]': {\n        display: 'none',\n      },\n\n      alignItems: 'center',\n      cursor: 'pointer',\n      zIndex: 2,\n    }),\n    useStyle(\n      useResponsiveStyle(\n        [arrowColor] as const,\n        ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n          color: colorToString(color),\n        }),\n      ),\n    ),\n  )\n\n  const leftSlopClassName = cx(\n    slopClassName,\n    useStyle(\n      useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n        switch (position) {\n          case 'inside':\n            return { transform: 'translateX(8px)' }\n\n          case 'outside':\n            return { transform: 'translateX(calc(-100% - 8px))' }\n\n          default:\n            return { transform: 'translateX(calc(-50%))' }\n        }\n      }),\n    ),\n    useStyle({\n      left: 0,\n\n      [`&:hover > ${classSelector(arrowClassName)}`]: {\n        '& > svg': {\n          transform: 'translateX(-2px)',\n        },\n      },\n    }),\n  )\n\n  const rightSlopClassName = cx(\n    slopClassName,\n    useStyle(\n      useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n        switch (position) {\n          case 'inside':\n            return { transform: 'translateX(-8px)' }\n\n          case 'outside':\n            return { transform: 'translateX(calc(100% + 8px))' }\n\n          default:\n            return { transform: 'translateX(calc(50%))' }\n        }\n      }),\n    ),\n    useStyle({\n      right: 0,\n      [`&:hover > ${classSelector(arrowClassName)}`]: {\n        '& > svg': {\n          transform: 'translateX(2px)',\n        },\n      },\n    }),\n  )\n\n  const dotsClassName = cx(\n    useStyle({ display: showDots ? 'flex' : 'none', justifyContent: 'center', marginTop: 20 }),\n    useStyle(\n      useResponsiveStyle(\n        [dotColor] as const,\n        ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n          color: colorToString(color),\n        }),\n      ),\n    ),\n  )\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\n        useStyle({ position: 'relative', display: 'flex', flexDirection: 'column' }),\n        width,\n        margin,\n        useStyle({ '&:focus': { outline: 0 } }),\n      )}\n      tabIndex={-1}\n      onKeyDown={e => {\n        switch (e.key) {\n          case 'ArrowRight':\n            paginate(1)\n            break\n          case 'ArrowLeft':\n            paginate(-1)\n            break\n          default:\n        }\n      }}\n    >\n      {/* NOTE: We set height to 100% here to fix an issue on IE11 where the child height of a flex column extends too far */}\n      <div className={useStyle({ position: 'relative', height: '100%' })}>\n        <div className={clipMaskClassName}>\n          {/* https://github.com/framer/motion/issues/1723 */}\n          {/* @ts-expect-error: React HTMLElement typings conflict with motion components */}\n          <motion.div {...bindPage()} className={pageClassName} animate={animation}>\n            <motion.div\n              className={reelClassName}\n              animate={{ x: `${-(100 / pageSize) * startIndex}%` }}\n              transition={{\n                x: {\n                  type: 'tween',\n                  ease: [0.165, 0.84, 0.44, 1],\n                  duration: 0.5,\n                },\n              }}\n            >\n              {images.map(({ props: imageProps, key }) => (\n                <motion.div\n                  id={key}\n                  key={key}\n                  className={slideClassName}\n                  onMouseDown={e => e.preventDefault()}\n                  onClick={e => {\n                    if (swipe.current !== 0) e.preventDefault()\n                  }}\n                >\n                  <Image\n                    width={[\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: { value: 100, unit: '%' },\n                      },\n                    ]}\n                    file={imageProps.file}\n                    altText={imageProps.altText}\n                    link={imageProps.link}\n                    border={slideBorder}\n                    borderRadius={slideBorderRadius}\n                  />\n                </motion.div>\n              ))}\n            </motion.div>\n          </motion.div>\n        </div>\n        <div\n          onClick={() => paginate(-1)}\n          className={leftSlopClassName}\n          hidden={!showArrows || isFirstPage}\n        >\n          <div className={arrowClassName}>\n            <LeftChevron />\n          </div>\n        </div>\n        <div\n          onClick={() => paginate(1)}\n          className={rightSlopClassName}\n          hidden={!showArrows || isLastPage}\n        >\n          <div className={arrowClassName}>\n            <RightChevron />\n          </div>\n        </div>\n      </div>\n      <div className={dotsClassName}>\n        {Array.from({ length: pageCount }).map((_, i) => (\n          <Dot key={i} active={i === pageIndex} onClick={() => paginate(i - pageIndex)} />\n        ))}\n      </div>\n    </div>\n  )\n})\n\nexport default Carousel\n\ntype DotBaseProps = {\n  className?: string\n  active: boolean\n}\n\ntype DotProps = DotBaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof DotBaseProps>\n\nfunction Dot({ className, active, ...restOfProps }: DotProps) {\n  return (\n    <div\n      {...restOfProps}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          margin: '0 6px',\n          borderRadius: '50%',\n          cursor: 'pointer',\n          width: 16,\n          height: 16,\n\n          '&::before, &::after': {\n            content: '\"\"',\n            position: 'absolute',\n            top: '50%',\n            left: '50%',\n            display: 'block',\n            borderRadius: '50%',\n            transition: 'all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275)',\n          },\n\n          '&::before': {\n            boxShadow: '0 0 0 2px currentColor',\n            transform: 'translate3d(-50%, -50%, 0)',\n            width: active ? 16 : 10,\n            height: active ? 16 : 10,\n          },\n\n          '&::after': {\n            background: 'currentColor',\n            transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n            width: 10,\n            height: 10,\n          },\n\n          '&:hover::after': {\n            transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n          },\n        }),\n        className,\n      )}\n    />\n  )\n}\n"],"mappings":"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","names":["Carousel","pageSize","gap"]}
+{"version":3,"sources":["../../../../../src/components/builtin/Carousel/Carousel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  forwardRef,\n  Ref,\n  ComponentPropsWithoutRef,\n} from 'react'\nimport { motion, useAnimation } from 'framer-motion'\nimport { useGesture } from '@use-gesture/react'\nimport { wrap } from '@popmotion/popcorn'\n\nimport { getBaseBreakpoint } from '@makeswift/controls'\n\nimport { colorToString } from '../../utils/colorToString'\nimport { type ResponsiveColor } from '../../utils/types'\nimport { useMediaQuery } from '../../hooks'\n\nimport Image from '../Image'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport {\n  type ResponsiveGapData,\n  type ResponsiveNumberValue,\n  type ResponsiveIconRadioGroupValue,\n  type ImagesData,\n} from '@makeswift/prop-controllers'\n\nconst LeftChevron = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n    <path\n      d=\"M7,13,1,7,7,1\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n    />\n  </svg>\n)\n\nconst RightChevron = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n    <path\n      d=\"M3,1,9,7,3,13\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n    />\n  </svg>\n)\n\ntype Props = {\n  id?: string\n  images?: ImagesData\n  width?: string\n  margin?: string\n  pageSize?: ResponsiveNumberValue\n  step?: ResponsiveNumberValue\n  slideAlignment?: ResponsiveIconRadioGroupValue<'flex-start' | 'center' | 'flex-end'>\n  gap?: ResponsiveGapData\n  autoplay?: boolean\n  delay?: number\n  showArrows?: boolean\n  arrowPosition?: ResponsiveIconRadioGroupValue<'inside' | 'center' | 'outside'>\n  arrowColor?: ResponsiveColor | null\n  arrowBackground?: ResponsiveColor | null\n  showDots?: boolean\n  dotColor?: ResponsiveColor | null\n  slideBorder?: string\n  slideBorderRadius?: string\n}\n\nconst SWIPE_THRESHOLD = 20\nconst swipePower = (dx: number, velocity: number) => dx * (1 + velocity)\n\n// constructs a CSS [class selector](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors),\n// returns a compound class selector if the `classname` string includes multiple class names\nconst classSelector = (classname: string) => `.${classname.split(' ').join('.')}`\n\nconst Carousel = forwardRef(function Carousel(\n  {\n    images = [],\n    width,\n    margin,\n    pageSize: responsivePageSize,\n    step: responsiveStep,\n    gap,\n    slideAlignment,\n    showDots,\n    showArrows,\n    arrowPosition,\n    arrowColor,\n    arrowBackground,\n    dotColor,\n    autoplay = false,\n    delay = 5,\n    slideBorder,\n    slideBorderRadius,\n  }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  const breakpoints = useBreakpoints()\n  const [index, setIndex] = useState(0)\n  const swipe = useRef(0)\n  const startIndex = wrap(0, images.length, index)\n  const pageSize = useMediaQuery(responsivePageSize) || 1\n  const step = useMediaQuery(responsiveStep) || 1\n  const endIndex = startIndex + pageSize\n  const pageCount = Math.ceil((images.length - pageSize) / step + 1)\n  const pageIndex = Math.ceil(startIndex / step)\n  const isFirstPage = pageIndex === 0\n  const isLastPage = pageIndex === pageCount - 1\n  const paginate = useCallback(\n    (pageDistance: number) => {\n      if (pageDistance === 0) return\n\n      const direction = pageDistance / Math.abs(pageDistance)\n      const remaining = direction > 0 ? images.slice(endIndex) : images.slice(0, startIndex)\n      const distance = direction * Math.min(remaining.length, step * Math.abs(pageDistance))\n\n      setIndex(index + distance)\n    },\n    [images, index, startIndex, endIndex, step],\n  )\n  // @ts-expect-error: `useAnimation` types expect no arguments.\n  const animation = useAnimation({ x: 0, transition: { type: 'spring', stiffness: 100 } })\n  const bindPage = useGesture(\n    {\n      onDrag: ({ movement: [mx], delta: [dx], velocity: [vx] }) => {\n        animation.start({ x: mx })\n        swipe.current = swipePower(dx, vx)\n      },\n      onDragEnd: () => {\n        animation.start({ x: 0 })\n\n        if (swipe.current > SWIPE_THRESHOLD) paginate(1)\n        else if (swipe.current < -SWIPE_THRESHOLD) paginate(-1)\n      },\n    },\n    {\n      drag: {\n        axis: 'x',\n        bounds: { left: 0, right: 0 },\n        rubberband: true,\n      },\n    },\n  )\n\n  useEffect(() => {\n    if (!autoplay || pageSize !== 0) setIndex(0)\n  }, [autoplay, pageSize])\n\n  useEffect(() => {\n    if (!autoplay) return () => {}\n\n    const intervalId = setInterval(() => (isLastPage ? setIndex(0) : paginate(1)), delay * 1000)\n\n    return () => clearInterval(intervalId)\n  }, [autoplay, delay, paginate, isLastPage])\n\n  const clipMaskClassName = useStyle({ overflow: 'hidden' })\n  const pageClassName = useStyle({ position: 'relative', width: '100%' })\n  const slideClassName = cx(\n    useStyle({ display: 'flex' }),\n    useStyle(\n      useResponsiveStyle([responsivePageSize] as const, ([pageSize = 1]) => ({\n        flexBasis: `${100 / pageSize}%`,\n        maxWidth: `${100 / pageSize}%`,\n        minWidth: `${100 / pageSize}%`,\n      })),\n    ),\n    useStyle(\n      useResponsiveStyle([slideAlignment] as const, ([alignItems = 'center']) => ({ alignItems })),\n    ),\n  )\n\n  const reelClassName = cx(\n    useStyle({ display: 'flex', position: 'relative', flexWrap: 'nowrap' }),\n    useStyle(\n      useResponsiveStyle([gap] as const, ([gap = { value: 0, unit: 'px' }]) => ({\n        margin: `0 ${`${-gap.value / 2}${gap.unit}`}`,\n        [`& > ${classSelector(slideClassName)}`]: {\n          padding: `0 ${`${gap.value / 2}${gap.unit}`}`,\n        },\n      })),\n    ),\n  )\n\n  const arrowClassName = cx(\n    useStyle({\n      padding: 10,\n      borderRadius: '50%',\n      outline: 0,\n      border: 0,\n      width: 40,\n      height: 40,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      cursor: 'pointer',\n      userSelect: 'none',\n    }),\n    useStyle(\n      useResponsiveStyle(\n        [arrowBackground] as const,\n        ([background = { swatch: { hue: 0, saturation: 0, lightness: 100 }, alpha: 1 }]) => ({\n          background: colorToString(background),\n        }),\n      ),\n    ),\n    useStyle({ svg: { transition: 'transform 0.15s', stroke: 'currentcolor' } }),\n  )\n\n  const slopClassName = cx(\n    useStyle({\n      position: 'absolute',\n      top: 0,\n      bottom: 0,\n\n      display: 'flex',\n      '&[hidden]': {\n        display: 'none',\n      },\n\n      alignItems: 'center',\n      cursor: 'pointer',\n      zIndex: 2,\n    }),\n    useStyle(\n      useResponsiveStyle(\n        [arrowColor] as const,\n        ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n          color: colorToString(color),\n        }),\n      ),\n    ),\n  )\n\n  const leftSlopClassName = cx(\n    slopClassName,\n    useStyle(\n      useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n        switch (position) {\n          case 'inside':\n            return { transform: 'translateX(8px)' }\n\n          case 'outside':\n            return { transform: 'translateX(calc(-100% - 8px))' }\n\n          default:\n            return { transform: 'translateX(calc(-50%))' }\n        }\n      }),\n    ),\n    useStyle({\n      left: 0,\n\n      [`&:hover > ${classSelector(arrowClassName)}`]: {\n        '& > svg': {\n          transform: 'translateX(-2px)',\n        },\n      },\n    }),\n  )\n\n  const rightSlopClassName = cx(\n    slopClassName,\n    useStyle(\n      useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n        switch (position) {\n          case 'inside':\n            return { transform: 'translateX(-8px)' }\n\n          case 'outside':\n            return { transform: 'translateX(calc(100% + 8px))' }\n\n          default:\n            return { transform: 'translateX(calc(50%))' }\n        }\n      }),\n    ),\n    useStyle({\n      right: 0,\n      [`&:hover > ${classSelector(arrowClassName)}`]: {\n        '& > svg': {\n          transform: 'translateX(2px)',\n        },\n      },\n    }),\n  )\n\n  const dotsClassName = cx(\n    useStyle({ display: showDots ? 'flex' : 'none', justifyContent: 'center', marginTop: 20 }),\n    useStyle(\n      useResponsiveStyle(\n        [dotColor] as const,\n        ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n          color: colorToString(color),\n        }),\n      ),\n    ),\n  )\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\n        useStyle({ position: 'relative', display: 'flex', flexDirection: 'column' }),\n        width,\n        margin,\n        useStyle({ '&:focus': { outline: 0 } }),\n      )}\n      tabIndex={-1}\n      onKeyDown={e => {\n        switch (e.key) {\n          case 'ArrowRight':\n            paginate(1)\n            break\n          case 'ArrowLeft':\n            paginate(-1)\n            break\n          default:\n        }\n      }}\n    >\n      {/* NOTE: We set height to 100% here to fix an issue on IE11 where the child height of a flex column extends too far */}\n      <div className={useStyle({ position: 'relative', height: '100%' })}>\n        <div className={clipMaskClassName}>\n          {/* https://github.com/framer/motion/issues/1723 */}\n          {/* @ts-expect-error: React HTMLElement typings conflict with motion components */}\n          <motion.div {...bindPage()} className={pageClassName} animate={animation}>\n            <motion.div\n              className={reelClassName}\n              animate={{ x: `${-(100 / pageSize) * startIndex}%` }}\n              transition={{\n                x: {\n                  type: 'tween',\n                  ease: [0.165, 0.84, 0.44, 1],\n                  duration: 0.5,\n                },\n              }}\n            >\n              {images.map(({ props: imageProps, key }) => (\n                <motion.div\n                  id={key}\n                  key={key}\n                  className={slideClassName}\n                  onMouseDown={e => e.preventDefault()}\n                  onClick={e => {\n                    if (swipe.current !== 0) e.preventDefault()\n                  }}\n                >\n                  <Image\n                    width={[\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: { value: 100, unit: '%' },\n                      },\n                    ]}\n                    file={imageProps.file}\n                    altText={imageProps.altText}\n                    link={imageProps.link}\n                    border={slideBorder}\n                    borderRadius={slideBorderRadius}\n                  />\n                </motion.div>\n              ))}\n            </motion.div>\n          </motion.div>\n        </div>\n        <div\n          onClick={() => paginate(-1)}\n          className={leftSlopClassName}\n          hidden={!showArrows || isFirstPage}\n        >\n          <div className={arrowClassName}>\n            <LeftChevron />\n          </div>\n        </div>\n        <div\n          onClick={() => paginate(1)}\n          className={rightSlopClassName}\n          hidden={!showArrows || isLastPage}\n        >\n          <div className={arrowClassName}>\n            <RightChevron />\n          </div>\n        </div>\n      </div>\n      <div className={dotsClassName}>\n        {Array.from({ length: pageCount }).map((_, i) => (\n          <Dot key={i} active={i === pageIndex} onClick={() => paginate(i - pageIndex)} />\n        ))}\n      </div>\n    </div>\n  )\n})\n\nexport default Carousel\n\ntype DotBaseProps = {\n  className?: string\n  active: boolean\n}\n\ntype DotProps = DotBaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof DotBaseProps>\n\nfunction Dot({ className, active, ...restOfProps }: DotProps) {\n  return (\n    <div\n      {...restOfProps}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          margin: '0 6px',\n          borderRadius: '50%',\n          cursor: 'pointer',\n          width: 16,\n          height: 16,\n\n          '&::before, &::after': {\n            content: '\"\"',\n            position: 'absolute',\n            top: '50%',\n            left: '50%',\n            display: 'block',\n            borderRadius: '50%',\n            transition: 'all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275)',\n          },\n\n          '&::before': {\n            boxShadow: '0 0 0 2px currentColor',\n            transform: 'translate3d(-50%, -50%, 0)',\n            width: active ? 16 : 10,\n            height: active ? 16 : 10,\n          },\n\n          '&::after': {\n            background: 'currentColor',\n            transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n            width: 10,\n            height: 10,\n          },\n\n          '&:hover::after': {\n            transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n          },\n        }),\n        className,\n      )}\n    />\n  )\n}\n"],"mappings":"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","names":["Carousel","pageSize","gap"]}

package/dist/esm/components/builtin/Carousel/register.js

@@ -1,5 +1,5 @@
 import { v4 as uuid } from "uuid";
-import { findBreakpointOverride } from "../../../state/modules/breakpoints";
+import { findBreakpointOverride } from "@makeswift/controls";
 import {
   BorderRadius,
   ElementID,