@plasmicapp/react-web 0.2.123 → 0.2.125

package/dist/all.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { AriaAttributes, DOMAttributes as DOMAttributes$1, AriaRole, CSSProperties, Key, ReactNode, ReactElement, FocusEvent, KeyboardEvent as KeyboardEvent$1, SyntheticEvent } from 'react';
+import React__default, { AriaAttributes, DOMAttributes as DOMAttributes$1, AriaRole, CSSProperties, Key, ReactNode, ReactElement, FocusEvent, KeyboardEvent as KeyboardEvent$1, SyntheticEvent, useLayoutEffect } from 'react';
 
 // LICENSE is MIT
 //
@@ -23,7 +23,7 @@ declare function omit<T extends {}>(obj: T, ...keys: (keyof T)[]): Partial<T>;
 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>;
 
-declare type InitFunc$1<T> = ($props: Record<string, any>, $state: $State$1, indexes: number[]) => T;
+declare type InitFunc$1<T> = ($props: Record<string, any>, $state: $State$1, $ctx: Record<string, any>, indexes: number[]) => T;
 interface $State$1 {
     [key: string]: any;
     registerInitFunc?: (path: string, f: InitFunc$1<any>) => any;
@@ -37,9 +37,9 @@ interface $StateSpec<T> {
     onChangeProp?: string;
     isArray?: boolean;
 }
-declare function useDollarState(specs: $StateSpec<any>[], props: Record<string, any>): any;
+declare function useDollarState(specs: $StateSpec<any>[], props: Record<string, any>, $ctx?: Record<string, any>): any;
 
-declare function useCanvasDollarState(specs: $StateSpec<any>[], props: Record<string, any>): any;
+declare function useCanvasDollarState(specs: $StateSpec<any>[], props: Record<string, any>, $ctx?: Record<string, any>): any;
 
 interface Variants {
     [vg: string]: any;
@@ -677,7 +677,8 @@ declare function generateStateValueProp($state: $State, path: (string | number)[
  * Forked from https://github.com/lukeed/dset
  * Changes: fixed setting a deep value to a proxy object
  */
-declare function set(obj: any, keys: any, val: any): void;
+declare function set(obj: any, keys: any, val: any): void;
+declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
 
 declare const classNames: typeof classNames$1;
 
@@ -1637,4 +1638,4 @@ interface TriggeredOverlayContextValue {
 }
 declare const TriggeredOverlayContext: React.Context<TriggeredOverlayContextValue | undefined>;
 
-export { $State$1 as $State, BaseButtonProps, BaseMenuButtonProps, BaseMenuGroupProps, BaseMenuItemProps, BaseMenuProps, BaseSelectOptionGroupProps, BaseSelectOptionProps, BaseSelectProps, BaseTextInputProps, BaseTriggeredOverlayProps, ButtonRef, CheckboxProps, CheckboxRef, CheckboxRefValue, DropdownMenu, Flex, HTMLElementRefOf, HtmlAnchorOnlyProps, HtmlButtonOnlyProps, MenuButtonRef, MenuButtonRefValue, MenuRef, MenuRefValue, MultiChoiceArg, PlasmicDataSourceContextProvider, PlasmicHead, PlasmicIcon, PlasmicImg, PlasmicLink, PlasmicRootProvider, PlasmicSlot, SelectContext, SelectOptionRef, SelectRef, SelectRefValue, SingleBooleanChoiceArg, SingleChoiceArg, Stack, StrictProps, SwitchProps, SwitchRef, SwitchRefValue, TextInputRef, TextInputRefValue, Trans, TriggeredOverlayConfig, TriggeredOverlayContext, TriggeredOverlayRef, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateValueProp, dlv as get, getDataProps, hasVariant, makeFragment, mergeVariantsWithStates, omit, pick, plasmicHeadMeta, renderPlasmicSlot, set, setPlumeStrictMode, useButton, useCanvasDollarState, useCheckbox, useCurrentUser, useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, wrapWithClassName };
+export { $State$1 as $State, BaseButtonProps, BaseMenuButtonProps, BaseMenuGroupProps, BaseMenuItemProps, BaseMenuProps, BaseSelectOptionGroupProps, BaseSelectOptionProps, BaseSelectProps, BaseTextInputProps, BaseTriggeredOverlayProps, ButtonRef, CheckboxProps, CheckboxRef, CheckboxRefValue, DropdownMenu, Flex, HTMLElementRefOf, HtmlAnchorOnlyProps, HtmlButtonOnlyProps, MenuButtonRef, MenuButtonRefValue, MenuRef, MenuRefValue, MultiChoiceArg, PlasmicDataSourceContextProvider, PlasmicHead, PlasmicIcon, PlasmicImg, PlasmicLink, PlasmicRootProvider, PlasmicSlot, SelectContext, SelectOptionRef, SelectRef, SelectRefValue, SingleBooleanChoiceArg, SingleChoiceArg, Stack, StrictProps, SwitchProps, SwitchRef, SwitchRefValue, TextInputRef, TextInputRefValue, Trans, TriggeredOverlayConfig, TriggeredOverlayContext, TriggeredOverlayRef, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateValueProp, dlv as get, getDataProps, hasVariant, makeFragment, mergeVariantsWithStates, omit, pick, plasmicHeadMeta, renderPlasmicSlot, set, setPlumeStrictMode, useButton, useCanvasDollarState, useCheckbox, useCurrentUser, useDollarState, useIsSSR, useIsomorphicLayoutEffect, useMenu, useMenuButton, useMenuGroup, useMenuItem, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, wrapWithClassName };

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

@@ -1738,9 +1738,10 @@ function set(obj, keys, val) {
     }
   }
 }
+var useIsomorphicLayoutEffect$1 = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
 
 var mkUntrackedValue = function mkUntrackedValue(o) {
-  return typeof o === "object" ? valtio.ref(o) : o;
+  return o != null && typeof o === "object" ? valtio.ref(o) : o;
 };
 
 var transformPathStringToObj = function transformPathStringToObj(str) {
@@ -1978,11 +1979,11 @@ function initializeStateValue($$state, initialStatePath, initialSpec) {
     var path = _ref2.path,
         spec = _ref2.spec;
     var unsubscribe = utils.subscribeKey(_get($$state.stateValues, path.slice(-1)), path.slice(-1)[0], function () {
-      return set($$state.stateValues, initialStatePath, mkUntrackedValue(initialSpec.initFunc($$state.props, $state, getIndexes(path, spec))));
+      return set($$state.stateValues, initialStatePath, mkUntrackedValue(initialSpec.initFunc($$state.props, $state, $$state.ctx, getIndexes(path, spec))));
     });
     $$state.unsubscriptionsByState[initialStateKey].push(unsubscribe);
   });
-  var initialValue = initialSpec.initFunc($$state.props, $state, getIndexes(initialStatePath, initialSpec));
+  var initialValue = initialSpec.initFunc($$state.props, $state, $$state.ctx, getIndexes(initialStatePath, initialSpec));
   saveStateInitialValue($$state, initialStatePath, initialSpec, initialValue);
   return initialValue;
 }
@@ -2011,7 +2012,7 @@ function saveStateInitialValue($$state, path, spec, initialValue) {
   }
 }
 
-function useDollarState(specs, props) {
+function useDollarState(specs, props, $ctx) {
   var $$state = React__default.useRef(valtio.proxy({
     stateValues: {},
     initStateValues: {},
@@ -2026,10 +2027,12 @@ function useDollarState(specs, props) {
     statesInstanceBySpec: new Map(),
     existingStates: new Map(),
     unsubscriptionsByState: {},
-    props: undefined,
+    props: {},
+    ctx: {},
     registrationsQueue: []
   })).current;
   $$state.props = mkUntrackedValue(props);
+  $$state.ctx = mkUntrackedValue($ctx != null ? $ctx : {});
   var $state = React__default.useRef(Object.assign(create$StateProxy($$state, function (path, spec) {
     var key = JSON.stringify(path);
 
@@ -2069,7 +2072,7 @@ function useDollarState(specs, props) {
       if ((_$$state$statesInstan = $$state.statesInstanceBySpec.get(pathStr)) != null && _$$state$statesInstan.some(function (_ref3) {
         var path = _ref3.path,
             specKey = _ref3.specKey;
-        return !deepEqual(_get($$state.initStateValues, path), f(props, $state, getIndexes(path, $$state.specsByKey[specKey])));
+        return !deepEqual(_get($$state.initStateValues, path), f(props, $state, $ctx != null ? $ctx : {}, getIndexes(path, $$state.specsByKey[specKey])));
       })) {
         $$state.registrationsQueue.push({
           pathStr: pathStr,
@@ -2087,7 +2090,7 @@ function useDollarState(specs, props) {
     var spec = $$state.specsByKey[specKey];
 
     if (spec.initFunc) {
-      var newInit = spec.initFunc(props, $state, getIndexes(path, spec));
+      var newInit = spec.initFunc(props, $state, $ctx != null ? $ctx : {}, getIndexes(path, spec));
 
       if (!deepEqual(newInit, _get($$state.initStateValues, path))) {
         resetSpecs.push({
@@ -2097,7 +2100,7 @@ function useDollarState(specs, props) {
       }
     }
   });
-  React__default.useLayoutEffect(function () {
+  useIsomorphicLayoutEffect$1(function () {
     resetSpecs.forEach(function (_ref5) {
       var path = _ref5.path,
           spec = _ref5.spec;
@@ -2110,7 +2113,7 @@ function useDollarState(specs, props) {
       }
     });
   }, [props, resetSpecs]);
-  React__default.useLayoutEffect(function () {
+  useIsomorphicLayoutEffect$1(function () {
     $$state.registrationsQueue.forEach(function (_ref6) {
       var f = _ref6.f,
           pathStr = _ref6.pathStr;
@@ -2128,7 +2131,7 @@ function useDollarState(specs, props) {
   return $state;
 }
 
-function useCanvasDollarState(specs, props) {
+function useCanvasDollarState(specs, props, $ctx) {
   var $$state = valtio.proxy({
     stateValues: {},
     initStateValues: {},
@@ -2143,10 +2146,12 @@ function useCanvasDollarState(specs, props) {
     statesInstanceBySpec: new Map(),
     existingStates: new Map(),
     unsubscriptionsByState: {},
-    props: undefined,
+    props: {},
+    ctx: {},
     registrationsQueue: []
   });
   $$state.props = mkUntrackedValue(props);
+  $$state.ctx = mkUntrackedValue($ctx);
   var $state = create$StateProxy($$state, function (path, spec) {
     return {
       get: function get() {
@@ -3776,6 +3781,7 @@ exports.useCanvasDollarState = useCanvasDollarState;
 exports.useCheckbox = useCheckbox;
 exports.useDollarState = useDollarState;
 exports.useIsSSR = useIsSSR;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect$1;
 exports.useMenu = useMenu;
 exports.useMenuButton = useMenuButton;
 exports.useMenuGroup = useMenuGroup;