@plasmicapp/react-web 0.2.86 → 0.2.91

package/dist/all.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as React from 'react';
 import React__default, { FocusEvent, KeyboardEvent as KeyboardEvent$1, SyntheticEvent, ReactNode } from 'react';
 
@@ -19,7 +18,7 @@ type ClassNamesExport = ClassNamesFn & { default: ClassNamesFn };
 declare function pick<T>(obj: T, ...keys: (string | number | symbol)[]): Partial<T>;
 declare function omit<T>(obj: T, ...keys: (keyof T)[]): Partial<T>;
 
-declare type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : "Unexpected extraneous props";
+declare type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : Partial<"Unexpected extraneous props">;
 declare type HTMLElementRefOf<T extends keyof JSX.IntrinsicElements> = Exclude<React__default.ComponentProps<T>["ref"], string>;
 
 interface Variants {
@@ -155,14 +154,15 @@ interface PlasmicImgProps extends ImgTagProps {
      */
     style?: React__default.CSSProperties;
     /**
-     * Ref for the wrapper element.  The normal <PlasmicImg ref={...} />
-     * prop gives you the wrap to the img element.
+     * Ref for the img element.  The normal <PlasmicImg ref={...} />
+     * prop gives the root element instead, which may be the img element
+     * or a wrapper element
      */
-    containerRef?: React__default.Ref<HTMLDivElement>;
+    imgRef?: React__default.Ref<HTMLImageElement>;
 }
-declare const PlasmicImg: React__default.ForwardRefExoticComponent<PlasmicImgProps & React__default.RefAttributes<HTMLImageElement>>;
+declare const PlasmicImg: React__default.ForwardRefExoticComponent<PlasmicImgProps & React__default.RefAttributes<HTMLElement>>;
 
-declare function PlasmicLink(props: any): JSX.Element;
+declare const PlasmicLink: React__default.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React__default.RefAttributes<any>>;
 
 declare function PlasmicSlot<T extends keyof JSX.IntrinsicElements = "div">(props: React.ComponentProps<T> & {
     as?: T;

package/dist/react-utils.d.ts

@@ -13,7 +13,7 @@ export declare function isReactText(child: React.ReactNode): child is React.Reac
 export declare function isReactChild(child: React.ReactNode): child is React.ReactChild;
 export declare function isReactFragment(child: React.ReactNode): child is React.ReactElement;
 export declare function isReactNode(x: any): boolean;
-export declare type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : "Unexpected extraneous props";
+export declare type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : Partial<"Unexpected extraneous props">;
 export declare type HTMLElementRefOf<T extends keyof JSX.IntrinsicElements> = Exclude<React.ComponentProps<T>["ref"], string>;
 export declare function mergeProps(props: Record<string, any>, ...restProps: Record<string, any>[]): Record<string, any>;
 export declare function mergeRefs<T>(...refs: (React.Ref<T> | undefined)[]): (value: T) => void;

package/dist/react-web.cjs.development.js

@@ -807,7 +807,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,
@@ -818,9 +818,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,
@@ -838,8 +845,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)
     }));
   }
 
@@ -937,7 +945,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: "",
@@ -951,9 +959,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"
   }));
 });
@@ -1157,22 +1165,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);
@@ -1528,12 +1541,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: {
@@ -2862,12 +2875,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: {
@@ -2977,9 +2990,7 @@ function useTriggeredOverlay(plasmicClass, props, config, outerRef) {
     restoreFocus: true
   }, React.createElement(reactAria.DismissButton, {
     onDismiss: state.close
-  }), children, React.createElement(reactAria.DismissButton, {
-    onDismiss: state.close
-  })), _extends2));
+  }), children), _extends2));
 
   var overrides = (_overrides = {}, _overrides[config.root] = {
     props: mergeProps(overlayProps, getStyleProps(props), {