npm - @makeswift/runtime - Versions diffs - 0.28.7-canary.3 → 0.28.7-canary.4 - Mend

@makeswift/runtime 0.28.7-canary.3 → 0.28.7-canary.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (80) hide show

package/dist/cjs/api/client.js CHANGED Viewed

@@ -25,22 +25,17 @@ module.exports = __toCommonJS(client_exports);
 var import_fetch_api_resource = require("../state/api-client/fetch-api-resource");
 var import_client_store = require("../state/api-client/client-store");
 var import_types = require("./types");
-var import_client = require("./graphql/client");
-var import_documents = require("./graphql/documents");
 var import_api_resources_client = require("./api-resources-client");
 var import_api_resources_client2 = require("./api-resources-client");
 class MakeswiftHostApiClient extends import_api_resources_client.ApiResourcesClient {
-  graphqlClient;
   fetch;
   constructor({
-    uri,
     fetch,
     preloadedState
   }) {
     super({
       store: (0, import_client_store.configureClientStore)({ preloadedState })
     });
-    this.graphqlClient = new import_client.GraphQLClient(uri);
     this.fetch = fetch;
   }
   async fetchSwatch(swatchId) {
@@ -78,9 +73,6 @@ class MakeswiftHostApiClient extends import_api_resources_client.ApiResourcesCli
   async fetchTable(tableId) {
     return await this.store.dispatch((0, import_fetch_api_resource.fetchAPIResource)(import_types.APIResourceType.Table, tableId, this.fetch));
   }
-  async createTableRecord(tableId, columns) {
-    await this.graphqlClient.request(import_documents.CreateTableRecordMutation, { input: { data: { tableId, columns } } });
-  }
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/api/client.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/api/client.ts"],"sourcesContent":["import { type State as ApiClientState } from '../state/api-client/state'\nimport { type HttpFetch, fetchAPIResource } from '../state/api-client/fetch-api-resource'\nimport { configureClientStore } from '../state/api-client/client-store'\n\nimport {\n type File,\n type GlobalElement,\n type LocalizedGlobalElement,\n type PagePathnameSlice,\n type Swatch,\n type Table,\n type Typography,\n APIResourceType,\n} from './types'\n\nimport { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nimport { ApiResourcesClient } from './api-resources-client'\n\nexport { CacheData } from './api-resources-client'\n\n/*\n NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n \n Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n \n Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient extends ApiResourcesClient {\n readonly ~~graphqlClient: GraphQLClient\n readonly~~ fetch: HttpFetch\n\n constructor({\n ~~uri,\n~~ fetch,\n preloadedState,\n }: {\n ~~uri: string\n~~ fetch: HttpFetch\n preloadedState: Partial<ApiClientState>\n }) {\n super({\n store: configureClientStore({ preloadedState }),\n })\n\n this.~~graphqlClient = new GraphQLClient(uri)\n this.~~fetch = fetch\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.Swatch, swatchId, this.fetch))\n }\n\n async fetchFile(fileId: string): Promise<File \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.File, fileId, this.fetch))\n }\n\n async fetchTypography(typographyId: string): Promise<Typography \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.Typography, typographyId, this.fetch),\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.GlobalElement, globalElementId, this.fetch),\n )\n }\n\n async fetchLocalizedGlobalElement({\n globalElementId,\n locale,\n }: {\n globalElementId: string\n locale: string\n }): Promise<LocalizedGlobalElement \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.LocalizedGlobalElement, globalElementId, this.fetch, locale),\n )\n }\n\n async fetchPagePathnameSlice({\n pageId,\n locale,\n }: {\n pageId: string\n locale: string \| null\n }): Promise<PagePathnameSlice \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.fetch, locale),\n )\n }\n\n async fetchTable(tableId: string): Promise<Table \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.Table, tableId, this.fetch))\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } ~~} })~~\n ~~}\n}\n~~"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gCAAiD;AACjD,0BAAqC;AAErC,mBASO;AAEP,~~oBAA8B;AAC9B,uBAA0C;AAM1C,~~kCAAmC;AAEnC,IAAAA,+BAA0B;AAqBnB,MAAM,+BAA+B,+CAAmB;AAAA,EACpD;AAAA,~~EACA;AAAA,~~EAET,YAAY;AAAA,IACV;AAAA,IACA;AAAA,~~IACA;AAAA,~~EACF,~~GAIG~~;AACD,UAAM;AAAA,MACJ,WAAO,0CAAqB,EAAE,eAAe,CAAC;AAAA,IAChD,CAAC;AAED,SAAK,~~gBAAgB,IAAI,4BAAc,GAAG;AAC1C,SAAK,~~QAAQ;AAAA,EACf;AAAA,EAEA,MAAM,YAAY,UAA0C;AAC1D,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,QAAQ,UAAU,KAAK,KAAK,CAAC;AAAA,EACjG;AAAA,EAEA,MAAM,UAAU,QAAsC;AACpD,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,MAAM,QAAQ,KAAK,KAAK,CAAC;AAAA,EAC7F;AAAA,EAEA,MAAM,gBAAgB,cAAkD;AACtE,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,YAAY,cAAc,KAAK,KAAK;AAAA,IACvE;AAAA,EACF;AAAA,EAEA,MAAM,mBAAmB,iBAAwD;AAC/E,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,eAAe,iBAAiB,KAAK,KAAK;AAAA,IAC7E;AAAA,EACF;AAAA,EAEA,MAAM,4BAA4B;AAAA,IAChC;AAAA,IACA;AAAA,EACF,GAG2C;AACzC,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,wBAAwB,iBAAiB,KAAK,OAAO,MAAM;AAAA,IAC9F;AAAA,EACF;AAAA,EAEA,MAAM,uBAAuB;AAAA,IAC3B;AAAA,IACA;AAAA,EACF,GAGsC;AACpC,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,mBAAmB,QAAQ,KAAK,OAAO,MAAM;AAAA,IAChF;AAAA,EACF;AAAA,EAEA,MAAM,WAAW,SAAwC;AACvD,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,OAAO,SAAS,KAAK,KAAK,CAAC;AAAA,EAC/F;~~AAAA,EAEA,MAAM,kBAAkB,SAAiB,SAA6B;AACpE,UAAM,KAAK,cAAc,QAGvB,4CAA2B,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,QAAQ,EAAE,EAAE,CAAC;AAAA,EACxE;~~AACF;","names":["import_api_resources_client"]}
1	+ {"version":3,"sources":["../../../src/api/client.ts"],"sourcesContent":["import { type State as ApiClientState } from '../state/api-client/state'\nimport { type HttpFetch, fetchAPIResource } from '../state/api-client/fetch-api-resource'\nimport { configureClientStore } from '../state/api-client/client-store'\n\nimport {\n type File,\n type GlobalElement,\n type LocalizedGlobalElement,\n type PagePathnameSlice,\n type Swatch,\n type Table,\n type Typography,\n APIResourceType,\n} from './types'\n\nimport { ApiResourcesClient } from './api-resources-client'\n\nexport { CacheData } from './api-resources-client'\n\n/*\n NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n \n Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n \n Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient extends ApiResourcesClient {\n readonly fetch: HttpFetch\n\n constructor({\n fetch,\n preloadedState,\n }: {\n fetch: HttpFetch\n preloadedState: Partial<ApiClientState>\n }) {\n super({\n store: configureClientStore({ preloadedState }),\n })\n\n this.fetch = fetch\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.Swatch, swatchId, this.fetch))\n }\n\n async fetchFile(fileId: string): Promise<File \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.File, fileId, this.fetch))\n }\n\n async fetchTypography(typographyId: string): Promise<Typography \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.Typography, typographyId, this.fetch),\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.GlobalElement, globalElementId, this.fetch),\n )\n }\n\n async fetchLocalizedGlobalElement({\n globalElementId,\n locale,\n }: {\n globalElementId: string\n locale: string\n }): Promise<LocalizedGlobalElement \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.LocalizedGlobalElement, globalElementId, this.fetch, locale),\n )\n }\n\n async fetchPagePathnameSlice({\n pageId,\n locale,\n }: {\n pageId: string\n locale: string \| null\n }): Promise<PagePathnameSlice \| null> {\n return await this.store.dispatch(\n fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.fetch, locale),\n )\n }\n\n async fetchTable(tableId: string): Promise<Table \| null> {\n return await this.store.dispatch(fetchAPIResource(APIResourceType.Table, tableId, this.fetch))\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gCAAiD;AACjD,0BAAqC;AAErC,mBASO;AAEP,kCAAmC;AAEnC,IAAAA,+BAA0B;AAqBnB,MAAM,+BAA+B,+CAAmB;AAAA,EACpD;AAAA,EAET,YAAY;AAAA,IACV;AAAA,IACA;AAAA,EACF,GAGG;AACD,UAAM;AAAA,MACJ,WAAO,0CAAqB,EAAE,eAAe,CAAC;AAAA,IAChD,CAAC;AAED,SAAK,QAAQ;AAAA,EACf;AAAA,EAEA,MAAM,YAAY,UAA0C;AAC1D,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,QAAQ,UAAU,KAAK,KAAK,CAAC;AAAA,EACjG;AAAA,EAEA,MAAM,UAAU,QAAsC;AACpD,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,MAAM,QAAQ,KAAK,KAAK,CAAC;AAAA,EAC7F;AAAA,EAEA,MAAM,gBAAgB,cAAkD;AACtE,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,YAAY,cAAc,KAAK,KAAK;AAAA,IACvE;AAAA,EACF;AAAA,EAEA,MAAM,mBAAmB,iBAAwD;AAC/E,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,eAAe,iBAAiB,KAAK,KAAK;AAAA,IAC7E;AAAA,EACF;AAAA,EAEA,MAAM,4BAA4B;AAAA,IAChC;AAAA,IACA;AAAA,EACF,GAG2C;AACzC,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,wBAAwB,iBAAiB,KAAK,OAAO,MAAM;AAAA,IAC9F;AAAA,EACF;AAAA,EAEA,MAAM,uBAAuB;AAAA,IAC3B;AAAA,IACA;AAAA,EACF,GAGsC;AACpC,WAAO,MAAM,KAAK,MAAM;AAAA,UACtB,4CAAiB,6BAAgB,mBAAmB,QAAQ,KAAK,OAAO,MAAM;AAAA,IAChF;AAAA,EACF;AAAA,EAEA,MAAM,WAAW,SAAwC;AACvD,WAAO,MAAM,KAAK,MAAM,aAAS,4CAAiB,6BAAgB,OAAO,SAAS,KAAK,KAAK,CAAC;AAAA,EAC/F;AACF;","names":["import_api_resources_client"]}

package/dist/cjs/api/graphql-api-client.js ADDED Viewed

@@ -0,0 +1,39 @@
+"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 graphql_api_client_exports = {};
+__export(graphql_api_client_exports, {
+  MakeswiftGraphQLApiClient: () => MakeswiftGraphQLApiClient
+});
+module.exports = __toCommonJS(graphql_api_client_exports);
+var import_client = require("./graphql/client");
+var import_documents = require("./graphql/documents");
+class MakeswiftGraphQLApiClient {
+  graphqlClient;
+  constructor({ endpoint }) {
+    this.graphqlClient = new import_client.GraphQLClient(endpoint);
+  }
+  async createTableRecord(tableId, columns) {
+    await this.graphqlClient.request(import_documents.CreateTableRecordMutation, { input: { data: { tableId, columns } } });
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MakeswiftGraphQLApiClient
+});
+//# sourceMappingURL=graphql-api-client.js.map

package/dist/cjs/api/graphql-api-client.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../src/api/graphql-api-client.ts"],"sourcesContent":["import { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nexport class MakeswiftGraphQLApiClient {\n readonly graphqlClient: GraphQLClient\n\n constructor({ endpoint }: { endpoint: string }) {\n this.graphqlClient = new GraphQLClient(endpoint)\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } } })\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA8B;AAC9B,uBAA0C;AAMnC,MAAM,0BAA0B;AAAA,EAC5B;AAAA,EAET,YAAY,EAAE,SAAS,GAAyB;AAC9C,SAAK,gBAAgB,IAAI,4BAAc,QAAQ;AAAA,EACjD;AAAA,EAEA,MAAM,kBAAkB,SAAiB,SAA6B;AACpE,UAAM,KAAK,cAAc,QAGvB,4CAA2B,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,QAAQ,EAAE,EAAE,CAAC;AAAA,EACxE;AACF;","names":[]}

package/dist/cjs/api-handler/handlers/manifest.js CHANGED Viewed

@@ -28,7 +28,7 @@ async function manifestHandler(req, { apiKey, manifest }) {
     return import_request_response.ApiResponse.json({ message: "Unauthorized" }, { status: 401 });
   }
   return import_request_response.ApiResponse.json({
-    version: "0.28.7-canary.3",
+    version: "0.28.7-canary.4",
     interactionMode: true,
     clientSideNavigation: false,
     elementFromPoint: false,

package/dist/cjs/client/index.js CHANGED Viewed

@@ -214,7 +214,7 @@ Received "${apiKey}" instead.`
     }
     this.apiKey = apiKey;
     this.graphqlClient = new import_client.GraphQLClient(new URL("graphql", runtime.apiOrigin).href, {
-      "makeswift-runtime-version": "0.28.7-canary.3"
+      "makeswift-runtime-version": "0.28.7-canary.4"
     });
     this.runtime = runtime;
   }
@@ -226,7 +226,7 @@ Received "${apiKey}" instead.`
     const requestHeaders = new Headers({
       "x-api-key": this.apiKey,
       "makeswift-site-api-key": this.apiKey,
-      "makeswift-runtime-version": "0.28.7-canary.3"
+      "makeswift-runtime-version": "0.28.7-canary.4"
     });
     if (siteVersion?.token) {
       requestUrl.searchParams.set("version", siteVersion.version);
@@ -953,7 +953,7 @@ Received "${apiKey}" instead.`
       headers: {
         "x-api-key": this.apiKey,
         "makeswift-site-api-key": this.apiKey,
-        "makeswift-runtime-version": "0.28.7-canary.3",
+        "makeswift-runtime-version": "0.28.7-canary.4",
         "content-type": "application/json"
       },
       body: JSON.stringify({ token }),

package/dist/cjs/components/builtin/Form/Form.js CHANGED Viewed

@@ -47,7 +47,7 @@ var import_box_models = require("../../../state/modules/read-write/box-models");
 var import_useTableFormFieldRefs = require("../../hooks/useTableFormFieldRefs");
 var import_css = require("@emotion/css");
 var import_responsive_style = require("../../utils/responsive-style");
-var import_host_api_client = require("../../../runtimes/react/host-api-client");
+var import_use_graphql_api_client = require("../../../runtimes/react/hooks/use-graphql-api-client");
 var import_use_style = require("../../../runtimes/react/use-style");
 var import_makeswift_api = require("../../../runtimes/react/hooks/makeswift-api");
 const LOCAL_STORAGE_NAMESPACE = "@@makeswift/components/form";
@@ -203,7 +203,7 @@ const Form = (0, import_react.forwardRef)(function Form2({
   const fields = (0, import_react.useMemo)(() => fieldsProp?.fields ?? [], [fieldsProp]);
   const grid = (0, import_react.useMemo)(() => fieldsProp?.grid ?? [], [fieldsProp]);
   const table = (0, import_makeswift_api.useTable)(tableId ?? null);
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_graphql_api_client.useMakeswiftGraphQLApiClient)();
   const [refEl, setRefEl] = (0, import_react.useState)(null);
   const [propControllers, setPropControllers] = (0, import_react.useState)(null);
   const [initialValues, setInitialValues] = (0, import_react.useState)(

package/dist/cjs/components/builtin/Form/Form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/Form/Form.tsx"],"sourcesContent":["'use client'\n\nimport {\n useState,\n useEffect,\n useRef,\n useMemo,\n forwardRef,\n ComponentPropsWithoutRef,\n Ref,\n useImperativeHandle,\n ForwardedRef,\n} from 'react'\nimport { Formik, getIn } from 'formik'\n\nimport { Check12 } from '../../icons/Check12'\n\nimport { getSizeHeight as getInputSizeHeight } from './components/Field/components/Input'\n\nimport {\n Size,\n Sizes,\n Provider as FormContextProvider,\n Shape,\n Contrast,\n Alignment,\n Alignments,\n} from './context/FormContext'\nimport Placeholder from './components/Placeholder'\nimport Field from './components/Field'\nimport Spinner from './components/Spinner'\nimport Button from '../Button'\nimport type { TableColumn } from './types'\nimport { Link } from '../../shared/Link'\nimport { getBox, type BoxModelHandle } from '../../../state/modules/read-write/box-models'\nimport { PropControllersHandle } from '../../../state/modules/prop-controller-handles'\nimport { DescriptorsPropControllers } from '../../../prop-controllers/instances'\nimport { useTableFormFieldRefs } from '../../hooks/useTableFormFieldRefs'\nimport { cx } from '@emotion/css'\nimport { useResponsiveGridItem, useResponsiveStyle } from '../../utils/responsive-style'\nimport { type ResponsiveColor } from '../../utils/types'\n\nimport { useMakeswiftHostApiClient } from '../../../runtimes/react/host-api-client'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useTable } from '../../../runtimes/react/hooks/makeswift-api'\nimport {\n type LinkData,\n type ResponsiveGapData,\n type ResponsiveLengthData,\n type ResponsiveIconRadioGroupValue,\n type ResponsiveTextStyleData,\n type ResponsiveSelectValue,\n type ResponsiveValue,\n type TableFormFieldsData,\n type TableFormFieldsDescriptor,\n} from '@makeswift/prop-controllers'\n\nconst LOCAL_STORAGE_NAMESPACE = '@@makeswift/components/form'\n\nfunction getSizeFontSize(size: Size): number {\n switch (size) {\n case Sizes.SMALL:\n return 12\n\n case Sizes.MEDIUM:\n return 14\n\n case Sizes.LARGE:\n return 18\n\n default:\n throw new Error(`Invalid form size \"${size}\"`)\n }\n}\n\ntype Props = {\n id?: string\n tableId?: string\n fields?: TableFormFieldsData\n submitLink?: LinkData\n gap?: ResponsiveGapData\n shape?: ResponsiveIconRadioGroupValue<Shape>\n size?: ResponsiveIconRadioGroupValue<Size>\n contrast?: ResponsiveIconRadioGroupValue<Contrast>\n labelTextStyle?: ResponsiveTextStyleData\n labelTextColor?: ResponsiveColor \| null\n submitTextStyle?: ResponsiveTextStyleData\n brandColor?: ResponsiveColor \| null\n submitTextColor?: ResponsiveColor \| null\n submitLabel?: string\n submitVariant?: ResponsiveSelectValue<\n 'flat' \| 'outline' \| 'shadow' \| 'clear' \| 'blocky' \| 'bubbly' \| 'skewed'\n >\n submitWidth?: ResponsiveLengthData\n submitAlignment?: ResponsiveIconRadioGroupValue<Alignment>\n width?: string\n margin?: string\n}\n\ntype GridFormBaseProps = { size?: Props['size'] }\n\ntype GridFormProps = GridFormBaseProps &\n Omit<ComponentPropsWithoutRef<'form'>, keyof GridFormBaseProps>\n\nconst GridForm = forwardRef(function GridFrom(\n { className, size, ...restOfProps }: GridFormProps,\n ref: ForwardedRef<HTMLFormElement>,\n) {\n return (\n <form\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n useStyle(\n useResponsiveStyle([size] as const, ([size = Sizes.MEDIUM]) => ({\n fontSize: getSizeFontSize(size),\n })),\n ),\n className,\n )}\n />\n )\n})\n\ntype GridItemBaseProps = {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n rowGap: Props['gap']\n columnGap: Props['gap']\n}\n\ntype GridItemProps = GridItemBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof GridItemBaseProps>\n\nconst GridItem = forwardRef(function GridItem(\n { className, grid, index, rowGap, columnGap, ...restOfProps }: GridItemProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ alignSelf: 'flex-end', flexDirection: 'column' }),\n useStyle(useResponsiveGridItem({ grid, index, rowGap, columnGap })),\n className,\n )}\n />\n )\n})\n\nfunction getAlignmentMargin(alignment: Alignment): string {\n switch (alignment) {\n case Alignments.LEFT:\n return '0 auto 0 0'\n case Alignments.RIGHT:\n return '0 0 0 auto'\n default:\n return '0 auto'\n }\n}\n\ntype StyledButtonBaseProps = { size?: Props['size']; alignment?: Props['submitAlignment'] }\n\ntype StyledButtonProps = StyledButtonBaseProps &\n Omit<ComponentPropsWithoutRef<typeof Button>, keyof StyledButtonBaseProps>\n\nfunction StyledButton({ className, size, alignment, ...restOfProps }: StyledButtonProps) {\n return (\n <Button\n {...restOfProps}\n as=\"button\"\n className={cx(\n useStyle({ display: 'flex', alignItems: 'center', justifyContent: 'center' }),\n useStyle(\n useResponsiveStyle(\n [size, alignment] as const,\n ([size = Sizes.MEDIUM, alignment = Alignments.CENTER]) => ({\n minHeight: getInputSizeHeight(size),\n maxHeight: getInputSizeHeight(size),\n margin: getAlignmentMargin(alignment),\n paddingTop: 0,\n paddingBottom: 0,\n }),\n ),\n ),\n className,\n )}\n />\n )\n}\n\nfunction ErrorContainer({ className, ...restOfProps }: ComponentPropsWithoutRef<'div'>) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n padding: '8px 16px',\n backgroundColor: '#f19eb9',\n borderRadius: 4,\n marginTop: 16,\n }),\n className,\n )}\n />\n )\n}\n\nfunction IconContainer({ className, ...restOfProps }: ComponentPropsWithoutRef<'div'>) {\n return <div {...restOfProps} className={cx(useStyle({ fill: 'currentColor' }), className)} />\n}\n\nfunction ErrorMessage({ className, ...restOfProps }: ComponentPropsWithoutRef<'p'>) {\n return (\n <p\n {...restOfProps}\n className={cx(\n useStyle({ fontSize: 12, margin: '8px 0', color: 'rgba(127, 0, 0, 0.95)' }),\n className,\n )}\n />\n )\n}\n\nfunction getTableColumnDefaultValue(tableColumn: TableColumn) {\n switch (tableColumn.__typename) {\n case 'CheckboxTableColumn':\n return false\n\n case 'MultipleSelectTableColumn':\n return []\n\n case 'SingleLineTextTableColumn':\n case 'LongTextTableColumn':\n case 'SingleSelectTableColumn':\n case 'PhoneNumberTableColumn':\n case 'EmailTableColumn':\n case 'URLTableColumn':\n case 'NumberTableColumn':\n default:\n return ''\n }\n}\n\ntype Column = { columnId: string; data: Record<string, any> }\ntype Fields = Record<string, string \| string[] \| boolean>\n\ntype Descriptors = { fields?: TableFormFieldsDescriptor }\n\nconst Form = forwardRef(function Form(\n {\n id,\n tableId,\n fields: fieldsProp,\n submitLabel = 'Submit',\n submitLink,\n shape,\n size,\n contrast,\n brandColor,\n gap,\n width,\n margin,\n submitTextStyle,\n submitVariant,\n submitTextColor,\n submitWidth,\n submitAlignment,\n labelTextStyle,\n labelTextColor,\n }: Props,\n ref: Ref<BoxModelHandle & PropControllersHandle<Descriptors>>,\n) {\n const fields = useMemo(() => fieldsProp?.fields ?? [], [fieldsProp])\n const grid = useMemo(() => fieldsProp?.grid ?? [], [fieldsProp])\n const table = useTable(tableId ?? null)\n const client = useMakeswiftHostApiClient()\n const [refEl, setRefEl] = useState<HTMLElement \| null>(null)\n const [propControllers, setPropControllers] =\n useState<DescriptorsPropControllers<Descriptors> \| null>(null)\n const [initialValues, setInitialValues] = useState<Fields>(() =>\n fields.reduce((acc, formField) => {\n const tableColumn = table && table.columns.find(field => field.id === formField.tableColumnId)\n const defaultValue = formField ? formField.defaultValue : null\n\n if (tableColumn) {\n acc[tableColumn.name] =\n defaultValue == null ? getTableColumnDefaultValue(tableColumn) : defaultValue\n }\n\n return acc\n }, {} as Fields),\n )\n const controller = propControllers?.fields\n const { container, items } = useTableFormFieldRefs(controller, { fieldsCount: fields.length })\n const [isDone, setIsDone] = useState(false)\n const linkRef = useRef<HTMLAnchorElement>(null)\n\n useImperativeHandle(\n ref,\n () => ({\n getDomNode() {\n return refEl instanceof Element ? refEl : null\n },\n getBoxModel() {\n return refEl instanceof Element ? getBox(refEl) : null\n },\n setPropControllers,\n }),\n [refEl, setPropControllers],\n )\n\n useEffect(() => {\n container(refEl)\n }, [container, refEl])\n\n useEffect(() => {\n if (!isDone) return\n\n let timeoutId = setTimeout(() => setIsDone(false), 2500)\n\n return () => clearTimeout(timeoutId)\n }, [isDone])\n\n function getTableColumn({ tableColumnId }: any) {\n return table && table.columns.find(field => tableColumnId === field.id)\n }\n\n async function handleSubmit(values: any, { setSubmitting, resetForm, setStatus }: any) {\n if (table) {\n const columns: Column[] = []\n\n fields.forEach(field => {\n const tableColumn = getTableColumn(field)\n\n if (tableColumn) {\n const data = values[tableColumn.name]\n\n if (data) {\n columns.push({ columnId: field.tableColumnId, data })\n\n if (field.autofill) {\n localStorage.setItem(\n `${LOCAL_STORAGE_NAMESPACE}/${tableColumn.name}`,\n JSON.stringify(data),\n )\n }\n }\n }\n })\n\n try {\n await client.createTableRecord(table.id, columns)\n setIsDone(true)\n setInitialValues(prev =>\n fields.reduce(\n (acc, field) => {\n const tableColumn = getTableColumn(field)\n\n if (tableColumn) {\n const data = values[tableColumn.name]\n\n if (data && field.autofill) return { ...acc, [tableColumn.name]: data }\n }\n\n return acc\n },\n { ...prev },\n ),\n )\n resetForm()\n\n if (linkRef.current != null) linkRef.current.click()\n } catch (error) {\n setStatus({ error: 'An unexpected error has occurred, please try again later' })\n } finally {\n setSubmitting(false)\n }\n }\n }\n\n useEffect(() => {\n setInitialValues(prev =>\n fields.reduce(\n (acc, formField) => {\n const tableColumn =\n table && table.columns.find(field => field.id === formField.tableColumnId)\n\n if (tableColumn && formField.autofill) {\n const storedValue = localStorage.getItem(\n `${LOCAL_STORAGE_NAMESPACE}/${tableColumn.name}`,\n )\n\n if (storedValue) {\n try {\n acc[tableColumn.name] = JSON.parse(storedValue)\n } catch (e) {\n // Ignore\n }\n }\n }\n\n return acc\n },\n { ...prev },\n ),\n )\n }, [fields, table])\n\n return (\n <FormContextProvider\n value={{ shape, size, contrast, brandColor, labelTextStyle, labelTextColor }}\n >\n {tableId == null ? (\n <Placeholder ref={setRefEl} width={width} margin={margin} />\n ) : (\n <>\n <Formik\n onSubmit={handleSubmit}\n initialValues={initialValues}\n initialStatus={{ error: null }}\n enableReinitialize\n >\n {formik => {\n const error = formik.status && formik.status.error\n const errors = fields\n .map(field => {\n const tableColumn = getTableColumn(field)\n\n return (\n tableColumn &&\n getIn(formik.touched, tableColumn.name) &&\n getIn(formik.errors, tableColumn.name)\n )\n })\n .filter(message => typeof message === 'string')\n\n return (\n <>\n <GridForm\n ref={setRefEl}\n id={id}\n className={cx(width, margin)}\n size={size}\n onSubmit={formik.handleSubmit}\n onReset={formik.handleReset}\n noValidate\n >\n {fields.map((field, index) => {\n const tableColumn = getTableColumn(field)\n\n return (\n <GridItem\n key={field.id}\n ref={items[index]}\n grid={grid}\n index={index}\n rowGap={gap}\n columnGap={gap}\n >\n <Field tableColumn={tableColumn} tableFormField={field} />\n </GridItem>\n )\n })}\n <GridItem\n ref={items[fields.length]}\n grid={grid}\n index={fields.length}\n rowGap={gap}\n columnGap={gap}\n >\n <StyledButton\n type=\"submit\"\n // @ts-ignore: `disabled` is in `'button'` but not in `T`.\n disabled={formik.isSubmitting \|\| isDone}\n shape={shape}\n size={size}\n color={brandColor}\n variant={submitVariant}\n textColor={submitTextColor}\n width={submitWidth}\n alignment={submitAlignment}\n textStyle={submitTextStyle}\n >\n {formik.isSubmitting ? (\n <Spinner />\n ) : isDone ? (\n <IconContainer>\n <Check12 />\n </IconContainer>\n ) : (\n submitLabel\n )}\n </StyledButton>\n {(errors.length > 0 \|\| error) && (\n <ErrorContainer>\n {errors.map(message => (\n <ErrorMessage key={message}>{message}</ErrorMessage>\n ))}\n {error != null && <ErrorMessage>{error}</ErrorMessage>}\n </ErrorContainer>\n )}\n </GridItem>\n </GridForm>\n {submitLink != null && <Link ref={linkRef} hidden link={submitLink} />}\n </>\n )\n }}\n </Formik>\n </>\n )}\n </FormContextProvider>\n )\n})\n\nexport default Form\n"],"mappings":"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","names":["size","GridItem","Button","alignment","getInputSizeHeight","Form","FormContextProvider","Placeholder","Field","Spinner"]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Form/Form.tsx"],"sourcesContent":["'use client'\n\nimport {\n useState,\n useEffect,\n useRef,\n useMemo,\n forwardRef,\n ComponentPropsWithoutRef,\n Ref,\n useImperativeHandle,\n ForwardedRef,\n} from 'react'\nimport { Formik, getIn } from 'formik'\n\nimport { Check12 } from '../../icons/Check12'\n\nimport { getSizeHeight as getInputSizeHeight } from './components/Field/components/Input'\n\nimport {\n Size,\n Sizes,\n Provider as FormContextProvider,\n Shape,\n Contrast,\n Alignment,\n Alignments,\n} from './context/FormContext'\nimport Placeholder from './components/Placeholder'\nimport Field from './components/Field'\nimport Spinner from './components/Spinner'\nimport Button from '../Button'\nimport type { TableColumn } from './types'\nimport { Link } from '../../shared/Link'\nimport { getBox, type BoxModelHandle } from '../../../state/modules/read-write/box-models'\nimport { PropControllersHandle } from '../../../state/modules/prop-controller-handles'\nimport { DescriptorsPropControllers } from '../../../prop-controllers/instances'\nimport { useTableFormFieldRefs } from '../../hooks/useTableFormFieldRefs'\nimport { cx } from '@emotion/css'\nimport { useResponsiveGridItem, useResponsiveStyle } from '../../utils/responsive-style'\nimport { type ResponsiveColor } from '../../utils/types'\n\nimport { useMakeswiftGraphQLApiClient } from '../../../runtimes/react/hooks/use-graphql-api-client'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useTable } from '../../../runtimes/react/hooks/makeswift-api'\nimport {\n type LinkData,\n type ResponsiveGapData,\n type ResponsiveLengthData,\n type ResponsiveIconRadioGroupValue,\n type ResponsiveTextStyleData,\n type ResponsiveSelectValue,\n type ResponsiveValue,\n type TableFormFieldsData,\n type TableFormFieldsDescriptor,\n} from '@makeswift/prop-controllers'\n\nconst LOCAL_STORAGE_NAMESPACE = '@@makeswift/components/form'\n\nfunction getSizeFontSize(size: Size): number {\n switch (size) {\n case Sizes.SMALL:\n return 12\n\n case Sizes.MEDIUM:\n return 14\n\n case Sizes.LARGE:\n return 18\n\n default:\n throw new Error(`Invalid form size \"${size}\"`)\n }\n}\n\ntype Props = {\n id?: string\n tableId?: string\n fields?: TableFormFieldsData\n submitLink?: LinkData\n gap?: ResponsiveGapData\n shape?: ResponsiveIconRadioGroupValue<Shape>\n size?: ResponsiveIconRadioGroupValue<Size>\n contrast?: ResponsiveIconRadioGroupValue<Contrast>\n labelTextStyle?: ResponsiveTextStyleData\n labelTextColor?: ResponsiveColor \| null\n submitTextStyle?: ResponsiveTextStyleData\n brandColor?: ResponsiveColor \| null\n submitTextColor?: ResponsiveColor \| null\n submitLabel?: string\n submitVariant?: ResponsiveSelectValue<\n 'flat' \| 'outline' \| 'shadow' \| 'clear' \| 'blocky' \| 'bubbly' \| 'skewed'\n >\n submitWidth?: ResponsiveLengthData\n submitAlignment?: ResponsiveIconRadioGroupValue<Alignment>\n width?: string\n margin?: string\n}\n\ntype GridFormBaseProps = { size?: Props['size'] }\n\ntype GridFormProps = GridFormBaseProps &\n Omit<ComponentPropsWithoutRef<'form'>, keyof GridFormBaseProps>\n\nconst GridForm = forwardRef(function GridFrom(\n { className, size, ...restOfProps }: GridFormProps,\n ref: ForwardedRef<HTMLFormElement>,\n) {\n return (\n <form\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n useStyle(\n useResponsiveStyle([size] as const, ([size = Sizes.MEDIUM]) => ({\n fontSize: getSizeFontSize(size),\n })),\n ),\n className,\n )}\n />\n )\n})\n\ntype GridItemBaseProps = {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n rowGap: Props['gap']\n columnGap: Props['gap']\n}\n\ntype GridItemProps = GridItemBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof GridItemBaseProps>\n\nconst GridItem = forwardRef(function GridItem(\n { className, grid, index, rowGap, columnGap, ...restOfProps }: GridItemProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ alignSelf: 'flex-end', flexDirection: 'column' }),\n useStyle(useResponsiveGridItem({ grid, index, rowGap, columnGap })),\n className,\n )}\n />\n )\n})\n\nfunction getAlignmentMargin(alignment: Alignment): string {\n switch (alignment) {\n case Alignments.LEFT:\n return '0 auto 0 0'\n case Alignments.RIGHT:\n return '0 0 0 auto'\n default:\n return '0 auto'\n }\n}\n\ntype StyledButtonBaseProps = { size?: Props['size']; alignment?: Props['submitAlignment'] }\n\ntype StyledButtonProps = StyledButtonBaseProps &\n Omit<ComponentPropsWithoutRef<typeof Button>, keyof StyledButtonBaseProps>\n\nfunction StyledButton({ className, size, alignment, ...restOfProps }: StyledButtonProps) {\n return (\n <Button\n {...restOfProps}\n as=\"button\"\n className={cx(\n useStyle({ display: 'flex', alignItems: 'center', justifyContent: 'center' }),\n useStyle(\n useResponsiveStyle(\n [size, alignment] as const,\n ([size = Sizes.MEDIUM, alignment = Alignments.CENTER]) => ({\n minHeight: getInputSizeHeight(size),\n maxHeight: getInputSizeHeight(size),\n margin: getAlignmentMargin(alignment),\n paddingTop: 0,\n paddingBottom: 0,\n }),\n ),\n ),\n className,\n )}\n />\n )\n}\n\nfunction ErrorContainer({ className, ...restOfProps }: ComponentPropsWithoutRef<'div'>) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n padding: '8px 16px',\n backgroundColor: '#f19eb9',\n borderRadius: 4,\n marginTop: 16,\n }),\n className,\n )}\n />\n )\n}\n\nfunction IconContainer({ className, ...restOfProps }: ComponentPropsWithoutRef<'div'>) {\n return <div {...restOfProps} className={cx(useStyle({ fill: 'currentColor' }), className)} />\n}\n\nfunction ErrorMessage({ className, ...restOfProps }: ComponentPropsWithoutRef<'p'>) {\n return (\n <p\n {...restOfProps}\n className={cx(\n useStyle({ fontSize: 12, margin: '8px 0', color: 'rgba(127, 0, 0, 0.95)' }),\n className,\n )}\n />\n )\n}\n\nfunction getTableColumnDefaultValue(tableColumn: TableColumn) {\n switch (tableColumn.__typename) {\n case 'CheckboxTableColumn':\n return false\n\n case 'MultipleSelectTableColumn':\n return []\n\n case 'SingleLineTextTableColumn':\n case 'LongTextTableColumn':\n case 'SingleSelectTableColumn':\n case 'PhoneNumberTableColumn':\n case 'EmailTableColumn':\n case 'URLTableColumn':\n case 'NumberTableColumn':\n default:\n return ''\n }\n}\n\ntype Column = { columnId: string; data: Record<string, any> }\ntype Fields = Record<string, string \| string[] \| boolean>\n\ntype Descriptors = { fields?: TableFormFieldsDescriptor }\n\nconst Form = forwardRef(function Form(\n {\n id,\n tableId,\n fields: fieldsProp,\n submitLabel = 'Submit',\n submitLink,\n shape,\n size,\n contrast,\n brandColor,\n gap,\n width,\n margin,\n submitTextStyle,\n submitVariant,\n submitTextColor,\n submitWidth,\n submitAlignment,\n labelTextStyle,\n labelTextColor,\n }: Props,\n ref: Ref<BoxModelHandle & PropControllersHandle<Descriptors>>,\n) {\n const fields = useMemo(() => fieldsProp?.fields ?? [], [fieldsProp])\n const grid = useMemo(() => fieldsProp?.grid ?? [], [fieldsProp])\n const table = useTable(tableId ?? null)\n const client = useMakeswiftGraphQLApiClient()\n const [refEl, setRefEl] = useState<HTMLElement \| null>(null)\n const [propControllers, setPropControllers] =\n useState<DescriptorsPropControllers<Descriptors> \| null>(null)\n const [initialValues, setInitialValues] = useState<Fields>(() =>\n fields.reduce((acc, formField) => {\n const tableColumn = table && table.columns.find(field => field.id === formField.tableColumnId)\n const defaultValue = formField ? formField.defaultValue : null\n\n if (tableColumn) {\n acc[tableColumn.name] =\n defaultValue == null ? getTableColumnDefaultValue(tableColumn) : defaultValue\n }\n\n return acc\n }, {} as Fields),\n )\n const controller = propControllers?.fields\n const { container, items } = useTableFormFieldRefs(controller, { fieldsCount: fields.length })\n const [isDone, setIsDone] = useState(false)\n const linkRef = useRef<HTMLAnchorElement>(null)\n\n useImperativeHandle(\n ref,\n () => ({\n getDomNode() {\n return refEl instanceof Element ? refEl : null\n },\n getBoxModel() {\n return refEl instanceof Element ? getBox(refEl) : null\n },\n setPropControllers,\n }),\n [refEl, setPropControllers],\n )\n\n useEffect(() => {\n container(refEl)\n }, [container, refEl])\n\n useEffect(() => {\n if (!isDone) return\n\n let timeoutId = setTimeout(() => setIsDone(false), 2500)\n\n return () => clearTimeout(timeoutId)\n }, [isDone])\n\n function getTableColumn({ tableColumnId }: any) {\n return table && table.columns.find(field => tableColumnId === field.id)\n }\n\n async function handleSubmit(values: any, { setSubmitting, resetForm, setStatus }: any) {\n if (table) {\n const columns: Column[] = []\n\n fields.forEach(field => {\n const tableColumn = getTableColumn(field)\n\n if (tableColumn) {\n const data = values[tableColumn.name]\n\n if (data) {\n columns.push({ columnId: field.tableColumnId, data })\n\n if (field.autofill) {\n localStorage.setItem(\n `${LOCAL_STORAGE_NAMESPACE}/${tableColumn.name}`,\n JSON.stringify(data),\n )\n }\n }\n }\n })\n\n try {\n await client.createTableRecord(table.id, columns)\n setIsDone(true)\n setInitialValues(prev =>\n fields.reduce(\n (acc, field) => {\n const tableColumn = getTableColumn(field)\n\n if (tableColumn) {\n const data = values[tableColumn.name]\n\n if (data && field.autofill) return { ...acc, [tableColumn.name]: data }\n }\n\n return acc\n },\n { ...prev },\n ),\n )\n resetForm()\n\n if (linkRef.current != null) linkRef.current.click()\n } catch (error) {\n setStatus({ error: 'An unexpected error has occurred, please try again later' })\n } finally {\n setSubmitting(false)\n }\n }\n }\n\n useEffect(() => {\n setInitialValues(prev =>\n fields.reduce(\n (acc, formField) => {\n const tableColumn =\n table && table.columns.find(field => field.id === formField.tableColumnId)\n\n if (tableColumn && formField.autofill) {\n const storedValue = localStorage.getItem(\n `${LOCAL_STORAGE_NAMESPACE}/${tableColumn.name}`,\n )\n\n if (storedValue) {\n try {\n acc[tableColumn.name] = JSON.parse(storedValue)\n } catch (e) {\n // Ignore\n }\n }\n }\n\n return acc\n },\n { ...prev },\n ),\n )\n }, [fields, table])\n\n return (\n <FormContextProvider\n value={{ shape, size, contrast, brandColor, labelTextStyle, labelTextColor }}\n >\n {tableId == null ? (\n <Placeholder ref={setRefEl} width={width} margin={margin} />\n ) : (\n <>\n <Formik\n onSubmit={handleSubmit}\n initialValues={initialValues}\n initialStatus={{ error: null }}\n enableReinitialize\n >\n {formik => {\n const error = formik.status && formik.status.error\n const errors = fields\n .map(field => {\n const tableColumn = getTableColumn(field)\n\n return (\n tableColumn &&\n getIn(formik.touched, tableColumn.name) &&\n getIn(formik.errors, tableColumn.name)\n )\n })\n .filter(message => typeof message === 'string')\n\n return (\n <>\n <GridForm\n ref={setRefEl}\n id={id}\n className={cx(width, margin)}\n size={size}\n onSubmit={formik.handleSubmit}\n onReset={formik.handleReset}\n noValidate\n >\n {fields.map((field, index) => {\n const tableColumn = getTableColumn(field)\n\n return (\n <GridItem\n key={field.id}\n ref={items[index]}\n grid={grid}\n index={index}\n rowGap={gap}\n columnGap={gap}\n >\n <Field tableColumn={tableColumn} tableFormField={field} />\n </GridItem>\n )\n })}\n <GridItem\n ref={items[fields.length]}\n grid={grid}\n index={fields.length}\n rowGap={gap}\n columnGap={gap}\n >\n <StyledButton\n type=\"submit\"\n // @ts-ignore: `disabled` is in `'button'` but not in `T`.\n disabled={formik.isSubmitting \|\| isDone}\n shape={shape}\n size={size}\n color={brandColor}\n variant={submitVariant}\n textColor={submitTextColor}\n width={submitWidth}\n alignment={submitAlignment}\n textStyle={submitTextStyle}\n >\n {formik.isSubmitting ? (\n <Spinner />\n ) : isDone ? (\n <IconContainer>\n <Check12 />\n </IconContainer>\n ) : (\n submitLabel\n )}\n </StyledButton>\n {(errors.length > 0 \|\| error) && (\n <ErrorContainer>\n {errors.map(message => (\n <ErrorMessage key={message}>{message}</ErrorMessage>\n ))}\n {error != null && <ErrorMessage>{error}</ErrorMessage>}\n </ErrorContainer>\n )}\n </GridItem>\n </GridForm>\n {submitLink != null && <Link ref={linkRef} hidden link={submitLink} />}\n </>\n )\n }}\n </Formik>\n </>\n )}\n </FormContextProvider>\n )\n})\n\nexport default Form\n"],"mappings":"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","names":["size","GridItem","Button","alignment","getInputSizeHeight","Form","FormContextProvider","Placeholder","Field","Spinner"]}

package/dist/cjs/runtimes/react/components/GoogleFontLink.js CHANGED Viewed

@@ -25,7 +25,7 @@ module.exports = __toCommonJS(GoogleFontLink_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_use_is_in_builder = require("../hooks/use-is-in-builder");
-var import_host_api_client = require("../host-api-client");
+var import_use_api_resources_client = require("../hooks/use-api-resources-client");
 var import_google_fonts_url = require("../utils/google-fonts-url");
 var import_head_tags = require("./page/head-tags");
 function GoogleFontLink({ fonts, siteId }) {
@@ -44,7 +44,7 @@ function GoogleFontLink({ fonts, siteId }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageLink, { precedence: "medium", rel: "stylesheet", href: url });
 }
 function useCachedSite(siteId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const getSnapshot = () => siteId == null ? null : client.readSite(siteId);
   return (0, import_react.useSyncExternalStore)(client.subscribe, getSnapshot, getSnapshot);
 }

package/dist/cjs/runtimes/react/components/GoogleFontLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/runtimes/react/components/GoogleFontLink.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useSyncExternalStore } from 'react'\n\nimport { type Font } from '../../../client'\nimport { type Site } from '../../../api'\nimport { useIsInBuilder } from '../hooks/use-is-in-builder'\nimport { ~~useMakeswiftHostApiClient~~ } from '../~~host~~-api-client'\n\nimport {\n getGoogleFontsParamFromFonts,\n getGoogleFontsParamFromSite,\n getGoogleFontsUrl,\n} from '../utils/google-fonts-url'\nimport { PageLink } from './page/head-tags'\n\ntype Props = {\n fonts: Font[]\n siteId: string \| null\n}\n\n/*\n This is experimental, and some of the logic here is duplicated in the `PageHead` component.\n * \n * For now we want to avoid putting this on the critical path for rendering Makeswift pages, so we haven't\n * deduplicated the two.\n */\nexport function GoogleFontLink({ fonts, siteId }: Props) {\n const isInBuilder = useIsInBuilder()\n\n const site = useCachedSite(isInBuilder ? siteId : null)\n\n const fontFamilyParamValue = useMemo(() => {\n if (isInBuilder && site != null) {\n return getGoogleFontsParamFromSite(site)\n }\n return getGoogleFontsParamFromFonts(fonts)\n }, [isInBuilder, site, fonts])\n\n const url = getGoogleFontsUrl(fontFamilyParamValue)\n if (url === '') {\n return null\n }\n\n return ~~(\n~~ <PageLink precedence=\"medium\" rel=\"stylesheet\" href={url} />\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 return useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;~~AA6CI~~;~~AA3CJ~~,mBAA8C;AAI9C,+BAA+B;AAC/B,~~6BAA0C~~;~~AAE1C~~,8BAIO;AACP,uBAAyB;AAalB,SAAS,eAAe,EAAE,OAAO,OAAO,GAAU;AACvD,QAAM,kBAAc,yCAAe;AAEnC,QAAM,OAAO,cAAc,cAAc,SAAS,IAAI;AAEtD,QAAM,2BAAuB,sBAAQ,MAAM;AACzC,QAAI,eAAe,QAAQ,MAAM;AAC/B,iBAAO,qDAA4B,IAAI;AAAA,IACzC;AACA,eAAO,sDAA6B,KAAK;AAAA,EAC3C,GAAG,CAAC,aAAa,MAAM,KAAK,CAAC;AAE7B,QAAM,UAAM,2CAAkB,oBAAoB;AAClD,MAAI,QAAQ,IAAI;AACd,WAAO;AAAA,EACT;AAEA,~~SACE~~,4CAAC,6BAAS,YAAW,UAAS,KAAI,cAAa,MAAM,KAAK;~~AAE9D~~;AAEA,SAAS,cAAc,QAAoC;AACzD,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,cAAc,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AAEzE,aAAO,mCAAqB,OAAO,WAAW,aAAa,WAAW;AACxE;","names":[]}
1	+ {"version":3,"sources":["../../../../../src/runtimes/react/components/GoogleFontLink.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useSyncExternalStore } from 'react'\n\nimport { type Font } from '../../../client'\nimport { type Site } from '../../../api'\nimport { useIsInBuilder } from '../hooks/use-is-in-builder'\nimport { useApiResourcesClient } from '../hooks/use-api-resources-client'\n\nimport {\n getGoogleFontsParamFromFonts,\n getGoogleFontsParamFromSite,\n getGoogleFontsUrl,\n} from '../utils/google-fonts-url'\nimport { PageLink } from './page/head-tags'\n\ntype Props = {\n fonts: Font[]\n siteId: string \| null\n}\n\n/*\n This is experimental, and some of the logic here is duplicated in the `PageHead` component.\n \n For now we want to avoid putting this on the critical path for rendering Makeswift pages, so we haven't\n * deduplicated the two.\n */\nexport function GoogleFontLink({ fonts, siteId }: Props) {\n const isInBuilder = useIsInBuilder()\n\n const site = useCachedSite(isInBuilder ? siteId : null)\n\n const fontFamilyParamValue = useMemo(() => {\n if (isInBuilder && site != null) {\n return getGoogleFontsParamFromSite(site)\n }\n return getGoogleFontsParamFromFonts(fonts)\n }, [isInBuilder, site, fonts])\n\n const url = getGoogleFontsUrl(fontFamilyParamValue)\n if (url === '') {\n return null\n }\n\n return <PageLink precedence=\"medium\" rel=\"stylesheet\" href={url} />\n}\n\nfunction useCachedSite(siteId: string \| null): Site \| null {\n const client = useApiResourcesClient()\n const getSnapshot = () => (siteId == null ? null : client.readSite(siteId))\n\n return useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CS;AA1CT,mBAA8C;AAI9C,+BAA+B;AAC/B,sCAAsC;AAEtC,8BAIO;AACP,uBAAyB;AAalB,SAAS,eAAe,EAAE,OAAO,OAAO,GAAU;AACvD,QAAM,kBAAc,yCAAe;AAEnC,QAAM,OAAO,cAAc,cAAc,SAAS,IAAI;AAEtD,QAAM,2BAAuB,sBAAQ,MAAM;AACzC,QAAI,eAAe,QAAQ,MAAM;AAC/B,iBAAO,qDAA4B,IAAI;AAAA,IACzC;AACA,eAAO,sDAA6B,KAAK;AAAA,EAC3C,GAAG,CAAC,aAAa,MAAM,KAAK,CAAC;AAE7B,QAAM,UAAM,2CAAkB,oBAAoB;AAClD,MAAI,QAAQ,IAAI;AACd,WAAO;AAAA,EACT;AAEA,SAAO,4CAAC,6BAAS,YAAW,UAAS,KAAI,cAAa,MAAM,KAAK;AACnE;AAEA,SAAS,cAAc,QAAoC;AACzD,QAAM,aAAS,uDAAsB;AACrC,QAAM,cAAc,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AAEzE,aAAO,mCAAqB,OAAO,WAAW,aAAa,WAAW;AACxE;","names":[]}

package/dist/cjs/runtimes/react/components/hooks/use-page-snippets.js CHANGED Viewed

@@ -35,7 +35,7 @@ var import_react = require("react");
 var import_client = require("../../../../client");
 var import_deepEqual = __toESM(require("../../../../utils/deepEqual"));
 var import_use_is_in_builder = require("../../hooks/use-is-in-builder");
-var import_host_api_client = require("../../host-api-client");
+var import_use_api_resources_client = require("../../hooks/use-api-resources-client");
 const filterUsedSnippetProperties = ({
   code,
   builderEnabled,
@@ -77,7 +77,7 @@ function usePageSnippets({ page }) {
   return { headSnippets, bodySnippets };
 }
 function useCachedPage(pageId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const getSnapshot = () => pageId == null ? null : client.readPage(pageId);
   const page = (0, import_react.useSyncExternalStore)(client.subscribe, getSnapshot, getSnapshot);
   return page;

package/dist/cjs/runtimes/react/components/hooks/use-page-snippets.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../src/runtimes/react/components/hooks/use-page-snippets.ts"],"sourcesContent":["import { useEffect, useMemo, useState, useSyncExternalStore } from 'react'\n\nimport { type MakeswiftPageDocument, type Snippet, SnippetLocation } from '../../../../client'\nimport { type Page as PageType } from '../../../../api'\n\nimport deepEqual from '../../../../utils/deepEqual'\n\nimport { useIsInBuilder } from '../../hooks/use-is-in-builder'\nimport { ~~useMakeswiftHostApiClient~~ } from '../../~~host~~-api-client'\n\nconst filterUsedSnippetProperties = ({\n code,\n builderEnabled,\n liveEnabled,\n location,\n cleanup,\n}: Snippet) => ({\n code,\n builderEnabled,\n liveEnabled,\n location,\n cleanup,\n})\n\nexport function usePageSnippets({ page }: { page: MakeswiftPageDocument }) {\n const isInBuilder = useIsInBuilder()\n const [snippets, setSnippets] = useState(page.snippets)\n\n // We're using cached results here for page snippets so that anytime the user\n // changes the snippets or fonts on the builder, the change would be reflected\n // here. See this PR for discussions and things we can do to improve it in the\n // future: https://github.com/makeswift/makeswift/pull/77\n const cachedPage = useCachedPage(isInBuilder ? page.id : null)\n useEffect(() => {\n if (cachedPage == null) return\n\n const oldSnippets = snippets.map(filterUsedSnippetProperties)\n const newSnippets = cachedPage.snippets.map(filterUsedSnippetProperties)\n\n if (deepEqual(newSnippets, oldSnippets)) return\n\n setSnippets(cachedPage.snippets)\n }, [cachedPage])\n\n const filteredSnippets = useMemo(\n () => snippets.filter(snippet => (isInBuilder ? snippet.builderEnabled : snippet.liveEnabled)),\n [snippets, isInBuilder],\n )\n\n const headSnippets = useMemo(\n () => filteredSnippets.filter(snippet => snippet.location === SnippetLocation.Head),\n [filteredSnippets],\n )\n\n const bodySnippets = useMemo(\n () => filteredSnippets.filter(snippet => snippet.location === SnippetLocation.Body),\n [filteredSnippets],\n )\n\n return { headSnippets, bodySnippets }\n}\n\nfunction useCachedPage(pageId: string \| null): PageType \| null {\n const client = ~~useMakeswiftHostApiClient~~()\n const getSnapshot = () => (pageId == null ? null : client.readPage(pageId))\n\n const page = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n return page\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAmE;AAEnE,oBAA0E;AAG1E,uBAAsB;AAEtB,+BAA+B;AAC/B,~~6BAA0C~~;~~AAE1C~~,MAAM,8BAA8B,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,OAAgB;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAAS,gBAAgB,EAAE,KAAK,GAAoC;AACzE,QAAM,kBAAc,yCAAe;AACnC,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK,QAAQ;AAMtD,QAAM,aAAa,cAAc,cAAc,KAAK,KAAK,IAAI;AAC7D,8BAAU,MAAM;AACd,QAAI,cAAc;AAAM;AAExB,UAAM,cAAc,SAAS,IAAI,2BAA2B;AAC5D,UAAM,cAAc,WAAW,SAAS,IAAI,2BAA2B;AAEvE,YAAI,iBAAAA,SAAU,aAAa,WAAW;AAAG;AAEzC,gBAAY,WAAW,QAAQ;AAAA,EACjC,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,uBAAmB;AAAA,IACvB,MAAM,SAAS,OAAO,aAAY,cAAc,QAAQ,iBAAiB,QAAQ,WAAY;AAAA,IAC7F,CAAC,UAAU,WAAW;AAAA,EACxB;AAEA,QAAM,mBAAe;AAAA,IACnB,MAAM,iBAAiB,OAAO,aAAW,QAAQ,aAAa,8BAAgB,IAAI;AAAA,IAClF,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,mBAAe;AAAA,IACnB,MAAM,iBAAiB,OAAO,aAAW,QAAQ,aAAa,8BAAgB,IAAI;AAAA,IAClF,CAAC,gBAAgB;AAAA,EACnB;AAEA,SAAO,EAAE,cAAc,aAAa;AACtC;AAEA,SAAS,cAAc,QAAwC;AAC7D,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,cAAc,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AAEzE,QAAM,WAAO,mCAAqB,OAAO,WAAW,aAAa,WAAW;AAE5E,SAAO;AACT;","names":["deepEqual"]}
1	+ {"version":3,"sources":["../../../../../../src/runtimes/react/components/hooks/use-page-snippets.ts"],"sourcesContent":["import { useEffect, useMemo, useState, useSyncExternalStore } from 'react'\n\nimport { type MakeswiftPageDocument, type Snippet, SnippetLocation } from '../../../../client'\nimport { type Page as PageType } from '../../../../api'\n\nimport deepEqual from '../../../../utils/deepEqual'\n\nimport { useIsInBuilder } from '../../hooks/use-is-in-builder'\nimport { useApiResourcesClient } from '../../hooks/use-api-resources-client'\n\nconst filterUsedSnippetProperties = ({\n code,\n builderEnabled,\n liveEnabled,\n location,\n cleanup,\n}: Snippet) => ({\n code,\n builderEnabled,\n liveEnabled,\n location,\n cleanup,\n})\n\nexport function usePageSnippets({ page }: { page: MakeswiftPageDocument }) {\n const isInBuilder = useIsInBuilder()\n const [snippets, setSnippets] = useState(page.snippets)\n\n // We're using cached results here for page snippets so that anytime the user\n // changes the snippets or fonts on the builder, the change would be reflected\n // here. See this PR for discussions and things we can do to improve it in the\n // future: https://github.com/makeswift/makeswift/pull/77\n const cachedPage = useCachedPage(isInBuilder ? page.id : null)\n useEffect(() => {\n if (cachedPage == null) return\n\n const oldSnippets = snippets.map(filterUsedSnippetProperties)\n const newSnippets = cachedPage.snippets.map(filterUsedSnippetProperties)\n\n if (deepEqual(newSnippets, oldSnippets)) return\n\n setSnippets(cachedPage.snippets)\n }, [cachedPage])\n\n const filteredSnippets = useMemo(\n () => snippets.filter(snippet => (isInBuilder ? snippet.builderEnabled : snippet.liveEnabled)),\n [snippets, isInBuilder],\n )\n\n const headSnippets = useMemo(\n () => filteredSnippets.filter(snippet => snippet.location === SnippetLocation.Head),\n [filteredSnippets],\n )\n\n const bodySnippets = useMemo(\n () => filteredSnippets.filter(snippet => snippet.location === SnippetLocation.Body),\n [filteredSnippets],\n )\n\n return { headSnippets, bodySnippets }\n}\n\nfunction useCachedPage(pageId: string \| null): PageType \| null {\n const client = useApiResourcesClient()\n const getSnapshot = () => (pageId == null ? null : client.readPage(pageId))\n\n const page = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n return page\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAmE;AAEnE,oBAA0E;AAG1E,uBAAsB;AAEtB,+BAA+B;AAC/B,sCAAsC;AAEtC,MAAM,8BAA8B,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,OAAgB;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAAS,gBAAgB,EAAE,KAAK,GAAoC;AACzE,QAAM,kBAAc,yCAAe;AACnC,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK,QAAQ;AAMtD,QAAM,aAAa,cAAc,cAAc,KAAK,KAAK,IAAI;AAC7D,8BAAU,MAAM;AACd,QAAI,cAAc;AAAM;AAExB,UAAM,cAAc,SAAS,IAAI,2BAA2B;AAC5D,UAAM,cAAc,WAAW,SAAS,IAAI,2BAA2B;AAEvE,YAAI,iBAAAA,SAAU,aAAa,WAAW;AAAG;AAEzC,gBAAY,WAAW,QAAQ;AAAA,EACjC,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,uBAAmB;AAAA,IACvB,MAAM,SAAS,OAAO,aAAY,cAAc,QAAQ,iBAAiB,QAAQ,WAAY;AAAA,IAC7F,CAAC,UAAU,WAAW;AAAA,EACxB;AAEA,QAAM,mBAAe;AAAA,IACnB,MAAM,iBAAiB,OAAO,aAAW,QAAQ,aAAa,8BAAgB,IAAI;AAAA,IAClF,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,mBAAe;AAAA,IACnB,MAAM,iBAAiB,OAAO,aAAW,QAAQ,aAAa,8BAAgB,IAAI;AAAA,IAClF,CAAC,gBAAgB;AAAA,EACnB;AAEA,SAAO,EAAE,cAAc,aAAa;AACtC;AAEA,SAAS,cAAc,QAAwC;AAC7D,QAAM,aAAS,uDAAsB;AACrC,QAAM,cAAc,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AAEzE,QAAM,WAAO,mCAAqB,OAAO,WAAW,aAAa,WAAW;AAE5E,SAAO;AACT;","names":["deepEqual"]}

package/dist/cjs/runtimes/react/components/page/PageHead.js CHANGED Viewed

@@ -23,7 +23,7 @@ __export(PageHead_exports, {
 module.exports = __toCommonJS(PageHead_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_host_api_client = require("../../host-api-client");
+var import_use_api_resources_client = require("../../hooks/use-api-resources-client");
 var import_use_framework_context = require("../hooks/use-framework-context");
 var import_use_is_in_builder = require("../../hooks/use-is-in-builder");
 var import_use_page_snippets = require("../hooks/use-page-snippets");
@@ -109,7 +109,7 @@ function PageHead({ document: page, metadata = {} }) {
   ] });
 }
 function useCachedSite(siteId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const getSnapshot = () => siteId == null ? null : client.readSite(siteId);
   const site = (0, import_react.useSyncExternalStore)(client.subscribe, getSnapshot, getSnapshot);
   return site;

package/dist/cjs/runtimes/react/components/page/PageHead.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../src/runtimes/react/components/page/PageHead.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore, ReactNode } from 'react'\n\nimport { type MakeswiftPageDocument } from '../../../../client'\nimport { type Site } from '../../../../api'\n\nimport { ~~useMakeswiftHostApiClient~~ } from '../../~~host~~-api-client'\n\nimport { useFrameworkContext } from '../hooks/use-framework-context'\nimport { useIsInBuilder } from '../../hooks/use-is-in-builder'\nimport { usePageSnippets } from '../hooks/use-page-snippets'\n\nimport { PageTitle, PageMeta, PageLink, PageStyle } from './head-tags'\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): ReactNode {\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 const { HeadSnippet } = useFrameworkContext()\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 && (\n <>\n <PageTitle>{title}</PageTitle>\n <PageMeta property=\"og:title\" content={title} />\n <PageMeta name=\"twitter:title\" content={title} />\n </>\n )}\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":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;~~AA+EM~~;~~AA/EN~~,mBAAyD;AAKzD,~~6BAA0C~~;~~AAE1C~~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~~kDAA0B~~;~~AACzC~~,QAAM,cAAc,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AAEzE,QAAM,WAAO,mCAAqB,OAAO,WAAW,aAAa,WAAW;AAE5E,SAAO;AACT;","names":[]}
1	+ {"version":3,"sources":["../../../../../../src/runtimes/react/components/page/PageHead.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore, ReactNode } from 'react'\n\nimport { type MakeswiftPageDocument } from '../../../../client'\nimport { type Site } from '../../../../api'\n\nimport { useApiResourcesClient } from '../../hooks/use-api-resources-client'\nimport { useFrameworkContext } from '../hooks/use-framework-context'\nimport { useIsInBuilder } from '../../hooks/use-is-in-builder'\nimport { usePageSnippets } from '../hooks/use-page-snippets'\n\nimport { PageTitle, PageMeta, PageLink, PageStyle } from './head-tags'\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): ReactNode {\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 const { HeadSnippet } = useFrameworkContext()\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 && (\n <>\n <PageTitle>{title}</PageTitle>\n <PageMeta property=\"og:title\" content={title} />\n <PageMeta name=\"twitter:title\" content={title} />\n </>\n )}\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 = useApiResourcesClient()\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/cjs/runtimes/react/hooks/makeswift-api.js CHANGED Viewed

@@ -31,10 +31,10 @@ __export(makeswift_api_exports, {
 });
 module.exports = __toCommonJS(makeswift_api_exports);
 var import_react = require("react");
-var import_host_api_client = require("../host-api-client");
+var import_use_api_resources_client = require("./use-api-resources-client");
 var import_use_document_context = require("./use-document-context");
 function useSwatch(swatchId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readSwatch = () => swatchId == null ? null : client.readSwatch(swatchId);
   const swatch = (0, import_react.useSyncExternalStore)(client.subscribe, readSwatch, readSwatch);
   (0, import_react.useEffect)(() => {
@@ -44,7 +44,7 @@ function useSwatch(swatchId) {
   return swatch;
 }
 function useSwatches(swatchIds) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const lastSnapshot = (0, import_react.useRef)(null);
   function getSnapshot() {
     const swatches2 = swatchIds.map((swatchId) => client.readSwatch(swatchId));
@@ -60,7 +60,7 @@ function useSwatches(swatchIds) {
   return swatches;
 }
 function useFile(fileId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readFile = () => fileId == null ? null : client.readFile(fileId);
   const file = (0, import_react.useSyncExternalStore)(client.subscribe, readFile, readFile);
   (0, import_react.useEffect)(() => {
@@ -70,7 +70,7 @@ function useFile(fileId) {
   return file;
 }
 function useFiles(fileIds) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const lastSnapshot = (0, import_react.useRef)(null);
   function getSnapshot() {
     const files2 = fileIds.map((fileId) => client.readFile(fileId));
@@ -86,7 +86,7 @@ function useFiles(fileIds) {
   return files;
 }
 function useTypography(typographyId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readTypography = () => typographyId == null ? null : client.readTypography(typographyId);
   const typography = (0, import_react.useSyncExternalStore)(client.subscribe, readTypography, readTypography);
   (0, import_react.useEffect)(() => {
@@ -96,7 +96,7 @@ function useTypography(typographyId) {
   return typography;
 }
 function useGlobalElement(globalElementId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readGlobalElement = () => globalElementId == null ? null : client.readGlobalElement(globalElementId);
   const globalElement = (0, import_react.useSyncExternalStore)(client.subscribe, readGlobalElement, readGlobalElement);
   (0, import_react.useEffect)(() => {
@@ -106,7 +106,7 @@ function useGlobalElement(globalElementId) {
   return globalElement;
 }
 function useLocalizedGlobalElement(locale, globalElementId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readLocalizedGlobalElement = () => locale == null || globalElementId == null ? null : client.readLocalizedGlobalElement({ globalElementId, locale });
   const localizedGlobalElement = (0, import_react.useSyncExternalStore)(
     client.subscribe,
@@ -121,7 +121,7 @@ function useLocalizedGlobalElement(locale, globalElementId) {
   return localizedGlobalElement;
 }
 function usePagePathnameSlice(pageId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const locale = (0, import_use_document_context.useDocumentLocale)();
   const readPagePathnameSlice = () => pageId == null ? null : client.readPagePathnameSlice({ pageId, locale });
   const pagePathnameSlice = (0, import_react.useSyncExternalStore)(
@@ -136,7 +136,7 @@ function usePagePathnameSlice(pageId) {
   return pagePathnameSlice;
 }
 function useTable(tableId) {
-  const client = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const client = (0, import_use_api_resources_client.useApiResourcesClient)();
   const readTable = () => tableId == null ? null : client.readTable(tableId);
   const table = (0, import_react.useSyncExternalStore)(client.subscribe, readTable, readTable);
   (0, import_react.useEffect)(() => {

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/runtimes/react/hooks/makeswift-api.ts"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef, useSyncExternalStore } from 'react'\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)[] \| null>(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)[] \| null>(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":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAwD;AAWxD,~~6BAA0C~~;~~AAC1C~~,kCAAkC;AAE3B,SAAS,UAAU,UAAwC;AAChE,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,aAAa,MAAO,YAAY,OAAO,OAAO,OAAO,WAAW,QAAQ;AAC9E,QAAM,aAAS,mCAAqB,OAAO,WAAW,YAAY,UAAU;AAE5E,8BAAU,MAAM;AACd,QAAI,YAAY;AAAM,aAAO,YAAY,QAAQ,EAAE,MAAM,QAAQ,KAAK;AAAA,EACxE,GAAG,CAAC,QAAQ,QAAQ,CAAC;AAErB,SAAO;AACT;AAEO,SAAS,YAAY,WAAwC;AAClE,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,mBAAe,qBAAiC,IAAI;AAE1D,WAAS,cAAc;AACrB,UAAMA,YAAW,UAAU,IAAI,cAAY,OAAO,WAAW,QAAQ,CAAC;AAEtE,QACE,aAAa,WAAW,QACxB,aAAa,QAAQ,WAAWA,UAAS,UACzC,aAAa,QAAQ,MAAM,CAAC,QAAQ,QAAQA,UAAS,GAAG,MAAM,MAAM,GACpE;AACA,aAAO,aAAa;AAAA,IACtB;AAEA,WAAQ,aAAa,UAAUA;AAAA,EACjC;AAEA,QAAM,eAAW,mCAAqB,OAAO,WAAW,aAAa,WAAW;AAEhF,8BAAU,MAAM;AACd,YAAQ,IAAI,UAAU,IAAI,cAAY,OAAO,YAAY,QAAQ,CAAC,CAAC,EAAE,MAAM,QAAQ,KAAK;AAAA,EAC1F,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,SAAO;AACT;AAEO,SAAS,QAAQ,QAAoC;AAC1D,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,WAAW,MAAO,UAAU,OAAO,OAAO,OAAO,SAAS,MAAM;AACtE,QAAM,WAAO,mCAAqB,OAAO,WAAW,UAAU,QAAQ;AAEtE,8BAAU,MAAM;AACd,QAAI,UAAU;AAAM,aAAO,UAAU,MAAM;AAAA,EAC7C,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACT;AAEO,SAAS,SAAS,SAAoC;AAC3D,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,mBAAe,qBAA+B,IAAI;AAExD,WAAS,cAAc;AACrB,UAAMC,SAAQ,QAAQ,IAAI,YAAU,OAAO,SAAS,MAAM,CAAC;AAE3D,QACE,aAAa,WAAW,QACxB,aAAa,QAAQ,WAAWA,OAAM,UACtC,aAAa,QAAQ,MAAM,CAAC,MAAM,QAAQA,OAAM,GAAG,MAAM,IAAI,GAC7D;AACA,aAAO,aAAa;AAAA,IACtB;AAEA,WAAQ,aAAa,UAAUA;AAAA,EACjC;AAEA,QAAM,YAAQ,mCAAqB,OAAO,WAAW,aAAa,WAAW;AAE7E,8BAAU,MAAM;AACd,YAAQ,IAAI,QAAQ,IAAI,YAAU,OAAO,UAAU,MAAM,CAAC,CAAC,EAAE,MAAM,QAAQ,KAAK;AAAA,EAClF,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,SAAO;AACT;AAEO,SAAS,cAAc,cAAgD;AAC5E,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,iBAAiB,MAAO,gBAAgB,OAAO,OAAO,OAAO,eAAe,YAAY;AAC9F,QAAM,iBAAa,mCAAqB,OAAO,WAAW,gBAAgB,cAAc;AAExF,8BAAU,MAAM;AACd,QAAI,gBAAgB;AAAM,aAAO,gBAAgB,YAAY,EAAE,MAAM,QAAQ,KAAK;AAAA,EACpF,GAAG,CAAC,QAAQ,YAAY,CAAC;AAEzB,SAAO;AACT;AAEO,SAAS,iBAAiB,iBAAsD;AACrF,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,oBAAoB,MACxB,mBAAmB,OAAO,OAAO,OAAO,kBAAkB,eAAe;AAC3E,QAAM,oBAAgB,mCAAqB,OAAO,WAAW,mBAAmB,iBAAiB;AAEjG,8BAAU,MAAM;AACd,QAAI,mBAAmB;AAAM,aAAO,mBAAmB,eAAe,EAAE,MAAM,QAAQ,KAAK;AAAA,EAC7F,GAAG,CAAC,QAAQ,eAAe,CAAC;AAE5B,SAAO;AACT;AAEO,SAAS,0BACd,QACA,iBAC+B;AAC/B,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,6BAA6B,MACjC,UAAU,QAAQ,mBAAmB,OACjC,OACA,OAAO,2BAA2B,EAAE,iBAAiB,OAAO,CAAC;AAEnE,QAAM,6BAAyB;AAAA,IAC7B,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF;AAEA,8BAAU,MAAM;AACd,QAAI,UAAU,QAAQ,mBAAmB,MAAM;AAC7C,aAAO,4BAA4B,EAAE,iBAAiB,OAAO,CAAC,EAAE,MAAM,QAAQ,KAAK;AAAA,IACrF;AAAA,EACF,GAAG,CAAC,QAAQ,QAAQ,eAAe,CAAC;AAEpC,SAAO;AACT;AAEO,SAAS,qBAAqB,QAAiD;AACpF,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,aAAS,+CAAkB;AAEjC,QAAM,wBAAwB,MAC5B,UAAU,OAAO,OAAO,OAAO,sBAAsB,EAAE,QAAQ,OAAO,CAAC;AAEzE,QAAM,wBAAoB;AAAA,IACxB,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF;AAEA,8BAAU,MAAM;AACd,QAAI,UAAU;AAAM,aAAO,uBAAuB,EAAE,QAAQ,OAAO,CAAC,EAAE,MAAM,QAAQ,KAAK;AAAA,EAC3F,GAAG,CAAC,QAAQ,QAAQ,MAAM,CAAC;AAE3B,SAAO;AACT;AAEO,SAAS,SAAS,SAAsC;AAC7D,QAAM,aAAS,~~kDAA0B~~;~~AACzC~~,QAAM,YAAY,MAAO,WAAW,OAAO,OAAO,OAAO,UAAU,OAAO;AAC1E,QAAM,YAAQ,mCAAqB,OAAO,WAAW,WAAW,SAAS;AAEzE,8BAAU,MAAM;AACd,QAAI,WAAW;AAAM,aAAO,WAAW,OAAO,EAAE,MAAM,QAAQ,KAAK;AAAA,EACrE,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,SAAO;AACT;","names":["swatches","files"]}
1	+ {"version":3,"sources":["../../../../../src/runtimes/react/hooks/makeswift-api.ts"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef, useSyncExternalStore } from 'react'\nimport {\n File,\n GlobalElement,\n LocalizedGlobalElement,\n PagePathnameSlice,\n Swatch,\n Table,\n Typography,\n} from '../../../api'\n\nimport { useApiResourcesClient } from './use-api-resources-client'\nimport { useDocumentLocale } from './use-document-context'\n\nexport function useSwatch(swatchId: string \| null): Swatch \| null {\n const client = useApiResourcesClient()\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 = useApiResourcesClient()\n const lastSnapshot = useRef<(Swatch \| null)[] \| null>(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 = useApiResourcesClient()\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 = useApiResourcesClient()\n const lastSnapshot = useRef<(File \| null)[] \| null>(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 = useApiResourcesClient()\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 = useApiResourcesClient()\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 = useApiResourcesClient()\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 = useApiResourcesClient()\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 = useApiResourcesClient()\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/{host-api-client.js → hooks/use-api-resources-client.js} RENAMED Viewed

@@ -17,17 +17,17 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var host_api_client_exports = {};
-__export(host_api_client_exports, {
-  useMakeswiftHostApiClient: () => useMakeswiftHostApiClient
+var use_api_resources_client_exports = {};
+__export(use_api_resources_client_exports, {
+  useApiResourcesClient: () => useApiResourcesClient
 });
-module.exports = __toCommonJS(host_api_client_exports);
-var import_use_store = require("./hooks/use-store");
-function useMakeswiftHostApiClient() {
-  return (0, import_use_store.useStore)().hostApiClient;
+module.exports = __toCommonJS(use_api_resources_client_exports);
+var import_use_store = require("./use-store");
+function useApiResourcesClient() {
+  return (0, import_use_store.useStore)().apiResourcesClient;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  useMakeswiftHostApiClient
+  useApiResourcesClient
 });
-//# sourceMappingURL=host-api-client.js.map
+//# sourceMappingURL=use-api-resources-client.js.map

package/dist/cjs/runtimes/react/hooks/use-api-resources-client.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../src/runtimes/react/hooks/use-api-resources-client.tsx"],"sourcesContent":["'use client'\n\nimport { ApiResourcesClient } from '../../../api/api-resources-client'\n\nimport { useStore } from './use-store'\n\nexport function useApiResourcesClient(): ApiResourcesClient {\n return useStore().apiResourcesClient\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,uBAAyB;AAElB,SAAS,wBAA4C;AAC1D,aAAO,2BAAS,EAAE;AACpB;","names":[]}

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

@@ -23,9 +23,9 @@ __export(use_cache_data_exports, {
 module.exports = __toCommonJS(use_cache_data_exports);
 var import_react = require("react");
 var import_read_write_actions = require("../../../state/actions/internal/read-write-actions");
-var import_host_api_client = require("../host-api-client");
+var import_use_api_resources_client = require("./use-api-resources-client");
 function useCacheData(cacheData) {
-  const { store: apiStore } = (0, import_host_api_client.useMakeswiftHostApiClient)();
+  const { store: apiStore } = (0, import_use_api_resources_client.useApiResourcesClient)();
   (0, import_react.useMemo)(() => apiStore.dispatch((0, import_read_write_actions.updateAPIClientCache)(cacheData)), [cacheData]);
 }
 // Annotate the CommonJS export names for ESM import in node: