@makeswift/runtime 0.9.11 → 0.10.0

package/dist/index.cjs.js

@@ -41,7 +41,7 @@ var dynamic = require("next/dynamic");
 var reactPage = require("./react-page.cjs.js");
 var actions = require("./actions.cjs.js");
 var jsxRuntime = require("react/jsx-runtime");
-var typography = require("./typography.cjs.js");
+var textInput = require("./text-input.cjs.js");
 var combobox = require("./combobox.cjs.js");
 require("slate");
 var shim = require("use-sync-external-store/shim");
@@ -67,6 +67,9 @@ var setCookieParser = require("set-cookie-parser");
 var constants = require("./constants.cjs.js");
 var uuid = require("uuid");
 var ipsum = require("corporate-ipsum");
+require("is-hotkey");
+require("slate-react");
+var NextLink = require("next/link");
 function _interopDefaultLegacy(e) {
   return e && typeof e === "object" && "default" in e ? e : { "default": e };
 }
@@ -101,6 +104,7 @@ var createEmotionServer__default = /* @__PURE__ */ _interopDefaultLegacy(createE
 var NextDocument__default = /* @__PURE__ */ _interopDefaultLegacy(NextDocument);
 var Cors__default = /* @__PURE__ */ _interopDefaultLegacy(Cors);
 var ipsum__default = /* @__PURE__ */ _interopDefaultLegacy(ipsum);
+var NextLink__default = /* @__PURE__ */ _interopDefaultLegacy(NextLink);
 const SCRIPT_TAG = "script";
 function BodySnippet({
   code,
@@ -145,43 +149,6 @@ function BodySnippet({
   }, [code, cleanup]);
   return null;
 }
-function is(x, y) {
-  if (x === y)
-    return x !== 0 || y !== 0 || 1 / x === 1 / y;
-  return x !== x && y !== y;
-}
-const { hasOwnProperty: hasOwnProperty$1 } = Object.prototype;
-const shallowEqual = (a, b) => {
-  if (is(a, b))
-    return true;
-  if (typeof a !== "object" || a === null || typeof b !== "object" || b === null)
-    return false;
-  const keysA = Object.keys(a);
-  const keysB = Object.keys(b);
-  if (keysA.length !== keysB.length)
-    return false;
-  for (let i = 0; i < keysA.length; i += 1) {
-    if (!hasOwnProperty$1.call(b, keysA[i]) || !is(a[keysA[i]], b[keysA[i]]))
-      return false;
-  }
-  return true;
-};
-const { hasOwnProperty } = Object.prototype;
-const deepEqual = (a, b) => {
-  if (shallowEqual(a, b))
-    return true;
-  if (typeof a !== "object" || a === null || typeof b !== "object" || b === null)
-    return false;
-  const keysA = Object.keys(a);
-  const keysB = Object.keys(b);
-  if (keysA.length !== keysB.length)
-    return false;
-  for (let i = 0; i < keysA.length; i += 1) {
-    if (!hasOwnProperty.call(b, keysA[i]) || !deepEqual(a[keysA[i]], b[keysA[i]]))
-      return false;
-  }
-  return true;
-};
 function getInitialState(serializedState = {
   Swatch: [],
   File: [],
@@ -216,7 +183,7 @@ function reducer$1(state = getInitialState(), action) {
     }
     case actions.ActionTypes.CHANGE_API_RESOURCE: {
       const existingApiResource = getAPIResource$1(state, action.payload.resource.__typename, action.payload.resource.id);
-      if (deepEqual(existingApiResource, action.payload.resource))
+      if (reactPage.deepEqual(existingApiResource, action.payload.resource))
         return state;
       return new Map(state).set(action.payload.resource.__typename, new Map(state.get(action.payload.resource.__typename)).set(action.payload.resource.id, action.payload.resource));
     }
@@ -657,7 +624,7 @@ function Page$1({
       return;
     const oldSnippets = snippets.map(filterUsedSnippetProperties);
     const newSnippets = cachedPage.snippets.map(filterUsedSnippetProperties);
-    if (deepEqual(newSnippets, oldSnippets))
+    if (reactPage.deepEqual(newSnippets, oldSnippets))
       return;
     setSnippets(cachedPage.snippets);
   }, [cachedPage]);
@@ -1053,8 +1020,8 @@ Received "${apiKey}" instead.`);
       getResourcesFromElementDescriptors(elementDescriptors, element2.props);
     }
     const typographies = await this.getTypographies([...typographyIds]);
-    typographies.forEach((typography2) => {
-      typography2 == null ? void 0 : typography2.style.forEach((style) => {
+    typographies.forEach((typography) => {
+      typography == null ? void 0 : typography.style.forEach((style) => {
         var _a;
         const swatchId = (_a = style.value.color) == null ? void 0 : _a.swatchId;
         if (swatchId != null)
@@ -1089,7 +1056,7 @@ Received "${apiKey}" instead.`);
         var _a;
         return {
           id,
-          value: (_a = typographies.find((typography2) => (typography2 == null ? void 0 : typography2.id) === id)) != null ? _a : null
+          value: (_a = typographies.find((typography) => (typography == null ? void 0 : typography.id) === id)) != null ? _a : null
         };
       }),
       [types.APIResourceType.Table]: [...tableIds].map((id) => {
@@ -1121,12 +1088,19 @@ Received "${apiKey}" instead.`);
     preview: previewOverride = false,
     unstable_locale
   } = {}) {
-    var _a;
+    var _a, _b;
     const isUsingVersioning = this.siteVersion != null;
     const siteVersion = (_a = this.siteVersion) != null ? _a : previewOverride ? MakeswiftSiteVersion.Working : MakeswiftSiteVersion.Live;
+    const defaultLocale = (_b = reactPage.getDefaultLocale(this.runtime.store.getState())) == null ? void 0 : _b.toString();
+    const locale = unstable_locale === defaultLocale ? null : unstable_locale;
     const searchParams = new URLSearchParams();
-    if (unstable_locale)
-      searchParams.set("locale", unstable_locale);
+    if (locale) {
+      const locales = reactPage.getLocales(this.runtime.store.getState()).map((locale2) => locale2.toString());
+      if (!locales.includes(locale)) {
+        throw new Error(`Locale "${locale}" is not included in the locales: ${locales}. Please add the locale to the locales on the ReactRuntime.`);
+      }
+      searchParams.set("locale", locale);
+    }
     const response = await this.fetch(`/${isUsingVersioning ? "v3" : "v2"}/pages/${encodeURIComponent(pathname)}/document?${searchParams.toString()}`, {
       headers: { "Makeswift-Site-Version": siteVersion }
     });
@@ -1146,7 +1120,7 @@ Received "${apiKey}" instead.`);
       apiOrigin,
       preview,
       localizedResourcesMap,
-      locale: unstable_locale != null ? unstable_locale : null
+      locale: locale != null ? locale : null
     };
   }
   async getSwatch(swatchId) {
@@ -1240,7 +1214,7 @@ async function fonts(_req, res, { getFonts } = {}) {
   const fonts2 = (_a = await (getFonts == null ? void 0 : getFonts())) != null ? _a : [];
   return res.json(fonts2);
 }
-const version = "0.9.11";
+const version = "0.10.0";
 async function handler(req, res, { apiKey, unstable_siteVersions }) {
   if (req.query.secret !== apiKey) {
     return res.status(401).json({ message: "Unauthorized" });
@@ -2416,6 +2390,211 @@ function registerComponent$2(runtime) {
     }
   });
 }
+function useSwatch(swatchId) {
+  const client = useMakeswiftClient();
+  const readSwatch = () => swatchId == null ? null : client.readSwatch(swatchId);
+  const swatch = shim.useSyncExternalStore(client.subscribe, readSwatch, readSwatch);
+  React.useEffect(() => {
+    if (swatchId != null)
+      client.fetchSwatch(swatchId).catch(console.error);
+  }, [client, swatchId]);
+  return swatch;
+}
+function useSwatches(swatchIds) {
+  const client = useMakeswiftClient();
+  const lastSnapshot = React.useRef();
+  function getSnapshot() {
+    const swatches2 = swatchIds.map((swatchId) => client.readSwatch(swatchId));
+    if (lastSnapshot.current != null && lastSnapshot.current.length === swatches2.length && lastSnapshot.current.every((swatch, idx) => swatches2[idx] === swatch)) {
+      return lastSnapshot.current;
+    }
+    return lastSnapshot.current = swatches2;
+  }
+  const swatches = shim.useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot);
+  React.useEffect(() => {
+    Promise.all(swatchIds.map((swatchId) => client.fetchSwatch(swatchId))).catch(console.error);
+  }, [client, swatchIds]);
+  return swatches;
+}
+function useFile(fileId) {
+  const client = useMakeswiftClient();
+  const readFile = () => fileId == null ? null : client.readFile(fileId);
+  const file = shim.useSyncExternalStore(client.subscribe, readFile, readFile);
+  React.useEffect(() => {
+    if (fileId != null)
+      client.fetchFile(fileId);
+  }, [client, fileId]);
+  return file;
+}
+function useFiles(fileIds) {
+  const client = useMakeswiftClient();
+  const lastSnapshot = React.useRef();
+  function getSnapshot() {
+    const files2 = fileIds.map((fileId) => client.readFile(fileId));
+    if (lastSnapshot.current != null && lastSnapshot.current.length === files2.length && lastSnapshot.current.every((file, idx) => files2[idx] === file)) {
+      return lastSnapshot.current;
+    }
+    return lastSnapshot.current = files2;
+  }
+  const files = shim.useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot);
+  React.useEffect(() => {
+    Promise.all(fileIds.map((fileId) => client.fetchFile(fileId))).catch(console.error);
+  }, [client, fileIds]);
+  return files;
+}
+function useTypography(typographyId) {
+  const client = useMakeswiftClient();
+  const readTypography = () => typographyId == null ? null : client.readTypography(typographyId);
+  const typography = shim.useSyncExternalStore(client.subscribe, readTypography, readTypography);
+  React.useEffect(() => {
+    if (typographyId != null)
+      client.fetchTypography(typographyId).catch(console.error);
+  }, [client, typographyId]);
+  return typography;
+}
+function useGlobalElement(globalElementId) {
+  const client = useMakeswiftClient();
+  const readGlobalElement = () => globalElementId == null ? null : client.readGlobalElement(globalElementId);
+  const globalElement = shim.useSyncExternalStore(client.subscribe, readGlobalElement, readGlobalElement);
+  React.useEffect(() => {
+    if (globalElementId != null)
+      client.fetchGlobalElement(globalElementId).catch(console.error);
+  }, [client, globalElementId]);
+  return globalElement;
+}
+function useLocalizedGlobalElement(globalElementId) {
+  const client = useMakeswiftClient();
+  const readLocalizedGlobalElement = () => globalElementId == null ? null : client.readLocalizedGlobalElement(globalElementId);
+  const localizedGlobalElement = shim.useSyncExternalStore(client.subscribe, readLocalizedGlobalElement, readLocalizedGlobalElement);
+  React.useEffect(() => {
+    if (globalElementId != null) {
+      client.fetchLocalizedGlobalElement(globalElementId).catch(console.error);
+    }
+  }, [client, globalElementId]);
+  return localizedGlobalElement;
+}
+function usePagePathnameSlice(pageId) {
+  const client = useMakeswiftClient();
+  const readPagePathnameSlice = () => pageId == null ? null : client.readPagePathnameSlice(pageId);
+  const pagePathnameSlice = shim.useSyncExternalStore(client.subscribe, readPagePathnameSlice, readPagePathnameSlice);
+  React.useEffect(() => {
+    if (pageId != null)
+      client.fetchPagePathnameSlice(pageId).catch(console.error);
+  }, [client, pageId]);
+  return pagePathnameSlice;
+}
+function useTable(tableId) {
+  const client = useMakeswiftClient();
+  const readTable = () => tableId == null ? null : client.readTable(tableId);
+  const table = shim.useSyncExternalStore(client.subscribe, readTable, readTable);
+  React.useEffect(() => {
+    if (tableId != null)
+      client.fetchTable(tableId).catch(console.error);
+  }, [client, tableId]);
+  return table;
+}
+const Link = React.forwardRef(function Link2(_e, ref) {
+  var _f = _e, {
+    link,
+    onClick = () => {
+    }
+  } = _f, restOfProps = __objRest(_f, [
+    "link",
+    "onClick"
+  ]);
+  var _a;
+  const pageId = link && link.type === "OPEN_PAGE" ? link.payload.pageId : null;
+  const page = usePagePathnameSlice(pageId != null ? pageId : null);
+  const elementKey = (link == null ? void 0 : link.type) === "SCROLL_TO_ELEMENT" ? (_a = link.payload.elementIdConfig) == null ? void 0 : _a.elementKey : null;
+  const elementId = useElementId(elementKey);
+  let useNextLink;
+  let href;
+  let target;
+  let block;
+  if (link) {
+    switch (link.type) {
+      case "OPEN_PAGE": {
+        if (page) {
+          useNextLink = true;
+          href = `/${page.pathname}`;
+        }
+        target = link.payload.openInNewTab ? "_blank" : "_self";
+        break;
+      }
+      case "OPEN_URL": {
+        useNextLink = true;
+        href = link.payload.url;
+        target = link.payload.openInNewTab ? "_blank" : "_self";
+        break;
+      }
+      case "SEND_EMAIL": {
+        useNextLink = false;
+        const {
+          to,
+          subject = "",
+          body = ""
+        } = link.payload;
+        if (to != null)
+          href = `mailto:${to}?subject=${subject}&body=${body}`;
+        break;
+      }
+      case "CALL_PHONE": {
+        useNextLink = false;
+        href = `tel:${link.payload.phoneNumber}`;
+        break;
+      }
+      case "SCROLL_TO_ELEMENT": {
+        useNextLink = false;
+        href = `#${elementId != null ? elementId : ""}`;
+        block = link.payload.block;
+        break;
+      }
+      default:
+        throw new RangeError(`Invalid link type "${link.type}."`);
+    }
+  }
+  function handleClick(event) {
+    onClick(event);
+    if (event.defaultPrevented)
+      return;
+    if (event.currentTarget.isContentEditable)
+      return event.preventDefault();
+    if (link && link.type === "SCROLL_TO_ELEMENT") {
+      let hash;
+      try {
+        if (href != null)
+          hash = new URL(`http://www.example.com/${href}`).hash;
+      } catch (error) {
+        console.error(`Link received invalid href: ${href}`, error);
+      }
+      if (href != null && hash != null && href === hash) {
+        event.preventDefault();
+        const view = event.view;
+        scrollIntoView__default["default"](view.document.querySelector(hash), {
+          behavior: "smooth",
+          block
+        });
+        if (view.location.hash !== hash)
+          view.history.pushState({}, "", hash);
+      }
+    }
+  }
+  if (useNextLink && href != null) {
+    return /* @__PURE__ */ jsxRuntime.jsx(NextLink__default["default"], __spreadProps(__spreadValues({}, restOfProps), {
+      ref,
+      target,
+      onClick: handleClick,
+      href,
+      legacyBehavior: false
+    }));
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("a", __spreadProps(__spreadValues({}, restOfProps), {
+    ref,
+    href,
+    target,
+    onClick: handleClick
+  }));
+});
 function registerComponent$1(runtime) {
   return runtime.registerComponent(forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
     return require("./Text.cjs.js");
@@ -2424,52 +2603,36 @@ function registerComponent$1(runtime) {
     label: "Text",
     props: {
       id: reactPage.ElementID(),
-      text: reactPage.RichText(() => ({
-        preset: {
-          document: {
-            object: "document",
-            nodes: [
+      text: reactPage.RichText({
+        unstable_defaultValue: [
+          {
+            type: reactPage.BlockType.Default,
+            children: [
               {
-                object: "block",
-                type: "paragraph",
-                nodes: [
-                  {
-                    object: "text",
-                    text: ipsum__default["default"](3),
-                    marks: [
+                text: ipsum__default["default"](3),
+                typography: {
+                  style: [
+                    {
+                      deviceId: state_breakpoints.getBaseBreakpoint(runtime.getBreakpoints()).id,
+                      value: {
+                        fontWeight: 400,
+                        fontSize: { value: 18, unit: "px" },
+                        lineHeight: 1.5
+                      }
+                    },
+                    ...runtime.getBreakpoints().some(({ id }) => id === state_breakpoints.DefaultBreakpointID.Mobile) ? [
                       {
-                        object: "mark",
-                        type: "typography",
-                        data: {
-                          value: {
-                            id: null,
-                            style: [
-                              {
-                                deviceId: state_breakpoints.getBaseBreakpoint(runtime.getBreakpoints()).id,
-                                value: {
-                                  fontWeight: 400,
-                                  fontSize: { value: 18, unit: "px" },
-                                  lineHeight: 1.5
-                                }
-                              },
-                              ...runtime.getBreakpoints().some(({ id }) => id === state_breakpoints.DefaultBreakpointID.Mobile) ? [
-                                {
-                                  deviceId: state_breakpoints.DefaultBreakpointID.Mobile,
-                                  value: { fontSize: { value: 16, unit: "px" } }
-                                }
-                              ] : []
-                            ]
-                          }
-                        }
+                        deviceId: state_breakpoints.DefaultBreakpointID.Mobile,
+                        value: { fontSize: { value: 16, unit: "px" } }
                       }
-                    ]
-                  }
-                ]
+                    ] : []
+                  ]
+                }
               }
             ]
           }
-        }
-      })),
+        ]
+      }),
       width: reactPage.Width({
         format: reactPage.Width.Format.ClassName,
         preset: [
@@ -2597,115 +2760,15 @@ const FallbackComponent = React.forwardRef(function FallbackComponent2({
     })]
   });
 });
-function useSwatch(swatchId) {
-  const client = useMakeswiftClient();
-  const readSwatch = () => swatchId == null ? null : client.readSwatch(swatchId);
-  const swatch = shim.useSyncExternalStore(client.subscribe, readSwatch, readSwatch);
-  React.useEffect(() => {
-    if (swatchId != null)
-      client.fetchSwatch(swatchId).catch(console.error);
-  }, [client, swatchId]);
-  return swatch;
-}
-function useSwatches(swatchIds) {
-  const client = useMakeswiftClient();
-  const lastSnapshot = React.useRef();
-  function getSnapshot() {
-    const swatches2 = swatchIds.map((swatchId) => client.readSwatch(swatchId));
-    if (lastSnapshot.current != null && lastSnapshot.current.length === swatches2.length && lastSnapshot.current.every((swatch, idx) => swatches2[idx] === swatch)) {
-      return lastSnapshot.current;
-    }
-    return lastSnapshot.current = swatches2;
-  }
-  const swatches = shim.useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot);
-  React.useEffect(() => {
-    Promise.all(swatchIds.map((swatchId) => client.fetchSwatch(swatchId))).catch(console.error);
-  }, [client, swatchIds]);
-  return swatches;
-}
-function useFile(fileId) {
-  const client = useMakeswiftClient();
-  const readFile = () => fileId == null ? null : client.readFile(fileId);
-  const file = shim.useSyncExternalStore(client.subscribe, readFile, readFile);
-  React.useEffect(() => {
-    if (fileId != null)
-      client.fetchFile(fileId);
-  }, [client, fileId]);
-  return file;
-}
-function useFiles(fileIds) {
-  const client = useMakeswiftClient();
-  const lastSnapshot = React.useRef();
-  function getSnapshot() {
-    const files2 = fileIds.map((fileId) => client.readFile(fileId));
-    if (lastSnapshot.current != null && lastSnapshot.current.length === files2.length && lastSnapshot.current.every((file, idx) => files2[idx] === file)) {
-      return lastSnapshot.current;
-    }
-    return lastSnapshot.current = files2;
-  }
-  const files = shim.useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot);
-  React.useEffect(() => {
-    Promise.all(fileIds.map((fileId) => client.fetchFile(fileId))).catch(console.error);
-  }, [client, fileIds]);
-  return files;
-}
-function useTypography(typographyId) {
-  const client = useMakeswiftClient();
-  const readTypography = () => typographyId == null ? null : client.readTypography(typographyId);
-  const typography2 = shim.useSyncExternalStore(client.subscribe, readTypography, readTypography);
-  React.useEffect(() => {
-    if (typographyId != null)
-      client.fetchTypography(typographyId).catch(console.error);
-  }, [client, typographyId]);
-  return typography2;
-}
-function useGlobalElement(globalElementId) {
-  const client = useMakeswiftClient();
-  const readGlobalElement = () => globalElementId == null ? null : client.readGlobalElement(globalElementId);
-  const globalElement = shim.useSyncExternalStore(client.subscribe, readGlobalElement, readGlobalElement);
-  React.useEffect(() => {
-    if (globalElementId != null)
-      client.fetchGlobalElement(globalElementId).catch(console.error);
-  }, [client, globalElementId]);
-  return globalElement;
-}
-function useLocalizedGlobalElement(globalElementId) {
-  const client = useMakeswiftClient();
-  const readLocalizedGlobalElement = () => globalElementId == null ? null : client.readLocalizedGlobalElement(globalElementId);
-  const localizedGlobalElement = shim.useSyncExternalStore(client.subscribe, readLocalizedGlobalElement, readLocalizedGlobalElement);
-  React.useEffect(() => {
-    if (globalElementId != null) {
-      client.fetchLocalizedGlobalElement(globalElementId).catch(console.error);
-    }
-  }, [client, globalElementId]);
-  return localizedGlobalElement;
-}
-function usePagePathnameSlice(pageId) {
-  const client = useMakeswiftClient();
-  const readPagePathnameSlice = () => pageId == null ? null : client.readPagePathnameSlice(pageId);
-  const pagePathnameSlice = shim.useSyncExternalStore(client.subscribe, readPagePathnameSlice, readPagePathnameSlice);
-  React.useEffect(() => {
-    if (pageId != null)
-      client.fetchPagePathnameSlice(pageId).catch(console.error);
-  }, [client, pageId]);
-  return pagePathnameSlice;
-}
-function useTable(tableId) {
-  const client = useMakeswiftClient();
-  const readTable = () => tableId == null ? null : client.readTable(tableId);
-  const table = shim.useSyncExternalStore(client.subscribe, readTable, readTable);
-  React.useEffect(() => {
-    if (tableId != null)
-      client.fetchTable(tableId).catch(console.error);
-  }, [client, tableId]);
-  return table;
+function isNonNullable(value) {
+  return value != null;
 }
-function mapSideColor(swatches, _e) {
-  var _f = _e, { color } = _f, restOfSide = __objRest(_f, ["color"]);
+function mapSideColor(swatches, _g) {
+  var _h = _g, { color } = _h, restOfSide = __objRest(_h, ["color"]);
   return __spreadProps(__spreadValues({}, restOfSide), {
     color: color && {
       alpha: color.alpha,
-      swatch: swatches.filter(reactPage.isNonNullable).find((s) => s && s.id === color.swatchId)
+      swatch: swatches.filter(isNonNullable).find((s) => s && s.id === color.swatchId)
     }
   });
 }
@@ -2751,7 +2814,7 @@ function useBoxShadow(value) {
         return __spreadProps(__spreadValues({}, restOfShadow), {
           payload: {
             color: color != null ? {
-              swatch: swatches.filter(reactPage.isNonNullable).find((s) => s && s.id === color.swatchId),
+              swatch: swatches.filter(isNonNullable).find((s) => s && s.id === color.swatchId),
               alpha: color.alpha
             } : null,
             inset: inset != null ? inset : ShadowDefaultValue.inset,
@@ -2775,7 +2838,7 @@ function useResponsiveColor(color) {
     const { swatchId, alpha } = v;
     const swatch = swatches.find((s) => s && s.id === swatchId);
     return swatch == null ? null : __spreadProps(__spreadValues({}, rest), { value: { swatch, alpha } });
-  }).filter(reactPage.isNonNullable);
+  }).filter(isNonNullable);
 }
 const getIndexes = (spans, index) => {
   const flattened = spans.reduce((a, s) => a.concat(s), []);
@@ -3081,7 +3144,7 @@ function useFormattedStyle(styleControlData, controlDefinition, control) {
         return;
       const element = document.querySelector(`.${guid}`);
       const measuredBoxModel = element == null ? null : boxModels.getBox(element);
-      if (!deepEqual(currentBoxModel, measuredBoxModel)) {
+      if (!reactPage.deepEqual(currentBoxModel, measuredBoxModel)) {
         currentBoxModel = measuredBoxModel;
         control.changeBoxModel(currentBoxModel);
       }
@@ -3233,8 +3296,11 @@ function ListControlValue({
 function useNumber(numberControlData, controlDefinition) {
   return numberControlData != null ? numberControlData : controlDefinition.config.defaultValue;
 }
-const Text = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
-  return require("./index.cjs8.js");
+const EditableText$1 = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
+  return require("./index.cjs7.js");
+}))));
+const ReadOnlyText$1 = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
+  return require("./ReadOnlyText.cjs.js");
 }))));
 function useRichText(data, control) {
   const textCallbackRef = React.useCallback((handle) => {
@@ -3244,13 +3310,17 @@ function useRichText(data, control) {
         text: control
       });
   }, [control]);
-  return /* @__PURE__ */ jsxRuntime.jsx(Text, {
+  const isPreview = useIsPreview();
+  return isPreview ? /* @__PURE__ */ jsxRuntime.jsx(EditableText$1, {
+    text: data,
+    ref: textCallbackRef
+  }) : /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyText$1, {
     text: data,
     ref: textCallbackRef
   });
 }
 const EditableText = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
-  return require("./index.cjs9.js");
+  return require("./index.cjs8.js");
 }))));
 const ReadOnlyText = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
   return require("./ReadOnlyTextV2.cjs.js");
