@makeswift/runtime 0.5.5 → 0.6.0

package/dist/index.cjs.js

@@ -42,13 +42,14 @@ var dynamic = require("next/dynamic");
 var constants = require("./constants.cjs.js");
 var actions = require("./actions.cjs.js");
 var css = require("@emotion/css");
+var serialize = require("@emotion/serialize");
+var utils = require("@emotion/utils");
 var jsxRuntime = require("react/jsx-runtime");
 var slot = require("./slot.cjs.js");
 var textInput = require("./text-input.cjs.js");
 var combobox = require("./combobox.cjs.js");
 var control = require("./control.cjs.js");
 var shim = require("use-sync-external-store/shim");
-var slate = require("slate");
 var redux = require("redux");
 var thunk = require("redux-thunk");
 var types = require("./types.cjs.js");
@@ -656,7 +657,6 @@ class MakeswiftClient {
   async prefetch(element) {
     const introspectionData = await introspect(element, this, storeContextDefaultValue);
     await this.makeswiftApiClient.dispatch(fetchIntrospectedResources(introspectionData));
-    slate.KeyUtils.resetGenerator();
     return getSerializedState(this.makeswiftApiClient.getState());
   }
   readSwatch(swatchId) {
@@ -1050,7 +1050,6 @@ if (originalUrl.searchParams.has(searchParamName)) {
 class Document$1 extends NextDocument__default["default"] {
   static async getInitialProps(ctx) {
     const initialProps = await NextDocument__default["default"].getInitialProps(ctx);
-    slate.KeyUtils.resetGenerator();
     const {
       extractCritical
     } = createEmotionServer__default["default"](css.cache);
@@ -1084,7 +1083,7 @@ class Document$1 extends NextDocument__default["default"] {
     });
   }
 }
-const version = "0.5.5";
+const version = "0.6.0";
 function isErrorWithMessage(error) {
   return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
 }
@@ -2367,279 +2366,20 @@ function registerBuiltinComponents(runtime) {
     unregisterRootComponent();
     unregisterSocialLinksComponent();
     unregisterTextComponent();
-    unregisterTextComponent();
     unregisterVideoComponent();
   };
 }
-function murmur2(str) {
-  var h = 0;
-  var k, i = 0, len = str.length;
-  for (; len >= 4; ++i, len -= 4) {
-    k = str.charCodeAt(i) & 255 | (str.charCodeAt(++i) & 255) << 8 | (str.charCodeAt(++i) & 255) << 16 | (str.charCodeAt(++i) & 255) << 24;
-    k = (k & 65535) * 1540483477 + ((k >>> 16) * 59797 << 16);
-    k ^= k >>> 24;
-    h = (k & 65535) * 1540483477 + ((k >>> 16) * 59797 << 16) ^ (h & 65535) * 1540483477 + ((h >>> 16) * 59797 << 16);
-  }
-  switch (len) {
-    case 3:
-      h ^= (str.charCodeAt(i + 2) & 255) << 16;
-    case 2:
-      h ^= (str.charCodeAt(i + 1) & 255) << 8;
-    case 1:
-      h ^= str.charCodeAt(i) & 255;
-      h = (h & 65535) * 1540483477 + ((h >>> 16) * 59797 << 16);
-  }
-  h ^= h >>> 13;
-  h = (h & 65535) * 1540483477 + ((h >>> 16) * 59797 << 16);
-  return ((h ^ h >>> 15) >>> 0).toString(36);
-}
-var unitlessKeys = {
-  animationIterationCount: 1,
-  borderImageOutset: 1,
-  borderImageSlice: 1,
-  borderImageWidth: 1,
-  boxFlex: 1,
-  boxFlexGroup: 1,
-  boxOrdinalGroup: 1,
-  columnCount: 1,
-  columns: 1,
-  flex: 1,
-  flexGrow: 1,
-  flexPositive: 1,
-  flexShrink: 1,
-  flexNegative: 1,
-  flexOrder: 1,
-  gridRow: 1,
-  gridRowEnd: 1,
-  gridRowSpan: 1,
-  gridRowStart: 1,
-  gridColumn: 1,
-  gridColumnEnd: 1,
-  gridColumnSpan: 1,
-  gridColumnStart: 1,
-  msGridRow: 1,
-  msGridRowSpan: 1,
-  msGridColumn: 1,
-  msGridColumnSpan: 1,
-  fontWeight: 1,
-  lineHeight: 1,
-  opacity: 1,
-  order: 1,
-  orphans: 1,
-  tabSize: 1,
-  widows: 1,
-  zIndex: 1,
-  zoom: 1,
-  WebkitLineClamp: 1,
-  fillOpacity: 1,
-  floodOpacity: 1,
-  stopOpacity: 1,
-  strokeDasharray: 1,
-  strokeDashoffset: 1,
-  strokeMiterlimit: 1,
-  strokeOpacity: 1,
-  strokeWidth: 1
-};
-function memoize(fn) {
-  var cache = /* @__PURE__ */ Object.create(null);
-  return function(arg) {
-    if (cache[arg] === void 0)
-      cache[arg] = fn(arg);
-    return cache[arg];
-  };
-}
-var hyphenateRegex = /[A-Z]|^ms/g;
-var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
-var isCustomProperty = function isCustomProperty2(property) {
-  return property.charCodeAt(1) === 45;
-};
-var isProcessableValue = function isProcessableValue2(value) {
-  return value != null && typeof value !== "boolean";
-};
-var processStyleName = /* @__PURE__ */ memoize(function(styleName) {
-  return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, "-$&").toLowerCase();
-});
-var processStyleValue = function processStyleValue2(key, value) {
-  switch (key) {
-    case "animation":
-    case "animationName": {
-      if (typeof value === "string") {
-        return value.replace(animationRegex, function(match, p1, p2) {
-          cursor = {
-            name: p1,
-            styles: p2,
-            next: cursor
-          };
-          return p1;
-        });
-      }
-    }
-  }
-  if (unitlessKeys[key] !== 1 && !isCustomProperty(key) && typeof value === "number" && value !== 0) {
-    return value + "px";
-  }
-  return value;
-};
-function handleInterpolation(mergedProps, registered, interpolation) {
-  if (interpolation == null) {
-    return "";
-  }
-  if (interpolation.__emotion_styles !== void 0) {
-    return interpolation;
-  }
-  switch (typeof interpolation) {
-    case "boolean": {
-      return "";
-    }
-    case "object": {
-      if (interpolation.anim === 1) {
-        cursor = {
-          name: interpolation.name,
-          styles: interpolation.styles,
-          next: cursor
-        };
-        return interpolation.name;
-      }
-      if (interpolation.styles !== void 0) {
-        var next = interpolation.next;
-        if (next !== void 0) {
-          while (next !== void 0) {
-            cursor = {
-              name: next.name,
-              styles: next.styles,
-              next: cursor
-            };
-            next = next.next;
-          }
-        }
-        var styles = interpolation.styles + ";";
-        return styles;
-      }
-      return createStringFromObject(mergedProps, registered, interpolation);
-    }
-    case "function": {
-      if (mergedProps !== void 0) {
-        var previousCursor = cursor;
-        var result = interpolation(mergedProps);
-        cursor = previousCursor;
-        return handleInterpolation(mergedProps, registered, result);
-      }
-      break;
-    }
-  }
-  if (registered == null) {
-    return interpolation;
-  }
-  var cached = registered[interpolation];
-  return cached !== void 0 ? cached : interpolation;
-}
-function createStringFromObject(mergedProps, registered, obj) {
-  var string = "";
-  if (Array.isArray(obj)) {
-    for (var i = 0; i < obj.length; i++) {
-      string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
-    }
-  } else {
-    for (var _key in obj) {
-      var value = obj[_key];
-      if (typeof value !== "object") {
-        if (registered != null && registered[value] !== void 0) {
-          string += _key + "{" + registered[value] + "}";
-        } else if (isProcessableValue(value)) {
-          string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
-        }
-      } else {
-        if (_key === "NO_COMPONENT_SELECTOR" && false) {
-          throw new Error("Component selectors can only be used in conjunction with @emotion/babel-plugin.");
-        }
-        if (Array.isArray(value) && typeof value[0] === "string" && (registered == null || registered[value[0]] === void 0)) {
-          for (var _i = 0; _i < value.length; _i++) {
-            if (isProcessableValue(value[_i])) {
-              string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
-            }
-          }
-        } else {
-          var interpolated = handleInterpolation(mergedProps, registered, value);
-          switch (_key) {
-            case "animation":
-            case "animationName": {
-              string += processStyleName(_key) + ":" + interpolated + ";";
-              break;
-            }
-            default: {
-              string += _key + "{" + interpolated + "}";
-            }
-          }
-        }
-      }
-    }
-  }
-  return string;
-}
-var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
-var cursor;
-var serializeStyles = function serializeStyles2(args, registered, mergedProps) {
-  if (args.length === 1 && typeof args[0] === "object" && args[0] !== null && args[0].styles !== void 0) {
-    return args[0];
-  }
-  var stringMode = true;
-  var styles = "";
-  cursor = void 0;
-  var strings = args[0];
-  if (strings == null || strings.raw === void 0) {
-    stringMode = false;
-    styles += handleInterpolation(mergedProps, registered, strings);
-  } else {
-    styles += strings[0];
-  }
-  for (var i = 1; i < args.length; i++) {
-    styles += handleInterpolation(mergedProps, registered, args[i]);
-    if (stringMode) {
-      styles += strings[i];
-    }
-  }
-  labelPattern.lastIndex = 0;
-  var identifierName = "";
-  var match;
-  while ((match = labelPattern.exec(styles)) !== null) {
-    identifierName += "-" + match[1];
-  }
-  var name = murmur2(styles) + identifierName;
-  return {
-    name,
-    styles,
-    next: cursor
-  };
-};
-var isBrowser = true;
-var registerStyles = function registerStyles2(cache, serialized, isStringTag) {
-  var className = cache.key + "-" + serialized.name;
-  if ((isStringTag === false || isBrowser === false) && cache.registered[className] === void 0) {
-    cache.registered[className] = serialized.styles;
-  }
-};
-var insertStyles = function insertStyles2(cache, serialized, isStringTag) {
-  registerStyles(cache, serialized, isStringTag);
-  var className = cache.key + "-" + serialized.name;
-  if (cache.inserted[serialized.name] === void 0) {
-    var current = serialized;
-    do {
-      cache.insert(serialized === current ? "." + className : "", current, cache.sheet, true);
-      current = current.next;
-    } while (current !== void 0);
-  }
-};
 const isServer = typeof window === "undefined";
 const useInsertionEffectSpecifier = "useInsertionEffect";
 const useInsertionEffect = (_c = React__namespace[useInsertionEffectSpecifier]) != null ? _c : React__namespace.useLayoutEffect;
 function useStyle(style) {
-  const serialized = serializeStyles([style], css.cache.registered);
-  registerStyles(css.cache, serialized, false);
+  const serialized = serialize.serializeStyles([style], css.cache.registered);
+  utils.registerStyles(css.cache, serialized, false);
   useInsertionEffect(() => {
-    insertStyles(css.cache, serialized, false);
+    utils.insertStyles(css.cache, serialized, false);
   });
   if (isServer)
-    insertStyles(css.cache, serialized, false);
+    utils.insertStyles(css.cache, serialized, false);
   return `${css.cache.key}-${serialized.name}`;
 }
 var _path;
@@ -3740,22 +3480,9 @@ function suppressWarningAndFindDomNode(instance) {
   return foundDomNode;
 }
 class FindDomNodeClassComponent extends React.Component {
-  componentDidMount() {
-    this.setInnerRef(suppressWarningAndFindDomNode(this));
-  }
-  componentDidUpdate() {
-    this.setInnerRef(suppressWarningAndFindDomNode(this));
-  }
-  setInnerRef(current) {
-    const {
-      innerRef
-    } = this.props;
-    if (innerRef == null)
-      return;
-    if (typeof innerRef === "function")
-      innerRef(current);
-    else
-      innerRef.current = current;
+  constructor(props) {
+    super(props);
+    this.props.innerRef.current = () => suppressWarningAndFindDomNode(this);
   }
   render() {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
@@ -3764,10 +3491,39 @@ class FindDomNodeClassComponent extends React.Component {
   }
 }
 const FindDomNode = React.forwardRef(function FindDomNode2(props, ref) {
+  const findDomNodeRef = React.useRef(null);
+  React.useImperativeHandle(ref, () => () => {
+    var _a, _b;
+    return (_b = (_a = findDomNodeRef.current) == null ? void 0 : _a.call(findDomNodeRef)) != null ? _b : null;
+  }, []);
   return /* @__PURE__ */ jsxRuntime.jsx(FindDomNodeClassComponent, __spreadProps(__spreadValues({}, props), {
-    innerRef: ref
+    innerRef: findDomNodeRef
   }));
 });
+class ElementImperativeHandle {
+  constructor() {
+    __publicField(this, "getCurrent", () => null);
+    __publicField(this, "lastPropControllers", null);
+  }
+  callback(getCurrent) {
+    const current = this.getCurrent();
+    if (current === null)
+      this.setPropControllers(null);
+    else if (this.lastPropControllers !== null)
+      this.setPropControllers(this.lastPropControllers);
+    this.getCurrent = getCurrent;
+  }
+  getBoxModel() {
+    const current = this.getCurrent();
+    return boxModels.isMeasurable(current) ? boxModels.measure(current) : null;
+  }
+  setPropControllers(propControllers) {
+    const current = this.getCurrent();
+    if (constants.isPropControllersHandle(current))
+      current.setPropControllers(propControllers);
+    this.lastPropControllers = propControllers;
+  }
+}
 const storeContextDefaultValue = constants.configureStore();
 function createReactRuntime(store) {
   return {
@@ -3854,6 +3610,9 @@ function useDocument(documentKey) {
 function useIsInBuilder() {
   return useSelector((state) => constants.getIsInBuilder(state));
 }
+function useIsPreview() {
+  return useSelector((state) => constants.getIsPreview(state));
+}
 function useDispatch() {
   const store = React.useContext(StoreContext);
   return store.dispatch;
@@ -3875,26 +3634,20 @@ const ElementData = React.memo(React.forwardRef(function ElementData2({
   elementData
 }, ref) {
   const Component = useComponent(elementData.type);
-  const [handle, setHandle] = React.useState(null);
-  const [foundDomNode, setFoundDomNode] = React.useState(null);
-  React.useImperativeHandle(ref, () => handle != null ? handle : foundDomNode, [handle, foundDomNode]);
   suppressRefWarning(`\`ForwardRef(${ElementData2.name})\``);
   if (Component == null) {
     return /* @__PURE__ */ jsxRuntime.jsx(FallbackComponent, {
-      ref: setHandle,
+      ref,
       text: "Component not found"
     });
   }
   return /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, {
-    children: /* @__PURE__ */ jsxRuntime.jsx(FindDomNode, {
-      ref: setFoundDomNode,
-      children: /* @__PURE__ */ jsxRuntime.jsx(PropsValue, {
-        element: elementData,
-        children: (props) => /* @__PURE__ */ React.createElement(Component, __spreadProps(__spreadValues({}, props), {
-          key: elementData.key,
-          ref: setHandle
-        }))
-      })
+    children: /* @__PURE__ */ jsxRuntime.jsx(PropsValue, {
+      element: elementData,
+      children: (props) => /* @__PURE__ */ React.createElement(Component, __spreadProps(__spreadValues({}, props), {
+        key: elementData.key,
+        ref
+      }))
     })
   });
 }));
@@ -3928,26 +3681,42 @@ const Element = React.memo(React.forwardRef(function Element2({
   const elementKey = element.key;
   const dispatch = useDispatch();
   const documentKey = useDocumentKey();
-  const [handle, setHandle] = React.useState(null);
+  const useFindDomNodeRef = React.useRef(true);
+  const imperativeHandleRef = React.useRef(new ElementImperativeHandle());
+  const findDomNodeCallbackRef = React.useCallback((current) => {
+    if (useFindDomNodeRef.current === true) {
+      imperativeHandleRef.current.callback(() => {
+        var _a;
+        return (_a = current == null ? void 0 : current()) != null ? _a : null;
+      });
+    }
+  }, []);
+  const elementCallbackRef = React.useCallback((current) => {
+    useFindDomNodeRef.current = false;
+    imperativeHandleRef.current.callback(() => current);
+  }, []);
   const isRegisterElementDisabled = React.useContext(DisableRegisterElement);
-  React.useImperativeHandle(ref, () => handle, [handle]);
+  React.useImperativeHandle(ref, () => imperativeHandleRef.current, []);
   React.useEffect(() => {
     if (documentKey == null || isRegisterElementDisabled)
       return;
-    return dispatch(actions.registerComponentHandleEffect(documentKey, elementKey, handle));
-  }, [dispatch, documentKey, elementKey, handle, isRegisterElementDisabled]);
+    return dispatch(actions.registerComponentHandleEffect(documentKey, elementKey, imperativeHandleRef.current));
+  }, [dispatch, documentKey, elementKey, isRegisterElementDisabled]);
   React.useEffect(() => {
     if (documentKey == null || isRegisterElementDisabled)
       return;
     return dispatch(actions.mountComponentEffect(documentKey, elementKey));
   }, [dispatch, documentKey, elementKey, isRegisterElementDisabled]);
-  return constants.isElementReference(element) ? /* @__PURE__ */ jsxRuntime.jsx(ElementReference, {
-    ref: setHandle,
-    elementReference: element
-  }, elementKey) : /* @__PURE__ */ jsxRuntime.jsx(ElementData, {
-    ref: setHandle,
-    elementData: element
-  }, elementKey);
+  return /* @__PURE__ */ jsxRuntime.jsx(FindDomNode, {
+    ref: findDomNodeCallbackRef,
+    children: constants.isElementReference(element) ? /* @__PURE__ */ jsxRuntime.jsx(ElementReference, {
+      ref: elementCallbackRef,
+      elementReference: element
+    }, elementKey) : /* @__PURE__ */ jsxRuntime.jsx(ElementData, {
+      ref: elementCallbackRef,
+      elementData: element
+    }, elementKey)
+  });
 }));
 const Document = React.memo(React.forwardRef(function Document2({
   document: document2
@@ -4009,12 +3778,10 @@ exports.forwardNextDynamicRef = forwardNextDynamicRef;
 exports.getServerSideProps = getServerSideProps;
 exports.getStaticPaths = getStaticPaths;
 exports.getStaticProps = getStaticProps;
-exports.insertStyles = insertStyles;
 exports.responsiveGridItem = responsiveGridItem;
 exports.responsiveStyle = responsiveStyle;
 exports.responsiveTextStyle = responsiveTextStyle;
 exports.responsiveWidth = responsiveWidth;
-exports.serializeStyles = serializeStyles;
 exports.shallowMergeFallbacks = shallowMergeFallbacks;
 exports.storeContextDefaultValue = storeContextDefaultValue;
 exports.useBorder = useBorder;
@@ -4024,6 +3791,7 @@ exports.useFile = useFile;
 exports.useFiles = useFiles;
 exports.useFormContext = useFormContext;
 exports.useIsInBuilder = useIsInBuilder;
+exports.useIsPreview = useIsPreview;
 exports.useMakeswiftClient = useMakeswiftClient;
 exports.useMediaQuery = useMediaQuery;
 exports.usePageId = usePageId;