@plasmicapp/react-web 0.2.86 → 0.2.91

package/dist/react-web.esm.js

@@ -800,7 +800,7 @@ function PlasmicIcon(props) {
 var IMG_SIZES = [16, 32, 48, 64, 96, 128, 256, 384];
 var DEVICE_SIZES = [640, 750, 828, 1080, 1200, 1920, 2048, 3840];
 var ALL_SIZES = /*#__PURE__*/[].concat(IMG_SIZES, DEVICE_SIZES);
-var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(props, ref) {
+var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(props, outerRef) {
   var src = props.src,
       className = props.className,
       displayWidth = props.displayWidth,
@@ -811,9 +811,16 @@ var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(prop
       displayMaxHeight = props.displayMaxHeight,
       quality = props.quality,
       loader = props.loader,
-      containerRef = props.containerRef,
+      imgRef = props.imgRef,
       style = props.style,
-      rest = _objectWithoutPropertiesLoose(props, ["src", "className", "displayWidth", "displayHeight", "displayMinWidth", "displayMinHeight", "displayMaxWidth", "displayMaxHeight", "quality", "loader", "containerRef", "style"]);
+      loading = props.loading,
+      rest = _objectWithoutPropertiesLoose(props, ["src", "className", "displayWidth", "displayHeight", "displayMinWidth", "displayMinHeight", "displayMaxWidth", "displayMaxHeight", "quality", "loader", "imgRef", "style", "loading"]);
+
+  var imgProps = Object.assign({}, rest, {
+    // Default loading to "lazy" if not specified (which is different from the
+    // html img, which defaults to eager!)
+    loading: loading != null ? loading : "lazy"
+  });
 
   var _ref = typeof src === "string" || !src ? {
     fullWidth: undefined,
@@ -831,8 +838,9 @@ var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(prop
       src: srcStr,
       className: className,
       style: style
-    }, rest, {
-      ref: ref
+    }, imgProps, {
+      loading: loading,
+      ref: mergeRefs(imgRef, outerRef)
     }));
   }
 
@@ -930,7 +938,7 @@ var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(prop
 
   return React__default.createElement("div", {
     className: classNames$1(className, "__wab_img-wrapper"),
-    ref: containerRef,
+    ref: outerRef,
     style: wrapperStyle
   }, React__default.createElement("img", {
     alt: "",
@@ -944,9 +952,9 @@ var PlasmicImg = /*#__PURE__*/React__default.forwardRef(function PlasmicImg(prop
     sizes: sizes,
     src: srcStr,
     quality: quality,
-    ref: ref,
+    ref: imgRef,
     style: style ? pick(style, "objectFit", "objectPosition") : undefined,
-    imgProps: rest,
+    imgProps: imgProps,
     className: "__wab_img"
   }));
 });
@@ -1150,22 +1158,27 @@ var PLASMIC_IMAGE_LOADER = {
   }
 };
 
-function PlasmicLink(props) {
+var PlasmicLink = /*#__PURE__*/React__default.forwardRef(function PlasmicLink(props, ref) {
   // props.href is required for nextjs; if no props.href,
   // then we just render the default anchor element
   if (props.platform === "nextjs" && props.href) {
     var nextjsProps = ["href", "replace", "scroll", "shallow", "passHref", "prefetch", "locale"];
-    return React__default.createElement(props.component, pick.apply(void 0, [props].concat(nextjsProps)), React__default.createElement("a", Object.assign({}, omit.apply(void 0, [props, "component", "platform"].concat(nextjsProps)))));
+    return React__default.createElement(props.component, pick.apply(void 0, [props].concat(nextjsProps)), React__default.createElement("a", Object.assign({}, omit.apply(void 0, [props, "component", "platform"].concat(nextjsProps)), {
+      ref: ref
+    })));
   }
 
   if (props.platform === "gatsby" && isInternalHref(props.href)) {
     return React__default.createElement(props.component, _extends({}, omit(props, "component", "platform", "href"), {
-      to: props.href
+      to: props.href,
+      ref: ref
     }));
   }
 
-  return React__default.createElement("a", Object.assign({}, omit(props, "component", "platform")));
-}
+  return React__default.createElement("a", Object.assign({}, omit(props, "component", "platform"), {
+    ref: ref
+  }));
+});
 
 function isInternalHref(href) {
   return /^\/(?!\/)/.test(href);
@@ -1521,12 +1534,12 @@ function useButton(plasmicClass, props, config, ref) {
 
   var overrides = (_overrides = {}, _overrides[config.root] = {
     as: !!link ? "a" : "button",
-    props: _extends({
+    props: _extends({}, omit.apply(void 0, [rest].concat(plasmicClass.internalArgProps, plasmicClass.internalVariantProps)), {
       ref: ref,
       disabled: isDisabled
     }, !!link && {
       href: link
-    }, rest)
+    })
   }, _overrides);
   return {
     plasmicProps: {
@@ -2855,12 +2868,12 @@ function useTextInput(plasmicClass, props, config, ref) {
       style: style
     }
   }, _overrides[config.input] = {
-    props: _extends({
+    props: _extends({}, omit.apply(void 0, [rest].concat(plasmicClass.internalArgProps, plasmicClass.internalVariantProps)), {
       disabled: isDisabled,
       ref: inputRef,
       className: inputClassName,
       style: inputStyle
-    }, rest)
+    })
   }, _overrides);
   return {
     plasmicProps: {
@@ -2970,9 +2983,7 @@ function useTriggeredOverlay(plasmicClass, props, config, outerRef) {
     restoreFocus: true
   }, createElement(DismissButton, {
     onDismiss: state.close
-  }), children, createElement(DismissButton, {
-    onDismiss: state.close
-  })), _extends2));
+  }), children), _extends2));
 
   var overrides = (_overrides = {}, _overrides[config.root] = {
     props: mergeProps(overlayProps, getStyleProps(props), {