@@ -3271,7 +3341,7 @@ function useRichTextV2(data, definition, control) {
     control
   }) : /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyText, {
     text: data,
-    control
+    definition
   });
 }
 function useSelectControlValue(data, definition) {
@@ -3299,7 +3369,7 @@ function pollBoxModel({
   let currentBoxModel = null;
   const handleAnimationFrameRequest = () => {
     const measuredBoxModel = boxModels.getBox(element);
-    if (!deepEqual(currentBoxModel, measuredBoxModel)) {
+    if (!reactPage.deepEqual(currentBoxModel, measuredBoxModel)) {
       currentBoxModel = measuredBoxModel;
       onBoxModelChange(currentBoxModel);
     }
@@ -3329,13 +3399,13 @@ function useSlot(data, control) {
     }, element.key))
   });
 }
-function Slot(_g) {
-  var _h = _g, {
+function Slot(_i) {
+  var _j = _i, {
     as,
     control,
     children,
     className
-  } = _h, restOfProps = __objRest(_h, [
+  } = _j, restOfProps = __objRest(_j, [
     "as",
     "control",
     "children",
@@ -3364,15 +3434,15 @@ function Slot(_g) {
 }
 Slot.Placeholder = SlotPlaceholder;
 Slot.Item = SlotItem;
-function SlotItem(_i) {
-  var _j = _i, {
+function SlotItem(_k) {
+  var _l = _k, {
     as,
     control,
     grid,
     index,
     children,
     className
-  } = _j, restOfProps = __objRest(_j, [
+  } = _l, restOfProps = __objRest(_l, [
     "as",
     "control",
     "grid",
@@ -3497,15 +3567,12 @@ function useTextAreaValue(data, definition) {
 function useTextInputValue(data, definition) {
   return data != null ? data : definition.config.defaultValue;
 }
-function isNonNullable(value) {
-  return value != null;
-}
-function typographyFragementToTypographyControlData(typography2) {
-  if (typography2 == null)
+function typographyFragementToTypographyControlData(typography) {
+  if (typography == null)
     return void 0;
   return {
-    id: typography2.id,
-    style: typography2.style.map(({ deviceId, value }) => {
+    id: typography.id,
+    style: typography.style.map(({ deviceId, value }) => {
       var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
       return {
         deviceId,
@@ -3531,7 +3598,7 @@ function getTypographyStyleSwatchIds(style) {
   return (_a = style == null ? void 0 : style.map((override) => override.value).flatMap((typographyStyle) => {
     var _a2;
     return (_a2 = typographyStyle.color) == null ? void 0 : _a2.swatchId;
-  }).filter(isNonNullable)) != null ? _a : [];
+  }).filter(reactPage.isNonNullable)) != null ? _a : [];
 }
 const withColor = (swatches) => (deviceRawTypographyValue) => {
   var _b, _c;
@@ -3559,15 +3626,15 @@ const withColor = (swatches) => (deviceRawTypographyValue) => {
 const getDeviceId = ({ deviceId }) => deviceId;
 function useEnhancedTypography(value) {
   var _a, _b, _c;
-  const typography2 = typographyFragementToTypographyControlData(useTypography((_a = value == null ? void 0 : value.id) != null ? _a : null));
-  const source = (_b = typography2 == null ? void 0 : typography2.style) != null ? _b : [];
+  const typography = typographyFragementToTypographyControlData(useTypography((_a = value == null ? void 0 : value.id) != null ? _a : null));
+  const source = (_b = typography == null ? void 0 : typography.style) != null ? _b : [];
   const override = (_c = value == null ? void 0 : value.style) != null ? _c : [];
   const breakpoints = useBreakpoints();
   const swatchIds = [
     ...getTypographyStyleSwatchIds(value == null ? void 0 : value.style),
-    ...getTypographyStyleSwatchIds(typography2 == null ? void 0 : typography2.style)
+    ...getTypographyStyleSwatchIds(typography == null ? void 0 : typography.style)
   ];
-  const swatches = useSwatches(swatchIds).filter(isNonNullable);
+  const swatches = useSwatches(swatchIds).filter(reactPage.isNonNullable);
   const enhancedSource = source.map(withColor(swatches));
   const enhancedOverride = override.map(withColor(swatches));
   const devices = [
@@ -3594,7 +3661,7 @@ function useEnhancedTypography(value) {
       };
     }
     return null;
-  }).filter(isNonNullable);
+  }).filter(reactPage.isNonNullable);
 }
 function useTypographyClassName(value) {
   return reactPage.useStyle(useResponsiveStyle([value], ([value2]) => {
@@ -3636,31 +3703,31 @@ function ControlValue({
   control
 }) {
   switch (definition.type) {
-    case typography.CheckboxControlType:
+    case textInput.CheckboxControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useCheckboxControlValue,
         parameters: [data, definition],
         children: (value) => children(value)
       }, definition.type);
-    case typography.NumberControlType:
+    case textInput.NumberControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useNumber,
         parameters: [data, definition],
         children: (value) => children(value)
       }, definition.type);
-    case typography.TextInputControlType:
+    case textInput.TextInputControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useTextInputValue,
         parameters: [data, definition],
         children: (value) => children(value)
       }, definition.type);
-    case typography.TextAreaControlType:
+    case textInput.TextAreaControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useTextAreaValue,
         parameters: [data, definition],
         children: (value) => children(value)
       }, definition.type);
-    case typography.SelectControlType:
+    case reactPage.SelectControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useSelectControlValue,
         parameters: [data, definition],
@@ -3672,7 +3739,7 @@ function ControlValue({
         parameters: [data, definition],
         children: (value) => children(value)
       }, definition.type);
-    case typography.IconRadioGroupControlType:
+    case reactPage.IconRadioGroupControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useIconRadioGroupValue,
         parameters: [data, definition],
@@ -3741,7 +3808,7 @@ function ControlValue({
         parameters: [data, definition, control],
         children: (value) => children(value)
       }, definition.type);
-    case typography.TypographyControlType:
+    case reactPage.TypographyControlType:
       return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
         hook: useTypographyValue,
         parameters: [data],
@@ -3788,20 +3855,20 @@ function PropsValue({
   return Object.entries(propControllerDescriptorsRef.current).reduceRight((renderFn, [propName, descriptor]) => (propsValue) => {
     var _a2, _b, _c, _d;
     switch (descriptor.type) {
-      case typography.CheckboxControlType:
-      case typography.NumberControlType:
-      case typography.TextInputControlType:
-      case typography.TextAreaControlType:
-      case typography.SelectControlType:
+      case textInput.CheckboxControlType:
+      case textInput.NumberControlType:
+      case textInput.TextInputControlType:
+      case textInput.TextAreaControlType:
+      case reactPage.SelectControlType:
       case reactPage.ColorControlType:
-      case typography.IconRadioGroupControlType:
+      case reactPage.IconRadioGroupControlType:
       case reactPage.ImageControlType:
       case combobox.ComboboxControlType:
       case reactPage.ShapeControlType:
       case reactPage.ListControlType:
       case reactPage.LinkControlType:
       case reactPage.StyleV2ControlType:
-      case typography.TypographyControlType:
+      case reactPage.TypographyControlType:
         return /* @__PURE__ */ jsxRuntime.jsx(ControlValue, {
           definition: descriptor,
           data: props[propName],
@@ -4093,10 +4160,10 @@ const PreviewProvider = dynamic__default["default"](() => Promise.resolve().then
 const LiveProvider = dynamic__default["default"](() => Promise.resolve().then(function() {
   return require("./LiveProvider.cjs.js");
 }));
-function RuntimeProvider(_k) {
-  var _l = _k, {
+function RuntimeProvider(_m) {
+  var _n = _m, {
     preview
-  } = _l, props = __objRest(_l, [
+  } = _n, props = __objRest(_n, [
     "preview"
   ]);
   return preview ? /* @__PURE__ */ jsxRuntime.jsx(PreviewProvider, __spreadValues({}, props)) : /* @__PURE__ */ jsxRuntime.jsx(LiveProvider, __spreadValues({}, props));
@@ -4313,6 +4380,7 @@ exports.Document = Document$1;
 exports.DocumentReference = DocumentReference;
 exports.Element = Element$1;
 exports.ElementImperativeHandle = ElementImperativeHandle;
+exports.Link = Link;
 exports.Makeswift = Makeswift;
 exports.MakeswiftApiHandler = MakeswiftApiHandler;
 exports.MakeswiftProvider = MakeswiftProvider;
@@ -4327,27 +4395,23 @@ exports.Shapes = Shapes;
 exports.Sizes = Sizes;
 exports.StoreContext = StoreContext;
 exports.colorToString = colorToString;
-exports.deepEqual = deepEqual;
 exports.forwardNextDynamicRef = forwardNextDynamicRef;
 exports.getServerSideProps = getServerSideProps;
 exports.getStaticPaths = getStaticPaths;
 exports.getStaticProps = getStaticProps;
+exports.isNonNullable = isNonNullable;
 exports.pollBoxModel = pollBoxModel;
-exports.shallowEqual = shallowEqual;
 exports.useBorder = useBorder;
 exports.useBoxShadow = useBoxShadow;
 exports.useBreakpoints = useBreakpoints;
 exports.useBuilderEditMode = useBuilderEditMode;
-exports.useElementId = useElementId;
 exports.useEnhancedTypography = useEnhancedTypography;
 exports.useFile = useFile;
 exports.useFiles = useFiles;
 exports.useFormContext = useFormContext;
 exports.useIsInBuilder = useIsInBuilder;
-exports.useIsPreview = useIsPreview;
 exports.useMakeswiftClient = useMakeswiftClient;
 exports.usePageId = usePageId;
-exports.usePagePathnameSlice = usePagePathnameSlice;
 exports.useResponsiveColor = useResponsiveColor;
 exports.useResponsiveGridItem = useResponsiveGridItem;
 exports.useResponsiveStyle = useResponsiveStyle;