@makeswift/runtime 0.22.3 → 0.23.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/components/PreviewProvider.tsx"],"sourcesContent":["'use client'\n\nimport { ReactNode, useEffect, useMemo } from 'react'\n\nimport { ReactRuntime } from '../react-runtime'\nimport { StoreContext } from '../hooks/use-store'\nimport * as ReactBuilderPreview from '../../../state/react-builder-preview'\nimport * as ReactPage from '../../../state/react-page'\nimport { MakeswiftHostApiClient } from '../../../api/react'\nimport { registerDocumentEffect } from '../../../state/actions'\nimport { useReactRuntime } from '../../../next/context/react-runtime'\nimport { MakeswiftHostApiClientProvider } from '../../../next/context/makeswift-host-api-client'\n\ntype Props = {\n  client: MakeswiftHostApiClient\n  rootElements?: Map<string, ReactPage.Element>\n  children?: ReactNode\n}\n\nexport default function PreviewProvider({ client, children, rootElements }: Props): JSX.Element {\n  const runtime = useReactRuntime()\n  const store = useMemo(\n    () =>\n      ReactBuilderPreview.configureStore({\n        preloadedState: runtime ? runtime.store.getState() : ReactRuntime.store.getState(),\n        rootElements,\n        client,\n      }),\n    [client, rootElements, runtime],\n  )\n\n  useEffect(() => {\n    store.setup()\n    return () => store.teardown()\n  }, [store])\n\n  useEffect(() => {\n    const unregisterDocuments = Array.from(rootElements?.entries() ?? []).map(\n      ([documentKey, rootElement]) =>\n        store.dispatch(registerDocumentEffect(ReactPage.createDocument(documentKey, rootElement))),\n    )\n\n    return () => {\n      unregisterDocuments.forEach(unregisterDocument => {\n        unregisterDocument()\n      })\n    }\n  }, [store, rootElements])\n\n  return (\n    <StoreContext.Provider value={store}>\n      <MakeswiftHostApiClientProvider client={client}>{children}</MakeswiftHostApiClientProvider>\n    </StoreContext.Provider>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmDM;AAjDN,mBAA8C;AAE9C,2BAA6B;AAC7B,uBAA6B;AAC7B,0BAAqC;AACrC,gBAA2B;AAE3B,qBAAuC;AACvC,IAAAA,wBAAgC;AAChC,uCAA+C;AAQhC,SAAR,gBAAiC,EAAE,QAAQ,UAAU,aAAa,GAAuB;AAC9F,QAAM,cAAU,uCAAgB;AAChC,QAAM,YAAQ;AAAA,IACZ,MACE,oBAAoB,eAAe;AAAA,MACjC,gBAAgB,UAAU,QAAQ,MAAM,SAAS,IAAI,kCAAa,MAAM,SAAS;AAAA,MACjF;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,QAAQ,cAAc,OAAO;AAAA,EAChC;AAEA,8BAAU,MAAM;AACd,UAAM,MAAM;AACZ,WAAO,MAAM,MAAM,SAAS;AAAA,EAC9B,GAAG,CAAC,KAAK,CAAC;AAEV,8BAAU,MAAM;AACd,UAAM,sBAAsB,MAAM,KAAK,cAAc,QAAQ,KAAK,CAAC,CAAC,EAAE;AAAA,MACpE,CAAC,CAAC,aAAa,WAAW,MACxB,MAAM,aAAS,uCAAuB,UAAU,eAAe,aAAa,WAAW,CAAC,CAAC;AAAA,IAC7F;AAEA,WAAO,MAAM;AACX,0BAAoB,QAAQ,wBAAsB;AAChD,2BAAmB;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,OAAO,YAAY,CAAC;AAExB,SACE,4CAAC,8BAAa,UAAb,EAAsB,OAAO,OAC5B,sDAAC,mEAA+B,QAAiB,UAAS,GAC5D;AAEJ;","names":["import_react_runtime"]}
+{"version":3,"sources":["../../../../../src/runtimes/react/components/PreviewProvider.tsx"],"sourcesContent":["'use client'\n\nimport { type PropsWithChildren, useEffect, useMemo } from 'react'\n\nimport * as ReactBuilderPreview from '../../../state/react-builder-preview'\n\nimport { useReactRuntime } from '../hooks/use-react-runtime'\nimport { StoreContext } from '../hooks/use-store'\nimport { useMakeswiftHostApiClient } from '../host-api-client'\n\nexport default function PreviewProvider({ children }: PropsWithChildren): JSX.Element {\n  const runtime = useReactRuntime()\n  const client = useMakeswiftHostApiClient()\n  const store = useMemo(\n    () =>\n      ReactBuilderPreview.configureStore({\n        preloadedState: runtime.store.getState(),\n        client,\n      }),\n    [client, runtime],\n  )\n\n  useEffect(() => {\n    store.setup()\n    return () => store.teardown()\n  }, [store])\n\n  return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BS;AAzBT,mBAA2D;AAE3D,0BAAqC;AAErC,+BAAgC;AAChC,uBAA6B;AAC7B,6BAA0C;AAE3B,SAAR,gBAAiC,EAAE,SAAS,GAAmC;AACpF,QAAM,cAAU,0CAAgB;AAChC,QAAM,aAAS,kDAA0B;AACzC,QAAM,YAAQ;AAAA,IACZ,MACE,oBAAoB,eAAe;AAAA,MACjC,gBAAgB,QAAQ,MAAM,SAAS;AAAA,MACvC;AAAA,IACF,CAAC;AAAA,IACH,CAAC,QAAQ,OAAO;AAAA,EAClB;AAEA,8BAAU,MAAM;AACd,UAAM,MAAM;AACZ,WAAO,MAAM,MAAM,SAAS;AAAA,EAC9B,GAAG,CAAC,KAAK,CAAC;AAEV,SAAO,4CAAC,8BAAa,UAAb,EAAsB,OAAO,OAAQ,UAAS;AACxD;","names":[]}

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

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -28,18 +29,35 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var RuntimeProvider_exports = {};
 __export(RuntimeProvider_exports, {
-  RuntimeProvider: () => RuntimeProvider
+  ReactRuntimeProvider: () => ReactRuntimeProvider
 });
 module.exports = __toCommonJS(RuntimeProvider_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-const PreviewProvider = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("./PreviewProvider"))));
+var import_react2 = require("../../../api/react");
+var import_use_react_runtime = require("../hooks/use-react-runtime");
+var import_host_api_client = require("../host-api-client");
 const LiveProvider = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("./LiveProvider"))));
