@plasmicapp/react-web 0.2.220 → 0.2.222

package/dist/plume/button/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
-interface CommonProps {
+interface PlumeCommonProps {
     showStartIcon?: boolean;
     showEndIcon?: boolean;
     startIcon?: React.ReactNode;
@@ -9,15 +9,22 @@ interface CommonProps {
     isDisabled?: boolean;
 }
 interface HtmlButtonProps extends Omit<React.ComponentProps<"button">, "ref" | "disabled"> {
-    submitsForm?: boolean;
 }
 interface HtmlAnchorProps extends Omit<React.ComponentProps<"a">, "ref" | "href" | "target"> {
+}
+interface PlumeActualButtonProps {
+    submitsForm?: boolean;
+}
+interface PlumeAnchorProps {
     link?: string;
     target?: React.ComponentProps<"a">["target"] | boolean;
 }
-export type BaseButtonProps = CommonProps & HtmlButtonProps & HtmlAnchorProps;
-export type HtmlAnchorOnlyProps = Exclude<keyof HtmlAnchorProps, keyof HtmlButtonProps>;
-export type HtmlButtonOnlyProps = Exclude<keyof HtmlButtonProps, keyof HtmlAnchorProps>;
+export type PlumeButtonProps = PlumeCommonProps & PlumeActualButtonProps & PlumeAnchorProps;
+export type BaseButtonProps = PlumeButtonProps & HtmlButtonProps & HtmlAnchorProps;
+type AllButtonProps = PlumeCommonProps & PlumeActualButtonProps & HtmlButtonProps;
+type AllAnchorProps = PlumeCommonProps & PlumeAnchorProps & HtmlAnchorProps;
+export type HtmlAnchorOnlyProps = Exclude<keyof AllAnchorProps, keyof AllButtonProps>;
+export type HtmlButtonOnlyProps = Exclude<keyof AllButtonProps, keyof AllAnchorProps>;
 export type ButtonRef = React.Ref<HTMLButtonElement | HTMLAnchorElement>;
 interface ButtonConfig<C extends AnyPlasmicClass> {
     showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
@@ -28,7 +35,7 @@ interface ButtonConfig<C extends AnyPlasmicClass> {
     contentSlot: keyof PlasmicClassArgs<C>;
     root: keyof PlasmicClassOverrides<C>;
 }
-export declare function useButton<P extends BaseButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
+export declare function useButton<P extends PlumeButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
     plasmicProps: {
         variants: PlasmicClassVariants<C>;
         args: PlasmicClassArgs<C>;

package/dist/plume/text-input/index.d.ts

@@ -1,6 +1,8 @@
 import * as React from "react";
 import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
-export interface BaseTextInputProps extends Omit<React.ComponentProps<"input">, "type" | "disabled"> {
+export interface BaseTextInputProps extends Omit<React.ComponentProps<"input">, "type" | "disabled">, PlumeTextInputProps {
+}
+export interface PlumeTextInputProps {
     showStartIcon?: boolean;
     showEndIcon?: boolean;
     startIcon?: React.ReactNode;
@@ -9,6 +11,8 @@ export interface BaseTextInputProps extends Omit<React.ComponentProps<"input">,
     type?: "text" | "password" | "email" | "url" | string;
     inputClassName?: string;
     inputStyle?: React.CSSProperties;
+    className?: string;
+    style?: React.CSSProperties;
 }
 export interface TextInputRefValue {
     focus: () => void;
@@ -26,7 +30,7 @@ interface TextInputConfig<C extends AnyPlasmicClass> {
     root: keyof PlasmicClassOverrides<C>;
     input: keyof PlasmicClassOverrides<C>;
 }
-export declare function useTextInput<P extends BaseTextInputProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TextInputConfig<C>, ref?: TextInputRef): {
+export declare function useTextInput<P extends PlumeTextInputProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TextInputConfig<C>, ref?: TextInputRef): {
     plasmicProps: {
         variants: PlasmicClassVariants<C>;
         args: PlasmicClassArgs<C>;

package/dist/react-web.esm.js

@@ -9,6 +9,7 @@ export { default as get } from 'dlv';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default from 'react-dom';
 import { SSRProvider, useIsSSR as useIsSSR$1 } from '@react-aria/ssr';
+import { DataProvider, usePlasmicCanvasContext } from '@plasmicapp/host';
 import { useFocusRing, useFocusable, FocusScope } from '@react-aria/focus';
 import { proxy, ref, useSnapshot, getVersion, subscribe } from 'valtio';
 import clone from 'clone';
@@ -22,7 +23,6 @@ import { Item, Section } from '@react-stately/collections';
 import { useSeparator } from '@react-aria/separator';
 import { useMenuTriggerState } from '@react-stately/menu';
 import { usePress } from '@react-aria/interactions';
-import { usePlasmicCanvasContext } from '@plasmicapp/host';
 import { useListBox, useOption, useListBoxSection } from '@react-aria/listbox';
 import { useSelect as useSelect$1, HiddenSelect } from '@react-aria/select';
 import { useSelectState } from '@react-stately/select';
@@ -1395,10 +1395,11 @@ var PlasmicTranslatorContext = React__default.createContext(undefined);
 function isIterable(val) {
     return val != null && typeof val[Symbol.iterator] === "function";
 }
-function genTranslatableString(elt) {
+function genTranslatableString(elt, opts) {
     var components = {};
     var componentsCount = 0;
     var getText = function (node) {
+        var _a;
         if (!node) {
             return "";
         }
@@ -1428,7 +1429,8 @@ function genTranslatableString(elt) {
         if (React__default.isValidElement(node) && node.type === React__default.Fragment) {
             return contents;
         }
-        var componentId = componentsCount + 1;
+        var prefix = (_a = opts === null || opts === void 0 ? void 0 : opts.tagPrefix) !== null && _a !== void 0 ? _a : "";
+        var componentId = "".concat(prefix).concat(componentsCount + 1);
         componentsCount++;
         components[componentId] = React__default.isValidElement(node)
             ? React__default.cloneElement(node, {
@@ -1603,7 +1605,7 @@ function createUseScreenVariants(isMulti, screenQueries) {
 
 var PlasmicRootContext = React.createContext(undefined);
 function PlasmicRootProvider(props) {
-    var platform = props.platform, children = props.children, userAuthToken = props.userAuthToken, isUserLoading = props.isUserLoading, authRedirectUri = props.authRedirectUri, user = props.user;
+    var platform = props.platform, children = props.children, userAuthToken = props.userAuthToken, isUserLoading = props.isUserLoading, authRedirectUri = props.authRedirectUri, user = props.user, disableLoadingBoundary = props.disableLoadingBoundary, suspenseFallback = props.suspenseFallback;
     var context = React.useMemo(function () { return ({
         platform: platform,
     }); }, [platform]);
@@ -1613,11 +1615,14 @@ function PlasmicRootProvider(props) {
         isUserLoading: isUserLoading,
         authRedirectUri: authRedirectUri,
     }); }, [userAuthToken, isUserLoading, user, authRedirectUri]);
-    return (React.createElement(PlasmicRootContext.Provider, { value: context },
-        React.createElement(SSRProvider, null,
-            React.createElement(PlasmicDataSourceContextProvider, { value: dataSourceContextValue },
-                React.createElement(PlasmicTranslatorContext.Provider, { value: props.translator },
-                    React.createElement(PlasmicHeadContext.Provider, { value: props.Head }, children))))));
+    var reactMajorVersion = +React.version.split(".")[0];
+    return (React.createElement(MaybeWrap, { cond: !disableLoadingBoundary && reactMajorVersion >= 18, wrapper: function (children) { return (React.createElement(DataProvider, { name: "plasmicInternalEnableLoadingBoundary", hidden: true, data: true },
+            React.createElement(React.Suspense, { fallback: suspenseFallback !== null && suspenseFallback !== void 0 ? suspenseFallback : "Loading..." }, children))); } },
+        React.createElement(PlasmicRootContext.Provider, { value: context },
+            React.createElement(SSRProvider, null,
+                React.createElement(PlasmicDataSourceContextProvider, { value: dataSourceContextValue },
+                    React.createElement(PlasmicTranslatorContext.Provider, { value: props.translator },
+                        React.createElement(PlasmicHeadContext.Provider, { value: props.Head }, children)))))));
 }
 var useIsSSR = useIsSSR$1;
 function useHasPlasmicRoot() {
@@ -1635,6 +1640,9 @@ function useEnsureSSRProvider() {
     hasWarnedSSR = true;
     console.warn("Plasmic: To ensure your components work correctly with server-side rendering, please use PlasmicRootProvider at the root of your application.  See https://docs.plasmic.app/learn/ssr");
 }
+function MaybeWrap(props) {
+    return props.cond ? props.wrapper(props.children) : props.children;
+}
 
 function useFocused(opts) {
     var _a = useFocusRing({