@makeswift/runtime 0.23.5 → 0.24.0-canary.0

package/dist/cjs/next/root-style-registry.js

@@ -39,27 +39,26 @@ var import_css = require("@emotion/css");
 var import_navigation = require("next/navigation");
 var import_react = require("react");
 const CacheContext = (0, import_react.createContext)(import_css.cache);
-const createRootStyleCache = () => {
-  const cache2 = (0, import_cache.default)({ key: "css" });
-  cache2.compat = true;
-  const prevInsert = cache2.insert;
-  let inserted = [];
-  cache2.insert = (...args) => {
-    const serialized = args[1];
-    if (cache2.inserted[serialized.name] === void 0) {
-      inserted.push(serialized.name);
-    }
-    return prevInsert(...args);
-  };
-  const flush = () => {
-    const prevInserted = inserted;
-    inserted = [];
-    return prevInserted;
-  };
-  return { cache: cache2, flush };
-};
 function RootStyleRegistry({ children }) {
-  const [{ cache: cache2, flush }] = (0, import_react.useState)(() => createRootStyleCache());
+  const [{ cache: cache2, flush }] = (0, import_react.useState)(() => {
+    const cache3 = (0, import_cache.default)({ key: "css" });
+    cache3.compat = true;
+    const prevInsert = cache3.insert;
+    let inserted = [];
+    cache3.insert = (...args) => {
+      const serialized = args[1];
+      if (cache3.inserted[serialized.name] === void 0) {
+        inserted.push(serialized.name);
+      }
+      return prevInsert(...args);
+    };
+    const flush2 = () => {
+      const prevInserted = inserted;
+      inserted = [];
+      return prevInserted;
+    };
+    return { cache: cache3, flush: flush2 };
+  });
   (0, import_navigation.useServerInsertedHTML)(() => {
     const names = flush();
     if (names.length === 0)

package/dist/cjs/next/root-style-registry.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nconst createRootStyleCache = () => {\n  const cache = createCache({ key: 'css' })\n  cache.compat = true\n\n  const prevInsert = cache.insert\n  let inserted: string[] = []\n\n  cache.insert = (...args) => {\n    const serialized = args[1]\n    if (cache.inserted[serialized.name] === undefined) {\n      inserted.push(serialized.name)\n    }\n    return prevInsert(...args)\n  }\n\n  const flush = () => {\n    const prevInserted = inserted\n    inserted = []\n    return prevInserted\n  }\n\n  return { cache, flush }\n}\n\nexport function RootStyleRegistry({ children }: { children: ReactNode }) {\n  const [{ cache, flush }] = useState(() => createRootStyleCache())\n\n  useServerInsertedHTML(() => {\n    const names = flush()\n    if (names.length === 0) return null\n    let styles = ''\n    for (const name of names) {\n      styles += cache.inserted[name]\n    }\n\n    return (\n      <style\n        data-emotion={`${cache.key} ${names.join(' ')}`}\n        dangerouslySetInnerHTML={{\n          __html: styles,\n        }}\n      />\n    )\n  })\n\n  return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>\n}\n\nexport function useCache(): EmotionCache {\n  return useContext(CacheContext)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6CM;AA3CN,mBAA0C;AAC1C,iBAAsB;AACtB,wBAAsC;AACtC,mBAA+D;AAE/D,MAAM,mBAAe,4BAAc,gBAAK;AAExC,MAAM,uBAAuB,MAAM;AACjC,QAAMA,aAAQ,aAAAC,SAAY,EAAE,KAAK,MAAM,CAAC;AACxC,EAAAD,OAAM,SAAS;AAEf,QAAM,aAAaA,OAAM;AACzB,MAAI,WAAqB,CAAC;AAE1B,EAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,UAAM,aAAa,KAAK,CAAC;AACzB,QAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,eAAS,KAAK,WAAW,IAAI;AAAA,IAC/B;AACA,WAAO,WAAW,GAAG,IAAI;AAAA,EAC3B;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,eAAe;AACrB,eAAW,CAAC;AACZ,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAAA,QAAO,MAAM;AACxB;AAEO,SAAS,kBAAkB,EAAE,SAAS,GAA4B;AACvE,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,QAAI,uBAAS,MAAM,qBAAqB,CAAC;AAEhE,+CAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUA,OAAM,SAAS,IAAI;AAAA,IAC/B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,4CAAC,aAAa,UAAb,EAAsB,OAAOA,QAAQ,UAAS;AACxD;AAEO,SAAS,WAAyB;AACvC,aAAO,yBAAW,YAAY;AAChC;","names":["cache","createCache"]}
+{"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nexport function RootStyleRegistry({ children }: { children: ReactNode }) {\n  const [{ cache, flush }] = useState(() => {\n    const cache = createCache({ key: 'css' })\n    cache.compat = true\n    const prevInsert = cache.insert\n    let inserted: string[] = []\n    cache.insert = (...args) => {\n      const serialized = args[1]\n      if (cache.inserted[serialized.name] === undefined) {\n        inserted.push(serialized.name)\n      }\n      return prevInsert(...args)\n    }\n    const flush = () => {\n      const prevInserted = inserted\n      inserted = []\n      return prevInserted\n    }\n    return { cache, flush }\n  })\n\n  useServerInsertedHTML(() => {\n    const names = flush()\n    if (names.length === 0) return null\n    let styles = ''\n    for (const name of names) {\n      styles += cache.inserted[name]\n    }\n    return (\n      <style\n        data-emotion={`${cache.key} ${names.join(' ')}`}\n        dangerouslySetInnerHTML={{\n          __html: styles,\n        }}\n      />\n    )\n  })\n\n  return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>\n}\n\nexport function useCache(): EmotionCache {\n  return useContext(CacheContext)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsCM;AApCN,mBAA0C;AAC1C,iBAAsB;AACtB,wBAAsC;AACtC,mBAA+D;AAE/D,MAAM,mBAAe,4BAAc,gBAAK;AAEjC,SAAS,kBAAkB,EAAE,SAAS,GAA4B;AACvE,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,QAAI,uBAAS,MAAM;AACxC,UAAMA,aAAQ,aAAAC,SAAY,EAAE,KAAK,MAAM,CAAC;AACxC,IAAAD,OAAM,SAAS;AACf,UAAM,aAAaA,OAAM;AACzB,QAAI,WAAqB,CAAC;AAC1B,IAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,YAAM,aAAa,KAAK,CAAC;AACzB,UAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,iBAAS,KAAK,WAAW,IAAI;AAAA,MAC/B;AACA,aAAO,WAAW,GAAG,IAAI;AAAA,IAC3B;AACA,UAAME,SAAQ,MAAM;AAClB,YAAM,eAAe;AACrB,iBAAW,CAAC;AACZ,aAAO;AAAA,IACT;AACA,WAAO,EAAE,OAAAF,QAAO,OAAAE,OAAM;AAAA,EACxB,CAAC;AAED,+CAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUF,OAAM,SAAS,IAAI;AAAA,IAC/B;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,4CAAC,aAAa,UAAb,EAAsB,OAAOA,QAAQ,UAAS;AACxD;AAEO,SAAS,WAAyB;AACvC,aAAO,yBAAW,YAAY;AAChC;","names":["cache","createCache","flush"]}

package/dist/cjs/runtimes/react/components/ElementData.js

@@ -32,7 +32,6 @@ const ElementData = (0, import_react2.memo)(
   (0, import_react2.forwardRef)(function ElementData2({ elementData }, ref) {
     const Component = (0, import_use_component.useComponent)(elementData.type);
     if (Component == null) {
-      console.warn(`Unknown component '${elementData.type}'`, { elementData });
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_FallbackComponent.FallbackComponent, { ref, text: "Component not found" });
     }
     const forwardRef2 = (0, import_can_accept_ref.canAcceptRef)(Component);

package/dist/cjs/runtimes/react/components/ElementData.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/components/ElementData.tsx"],"sourcesContent":["import { Ref, Suspense, forwardRef, memo } from 'react'\nimport { ElementData as ReactPageElementData } from '../../../state/react-page'\nimport { useComponent } from '../hooks/use-component'\nimport { canAcceptRef } from '../utils/can-accept-ref'\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ResolveProps } from '../controls'\n\ntype ElementDataProps = {\n  elementData: ReactPageElementData\n}\n\nexport const ElementData = memo(\n  forwardRef(function ElementData(\n    { elementData }: ElementDataProps,\n    ref: Ref<unknown>,\n  ): JSX.Element {\n    const Component = useComponent(elementData.type)\n\n    if (Component == null) {\n      console.warn(`Unknown component '${elementData.type}'`, { elementData })\n      return <FallbackComponent ref={ref as Ref<HTMLDivElement>} text=\"Component not found\" />\n    }\n\n    const forwardRef = canAcceptRef(Component)\n\n    return (\n      <Suspense>\n        <ResolveProps element={elementData}>\n          {props =>\n            forwardRef ? (\n              <Component {...props} key={elementData.key} ref={ref} />\n            ) : (\n              <Component {...props} key={elementData.key} />\n            )\n          }\n        </ResolveProps>\n      </Suspense>\n    )\n  }),\n)\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBa;AAUC;AA9Bd,IAAAA,gBAAgD;AAEhD,2BAA6B;AAC7B,4BAA6B;AAC7B,+BAAkC;AAClC,sBAA6B;AAMtB,MAAM,kBAAc;AAAA,MACzB,0BAAW,SAASC,aAClB,EAAE,YAAY,GACd,KACa;AACb,UAAM,gBAAY,mCAAa,YAAY,IAAI;AAE/C,QAAI,aAAa,MAAM;AACrB,cAAQ,KAAK,sBAAsB,YAAY,IAAI,KAAK,EAAE,YAAY,CAAC;AACvE,aAAO,4CAAC,8CAAkB,KAAiC,MAAK,uBAAsB;AAAA,IACxF;AAEA,UAAMC,kBAAa,oCAAa,SAAS;AAEzC,WACE,4CAAC,0BACC,sDAAC,gCAAa,SAAS,aACpB,qBACCA,cACE,gDAAC,aAAW,GAAG,OAAO,KAAK,YAAY,KAAK,KAAU,IAEtD,gDAAC,aAAW,GAAG,OAAO,KAAK,YAAY,KAAK,GAGlD,GACF;AAAA,EAEJ,CAAC;AACH;","names":["import_react","ElementData","forwardRef"]}
+{"version":3,"sources":["../../../../../src/runtimes/react/components/ElementData.tsx"],"sourcesContent":["import { Ref, Suspense, forwardRef, memo } from 'react'\nimport { ElementData as ReactPageElementData } from '../../../state/react-page'\nimport { useComponent } from '../hooks/use-component'\nimport { canAcceptRef } from '../utils/can-accept-ref'\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ResolveProps } from '../controls'\n\ntype ElementDataProps = {\n  elementData: ReactPageElementData\n}\n\nexport const ElementData = memo(\n  forwardRef(function ElementData(\n    { elementData }: ElementDataProps,\n    ref: Ref<unknown>,\n  ): JSX.Element {\n    const Component = useComponent(elementData.type)\n\n    if (Component == null) {\n      return <FallbackComponent ref={ref as Ref<HTMLDivElement>} text=\"Component not found\" />\n    }\n\n    const forwardRef = canAcceptRef(Component)\n\n    return (\n      <Suspense>\n        <ResolveProps element={elementData}>\n          {props =>\n            forwardRef ? (\n              <Component {...props} key={elementData.key} ref={ref} />\n            ) : (\n              <Component {...props} key={elementData.key} />\n            )\n          }\n        </ResolveProps>\n      </Suspense>\n    )\n  }),\n)\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBa;AAUC;AA7Bd,IAAAA,gBAAgD;AAEhD,2BAA6B;AAC7B,4BAA6B;AAC7B,+BAAkC;AAClC,sBAA6B;AAMtB,MAAM,kBAAc;AAAA,MACzB,0BAAW,SAASC,aAClB,EAAE,YAAY,GACd,KACa;AACb,UAAM,gBAAY,mCAAa,YAAY,IAAI;AAE/C,QAAI,aAAa,MAAM;AACrB,aAAO,4CAAC,8CAAkB,KAAiC,MAAK,uBAAsB;AAAA,IACxF;AAEA,UAAMC,kBAAa,oCAAa,SAAS;AAEzC,WACE,4CAAC,0BACC,sDAAC,gCAAa,SAAS,aACpB,qBACCA,cACE,gDAAC,aAAW,GAAG,OAAO,KAAK,YAAY,KAAK,KAAU,IAEtD,gDAAC,aAAW,GAAG,OAAO,KAAK,YAAY,KAAK,GAGlD,GACF;AAAA,EAEJ,CAAC;AACH;","names":["import_react","ElementData","forwardRef"]}

package/dist/cjs/runtimes/react/hooks/use-cache-data.js

@@ -21,12 +21,12 @@ __export(use_cache_data_exports, {
   useCacheData: () => useCacheData
 });
 module.exports = __toCommonJS(use_cache_data_exports);
-var import_react = require("react");
 var import_actions = require("../../../state/actions");
 var import_host_api_client = require("../host-api-client");
+var import_use_universal_dispatch = require("./use-universal-dispatch");
 function useCacheData(cacheData) {
   const { makeswiftApiClient: apiStore } = (0, import_host_api_client.useMakeswiftHostApiClient)();
-  (0, import_react.useMemo)(() => apiStore.dispatch((0, import_actions.updateAPIClientCache)(cacheData)), [cacheData]);
+  (0, import_use_universal_dispatch.useUniversalDispatch)(apiStore.dispatch, import_actions.updateAPIClientCache, [cacheData]);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/runtimes/react/hooks/use-cache-data.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-cache-data.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { type CacheData } from '../../../api/react'\nimport { updateAPIClientCache } from '../../../state/actions'\n\nimport { useMakeswiftHostApiClient } from '../host-api-client'\n\nexport function useCacheData(cacheData: CacheData) {\n  const { makeswiftApiClient: apiStore } = useMakeswiftHostApiClient()\n\n  // We perform cache hydration immediately on render - this is safe to do per\n  // render because updating the API cache is idempotent. For precedence, see:\n  //\n  // https://github.com/TanStack/query/blob/8f9f183f11df3709a1a38c4efce1452788041f88/packages/react-query/src/HydrationBoundary.tsx#L41\n  useMemo(() => apiStore.dispatch(updateAPIClientCache(cacheData)), [cacheData])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAExB,qBAAqC;AAErC,6BAA0C;AAEnC,SAAS,aAAa,WAAsB;AACjD,QAAM,EAAE,oBAAoB,SAAS,QAAI,kDAA0B;AAMnE,4BAAQ,MAAM,SAAS,aAAS,qCAAqB,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC;AAC/E;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-cache-data.ts"],"sourcesContent":["import { type CacheData } from '../../../api/react'\nimport { updateAPIClientCache } from '../../../state/actions'\n\nimport { useMakeswiftHostApiClient } from '../host-api-client'\nimport { useUniversalDispatch } from './use-universal-dispatch'\n\nexport function useCacheData(cacheData: CacheData) {\n  const { makeswiftApiClient: apiStore } = useMakeswiftHostApiClient()\n  useUniversalDispatch(apiStore.dispatch, updateAPIClientCache, [cacheData])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAqC;AAErC,6BAA0C;AAC1C,oCAAqC;AAE9B,SAAS,aAAa,WAAsB;AACjD,QAAM,EAAE,oBAAoB,SAAS,QAAI,kDAA0B;AACnE,0DAAqB,SAAS,UAAU,qCAAsB,CAAC,SAAS,CAAC;AAC3E;","names":[]}

package/dist/cjs/runtimes/react/hooks/use-resolved-props.js

@@ -84,12 +84,11 @@ function useResolvedProps(propDefs, elementData, elementKey) {
     [propDefs, resolveProp]
   );
   const props = (0, import_react.useMemo)(() => (0, import_resolvable_record.resolvableRecord)(resolvables), [resolvables]);
+  stylesheetFactory.useDefinedStyles();
   (0, import_react.useEffect)(() => {
     props.triggerResolve();
   }, []);
-  const resolvedProps = (0, import_react.useSyncExternalStore)(props.subscribe, props.readStable, props.readStable);
-  stylesheetFactory.useDefinedStyles();
-  return resolvedProps;
+  return (0, import_react.useSyncExternalStore)(props.subscribe, props.readStable, props.readStable);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/runtimes/react/hooks/use-resolved-props.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-resolved-props.ts"],"sourcesContent":["import { useMemo, useEffect, useRef, useSyncExternalStore, useCallback } from 'react'\nimport {\n  ControlDefinition,\n  ControlInstance,\n  mapValues,\n  type Data,\n  type Resolvable,\n} from '@makeswift/controls'\n\nimport * as ReactPage from '../../../state/react-page'\nimport { useResourceResolver } from './use-resource-resolver'\nimport { useDocumentKey } from './use-document-context'\nimport { useSelector } from './use-selector'\n\nimport { useStylesheetFactory } from './use-stylesheet-factory'\n\nimport { resolvableRecord } from '../resolvable-record'\nimport { propErrorHandlingProxy } from '../utils/prop-error-handling-proxy'\n\nfunction useControlInstances(elementKey: string): Record<string, ControlInstance> | null {\n  const documentKey = useDocumentKey()\n\n  return useSelector(state => {\n    if (documentKey == null) return null\n\n    return ReactPage.getPropControllers(state, documentKey, elementKey)\n  })\n}\n\ntype CacheItem = {\n  data: Data\n  control: ControlInstance | undefined\n  resolvedValue: Resolvable<unknown>\n}\n\nexport function useResolvedProps(\n  propDefs: Record<string, ControlDefinition>,\n  elementData: Record<string, Data>,\n  elementKey: string,\n): Record<string, unknown> {\n  const stylesheetFactory = useStylesheetFactory()\n  const resourceResolver = useResourceResolver()\n  const controls = useControlInstances(elementKey)\n\n  const cache = useRef<Record<string, CacheItem>>({}).current\n  const resolveProp = useCallback(\n    (def: ControlDefinition, propName: string) => {\n      const data = elementData[propName]\n      const control = controls?.[propName]\n\n      if (\n        cache[propName] != null &&\n        data === cache[propName].data &&\n        control === cache[propName].control\n      ) {\n        return cache[propName].resolvedValue\n      }\n\n      const resolvedValue = def.resolveValue(\n        data,\n        resourceResolver,\n        stylesheetFactory.get(propName),\n        control,\n      )\n\n      cache[propName] = { data, control, resolvedValue }\n      return resolvedValue\n    },\n    [controls, elementData, resourceResolver, stylesheetFactory],\n  )\n\n  const resolvables = useMemo(\n    () =>\n      mapValues(propDefs, (def, propName) => {\n        const defaultValue = (def.config as any)?.defaultValue\n        return propErrorHandlingProxy(resolveProp(def, propName), defaultValue, error => {\n          console.warn(\n            `Error reading value for prop \"${propName}\", falling back to \\`${defaultValue}\\`.`,\n            { control: def, error },\n          )\n        })\n      }),\n    [propDefs, resolveProp],\n  )\n\n  const props = useMemo(() => resolvableRecord(resolvables), [resolvables])\n\n  // no need to call `triggerResolve` on the server, all the resources should already be in\n  // the host API client's cache (populated from the snapshot's cache)\n  useEffect(() => {\n    props.triggerResolve()\n  }, [])\n\n  // the order is important here, the styles are defined in the process of the props resolution,\n  // calling `useDefinedStyles` before the props are resolved would effectively be a noop\n  const resolvedProps = useSyncExternalStore(props.subscribe, props.readStable, props.readStable)\n\n  stylesheetFactory.useDefinedStyles()\n\n  return resolvedProps\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA8E;AAC9E,sBAMO;AAEP,gBAA2B;AAC3B,mCAAoC;AACpC,kCAA+B;AAC/B,0BAA4B;AAE5B,oCAAqC;AAErC,+BAAiC;AACjC,uCAAuC;AAEvC,SAAS,oBAAoB,YAA4D;AACvF,QAAM,kBAAc,4CAAe;AAEnC,aAAO,iCAAY,WAAS;AAC1B,QAAI,eAAe;AAAM,aAAO;AAEhC,WAAO,UAAU,mBAAmB,OAAO,aAAa,UAAU;AAAA,EACpE,CAAC;AACH;AAQO,SAAS,iBACd,UACA,aACA,YACyB;AACzB,QAAM,wBAAoB,oDAAqB;AAC/C,QAAM,uBAAmB,kDAAoB;AAC7C,QAAM,WAAW,oBAAoB,UAAU;AAE/C,QAAM,YAAQ,qBAAkC,CAAC,CAAC,EAAE;AACpD,QAAM,kBAAc;AAAA,IAClB,CAAC,KAAwB,aAAqB;AAC5C,YAAM,OAAO,YAAY,QAAQ;AACjC,YAAM,UAAU,WAAW,QAAQ;AAEnC,UACE,MAAM,QAAQ,KAAK,QACnB,SAAS,MAAM,QAAQ,EAAE,QACzB,YAAY,MAAM,QAAQ,EAAE,SAC5B;AACA,eAAO,MAAM,QAAQ,EAAE;AAAA,MACzB;AAEA,YAAM,gBAAgB,IAAI;AAAA,QACxB;AAAA,QACA;AAAA,QACA,kBAAkB,IAAI,QAAQ;AAAA,QAC9B;AAAA,MACF;AAEA,YAAM,QAAQ,IAAI,EAAE,MAAM,SAAS,cAAc;AACjD,aAAO;AAAA,IACT;AAAA,IACA,CAAC,UAAU,aAAa,kBAAkB,iBAAiB;AAAA,EAC7D;AAEA,QAAM,kBAAc;AAAA,IAClB,UACE,2BAAU,UAAU,CAAC,KAAK,aAAa;AACrC,YAAM,eAAgB,IAAI,QAAgB;AAC1C,iBAAO,yDAAuB,YAAY,KAAK,QAAQ,GAAG,cAAc,WAAS;AAC/E,gBAAQ;AAAA,UACN,iCAAiC,QAAQ,wBAAwB,YAAY;AAAA,UAC7E,EAAE,SAAS,KAAK,MAAM;AAAA,QACxB;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,UAAU,WAAW;AAAA,EACxB;AAEA,QAAM,YAAQ,sBAAQ,UAAM,2CAAiB,WAAW,GAAG,CAAC,WAAW,CAAC;AAIxE,8BAAU,MAAM;AACd,UAAM,eAAe;AAAA,EACvB,GAAG,CAAC,CAAC;AAIL,QAAM,oBAAgB,mCAAqB,MAAM,WAAW,MAAM,YAAY,MAAM,UAAU;AAE9F,oBAAkB,iBAAiB;AAEnC,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-resolved-props.ts"],"sourcesContent":["import { useMemo, useEffect, useRef, useSyncExternalStore, useCallback } from 'react'\nimport {\n  ControlDefinition,\n  ControlInstance,\n  mapValues,\n  type Data,\n  type Resolvable,\n} from '@makeswift/controls'\n\nimport * as ReactPage from '../../../state/react-page'\nimport { useResourceResolver } from './use-resource-resolver'\nimport { useDocumentKey } from './use-document-context'\nimport { useSelector } from './use-selector'\n\nimport { useStylesheetFactory } from './use-stylesheet-factory'\n\nimport { resolvableRecord } from '../resolvable-record'\nimport { propErrorHandlingProxy } from '../utils/prop-error-handling-proxy'\n\nfunction useControlInstances(elementKey: string): Record<string, ControlInstance> | null {\n  const documentKey = useDocumentKey()\n\n  return useSelector(state => {\n    if (documentKey == null) return null\n\n    return ReactPage.getPropControllers(state, documentKey, elementKey)\n  })\n}\n\ntype CacheItem = {\n  data: Data\n  control: ControlInstance | undefined\n  resolvedValue: Resolvable<unknown>\n}\n\nexport function useResolvedProps(\n  propDefs: Record<string, ControlDefinition>,\n  elementData: Record<string, Data>,\n  elementKey: string,\n): Record<string, unknown> {\n  const stylesheetFactory = useStylesheetFactory()\n  const resourceResolver = useResourceResolver()\n  const controls = useControlInstances(elementKey)\n\n  const cache = useRef<Record<string, CacheItem>>({}).current\n  const resolveProp = useCallback(\n    (def: ControlDefinition, propName: string) => {\n      const data = elementData[propName]\n      const control = controls?.[propName]\n\n      if (\n        cache[propName] != null &&\n        data === cache[propName].data &&\n        control === cache[propName].control\n      ) {\n        return cache[propName].resolvedValue\n      }\n\n      const resolvedValue = def.resolveValue(\n        data,\n        resourceResolver,\n        stylesheetFactory.get(propName),\n        control,\n      )\n\n      cache[propName] = { data, control, resolvedValue }\n      return resolvedValue\n    },\n    [controls, elementData, resourceResolver, stylesheetFactory],\n  )\n\n  const resolvables = useMemo(\n    () =>\n      mapValues(propDefs, (def, propName) => {\n        const defaultValue = (def.config as any)?.defaultValue\n        return propErrorHandlingProxy(resolveProp(def, propName), defaultValue, error => {\n          console.warn(\n            `Error reading value for prop \"${propName}\", falling back to \\`${defaultValue}\\`.`,\n            { control: def, error },\n          )\n        })\n      }),\n    [propDefs, resolveProp],\n  )\n\n  const props = useMemo(() => resolvableRecord(resolvables), [resolvables])\n\n  stylesheetFactory.useDefinedStyles()\n\n  useEffect(() => {\n    props.triggerResolve()\n  }, [])\n\n  return useSyncExternalStore(props.subscribe, props.readStable, props.readStable)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA8E;AAC9E,sBAMO;AAEP,gBAA2B;AAC3B,mCAAoC;AACpC,kCAA+B;AAC/B,0BAA4B;AAE5B,oCAAqC;AAErC,+BAAiC;AACjC,uCAAuC;AAEvC,SAAS,oBAAoB,YAA4D;AACvF,QAAM,kBAAc,4CAAe;AAEnC,aAAO,iCAAY,WAAS;AAC1B,QAAI,eAAe;AAAM,aAAO;AAEhC,WAAO,UAAU,mBAAmB,OAAO,aAAa,UAAU;AAAA,EACpE,CAAC;AACH;AAQO,SAAS,iBACd,UACA,aACA,YACyB;AACzB,QAAM,wBAAoB,oDAAqB;AAC/C,QAAM,uBAAmB,kDAAoB;AAC7C,QAAM,WAAW,oBAAoB,UAAU;AAE/C,QAAM,YAAQ,qBAAkC,CAAC,CAAC,EAAE;AACpD,QAAM,kBAAc;AAAA,IAClB,CAAC,KAAwB,aAAqB;AAC5C,YAAM,OAAO,YAAY,QAAQ;AACjC,YAAM,UAAU,WAAW,QAAQ;AAEnC,UACE,MAAM,QAAQ,KAAK,QACnB,SAAS,MAAM,QAAQ,EAAE,QACzB,YAAY,MAAM,QAAQ,EAAE,SAC5B;AACA,eAAO,MAAM,QAAQ,EAAE;AAAA,MACzB;AAEA,YAAM,gBAAgB,IAAI;AAAA,QACxB;AAAA,QACA;AAAA,QACA,kBAAkB,IAAI,QAAQ;AAAA,QAC9B;AAAA,MACF;AAEA,YAAM,QAAQ,IAAI,EAAE,MAAM,SAAS,cAAc;AACjD,aAAO;AAAA,IACT;AAAA,IACA,CAAC,UAAU,aAAa,kBAAkB,iBAAiB;AAAA,EAC7D;AAEA,QAAM,kBAAc;AAAA,IAClB,UACE,2BAAU,UAAU,CAAC,KAAK,aAAa;AACrC,YAAM,eAAgB,IAAI,QAAgB;AAC1C,iBAAO,yDAAuB,YAAY,KAAK,QAAQ,GAAG,cAAc,WAAS;AAC/E,gBAAQ;AAAA,UACN,iCAAiC,QAAQ,wBAAwB,YAAY;AAAA,UAC7E,EAAE,SAAS,KAAK,MAAM;AAAA,QACxB;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,UAAU,WAAW;AAAA,EACxB;AAEA,QAAM,YAAQ,sBAAQ,UAAM,2CAAiB,WAAW,GAAG,CAAC,WAAW,CAAC;AAExE,oBAAkB,iBAAiB;AAEnC,8BAAU,MAAM;AACd,UAAM,eAAe;AAAA,EACvB,GAAG,CAAC,CAAC;AAEL,aAAO,mCAAqB,MAAM,WAAW,MAAM,YAAY,MAAM,UAAU;AACjF;","names":[]}

package/dist/cjs/runtimes/react/use-style.js

@@ -37,7 +37,7 @@ var import_react = __toESM(require("react"));
 var import_serialize = require("@emotion/serialize");
 var import_utils = require("@emotion/utils");
 var import_root_style_registry = require("../../next/root-style-registry");
-var import_is_server = require("../../utils/is-server");
+const isServer = typeof window === "undefined";
 const useInsertionEffectSpecifier = "useInsertionEffect";
 const useInsertionEffect = import_react.default[useInsertionEffectSpecifier] ?? import_react.default.useLayoutEffect;
 function useStyle(style) {
@@ -57,7 +57,7 @@ function useStyles(cache, styles) {
 }
 function useUniversalInsertionEffect(effect) {
   useInsertionEffect(effect);
-  if ((0, import_is_server.isServer)())
+  if (isServer)
     effect();
 }
 function serializedStyleClassName(cache, serialized) {

package/dist/cjs/runtimes/react/use-style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/runtimes/react/use-style.ts"],"sourcesContent":["import React from 'react'\nimport { CSSObject } from '@emotion/css'\nimport { EmotionCache } from '@emotion/cache'\nimport { serializeStyles } from '@emotion/serialize'\nimport { registerStyles, insertStyles, type SerializedStyles } from '@emotion/utils'\n\nimport { useCache } from '../../next/root-style-registry'\nimport { isServer } from '../../utils/is-server'\n\nconst useInsertionEffectSpecifier = 'useInsertionEffect'\nconst useInsertionEffect = React[useInsertionEffectSpecifier] ?? React.useLayoutEffect\n\nexport function useStyle(style: CSSObject): string {\n  const cache = useCache()\n  const serialized = serializeStyles([style], cache.registered)\n\n  registerStyles(cache, serialized, false)\n\n  useUniversalInsertionEffect(() => {\n    insertStyles(cache, serialized, false)\n  })\n\n  return serializedStyleClassName(cache, serialized)\n}\n\nexport function useStyles(cache: EmotionCache, styles: SerializedStyles[]) {\n  styles.forEach(s => registerStyles(cache, s, false))\n\n  useUniversalInsertionEffect(() => {\n    styles.forEach(s => insertStyles(cache, s, false))\n  })\n}\n\nfunction useUniversalInsertionEffect(effect: () => void) {\n  useInsertionEffect(effect)\n  if (isServer()) effect()\n}\n\nexport function serializedStyleClassName(\n  cache: EmotionCache,\n  serialized: SerializedStyles,\n): string {\n  // see https://github.com/emotion-js/emotion/blob/main/packages/utils/src/index.ts#L26\n  return `${cache.key}-${serialized.name}`\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAGlB,uBAAgC;AAChC,mBAAoE;AAEpE,iCAAyB;AACzB,uBAAyB;AAEzB,MAAM,8BAA8B;AACpC,MAAM,qBAAqB,aAAAA,QAAM,2BAA2B,KAAK,aAAAA,QAAM;AAEhE,SAAS,SAAS,OAA0B;AACjD,QAAM,YAAQ,qCAAS;AACvB,QAAM,iBAAa,kCAAgB,CAAC,KAAK,GAAG,MAAM,UAAU;AAE5D,mCAAe,OAAO,YAAY,KAAK;AAEvC,8BAA4B,MAAM;AAChC,mCAAa,OAAO,YAAY,KAAK;AAAA,EACvC,CAAC;AAED,SAAO,yBAAyB,OAAO,UAAU;AACnD;AAEO,SAAS,UAAU,OAAqB,QAA4B;AACzE,SAAO,QAAQ,WAAK,6BAAe,OAAO,GAAG,KAAK,CAAC;AAEnD,8BAA4B,MAAM;AAChC,WAAO,QAAQ,WAAK,2BAAa,OAAO,GAAG,KAAK,CAAC;AAAA,EACnD,CAAC;AACH;AAEA,SAAS,4BAA4B,QAAoB;AACvD,qBAAmB,MAAM;AACzB,UAAI,2BAAS;AAAG,WAAO;AACzB;AAEO,SAAS,yBACd,OACA,YACQ;AAER,SAAO,GAAG,MAAM,GAAG,IAAI,WAAW,IAAI;AACxC;","names":["React"]}
+{"version":3,"sources":["../../../../src/runtimes/react/use-style.ts"],"sourcesContent":["import React from 'react'\nimport { CSSObject } from '@emotion/css'\nimport { EmotionCache } from '@emotion/cache'\nimport { serializeStyles } from '@emotion/serialize'\nimport { registerStyles, insertStyles, type SerializedStyles } from '@emotion/utils'\n\nimport { useCache } from '../../next/root-style-registry'\n\nconst isServer = typeof window === 'undefined'\nconst useInsertionEffectSpecifier = 'useInsertionEffect'\nconst useInsertionEffect = React[useInsertionEffectSpecifier] ?? React.useLayoutEffect\n\nexport function useStyle(style: CSSObject): string {\n  const cache = useCache()\n  const serialized = serializeStyles([style], cache.registered)\n\n  registerStyles(cache, serialized, false)\n\n  useUniversalInsertionEffect(() => {\n    insertStyles(cache, serialized, false)\n  })\n\n  return serializedStyleClassName(cache, serialized)\n}\n\nexport function useStyles(cache: EmotionCache, styles: SerializedStyles[]) {\n  styles.forEach(s => registerStyles(cache, s, false))\n\n  useUniversalInsertionEffect(() => {\n    styles.forEach(s => insertStyles(cache, s, false))\n  })\n}\n\nfunction useUniversalInsertionEffect(effect: () => void) {\n  useInsertionEffect(effect)\n  if (isServer) effect()\n}\n\nexport function serializedStyleClassName(\n  cache: EmotionCache,\n  serialized: SerializedStyles,\n): string {\n  // see https://github.com/emotion-js/emotion/blob/main/packages/utils/src/index.ts#L26\n  return `${cache.key}-${serialized.name}`\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAGlB,uBAAgC;AAChC,mBAAoE;AAEpE,iCAAyB;AAEzB,MAAM,WAAW,OAAO,WAAW;AACnC,MAAM,8BAA8B;AACpC,MAAM,qBAAqB,aAAAA,QAAM,2BAA2B,KAAK,aAAAA,QAAM;AAEhE,SAAS,SAAS,OAA0B;AACjD,QAAM,YAAQ,qCAAS;AACvB,QAAM,iBAAa,kCAAgB,CAAC,KAAK,GAAG,MAAM,UAAU;AAE5D,mCAAe,OAAO,YAAY,KAAK;AAEvC,8BAA4B,MAAM;AAChC,mCAAa,OAAO,YAAY,KAAK;AAAA,EACvC,CAAC;AAED,SAAO,yBAAyB,OAAO,UAAU;AACnD;AAEO,SAAS,UAAU,OAAqB,QAA4B;AACzE,SAAO,QAAQ,WAAK,6BAAe,OAAO,GAAG,KAAK,CAAC;AAEnD,8BAA4B,MAAM;AAChC,WAAO,QAAQ,WAAK,2BAAa,OAAO,GAAG,KAAK,CAAC;AAAA,EACnD,CAAC;AACH;AAEA,SAAS,4BAA4B,QAAoB;AACvD,qBAAmB,MAAM;AACzB,MAAI;AAAU,WAAO;AACvB;AAEO,SAAS,yBACd,OACA,YACQ;AAER,SAAO,GAAG,MAAM,GAAG,IAAI,WAAW,IAAI;AACxC;","names":["React"]}

package/dist/cjs/{runtimes/react/testing/breakpoints.js → utils/tests/breakpoint-test-util.js}

@@ -16,13 +16,13 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var breakpoints_exports = {};
-__export(breakpoints_exports, {
+var breakpoint_test_util_exports = {};
+__export(breakpoint_test_util_exports, {
   DESKTOP_MEDIA_QUERY: () => DESKTOP_MEDIA_QUERY,
   MOBILE_MEDIA_QUERY: () => MOBILE_MEDIA_QUERY,
   TABLET_MEDIA_QUERY: () => TABLET_MEDIA_QUERY
 });
-module.exports = __toCommonJS(breakpoints_exports);
+module.exports = __toCommonJS(breakpoint_test_util_exports);
 const DESKTOP_MEDIA_QUERY = "only screen and (min-width: 769px)";
 const TABLET_MEDIA_QUERY = "only screen and (min-width: 769px)";
 const MOBILE_MEDIA_QUERY = "only screen and (min-width: 769px)";
@@ -32,4 +32,4 @@ const MOBILE_MEDIA_QUERY = "only screen and (min-width: 769px)";
   MOBILE_MEDIA_QUERY,
   TABLET_MEDIA_QUERY
 });
-//# sourceMappingURL=breakpoints.js.map
+//# sourceMappingURL=breakpoint-test-util.js.map

package/dist/cjs/utils/tests/breakpoint-test-util.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/utils/tests/breakpoint-test-util.ts"],"sourcesContent":["export const DESKTOP_MEDIA_QUERY = 'only screen and (min-width: 769px)'\nexport const TABLET_MEDIA_QUERY = 'only screen and (min-width: 769px)'\nexport const MOBILE_MEDIA_QUERY = 'only screen and (min-width: 769px)'\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,MAAM,sBAAsB;AAC5B,MAAM,qBAAqB;AAC3B,MAAM,qBAAqB;","names":[]}

package/dist/cjs/{runtimes/react/testing/element-data.js → utils/tests/element-data-test-test.js}

@@ -16,16 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var element_data_exports = {};
-__export(element_data_exports, {
-  createMakeswiftComponentSnapshot: () => createMakeswiftComponentSnapshot,
+var element_data_test_test_exports = {};
+__export(element_data_test_test_exports, {
   createMakeswiftPageSnapshot: () => createMakeswiftPageSnapshot,
   createRootComponent: () => createRootComponent
 });
-module.exports = __toCommonJS(element_data_exports);
+module.exports = __toCommonJS(element_data_test_test_exports);
 var import_crypto = require("crypto");
-var import_react = require("../../../api/react");
-var import_components = require("../../../components");
+var import_components = require("../../components");
 function createRootComponent(elements, rootId) {
   return {
     key: rootId ?? (0, import_crypto.randomUUID)(),
@@ -63,39 +61,15 @@ function createMakeswiftPageSnapshot(elementData, {
       locale
     },
     cacheData: {
-      ...import_react.CacheData.empty(),
-      ...cacheData
-    }
-  };
-}
-function createMakeswiftComponentSnapshot(elementData, {
-  cacheData = {},
-  locale = null
-} = {}) {
-  return {
-    key: (0, import_crypto.randomUUID)(),
-    document: {
-      id: "test-component-id",
-      name: "Test Component Document",
-      siteId: "test-site-id",
-      data: elementData,
-      inheritsFromParent: false,
-      locale
-    },
-    meta: {
-      allowLocaleFallback: false,
-      requestedLocale: locale
-    },
-    cacheData: {
-      ...import_react.CacheData.empty(),
+      apiResources: {},
+      localizedResourcesMap: {},
       ...cacheData
     }
   };
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  createMakeswiftComponentSnapshot,
   createMakeswiftPageSnapshot,
   createRootComponent
 });
-//# sourceMappingURL=element-data.js.map
+//# sourceMappingURL=element-data-test-test.js.map

package/dist/cjs/utils/tests/element-data-test-test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/utils/tests/element-data-test-test.ts"],"sourcesContent":["import { randomUUID } from 'crypto'\nimport { type MakeswiftPageSnapshot } from '../../next'\nimport { type ElementData } from '../../state/react-page'\nimport { MakeswiftComponentType } from '../../components'\n\nexport function createRootComponent(elements: ElementData[], rootId?: string) {\n  return {\n    key: rootId ?? randomUUID(),\n    type: MakeswiftComponentType.Root,\n    props: {\n      children: {\n        columns: [\n          {\n            deviceId: 'desktop',\n            value: {\n              count: 12,\n              spans: elements?.map(() => [12]),\n            },\n          },\n        ],\n        elements,\n      },\n    },\n  }\n}\n\nexport function createMakeswiftPageSnapshot(\n  elementData: ElementData,\n  {\n    cacheData = {},\n    locale = null,\n  }: { cacheData?: Partial<MakeswiftPageSnapshot['cacheData']>; locale?: string | null } = {},\n): MakeswiftPageSnapshot {\n  return {\n    document: {\n      id: 'test-page-id',\n      site: { id: 'test-site-id' },\n      data: elementData,\n      snippets: [],\n      fonts: [],\n      meta: {},\n      seo: {},\n      localizedPages: [],\n      locale,\n    },\n    cacheData: {\n      apiResources: {},\n      localizedResourcesMap: {},\n      ...cacheData,\n    },\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA2B;AAG3B,wBAAuC;AAEhC,SAAS,oBAAoB,UAAyB,QAAiB;AAC5E,SAAO;AAAA,IACL,KAAK,cAAU,0BAAW;AAAA,IAC1B,MAAM,yCAAuB;AAAA,IAC7B,OAAO;AAAA,MACL,UAAU;AAAA,QACR,SAAS;AAAA,UACP;AAAA,YACE,UAAU;AAAA,YACV,OAAO;AAAA,cACL,OAAO;AAAA,cACP,OAAO,UAAU,IAAI,MAAM,CAAC,EAAE,CAAC;AAAA,YACjC;AAAA,UACF;AAAA,QACF;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,SAAS,4BACd,aACA;AAAA,EACE,YAAY,CAAC;AAAA,EACb,SAAS;AACX,IAAyF,CAAC,GACnE;AACvB,SAAO;AAAA,IACL,UAAU;AAAA,MACR,IAAI;AAAA,MACJ,MAAM,EAAE,IAAI,eAAe;AAAA,MAC3B,MAAM;AAAA,MACN,UAAU,CAAC;AAAA,MACX,OAAO,CAAC;AAAA,MACR,MAAM,CAAC;AAAA,MACP,KAAK,CAAC;AAAA,MACN,gBAAgB,CAAC;AAAA,MACjB;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACT,cAAc,CAAC;AAAA,MACf,uBAAuB,CAAC;AAAA,MACxB,GAAG;AAAA,IACL;AAAA,EACF;AACF;","names":[]}

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

@@ -40,7 +40,6 @@ const RightChevron = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.or
 ) });
 const SWIPE_THRESHOLD = 20;
 const swipePower = (dx, velocity) => dx * (1 + velocity);
-const classSelector = (classname) => `.${classname.split(" ").join(".")}`;
 const Carousel = forwardRef(function Carousel2({
   images = [],
   width,
@@ -136,7 +135,7 @@ const Carousel = forwardRef(function Carousel2({
     useStyle(
       useResponsiveStyle([gap], ([gap2 = { value: 0, unit: "px" }]) => ({
         margin: `0 ${`${-gap2.value / 2}${gap2.unit}`}`,
-        [`& > ${classSelector(slideClassName)}`]: {
+        [`& > .${slideClassName}`]: {
           padding: `0 ${`${gap2.value / 2}${gap2.unit}`}`
         }
       }))
@@ -204,7 +203,7 @@ const Carousel = forwardRef(function Carousel2({
     ),
     useStyle({
       left: 0,
-      [`&:hover > ${classSelector(arrowClassName)}`]: {
+      [`&:hover > .${arrowClassName}`]: {
         "& > svg": {
           transform: "translateX(-2px)"
         }
@@ -227,7 +226,7 @@ const Carousel = forwardRef(function Carousel2({
     ),
     useStyle({
       right: 0,
-      [`&:hover > ${classSelector(arrowClassName)}`]: {
+      [`&:hover > .${arrowClassName}`]: {
         "& > svg": {
           transform: "translateX(2px)"
         }

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 { 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\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  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        [`& > .${slideClassName}`]: {\n          padding: `0 ${`${gap.value / 2}${gap.unit}`}`,\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  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  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 > .${arrowClassName}`]: {\n        '& > svg': {\n          transform: 'translateX(-2px)',\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\n      [`&:hover > .${arrowClassName}`]: {\n        '& > svg': {\n          transform: 'translateX(2px)',\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/page/Page.js

@@ -1,18 +1,15 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
 import { BodySnippet } from "./BodySnippet";
 import { DocumentRoot } from "../../runtimes/react";
 import { useRouterLocaleSync } from "../hooks/useRouterLocaleSync";
 import { usePageSnippets } from "../hooks/usePageSnippets";
 import { PageHead } from "./PageHead";
-import { flattenMetadataSettings } from "./page-seo-settings";
-function Page({ page, rootDocument, metadata = true }) {
+function Page({ page, rootDocument }) {
   const { bodySnippets } = usePageSnippets({ page });
-  const pageMetadataSettings = useMemo(() => flattenMetadataSettings(metadata), [metadata]);
   useRouterLocaleSync();
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(PageHead, { document: page, metadata: pageMetadataSettings }),
+    /* @__PURE__ */ jsx(PageHead, { document: page }),
     /* @__PURE__ */ jsx(DocumentRoot, { rootDocument }),
     bodySnippets.map((snippet) => /* @__PURE__ */ jsx(BodySnippet, { code: snippet.code, cleanup: snippet.cleanup }, snippet.id))
   ] });

package/dist/esm/components/page/Page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/page/Page.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\nimport { BodySnippet } from './BodySnippet'\nimport { DocumentRoot } from '../../runtimes/react'\nimport { type Document } from '../../state/react-page'\nimport { MakeswiftPageDocument } from '../../next'\nimport { useRouterLocaleSync } from '../hooks/useRouterLocaleSync'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { PageHead } from './PageHead'\nimport { flattenMetadataSettings, type PageMetadataSettings } from './page-seo-settings'\n\ntype Props = {\n  page: MakeswiftPageDocument\n  rootDocument: Document\n  metadata?: boolean | PageMetadataSettings\n}\n\nexport function Page({ page, rootDocument, metadata = true }: Props): JSX.Element {\n  const { bodySnippets } = usePageSnippets({ page })\n  const pageMetadataSettings = useMemo(() => flattenMetadataSettings(metadata), [metadata])\n\n  useRouterLocaleSync()\n\n  return (\n    <>\n      <PageHead document={page} metadata={pageMetadataSettings} />\n\n      <DocumentRoot rootDocument={rootDocument} />\n\n      {bodySnippets.map(snippet => (\n        <BodySnippet key={snippet.id} code={snippet.code} cleanup={snippet.cleanup} />\n      ))}\n    </>\n  )\n}\n"],"mappings":";AAyBI,mBACE,KADF;AAvBJ,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAG7B,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,+BAA0D;AAQ5D,SAAS,KAAK,EAAE,MAAM,cAAc,WAAW,KAAK,GAAuB;AAChF,QAAM,EAAE,aAAa,IAAI,gBAAgB,EAAE,KAAK,CAAC;AACjD,QAAM,uBAAuB,QAAQ,MAAM,wBAAwB,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAExF,sBAAoB;AAEpB,SACE,iCACE;AAAA,wBAAC,YAAS,UAAU,MAAM,UAAU,sBAAsB;AAAA,IAE1D,oBAAC,gBAAa,cAA4B;AAAA,IAEzC,aAAa,IAAI,aAChB,oBAAC,eAA6B,MAAM,QAAQ,MAAM,SAAS,QAAQ,WAAjD,QAAQ,EAAkD,CAC7E;AAAA,KACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../src/components/page/Page.tsx"],"sourcesContent":["'use client'\n\nimport { BodySnippet } from './BodySnippet'\nimport { DocumentRoot } from '../../runtimes/react'\nimport { type Document } from '../../state/react-page'\nimport { MakeswiftPageDocument } from '../../next'\nimport { useRouterLocaleSync } from '../hooks/useRouterLocaleSync'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { PageHead } from './PageHead'\n\ntype Props = {\n  page: MakeswiftPageDocument\n  rootDocument: Document\n}\n\nexport function Page({ page, rootDocument }: Props): JSX.Element {\n  const { bodySnippets } = usePageSnippets({ page })\n\n  useRouterLocaleSync()\n\n  return (\n    <>\n      <PageHead document={page} />\n\n      <DocumentRoot rootDocument={rootDocument} />\n\n      {bodySnippets.map(snippet => (\n        <BodySnippet key={snippet.id} code={snippet.code} cleanup={snippet.cleanup} />\n      ))}\n    </>\n  )\n}\n"],"mappings":";AAqBI,mBACE,KADF;AAnBJ,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAG7B,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AAOlB,SAAS,KAAK,EAAE,MAAM,aAAa,GAAuB;AAC/D,QAAM,EAAE,aAAa,IAAI,gBAAgB,EAAE,KAAK,CAAC;AAEjD,sBAAoB;AAEpB,SACE,iCACE;AAAA,wBAAC,YAAS,UAAU,MAAM;AAAA,IAE1B,oBAAC,gBAAa,cAA4B;AAAA,IAEzC,aAAa,IAAI,aAChB,oBAAC,eAA6B,MAAM,QAAQ,MAAM,SAAS,QAAQ,WAAjD,QAAQ,EAAkD,CAC7E;AAAA,KACH;AAEJ;","names":[]}

package/dist/esm/components/page/PageHead.js

@@ -12,16 +12,7 @@ const defaultFavicon = {
   mimetype: "image/png",
   publicUrl: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC"
 };
-function PageHead({ document: page, metadata = {} }) {
-  const {
-    title: useTitle = false,
-    favicon: useFavicon = false,
-    canonicalUrl: useCanonicalUrl = false,
-    indexingBlocked: useIndexingBlocked = false,
-    description: useDescription = false,
-    keywords: useKeywords = false,
-    socialImage: useSocialImage = false
-  } = metadata;
+function PageHead({ document: page }) {
   const { headSnippets } = usePageSnippets({ page });
   const isInBuilder = useIsInBuilder();
   const site = useCachedSite(isInBuilder ? page.site.id : null);
@@ -55,17 +46,17 @@ function PageHead({ document: page, metadata = {} }) {
             overflow: hidden;
         }
         ` }),
-    useTitle && title && /* @__PURE__ */ jsx(PageTitle, { children: title }),
-    useFavicon && favicon && /* @__PURE__ */ jsx(PageLink, { rel: "icon", type: favicon.mimetype, href: favicon.publicUrl }),
-    useCanonicalUrl && canonicalUrl && /* @__PURE__ */ jsx(PageLink, { rel: "canonical", href: canonicalUrl }),
-    useIndexingBlocked && isIndexingBlocked && /* @__PURE__ */ jsx(PageMeta, { name: "robots", content: "noindex" }),
-    useDescription && description && /* @__PURE__ */ jsxs(Fragment, { children: [
+    title && /* @__PURE__ */ jsx(PageTitle, { children: title }),
+    favicon && /* @__PURE__ */ jsx(PageLink, { rel: "icon", type: favicon.mimetype, href: favicon.publicUrl }),
+    canonicalUrl && /* @__PURE__ */ jsx(PageLink, { rel: "canonical", href: canonicalUrl }),
+    isIndexingBlocked && /* @__PURE__ */ jsx(PageMeta, { name: "robots", content: "noindex" }),
+    description && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(PageMeta, { name: "description", content: description }),
       /* @__PURE__ */ jsx(PageMeta, { property: "og:description", content: description }),
       /* @__PURE__ */ jsx(PageMeta, { name: "twitter:description", content: description })
     ] }),
-    useKeywords && keywords && /* @__PURE__ */ jsx(PageMeta, { name: "keywords", content: keywords }),
-    useSocialImage && socialImage && /* @__PURE__ */ jsxs(Fragment, { children: [
+    keywords && /* @__PURE__ */ jsx(PageMeta, { name: "keywords", content: keywords }),
+    socialImage && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(PageMeta, { property: "og:image", content: socialImage.publicUrl }),
       /* @__PURE__ */ jsx(PageMeta, { property: "og:image:type", content: socialImage.mimetype }),
       /* @__PURE__ */ jsx(PageMeta, { name: "twitter:image", content: socialImage.publicUrl }),

package/dist/esm/components/page/PageHead.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/page/PageHead.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\nimport { MakeswiftPageDocument } from '../../next'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { useIsInBuilder } from '../../react'\nimport { useMakeswiftHostApiClient } from '../../runtimes/react/host-api-client'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport { Site } from '../../api'\nimport { PageTitle, PageMeta, PageLink, PageStyle } from '../../next/components/head-tags'\nimport { HeadSnippet } from './HeadSnippet'\nimport { type PageMetadataSettings } from './page-seo-settings'\n\nconst defaultFavicon = {\n  id: 'default-favicon',\n  mimetype: 'image/png',\n  publicUrl:\n    'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC',\n}\n\ntype Props = {\n  document: MakeswiftPageDocument\n  metadata?: PageMetadataSettings\n}\n\nexport function PageHead({ document: page, metadata = {} }: Props): JSX.Element {\n  const {\n    title: useTitle = false,\n    favicon: useFavicon = false,\n    canonicalUrl: useCanonicalUrl = false,\n    indexingBlocked: useIndexingBlocked = false,\n    description: useDescription = false,\n    keywords: useKeywords = false,\n    socialImage: useSocialImage = false,\n  } = metadata\n\n  const { headSnippets } = usePageSnippets({ page })\n\n  const isInBuilder = useIsInBuilder()\n\n  const site = useCachedSite(isInBuilder ? page.site.id : null)\n  const baseLocalizedPage = page.localizedPages.find(({ parentId }) => parentId == null)\n\n  const favicon = page.meta.favicon ?? defaultFavicon\n  const title = baseLocalizedPage?.meta.title ?? page.meta.title\n  const description = baseLocalizedPage?.meta.description ?? page.meta.description\n  const keywords = baseLocalizedPage?.meta.keywords ?? page.meta.keywords\n  const socialImage = baseLocalizedPage?.meta.socialImage ?? page.meta.socialImage\n  const canonicalUrl = baseLocalizedPage?.seo.canonicalUrl ?? page.seo.canonicalUrl\n  const isIndexingBlocked = baseLocalizedPage?.seo.isIndexingBlocked ?? page.seo.isIndexingBlocked\n\n  const fontFamilyParamValue = useMemo(() => {\n    if (site == null) {\n      return page.fonts\n        .map(({ family, variants }) => {\n          return `${family.replace(/ /g, '+')}:${variants.join()}`\n        })\n        .join('|')\n    }\n\n    return site.googleFonts.edges\n      .filter((edge): edge is NonNullable<typeof edge> => edge != null)\n      .map(({ activeVariants, node: { family, variants } }) => {\n        const activeVariantSpecifiers = variants\n          .filter(variant =>\n            activeVariants.some(activeVariant => activeVariant.specifier === variant.specifier),\n          )\n          .map(variant => variant.specifier)\n          .join()\n\n        return `${family.replace(/ /g, '+')}:${activeVariantSpecifiers}`\n      })\n      .join('|')\n  }, [site, page])\n\n  return (\n    <>\n      <PageStyle precedence=\"high\" href=\"makeswift-base-styles\">\n        {`\n        html {\n            font-family: sans-serif;\n        }\n        div#__next {\n            overflow: hidden;\n        }\n        `}\n      </PageStyle>\n      {useTitle && title && <PageTitle>{title}</PageTitle>}\n      {useFavicon && favicon && (\n        <PageLink rel=\"icon\" type={favicon.mimetype} href={favicon.publicUrl} />\n      )}\n      {useCanonicalUrl && canonicalUrl && <PageLink rel=\"canonical\" href={canonicalUrl} />}\n      {useIndexingBlocked && isIndexingBlocked && <PageMeta name=\"robots\" content=\"noindex\" />}\n      {useDescription && description && (\n        <>\n          <PageMeta name=\"description\" content={description} />\n          <PageMeta property=\"og:description\" content={description} />\n          <PageMeta name=\"twitter:description\" content={description} />\n        </>\n      )}\n      {useKeywords && keywords && <PageMeta name=\"keywords\" content={keywords} />}\n      {useSocialImage && socialImage && (\n        <>\n          <PageMeta property=\"og:image\" content={socialImage.publicUrl} />\n          <PageMeta property=\"og:image:type\" content={socialImage.mimetype} />\n          <PageMeta name=\"twitter:image\" content={socialImage.publicUrl} />\n          <PageMeta name=\"twitter:card\" content=\"summary_large_image\" />\n        </>\n      )}\n      {fontFamilyParamValue !== '' && (\n        <PageLink\n          precedence=\"medium\"\n          rel=\"stylesheet\"\n          href={`https://fonts.googleapis.com/css?family=${fontFamilyParamValue}&display=swap`}\n        />\n      )}\n      {headSnippets.map(snippet => (\n        <HeadSnippet key={snippet.id} snippet={snippet} />\n      ))}\n    </>\n  )\n}\n\nfunction useCachedSite(siteId: string | null): Site | null {\n  const client = useMakeswiftHostApiClient()\n  const getSnapshot = () => (siteId == null ? null : client.readSite(siteId))\n\n  const site = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  return site\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/page/PageHead.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\nimport { MakeswiftPageDocument } from '../../next'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { useIsInBuilder } from '../../react'\nimport { useMakeswiftHostApiClient } from '../../runtimes/react/host-api-client'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport { Site } from '../../api'\nimport { PageTitle, PageMeta, PageLink, PageStyle } from '../../next/components/head-tags'\nimport { HeadSnippet } from './HeadSnippet'\n\nconst defaultFavicon = {\n  id: 'default-favicon',\n  mimetype: 'image/png',\n  publicUrl:\n    'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC',\n}\n\ntype Props = {\n  document: MakeswiftPageDocument\n}\n\nexport function PageHead({ document: page }: Props): JSX.Element {\n  const { headSnippets } = usePageSnippets({ page })\n\n  const isInBuilder = useIsInBuilder()\n\n  const site = useCachedSite(isInBuilder ? page.site.id : null)\n  const baseLocalizedPage = page.localizedPages.find(({ parentId }) => parentId == null)\n\n  const favicon = page.meta.favicon ?? defaultFavicon\n  const title = baseLocalizedPage?.meta.title ?? page.meta.title\n  const description = baseLocalizedPage?.meta.description ?? page.meta.description\n  const keywords = baseLocalizedPage?.meta.keywords ?? page.meta.keywords\n  const socialImage = baseLocalizedPage?.meta.socialImage ?? page.meta.socialImage\n  const canonicalUrl = baseLocalizedPage?.seo.canonicalUrl ?? page.seo.canonicalUrl\n  const isIndexingBlocked = baseLocalizedPage?.seo.isIndexingBlocked ?? page.seo.isIndexingBlocked\n\n  const fontFamilyParamValue = useMemo(() => {\n    if (site == null) {\n      return page.fonts\n        .map(({ family, variants }) => {\n          return `${family.replace(/ /g, '+')}:${variants.join()}`\n        })\n        .join('|')\n    }\n\n    return site.googleFonts.edges\n      .filter((edge): edge is NonNullable<typeof edge> => edge != null)\n      .map(({ activeVariants, node: { family, variants } }) => {\n        const activeVariantSpecifiers = variants\n          .filter(variant =>\n            activeVariants.some(activeVariant => activeVariant.specifier === variant.specifier),\n          )\n          .map(variant => variant.specifier)\n          .join()\n\n        return `${family.replace(/ /g, '+')}:${activeVariantSpecifiers}`\n      })\n      .join('|')\n  }, [site, page])\n\n  return (\n    <>\n      <PageStyle precedence=\"high\" href=\"makeswift-base-styles\">\n        {`\n        html {\n            font-family: sans-serif;\n        }\n        div#__next {\n            overflow: hidden;\n        }\n        `}\n      </PageStyle>\n      {title && <PageTitle>{title}</PageTitle>}\n      {favicon && <PageLink rel=\"icon\" type={favicon.mimetype} href={favicon.publicUrl} />}\n      {canonicalUrl && <PageLink rel=\"canonical\" href={canonicalUrl} />}\n      {isIndexingBlocked && <PageMeta name=\"robots\" content=\"noindex\" />}\n      {description && (\n        <>\n          <PageMeta name=\"description\" content={description} />\n          <PageMeta property=\"og:description\" content={description} />\n          <PageMeta name=\"twitter:description\" content={description} />\n        </>\n      )}\n      {keywords && <PageMeta name=\"keywords\" content={keywords} />}\n      {socialImage && (\n        <>\n          <PageMeta property=\"og:image\" content={socialImage.publicUrl} />\n          <PageMeta property=\"og:image:type\" content={socialImage.mimetype} />\n          <PageMeta name=\"twitter:image\" content={socialImage.publicUrl} />\n          <PageMeta name=\"twitter:card\" content=\"summary_large_image\" />\n        </>\n      )}\n      {fontFamilyParamValue !== '' && (\n        <PageLink\n          precedence=\"medium\"\n          rel=\"stylesheet\"\n          href={`https://fonts.googleapis.com/css?family=${fontFamilyParamValue}&display=swap`}\n        />\n      )}\n      {headSnippets.map(snippet => (\n        <HeadSnippet key={snippet.id} snippet={snippet} />\n      ))}\n    </>\n  )\n}\n\nfunction useCachedSite(siteId: string | null): Site | null {\n  const client = useMakeswiftHostApiClient()\n  const getSnapshot = () => (siteId == null ? null : client.readSite(siteId))\n\n  const site = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  return site\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components/shared/Link/index.js

@@ -3,7 +3,6 @@ import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import NextLink from "next/link";
 import { Link as LinkDef } from "../../../controls/link";
-import { useIsPagesRouter } from "../../../next/hooks/use-is-pages-router";
 import { useResolvedValue } from "../../../runtimes/react/hooks/use-resolved-value";
 const isValidHref = (href) => {
   try {
@@ -33,7 +32,6 @@ const Link = forwardRef(function Link2({ link, onClick = () => {
     return resolvedOnClick?.(event);
   }
   const useNextLink = href != null && link && (link.type === "OPEN_PAGE" || link.type === "OPEN_URL" && isValidHref(link.payload.url));
-  const isPagesRouter = useIsPagesRouter();
   if (useNextLink) {
     return /* @__PURE__ */ jsx(
       NextLink,
@@ -43,7 +41,7 @@ const Link = forwardRef(function Link2({ link, onClick = () => {
         target,
         onClick: handleClick,
         href,
-        ...isPagesRouter ? { locale: false } : {},
+        locale: false,
         legacyBehavior: false
       }
     );

package/dist/esm/components/shared/Link/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\n\nimport { useIsPagesRouter } from '../../../next/hooks/use-is-pages-router'\nimport { useResolvedValue } from '../../../runtimes/react/hooks/use-resolved-value'\n\ntype BaseProps = {\n  link?: LinkData\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n  try {\n    const bases = ['http://n', 'https://n']\n    // - if `href` is a relative path, it will be resolved relative to the base URL\n    // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n    // - if `href` is an incomplete, protocol-only URL with a protocol that\n    //   conflicts with one of the base URL, this will throw\n    bases.forEach(base => new URL(href, base))\n  } catch (_) {\n    return false\n  }\n  return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n  { link, onClick = () => {}, ...restOfProps }: Props,\n  ref,\n) {\n  const {\n    href,\n    target,\n    onClick: resolvedOnClick,\n  } = useResolvedValue(link, (link, resourceResolver) =>\n    LinkDef().resolveValue(link, resourceResolver),\n  ) ?? {}\n\n  function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n    onClick(event)\n\n    if (event.defaultPrevented) return\n\n    /**\n     * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n     * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n     * On upgrade of slate this can be reevaluated.\n     */\n    if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n    return resolvedOnClick?.(event)\n  }\n\n  const useNextLink =\n    href != null &&\n    link &&\n    (link.type === 'OPEN_PAGE' || (link.type === 'OPEN_URL' && isValidHref(link.payload.url)))\n\n  const isPagesRouter = useIsPagesRouter()\n\n  if (useNextLink) {\n    return (\n      <NextLink\n        {...restOfProps}\n        ref={ref}\n        target={target}\n        onClick={handleClick}\n        href={href}\n        {...(isPagesRouter ? { locale: false } : {})}\n        // Next.js v12 has legacyBehavior set to true by default\n        legacyBehavior={false}\n      />\n    )\n  }\n\n  // eslint-disable-next-line\n  return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":";AAsEM;AApEN,SAAmC,kBAA8B;AACjE,OAAO,cAAc;AAIrB,SAAS,QAAQ,eAAe;AAEhC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAUjC,MAAM,cAAc,CAAC,SAAiB;AACpC,MAAI;AACF,UAAM,QAAQ,CAAC,YAAY,WAAW;AAKtC,UAAM,QAAQ,UAAQ,IAAI,IAAI,MAAM,IAAI,CAAC;AAAA,EAC3C,SAAS,GAAG;AACV,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,MAAM,OAAO,WAAqC,SAASA,MAChE,EAAE,MAAM,UAAU,MAAM;AAAC,GAAG,GAAG,YAAY,GAC3C,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX,IAAI;AAAA,IAAiB;AAAA,IAAM,CAACC,OAAM,qBAChC,QAAQ,EAAE,aAAaA,OAAM,gBAAgB;AAAA,EAC/C,KAAK,CAAC;AAEN,WAAS,YAAY,OAAsC;AACzD,YAAQ,KAAK;AAEb,QAAI,MAAM;AAAkB;AAO5B,QAAI,MAAM,cAAc;AAAmB,aAAO,MAAM,eAAe;AAEvE,WAAO,kBAAkB,KAAK;AAAA,EAChC;AAEA,QAAM,cACJ,QAAQ,QACR,SACC,KAAK,SAAS,eAAgB,KAAK,SAAS,cAAc,YAAY,KAAK,QAAQ,GAAG;AAEzF,QAAM,gBAAgB,iBAAiB;AAEvC,MAAI,aAAa;AACf,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACC,GAAI,gBAAgB,EAAE,QAAQ,MAAM,IAAI,CAAC;AAAA,QAE1C,gBAAgB;AAAA;AAAA,IAClB;AAAA,EAEJ;AAGA,SAAO,oBAAC,OAAG,GAAG,aAAa,KAAU,MAAY,QAAgB,SAAS,aAAa;AACzF,CAAC;","names":["Link","link"]}
+{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\nimport { useResolvedValue } from '../../../runtimes/react/hooks/use-resolved-value'\n\ntype BaseProps = {\n  link?: LinkData\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n  try {\n    const bases = ['http://n', 'https://n']\n    // - if `href` is a relative path, it will be resolved relative to the base URL\n    // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n    // - if `href` is an incomplete, protocol-only URL with a protocol that\n    //   conflicts with one of the base URL, this will throw\n    bases.forEach(base => new URL(href, base))\n  } catch (_) {\n    return false\n  }\n  return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n  { link, onClick = () => {}, ...restOfProps }: Props,\n  ref,\n) {\n  const {\n    href,\n    target,\n    onClick: resolvedOnClick,\n  } = useResolvedValue(link, (link, resourceResolver) =>\n    LinkDef().resolveValue(link, resourceResolver),\n  ) ?? {}\n\n  function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n    onClick(event)\n\n    if (event.defaultPrevented) return\n\n    /**\n     * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n     * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n     * On upgrade of slate this can be reevaluated.\n     */\n    if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n    return resolvedOnClick?.(event)\n  }\n\n  const useNextLink =\n    href != null &&\n    link &&\n    (link.type === 'OPEN_PAGE' || (link.type === 'OPEN_URL' && isValidHref(link.payload.url)))\n\n  if (useNextLink) {\n    return (\n      <NextLink\n        {...restOfProps}\n        ref={ref}\n        target={target}\n        onClick={handleClick}\n        href={href}\n        locale={false}\n        // Next.js v12 has legacyBehavior set to true by default\n        legacyBehavior={false}\n      />\n    )\n  }\n\n  // eslint-disable-next-line\n  return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":";AAkEM;AAhEN,SAAmC,kBAA8B;AACjE,OAAO,cAAc;AAIrB,SAAS,QAAQ,eAAe;AAChC,SAAS,wBAAwB;AAUjC,MAAM,cAAc,CAAC,SAAiB;AACpC,MAAI;AACF,UAAM,QAAQ,CAAC,YAAY,WAAW;AAKtC,UAAM,QAAQ,UAAQ,IAAI,IAAI,MAAM,IAAI,CAAC;AAAA,EAC3C,SAAS,GAAG;AACV,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,MAAM,OAAO,WAAqC,SAASA,MAChE,EAAE,MAAM,UAAU,MAAM;AAAC,GAAG,GAAG,YAAY,GAC3C,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX,IAAI;AAAA,IAAiB;AAAA,IAAM,CAACC,OAAM,qBAChC,QAAQ,EAAE,aAAaA,OAAM,gBAAgB;AAAA,EAC/C,KAAK,CAAC;AAEN,WAAS,YAAY,OAAsC;AACzD,YAAQ,KAAK;AAEb,QAAI,MAAM;AAAkB;AAO5B,QAAI,MAAM,cAAc;AAAmB,aAAO,MAAM,eAAe;AAEvE,WAAO,kBAAkB,KAAK;AAAA,EAChC;AAEA,QAAM,cACJ,QAAQ,QACR,SACC,KAAK,SAAS,eAAgB,KAAK,SAAS,cAAc,YAAY,KAAK,QAAQ,GAAG;AAEzF,MAAI,aAAa;AACf,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QAER,gBAAgB;AAAA;AAAA,IAClB;AAAA,EAEJ;AAGA,SAAO,oBAAC,OAAG,GAAG,aAAa,KAAU,MAAY,QAAgB,SAAS,aAAa;AACzF,CAAC;","names":["Link","link"]}