-function RuntimeProvider({ preview, ...props }) {
-  return preview ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PreviewProvider, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LiveProvider, { ...props });
+const PreviewProvider = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("./PreviewProvider"))));
+function ReactRuntimeProvider({
+  children,
+  runtime,
+  previewMode,
+  apiOrigin = "https://api.makeswift.com",
+  locale = void 0
+}) {
+  const client = (0, import_react.useMemo)(
+    () => new import_react2.MakeswiftHostApiClient({
+      uri: new URL("graphql", apiOrigin).href,
+      locale
+    }),
+    [apiOrigin, locale]
+  );
+  const StoreProvider = previewMode ? PreviewProvider : LiveProvider;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_use_react_runtime.ReactRuntimeContext.Provider, { value: runtime, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_host_api_client.MakeswiftHostApiClientProvider, { client, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StoreProvider, { children }) }) });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  RuntimeProvider
+  ReactRuntimeProvider
 });
 //# sourceMappingURL=RuntimeProvider.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/components/RuntimeProvider.tsx"],"sourcesContent":["import { ReactNode, lazy } from 'react'\nimport { MakeswiftHostApiClient } from '../../../api/react'\nimport { Element as ReactPageElement } from '../../../state/react-page'\nimport { ReactRuntime } from '../react-runtime'\n\ntype RuntimeProviderProps = {\n  client: MakeswiftHostApiClient\n  preview: boolean\n  rootElements?: Map<string, ReactPageElement>\n  children?: ReactNode\n  runtime?: ReactRuntime\n}\n\nconst PreviewProvider = lazy(() => import('./PreviewProvider'))\nconst LiveProvider = lazy(() => import('./LiveProvider'))\n\nexport function RuntimeProvider({ preview, ...props }: RuntimeProviderProps): JSX.Element {\n  return preview ? <PreviewProvider {...props} /> : <LiveProvider {...props} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBmB;AAjBnB,mBAAgC;AAahC,MAAM,sBAAkB,mBAAK,MAAM,6CAAO,mBAAmB,GAAC;AAC9D,MAAM,mBAAe,mBAAK,MAAM,6CAAO,gBAAgB,GAAC;AAEjD,SAAS,gBAAgB,EAAE,SAAS,GAAG,MAAM,GAAsC;AACxF,SAAO,UAAU,4CAAC,mBAAiB,GAAG,OAAO,IAAK,4CAAC,gBAAc,GAAG,OAAO;AAC7E;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/components/RuntimeProvider.tsx"],"sourcesContent":["'use client'\n\nimport { ReactNode, useMemo, lazy } from 'react'\n\nimport { MakeswiftHostApiClient } from '../../../api/react'\nimport { ReactRuntimeContext } from '../hooks/use-react-runtime'\nimport { ReactRuntime } from '../react-runtime'\nimport { MakeswiftHostApiClientProvider } from '../host-api-client'\n\nconst LiveProvider = lazy(() => import('./LiveProvider'))\nconst PreviewProvider = lazy(() => import('./PreviewProvider'))\n\nexport function ReactRuntimeProvider({\n  children,\n  runtime,\n  previewMode,\n  apiOrigin = 'https://api.makeswift.com',\n  locale = undefined,\n}: {\n  children: ReactNode\n  runtime: ReactRuntime\n  previewMode: boolean\n  apiOrigin?: string\n  locale?: string\n}) {\n  const client = useMemo(\n    () =>\n      new MakeswiftHostApiClient({\n        uri: new URL('graphql', apiOrigin).href,\n        locale,\n      }),\n    [apiOrigin, locale],\n  )\n\n  const StoreProvider = previewMode ? PreviewProvider : LiveProvider\n\n  return (\n    <ReactRuntimeContext.Provider value={runtime}>\n      <MakeswiftHostApiClientProvider client={client}>\n        <StoreProvider>{children}</StoreProvider>\n      </MakeswiftHostApiClientProvider>\n    </ReactRuntimeContext.Provider>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuCQ;AArCR,mBAAyC;AAEzC,IAAAA,gBAAuC;AACvC,+BAAoC;AAEpC,6BAA+C;AAE/C,MAAM,mBAAe,mBAAK,MAAM,6CAAO,gBAAgB,GAAC;AACxD,MAAM,sBAAkB,mBAAK,MAAM,6CAAO,mBAAmB,GAAC;AAEvD,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,SAAS;AACX,GAMG;AACD,QAAM,aAAS;AAAA,IACb,MACE,IAAI,qCAAuB;AAAA,MACzB,KAAK,IAAI,IAAI,WAAW,SAAS,EAAE;AAAA,MACnC;AAAA,IACF,CAAC;AAAA,IACH,CAAC,WAAW,MAAM;AAAA,EACpB;AAEA,QAAM,gBAAgB,cAAc,kBAAkB;AAEtD,SACE,4CAAC,6CAAoB,UAApB,EAA6B,OAAO,SACnC,sDAAC,yDAA+B,QAC9B,sDAAC,iBAAe,UAAS,GAC3B,GACF;AAEJ;","names":["import_react"]}

package/dist/cjs/runtimes/react/controls/group.js

@@ -0,0 +1,45 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var group_exports = {};
+__export(group_exports, {
+  GroupControlValue: () => GroupControlValue
+});
+module.exports = __toCommonJS(group_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_controls = require("@makeswift/controls");
+var import_control = require("./control");
+function GroupControlValue({ definition, data, children, control }) {
+  return Object.entries(definition.config.props).reduceRight(
+    (renderFn, [key, controlDefinition]) => (shapeControlValue) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_control.ControlValue,
+      {
+        definition: controlDefinition,
+        data: data != null ? import_controls.GroupDefinition.propsData(data)[key] : void 0,
+        control: control?.child(key),
+        children: (value) => renderFn({ ...shapeControlValue, [key]: value })
+      }
+    ),
+    children
+  )({});
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GroupControlValue
+});
+//# sourceMappingURL=group.js.map

package/dist/cjs/runtimes/react/controls/group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/runtimes/react/controls/group.tsx"],"sourcesContent":["import {\n  GroupControl,\n  GroupDefinition,\n  type DataType,\n  type ResolvedValueType,\n} from '@makeswift/controls'\n\nimport { ControlValue } from './control'\n\ntype GroupControlValueProps = {\n  definition: GroupDefinition\n  data: DataType<GroupDefinition> | undefined\n  children(value: ResolvedValueType<GroupDefinition>): JSX.Element\n  control: GroupControl\n}\n\nexport function GroupControlValue({ definition, data, children, control }: GroupControlValueProps) {\n  return Object.entries(definition.config.props).reduceRight(\n    (renderFn, [key, controlDefinition]) =>\n      shapeControlValue => (\n        <ControlValue\n          definition={controlDefinition}\n          data={data != null ? GroupDefinition.propsData(data)[key] : undefined}\n          control={control?.child(key)}\n        >\n          {value => renderFn({ ...shapeControlValue, [key]: value })}\n        </ControlValue>\n      ),\n    children,\n  )({} as ResolvedValueType<GroupDefinition>)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBQ;AApBR,sBAKO;AAEP,qBAA6B;AAStB,SAAS,kBAAkB,EAAE,YAAY,MAAM,UAAU,QAAQ,GAA2B;AACjG,SAAO,OAAO,QAAQ,WAAW,OAAO,KAAK,EAAE;AAAA,IAC7C,CAAC,UAAU,CAAC,KAAK,iBAAiB,MAChC,uBACE;AAAA,MAAC;AAAA;AAAA,QACC,YAAY;AAAA,QACZ,MAAM,QAAQ,OAAO,gCAAgB,UAAU,IAAI,EAAE,GAAG,IAAI;AAAA,QAC5D,SAAS,SAAS,MAAM,GAAG;AAAA,QAE1B,qBAAS,SAAS,EAAE,GAAG,mBAAmB,CAAC,GAAG,GAAG,MAAM,CAAC;AAAA;AAAA,IAC3D;AAAA,IAEJ;AAAA,EACF,EAAE,CAAC,CAAuC;AAC5C;","names":[]}

package/dist/cjs/runtimes/react/hooks/makeswift-api.js

@@ -32,9 +32,10 @@ __export(makeswift_api_exports, {
 module.exports = __toCommonJS(makeswift_api_exports);
 var import_react = require("react");
 var import_shim = require("use-sync-external-store/shim");
-var import_makeswift_host_api_client = require("../../../next/context/makeswift-host-api-client");
+var import_host_api_client = require("../host-api-client");
+var import_use_document_context = require("./use-document-context");
 function useSwatch(swatchId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const readSwatch = () => swatchId == null ? null : client.readSwatch(swatchId);
   const swatch = (0, import_shim.useSyncExternalStore)(client.subscribe, readSwatch, readSwatch);
   (0, import_react.useEffect)(() => {
@@ -44,7 +45,7 @@ function useSwatch(swatchId) {
   return swatch;
 }
 function useSwatches(swatchIds) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const lastSnapshot = (0, import_react.useRef)();
   function getSnapshot() {
     const swatches2 = swatchIds.map((swatchId) => client.readSwatch(swatchId));
@@ -60,7 +61,7 @@ function useSwatches(swatchIds) {
   return swatches;
 }
 function useFile(fileId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const readFile = () => fileId == null ? null : client.readFile(fileId);
   const file = (0, import_shim.useSyncExternalStore)(client.subscribe, readFile, readFile);
   (0, import_react.useEffect)(() => {
@@ -70,7 +71,7 @@ function useFile(fileId) {
   return file;
 }
 function useFiles(fileIds) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const lastSnapshot = (0, import_react.useRef)();
   function getSnapshot() {
     const files2 = fileIds.map((fileId) => client.readFile(fileId));
@@ -86,7 +87,7 @@ function useFiles(fileIds) {
   return files;
 }
 function useTypography(typographyId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const readTypography = () => typographyId == null ? null : client.readTypography(typographyId);
   const typography = (0, import_shim.useSyncExternalStore)(client.subscribe, readTypography, readTypography);
   (0, import_react.useEffect)(() => {
@@ -96,7 +97,7 @@ function useTypography(typographyId) {
   return typography;
 }
 function useGlobalElement(globalElementId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const readGlobalElement = () => globalElementId == null ? null : client.readGlobalElement(globalElementId);
   const globalElement = (0, import_shim.useSyncExternalStore)(client.subscribe, readGlobalElement, readGlobalElement);
   (0, import_react.useEffect)(() => {
@@ -105,24 +106,25 @@ function useGlobalElement(globalElementId) {
   }, [client, globalElementId]);
   return globalElement;
 }
-function useLocalizedGlobalElement(globalElementId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
-  const readLocalizedGlobalElement = () => globalElementId == null ? null : client.readLocalizedGlobalElement(globalElementId);
+function useLocalizedGlobalElement(locale, globalElementId) {
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const readLocalizedGlobalElement = () => locale == null || globalElementId == null ? null : client.readLocalizedGlobalElement({ globalElementId, locale });
   const localizedGlobalElement = (0, import_shim.useSyncExternalStore)(
     client.subscribe,
     readLocalizedGlobalElement,
     readLocalizedGlobalElement
   );
   (0, import_react.useEffect)(() => {
-    if (globalElementId != null) {
-      client.fetchLocalizedGlobalElement(globalElementId).catch(console.error);
+    if (locale != null && globalElementId != null) {
+      client.fetchLocalizedGlobalElement({ globalElementId, locale }).catch(console.error);
     }
-  }, [client, globalElementId]);
+  }, [client, locale, globalElementId]);
   return localizedGlobalElement;
 }
 function usePagePathnameSlice(pageId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
-  const readPagePathnameSlice = () => pageId == null ? null : client.readPagePathnameSlice(pageId);
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const locale = (0, import_use_document_context.useDocumentLocale)();
+  const readPagePathnameSlice = () => pageId == null ? null : client.readPagePathnameSlice({ pageId, locale });
   const pagePathnameSlice = (0, import_shim.useSyncExternalStore)(
     client.subscribe,
     readPagePathnameSlice,
@@ -130,12 +132,12 @@ function usePagePathnameSlice(pageId) {
   );
   (0, import_react.useEffect)(() => {
     if (pageId != null)
-      client.fetchPagePathnameSlice(pageId).catch(console.error);
-  }, [client, pageId]);
+      client.fetchPagePathnameSlice({ pageId, locale }).catch(console.error);
+  }, [client, pageId, locale]);
   return pagePathnameSlice;
 }
 function useTable(tableId) {
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
   const readTable = () => tableId == null ? null : client.readTable(tableId);
   const table = (0, import_shim.useSyncExternalStore)(client.subscribe, readTable, readTable);
   (0, import_react.useEffect)(() => {

package/dist/cjs/runtimes/react/hooks/makeswift-api.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/makeswift-api.ts"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef } from 'react'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport {\n  File,\n  GlobalElement,\n  LocalizedGlobalElement,\n  Swatch,\n  Table,\n  Typography,\n} from '../../../api'\nimport { PagePathnameSlice } from '../../../api/resource-types'\nimport { useMakeswiftHostApiClient } from '../../../next/context/makeswift-host-api-client'\n\nexport function useSwatch(swatchId: string | null): Swatch | null {\n  const client = useMakeswiftHostApiClient()\n  const readSwatch = () => (swatchId == null ? null : client.readSwatch(swatchId))\n  const swatch = useSyncExternalStore(client.subscribe, readSwatch, readSwatch)\n\n  useEffect(() => {\n    if (swatchId != null) client.fetchSwatch(swatchId).catch(console.error)\n  }, [client, swatchId])\n\n  return swatch\n}\n\nexport function useSwatches(swatchIds: string[]): (Swatch | null)[] {\n  const client = useMakeswiftHostApiClient()\n  const lastSnapshot = useRef<(Swatch | null)[]>()\n\n  function getSnapshot() {\n    const swatches = swatchIds.map(swatchId => client.readSwatch(swatchId))\n\n    if (\n      lastSnapshot.current != null &&\n      lastSnapshot.current.length === swatches.length &&\n      lastSnapshot.current.every((swatch, idx) => swatches[idx] === swatch)\n    ) {\n      return lastSnapshot.current\n    }\n\n    return (lastSnapshot.current = swatches)\n  }\n\n  const swatches = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  useEffect(() => {\n    Promise.all(swatchIds.map(swatchId => client.fetchSwatch(swatchId))).catch(console.error)\n  }, [client, swatchIds])\n\n  return swatches\n}\n\nexport function useFile(fileId: string | null): File | null {\n  const client = useMakeswiftHostApiClient()\n  const readFile = () => (fileId == null ? null : client.readFile(fileId))\n  const file = useSyncExternalStore(client.subscribe, readFile, readFile)\n\n  useEffect(() => {\n    if (fileId != null) client.fetchFile(fileId)\n  }, [client, fileId])\n\n  return file\n}\n\nexport function useFiles(fileIds: string[]): (File | null)[] {\n  const client = useMakeswiftHostApiClient()\n  const lastSnapshot = useRef<(File | null)[]>()\n\n  function getSnapshot() {\n    const files = fileIds.map(fileId => client.readFile(fileId))\n\n    if (\n      lastSnapshot.current != null &&\n      lastSnapshot.current.length === files.length &&\n      lastSnapshot.current.every((file, idx) => files[idx] === file)\n    ) {\n      return lastSnapshot.current\n    }\n\n    return (lastSnapshot.current = files)\n  }\n\n  const files = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  useEffect(() => {\n    Promise.all(fileIds.map(fileId => client.fetchFile(fileId))).catch(console.error)\n  }, [client, fileIds])\n\n  return files\n}\n\nexport function useTypography(typographyId: string | null): Typography | null {\n  const client = useMakeswiftHostApiClient()\n  const readTypography = () => (typographyId == null ? null : client.readTypography(typographyId))\n  const typography = useSyncExternalStore(client.subscribe, readTypography, readTypography)\n\n  useEffect(() => {\n    if (typographyId != null) client.fetchTypography(typographyId).catch(console.error)\n  }, [client, typographyId])\n\n  return typography\n}\n\nexport function useGlobalElement(globalElementId: string | null): GlobalElement | null {\n  const client = useMakeswiftHostApiClient()\n  const readGlobalElement = () =>\n    globalElementId == null ? null : client.readGlobalElement(globalElementId)\n  const globalElement = useSyncExternalStore(client.subscribe, readGlobalElement, readGlobalElement)\n\n  useEffect(() => {\n    if (globalElementId != null) client.fetchGlobalElement(globalElementId).catch(console.error)\n  }, [client, globalElementId])\n\n  return globalElement\n}\n\nexport function useLocalizedGlobalElement(\n  globalElementId: string | null,\n): LocalizedGlobalElement | null {\n  const client = useMakeswiftHostApiClient()\n  const readLocalizedGlobalElement = () =>\n    globalElementId == null ? null : client.readLocalizedGlobalElement(globalElementId)\n  const localizedGlobalElement = useSyncExternalStore(\n    client.subscribe,\n    readLocalizedGlobalElement,\n    readLocalizedGlobalElement,\n  )\n\n  useEffect(() => {\n    if (globalElementId != null) {\n      client.fetchLocalizedGlobalElement(globalElementId).catch(console.error)\n    }\n  }, [client, globalElementId])\n\n  return localizedGlobalElement\n}\n\nexport function usePagePathnameSlice(pageId: string | null): PagePathnameSlice | null {\n  const client = useMakeswiftHostApiClient()\n  const readPagePathnameSlice = () => (pageId == null ? null : client.readPagePathnameSlice(pageId))\n  const pagePathnameSlice = useSyncExternalStore(\n    client.subscribe,\n    readPagePathnameSlice,\n    readPagePathnameSlice,\n  )\n\n  useEffect(() => {\n    if (pageId != null) client.fetchPagePathnameSlice(pageId).catch(console.error)\n  }, [client, pageId])\n\n  return pagePathnameSlice\n}\n\nexport function useTable(tableId: string | null): Table | null {\n  const client = useMakeswiftHostApiClient()\n  const readTable = () => (tableId == null ? null : client.readTable(tableId))\n  const table = useSyncExternalStore(client.subscribe, readTable, readTable)\n\n  useEffect(() => {\n    if (tableId != null) client.fetchTable(tableId).catch(console.error)\n  }, [client, tableId])\n\n  return table\n}\n"],"mappings":"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","names":["swatches","files"]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/makeswift-api.ts"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef } from 'react'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport {\n  File,\n  GlobalElement,\n  LocalizedGlobalElement,\n  PagePathnameSlice,\n  Swatch,\n  Table,\n  Typography,\n} from '../../../api'\n\nimport { useMakeswiftHostApiClient } from '../host-api-client'\nimport { useDocumentLocale } from './use-document-context'\n\nexport function useSwatch(swatchId: string | null): Swatch | null {\n  const client = useMakeswiftHostApiClient()\n  const readSwatch = () => (swatchId == null ? null : client.readSwatch(swatchId))\n  const swatch = useSyncExternalStore(client.subscribe, readSwatch, readSwatch)\n\n  useEffect(() => {\n    if (swatchId != null) client.fetchSwatch(swatchId).catch(console.error)\n  }, [client, swatchId])\n\n  return swatch\n}\n\nexport function useSwatches(swatchIds: string[]): (Swatch | null)[] {\n  const client = useMakeswiftHostApiClient()\n  const lastSnapshot = useRef<(Swatch | null)[]>()\n\n  function getSnapshot() {\n    const swatches = swatchIds.map(swatchId => client.readSwatch(swatchId))\n\n    if (\n      lastSnapshot.current != null &&\n      lastSnapshot.current.length === swatches.length &&\n      lastSnapshot.current.every((swatch, idx) => swatches[idx] === swatch)\n    ) {\n      return lastSnapshot.current\n    }\n\n    return (lastSnapshot.current = swatches)\n  }\n\n  const swatches = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  useEffect(() => {\n    Promise.all(swatchIds.map(swatchId => client.fetchSwatch(swatchId))).catch(console.error)\n  }, [client, swatchIds])\n\n  return swatches\n}\n\nexport function useFile(fileId: string | null): File | null {\n  const client = useMakeswiftHostApiClient()\n  const readFile = () => (fileId == null ? null : client.readFile(fileId))\n  const file = useSyncExternalStore(client.subscribe, readFile, readFile)\n\n  useEffect(() => {\n    if (fileId != null) client.fetchFile(fileId)\n  }, [client, fileId])\n\n  return file\n}\n\nexport function useFiles(fileIds: string[]): (File | null)[] {\n  const client = useMakeswiftHostApiClient()\n  const lastSnapshot = useRef<(File | null)[]>()\n\n  function getSnapshot() {\n    const files = fileIds.map(fileId => client.readFile(fileId))\n\n    if (\n      lastSnapshot.current != null &&\n      lastSnapshot.current.length === files.length &&\n      lastSnapshot.current.every((file, idx) => files[idx] === file)\n    ) {\n      return lastSnapshot.current\n    }\n\n    return (lastSnapshot.current = files)\n  }\n\n  const files = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n  useEffect(() => {\n    Promise.all(fileIds.map(fileId => client.fetchFile(fileId))).catch(console.error)\n  }, [client, fileIds])\n\n  return files\n}\n\nexport function useTypography(typographyId: string | null): Typography | null {\n  const client = useMakeswiftHostApiClient()\n  const readTypography = () => (typographyId == null ? null : client.readTypography(typographyId))\n  const typography = useSyncExternalStore(client.subscribe, readTypography, readTypography)\n\n  useEffect(() => {\n    if (typographyId != null) client.fetchTypography(typographyId).catch(console.error)\n  }, [client, typographyId])\n\n  return typography\n}\n\nexport function useGlobalElement(globalElementId: string | null): GlobalElement | null {\n  const client = useMakeswiftHostApiClient()\n  const readGlobalElement = () =>\n    globalElementId == null ? null : client.readGlobalElement(globalElementId)\n  const globalElement = useSyncExternalStore(client.subscribe, readGlobalElement, readGlobalElement)\n\n  useEffect(() => {\n    if (globalElementId != null) client.fetchGlobalElement(globalElementId).catch(console.error)\n  }, [client, globalElementId])\n\n  return globalElement\n}\n\nexport function useLocalizedGlobalElement(\n  locale: string | null,\n  globalElementId: string | null,\n): LocalizedGlobalElement | null {\n  const client = useMakeswiftHostApiClient()\n  const readLocalizedGlobalElement = () =>\n    locale == null || globalElementId == null\n      ? null\n      : client.readLocalizedGlobalElement({ globalElementId, locale })\n\n  const localizedGlobalElement = useSyncExternalStore(\n    client.subscribe,\n    readLocalizedGlobalElement,\n    readLocalizedGlobalElement,\n  )\n\n  useEffect(() => {\n    if (locale != null && globalElementId != null) {\n      client.fetchLocalizedGlobalElement({ globalElementId, locale }).catch(console.error)\n    }\n  }, [client, locale, globalElementId])\n\n  return localizedGlobalElement\n}\n\nexport function usePagePathnameSlice(pageId: string | null): PagePathnameSlice | null {\n  const client = useMakeswiftHostApiClient()\n  const locale = useDocumentLocale()\n\n  const readPagePathnameSlice = () =>\n    pageId == null ? null : client.readPagePathnameSlice({ pageId, locale })\n\n  const pagePathnameSlice = useSyncExternalStore(\n    client.subscribe,\n    readPagePathnameSlice,\n    readPagePathnameSlice,\n  )\n\n  useEffect(() => {\n    if (pageId != null) client.fetchPagePathnameSlice({ pageId, locale }).catch(console.error)\n  }, [client, pageId, locale])\n\n  return pagePathnameSlice\n}\n\nexport function useTable(tableId: string | null): Table | null {\n  const client = useMakeswiftHostApiClient()\n  const readTable = () => (tableId == null ? null : client.readTable(tableId))\n  const table = useSyncExternalStore(client.subscribe, readTable, readTable)\n\n  useEffect(() => {\n    if (tableId != null) client.fetchTable(tableId).catch(console.error)\n  }, [client, tableId])\n\n  return table\n}\n"],"mappings":"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","names":["swatches","files"]}

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

@@ -0,0 +1,35 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_cache_data_exports = {};
+__export(use_cache_data_exports, {
+  useCacheData: () => useCacheData
+});
+module.exports = __toCommonJS(use_cache_data_exports);
+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_use_universal_dispatch.useUniversalDispatch)(apiStore.dispatch, import_actions.updateAPIClientCache, [cacheData]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useCacheData
+});
+//# sourceMappingURL=use-cache-data.js.map

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

@@ -0,0 +1 @@
+{"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-dispatch.js

@@ -21,10 +21,9 @@ __export(use_dispatch_exports, {
   useDispatch: () => useDispatch
 });
 module.exports = __toCommonJS(use_dispatch_exports);
-var import_react = require("react");
 var import_use_store = require("./use-store");
 function useDispatch() {
-  const store = (0, import_react.useContext)(import_use_store.StoreContext);
+  const store = (0, import_use_store.useStore)();
   return store.dispatch;
 }
 // Annotate the CommonJS export names for ESM import in node:

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-dispatch.ts"],"sourcesContent":["import { useContext } from 'react'\nimport { StoreContext } from './use-store'\nimport { Dispatch as ReactPageDispatch } from '../../../state/react-page'\nimport { Dispatch as ReactBuilderPreviewDispatch } from '../../../state/react-builder-preview'\n\ntype Dispatch = ReactPageDispatch & ReactBuilderPreviewDispatch\n\nexport function useDispatch(): Dispatch {\n  const store = useContext(StoreContext)\n\n  return store.dispatch\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2B;AAC3B,uBAA6B;AAMtB,SAAS,cAAwB;AACtC,QAAM,YAAQ,yBAAW,6BAAY;AAErC,SAAO,MAAM;AACf;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-dispatch.ts"],"sourcesContent":["import { useStore } from './use-store'\nimport { Dispatch as ReactPageDispatch } from '../../../state/react-page'\nimport { Dispatch as ReactBuilderPreviewDispatch } from '../../../state/react-builder-preview'\n\ntype Dispatch = ReactPageDispatch & ReactBuilderPreviewDispatch\n\nexport function useDispatch(): Dispatch {\n  const store = useStore()\n\n  return store.dispatch\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAyB;AAMlB,SAAS,cAAwB;AACtC,QAAM,YAAQ,2BAAS;AAEvB,SAAO,MAAM;AACf;","names":[]}

package/dist/cjs/runtimes/react/hooks/use-document-context.js

@@ -0,0 +1,49 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_document_context_exports = {};
+__export(use_document_context_exports, {
+  DocumentContext: () => DocumentContext,
+  useDocumentContext: () => useDocumentContext,
+  useDocumentKey: () => useDocumentKey,
+  useDocumentLocale: () => useDocumentLocale
+});
+module.exports = __toCommonJS(use_document_context_exports);
+var import_react = require("react");
+const DocumentContext = (0, import_react.createContext)({
+  key: null,
+  locale: null
+});
+function useDocumentContext() {
+  return (0, import_react.useContext)(DocumentContext);
+}
+function useDocumentKey() {
+  return useDocumentContext().key;
+}
+function useDocumentLocale() {
+  return useDocumentContext().locale;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DocumentContext,
+  useDocumentContext,
+  useDocumentKey,
+  useDocumentLocale
+});
+//# sourceMappingURL=use-document-context.js.map

package/dist/cjs/runtimes/react/hooks/use-document-context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-document-context.ts"],"sourcesContent":["'use client'\n\nimport { createContext, useContext } from 'react'\n\ntype ContextValue = {\n  key: string | null\n  locale: string | null\n}\n\nexport const DocumentContext = createContext<ContextValue>({\n  key: null,\n  locale: null,\n})\n\nexport function useDocumentContext(): ContextValue {\n  return useContext(DocumentContext)\n}\n\nexport function useDocumentKey(): string | null {\n  return useDocumentContext().key\n}\n\nexport function useDocumentLocale(): string | null {\n  return useDocumentContext().locale\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA0C;AAOnC,MAAM,sBAAkB,4BAA4B;AAAA,EACzD,KAAK;AAAA,EACL,QAAQ;AACV,CAAC;AAEM,SAAS,qBAAmC;AACjD,aAAO,yBAAW,eAAe;AACnC;AAEO,SAAS,iBAAgC;AAC9C,SAAO,mBAAmB,EAAE;AAC9B;AAEO,SAAS,oBAAmC;AACjD,SAAO,mBAAmB,EAAE;AAC9B;","names":[]}

package/dist/cjs/runtimes/react/hooks/use-element-id.js

@@ -22,10 +22,10 @@ __export(use_element_id_exports, {
 });
 module.exports = __toCommonJS(use_element_id_exports);
 var import_react_page = require("../../../state/react-page");
-var import_use_document_key = require("./use-document-key");
+var import_use_document_context = require("./use-document-context");
 var import_use_selector = require("./use-selector");
 function useElementId(elementKey) {
-  const documentKey = (0, import_use_document_key.useDocumentKey)();
+  const documentKey = (0, import_use_document_context.useDocumentKey)();
   return (0, import_use_selector.useSelector)(
     (state) => documentKey == null || elementKey == null ? null : (0, import_react_page.getElementId)(state, documentKey, elementKey)
   );

package/dist/cjs/runtimes/react/hooks/use-element-id.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-element-id.ts"],"sourcesContent":["import { getElementId } from '../../../state/react-page'\nimport { useDocumentKey } from './use-document-key'\nimport { useSelector } from './use-selector'\n\nexport function useElementId(elementKey: string | null | undefined): string | null {\n  const documentKey = useDocumentKey()\n\n  return useSelector(state =>\n    documentKey == null || elementKey == null ? null : getElementId(state, documentKey, elementKey),\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAA6B;AAC7B,8BAA+B;AAC/B,0BAA4B;AAErB,SAAS,aAAa,YAAsD;AACjF,QAAM,kBAAc,wCAAe;AAEnC,aAAO;AAAA,IAAY,WACjB,eAAe,QAAQ,cAAc,OAAO,WAAO,gCAAa,OAAO,aAAa,UAAU;AAAA,EAChG;AACF;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-element-id.ts"],"sourcesContent":["import { getElementId } from '../../../state/react-page'\nimport { useDocumentKey } from './use-document-context'\nimport { useSelector } from './use-selector'\n\nexport function useElementId(elementKey: string | null | undefined): string | null {\n  const documentKey = useDocumentKey()\n\n  return useSelector(state =>\n    documentKey == null || elementKey == null ? null : getElementId(state, documentKey, elementKey),\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAA6B;AAC7B,kCAA+B;AAC/B,0BAA4B;AAErB,SAAS,aAAa,YAAsD;AACjF,QAAM,kBAAc,4CAAe;AAEnC,aAAO;AAAA,IAAY,WACjB,eAAe,QAAQ,cAAc,OAAO,WAAO,gCAAa,OAAO,aAAa,UAAU;AAAA,EAChG;AACF;","names":[]}

package/dist/cjs/{next/context/react-runtime.js → runtimes/react/hooks/use-react-runtime.js}

@@ -17,28 +17,24 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var react_runtime_exports = {};
-__export(react_runtime_exports, {
-  ReactRuntimeProvider: () => ReactRuntimeProvider,
+var use_react_runtime_exports = {};
+__export(use_react_runtime_exports, {
+  ReactRuntimeContext: () => ReactRuntimeContext,
   useReactRuntime: () => useReactRuntime
 });
-module.exports = __toCommonJS(react_runtime_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
+module.exports = __toCommonJS(use_react_runtime_exports);
 var import_react = require("react");
-var import_react2 = require("../../react");
-const Context = (0, import_react.createContext)(import_react2.ReactRuntime);
+const ReactRuntimeContext = (0, import_react.createContext)(null);
 function useReactRuntime() {
-  return (0, import_react.useContext)(Context);
-}
-function ReactRuntimeProvider({
-  children,
-  runtime
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Context.Provider, { value: runtime, children });
+  const runtime = (0, import_react.useContext)(ReactRuntimeContext);
+  if (runtime === null) {
+    throw new Error("`useReactRuntime` must be used within a `ReactRuntimeProvider`");
+  }
+  return runtime;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  ReactRuntimeProvider,
+  ReactRuntimeContext,
   useReactRuntime
 });
-//# sourceMappingURL=react-runtime.js.map
+//# sourceMappingURL=use-react-runtime.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-react-runtime.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext } from 'react'\nimport { ReactRuntime } from '../react-runtime'\n\nexport const ReactRuntimeContext = createContext<ReactRuntime | null>(null)\n\nexport function useReactRuntime(): ReactRuntime {\n  const runtime = useContext(ReactRuntimeContext)\n  if (runtime === null) {\n    throw new Error('`useReactRuntime` must be used within a `ReactRuntimeProvider`')\n  }\n\n  return runtime\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA0C;AAGnC,MAAM,0BAAsB,4BAAmC,IAAI;AAEnE,SAAS,kBAAgC;AAC9C,QAAM,cAAU,yBAAW,mBAAmB;AAC9C,MAAI,YAAY,MAAM;AACpB,UAAM,IAAI,MAAM,gEAAgE;AAAA,EAClF;AAEA,SAAO;AACT;","names":[]}

package/dist/cjs/runtimes/react/hooks/use-register-document.js

@@ -0,0 +1,42 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_register_document_exports = {};
+__export(use_register_document_exports, {
+  useRegisterDocument: () => useRegisterDocument
+});
+module.exports = __toCommonJS(use_register_document_exports);
+var import_react = require("react");
+var import_use_dispatch = require("./use-dispatch");
+var import_use_is_in_builder = require("./use-is-in-builder");
+var import_actions = require("../../../state/actions");
+function useRegisterDocument(document) {
+  const isInBuilder = (0, import_use_is_in_builder.useIsInBuilder)();
+  const dispatch = (0, import_use_dispatch.useDispatch)();
+  (0, import_react.useEffect)(() => dispatch((0, import_actions.registerDocumentsEffect)([document])), [document]);
+  (0, import_react.useEffect)(() => {
+    if (!isInBuilder)
+      return;
+    return dispatch((0, import_actions.registerBuilderDocumentsEffect)([document]));
+  }, [isInBuilder, document]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useRegisterDocument
+});
+//# sourceMappingURL=use-register-document.js.map

package/dist/cjs/runtimes/react/hooks/use-register-document.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-register-document.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { type Document } from '../../../state/react-page'\nimport { useDispatch } from './use-dispatch'\nimport { useIsInBuilder } from './use-is-in-builder'\nimport { registerBuilderDocumentsEffect, registerDocumentsEffect } from '../../../state/actions'\n\n/**\n * @param document Document to register\n */\nexport function useRegisterDocument(document: Document): void {\n  const isInBuilder = useIsInBuilder()\n  const dispatch = useDispatch()\n\n  useEffect(() => dispatch(registerDocumentsEffect([document])), [document])\n\n  // TODO: Decide whether to do this via middleware or via explicit action (like\n  // what we're doing below)\n  useEffect(() => {\n    if (!isInBuilder) return\n    return dispatch(registerBuilderDocumentsEffect([document]))\n  }, [isInBuilder, document])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA0B;AAE1B,0BAA4B;AAC5B,+BAA+B;AAC/B,qBAAwE;AAKjE,SAAS,oBAAoB,UAA0B;AAC5D,QAAM,kBAAc,yCAAe;AACnC,QAAM,eAAW,iCAAY;AAE7B,8BAAU,MAAM,aAAS,wCAAwB,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC;AAIzE,8BAAU,MAAM;AACd,QAAI,CAAC;AAAa;AAClB,WAAO,aAAS,+CAA+B,CAAC,QAAQ,CAAC,CAAC;AAAA,EAC5D,GAAG,CAAC,aAAa,QAAQ,CAAC;AAC5B;","names":[]}

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

@@ -35,13 +35,13 @@ var import_react = require("react");
 var import_controls = require("@makeswift/controls");
 var ReactPage = __toESM(require("../../../state/react-page"));
 var import_use_resource_resolver = require("./use-resource-resolver");
-var import_use_document_key = require("./use-document-key");
+var import_use_document_context = require("./use-document-context");
 var import_use_selector = require("./use-selector");
 var import_use_stylesheet_factory = require("./use-stylesheet-factory");
 var import_resolvable_record = require("../resolvable-record");
 var import_prop_error_handling_proxy = require("../utils/prop-error-handling-proxy");
 function useControlInstances(elementKey) {
-  const documentKey = (0, import_use_document_key.useDocumentKey)();
+  const documentKey = (0, import_use_document_context.useDocumentKey)();
   return (0, import_use_selector.useSelector)((state) => {
     if (documentKey == null)
       return null;

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-key'\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,8BAA+B;AAC/B,0BAA4B;AAE5B,oCAAqC;AAErC,+BAAiC;AACjC,uCAAuC;AAEvC,SAAS,oBAAoB,YAA4D;AACvF,QAAM,kBAAc,wCAAe;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":[]}
+{"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/hooks/use-resource-resolver.js

@@ -33,19 +33,19 @@ __export(use_resource_resolver_exports, {
 module.exports = __toCommonJS(use_resource_resolver_exports);
 var import_react = require("react");
 var ReactPage = __toESM(require("../../../state/react-page"));
+var import_host_api_client = require("../host-api-client");
 var import_use_store = require("./use-store");
-var import_use_document_key = require("./use-document-key");
-var import_makeswift_host_api_client = require("../../../next/context/makeswift-host-api-client");
+var import_use_document_context = require("./use-document-context");
 function useResourceResolver() {
   const store = (0, import_use_store.useStore)();
-  const client = (0, import_makeswift_host_api_client.useMakeswiftHostApiClient)();
-  const documentKey = (0, import_use_document_key.useDocumentKey)();
+  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const { key: documentKey, locale } = (0, import_use_document_context.useDocumentContext)();
   return (0, import_react.useMemo)(() => {
     return {
       resolveSwatch: (swatchId) => client.resolveSwatch(swatchId),
       resolveFile: (fileId) => client.resolveFile(fileId),
       resolveTypography: (typographyId) => client.resolveTypography(typographyId),
-      resolvePagePathnameSlice: (pageId) => client.resolvePagePathnameSlice(pageId),
+      resolvePagePathnameSlice: (pageId) => client.resolvePagePathnameSlice({ pageId, locale }),
       resolveElementId: (elementKey) => {
         const read = () => documentKey == null ? null : ReactPage.getElementId(store.getState(), documentKey, elementKey);
         let lastValue = null;
@@ -59,7 +59,7 @@ function useResourceResolver() {
         };
       }
     };
-  }, [client, store, documentKey]);
+  }, [client, store, documentKey, locale]);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/runtimes/react/hooks/use-resource-resolver.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-resource-resolver.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { type ResourceResolver } from '@makeswift/controls'\n\nimport * as ReactPage from '../../../state/react-page'\nimport { useStore } from './use-store'\nimport { useDocumentKey } from './use-document-key'\nimport { useMakeswiftHostApiClient } from '../../../next/context/makeswift-host-api-client'\n\nexport function useResourceResolver(): ResourceResolver {\n  const store = useStore()\n  const client = useMakeswiftHostApiClient()\n  const documentKey = useDocumentKey()\n\n  return useMemo<ResourceResolver>(() => {\n    return {\n      resolveSwatch: swatchId => client.resolveSwatch(swatchId),\n      resolveFile: fileId => client.resolveFile(fileId),\n      resolveTypography: typographyId => client.resolveTypography(typographyId),\n      resolvePagePathnameSlice: pageId => client.resolvePagePathnameSlice(pageId),\n      resolveElementId: elementKey => {\n        const read = () =>\n          documentKey == null\n            ? null\n            : ReactPage.getElementId(store.getState(), documentKey, elementKey)\n\n        let lastValue: string | null = null\n        return {\n          name: `element-id:${documentKey}:${elementKey}`,\n          readStable: () => (lastValue = read()),\n          subscribe: (onUpdate: () => void) =>\n            store.subscribe(() => {\n              if (read() !== lastValue) onUpdate()\n            }),\n        }\n      },\n    }\n  }, [client, store, documentKey])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAGxB,gBAA2B;AAC3B,uBAAyB;AACzB,8BAA+B;AAC/B,uCAA0C;AAEnC,SAAS,sBAAwC;AACtD,QAAM,YAAQ,2BAAS;AACvB,QAAM,aAAS,4DAA0B;AACzC,QAAM,kBAAc,wCAAe;AAEnC,aAAO,sBAA0B,MAAM;AACrC,WAAO;AAAA,MACL,eAAe,cAAY,OAAO,cAAc,QAAQ;AAAA,MACxD,aAAa,YAAU,OAAO,YAAY,MAAM;AAAA,MAChD,mBAAmB,kBAAgB,OAAO,kBAAkB,YAAY;AAAA,MACxE,0BAA0B,YAAU,OAAO,yBAAyB,MAAM;AAAA,MAC1E,kBAAkB,gBAAc;AAC9B,cAAM,OAAO,MACX,eAAe,OACX,OACA,UAAU,aAAa,MAAM,SAAS,GAAG,aAAa,UAAU;AAEtE,YAAI,YAA2B;AAC/B,eAAO;AAAA,UACL,MAAM,cAAc,WAAW,IAAI,UAAU;AAAA,UAC7C,YAAY,MAAO,YAAY,KAAK;AAAA,UACpC,WAAW,CAAC,aACV,MAAM,UAAU,MAAM;AACpB,gBAAI,KAAK,MAAM;AAAW,uBAAS;AAAA,UACrC,CAAC;AAAA,QACL;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,OAAO,WAAW,CAAC;AACjC;","names":[]}
+{"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-resource-resolver.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { type ResourceResolver } from '@makeswift/controls'\n\nimport * as ReactPage from '../../../state/react-page'\nimport { useMakeswiftHostApiClient } from '../host-api-client'\nimport { useStore } from './use-store'\nimport { useDocumentContext } from './use-document-context'\n\nexport function useResourceResolver(): ResourceResolver {\n  const store = useStore()\n  const client = useMakeswiftHostApiClient()\n  const { key: documentKey, locale } = useDocumentContext()\n\n  return useMemo<ResourceResolver>(() => {\n    return {\n      resolveSwatch: swatchId => client.resolveSwatch(swatchId),\n      resolveFile: fileId => client.resolveFile(fileId),\n      resolveTypography: typographyId => client.resolveTypography(typographyId),\n      resolvePagePathnameSlice: pageId => client.resolvePagePathnameSlice({ pageId, locale }),\n      resolveElementId: elementKey => {\n        const read = () =>\n          documentKey == null\n            ? null\n            : ReactPage.getElementId(store.getState(), documentKey, elementKey)\n\n        let lastValue: string | null = null\n        return {\n          name: `element-id:${documentKey}:${elementKey}`,\n          readStable: () => (lastValue = read()),\n          subscribe: (onUpdate: () => void) =>\n            store.subscribe(() => {\n              if (read() !== lastValue) onUpdate()\n            }),\n        }\n      },\n    }\n  }, [client, store, documentKey, locale])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAGxB,gBAA2B;AAC3B,6BAA0C;AAC1C,uBAAyB;AACzB,kCAAmC;AAE5B,SAAS,sBAAwC;AACtD,QAAM,YAAQ,2BAAS;AACvB,QAAM,aAAS,kDAA0B;AACzC,QAAM,EAAE,KAAK,aAAa,OAAO,QAAI,gDAAmB;AAExD,aAAO,sBAA0B,MAAM;AACrC,WAAO;AAAA,MACL,eAAe,cAAY,OAAO,cAAc,QAAQ;AAAA,MACxD,aAAa,YAAU,OAAO,YAAY,MAAM;AAAA,MAChD,mBAAmB,kBAAgB,OAAO,kBAAkB,YAAY;AAAA,MACxE,0BAA0B,YAAU,OAAO,yBAAyB,EAAE,QAAQ,OAAO,CAAC;AAAA,MACtF,kBAAkB,gBAAc;AAC9B,cAAM,OAAO,MACX,eAAe,OACX,OACA,UAAU,aAAa,MAAM,SAAS,GAAG,aAAa,UAAU;AAEtE,YAAI,YAA2B;AAC/B,eAAO;AAAA,UACL,MAAM,cAAc,WAAW,IAAI,UAAU;AAAA,UAC7C,YAAY,MAAO,YAAY,KAAK;AAAA,UACpC,WAAW,CAAC,aACV,MAAM,UAAU,MAAM;AACpB,gBAAI,KAAK,MAAM;AAAW,uBAAS;AAAA,UACrC,CAAC;AAAA,QACL;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,OAAO,aAAa,MAAM,CAAC;AACzC;","names":[]}