@plasmicapp/react-web 0.2.234 → 0.2.236

package/dist/all.d.ts

@@ -44,6 +44,7 @@ type InitFuncEnv = {
     $state: Record<string, any>;
     $queries?: Record<string, any>;
     $ctx?: Record<string, any>;
+    $refs?: Record<string, any>;
 };
 type DollarStateEnv = Omit<InitFuncEnv, "$state">;
 type NoUndefinedField<T> = {
@@ -61,6 +62,8 @@ interface $StateSpec<T> {
     isImmutable?: boolean;
     variableType: "text" | "number" | "boolean" | "array" | "object" | "variant";
     initFuncHash?: string;
+    refName?: string;
+    onMutate?: (stateValue: T, $ref: any) => void;
 }
 interface $State {
     [key: string]: any;
@@ -11067,6 +11070,7 @@ type StateSpec = {
 interface StateHelpers<P, T> {
     initFunc?: ($props: P) => T;
     onChangeArgsToValue?: (...args: any) => T;
+    onMutate?: (stateValue: T, $ref: any) => void;
 }
 type ComponentHelpers<P> = {
     states: Record<string, StateHelpers<P, any>>;
@@ -11259,6 +11263,7 @@ interface PropTypeBase<P> {
     displayName?: string;
     description?: string;
     helpText?: string;
+    required?: boolean;
     /**
      * If the user has chosen to use a dynamic expression for this prop, provide
      * a hint as to the expected values that the expression should evaluate to.
@@ -11302,6 +11307,11 @@ interface Defaultable<P, T> {
      */
     defaultExpr?: string;
     defaultExprHint?: string;
+    /**
+     * This function validates whether the prop value is valid.
+     * If the value is invalid, it returns an error message. Otherwise, it returns true.
+     */
+    validator?: (value: T, ...args: ControlContext<P>) => (string | true) | Promise<string | true>;
 }
 interface Controllable {
     /**
@@ -11477,15 +11487,19 @@ interface DataSourceType<P> extends PropTypeBase<P> {
     dataSource: "airtable" | "cms";
 }
 type DataPickerValueType = string | number | (string | number)[];
-interface DataPickerType<P> extends PropTypeBaseDefault<P, DataPickerValueType> {
+interface RichDataPickerType<P> extends PropTypeBaseDefault<P, DataPickerValueType> {
     type: "dataSelector";
-    data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
+    data?: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
     alwaysShowValuePathAsLabel?: boolean;
+    mergeWithExternalData?: boolean;
 }
-interface ExprEditorType<P> extends PropTypeBaseDefault<P, DataPickerValueType> {
+type DataPickerType<P> = "dataPicker" | RichDataPickerType<P>;
+interface RichExprEditorType<P> extends PropTypeBaseDefault<P, DataPickerValueType> {
     type: "exprEditor";
-    data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
+    data?: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
+    mergeWithExternalData?: boolean;
 }
+type ExprEditorType<P> = "exprEditor" | RichExprEditorType<P>;
 interface FormValidationRulesType<P> extends PropTypeBaseDefault<P, any> {
     type: "formValidationRules";
 }
@@ -11755,6 +11769,7 @@ declare function initializeCodeComponentStates($state: $State, states: {
     name: string;
     plasmicStateName: string;
 }[], repetitionIndex: number[], componentHelpers: ComponentHelpers<any>, child$Props: Record<string, any>): void;
+declare function generateOnMutateForSpec(stateName: string, componentHelpers: ComponentHelpers<any>): ((stateValue: any, $ref: any) => void) | undefined;
 declare function initializePlasmicStates($state: $State, states: {
     name: string;
     initFunc: InitFunc<any>;
@@ -13414,4 +13429,4 @@ interface TriggeredOverlayContextValue {
 }
 declare const TriggeredOverlayContext: React$1.Context<TriggeredOverlayContextValue | undefined>;
 
-export { $State, $StateSpec, 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, PlasmicPageGuard, PlasmicRootProvider, PlasmicSlot, PlasmicTranslator, PlumeButtonProps, PlumeTextInputProps, SelectContext, SelectOptionRef, SelectRef, SelectRefValue, SingleBooleanChoiceArg, SingleChoiceArg, Stack, StrictProps, SwitchProps, SwitchRef, SwitchRefValue, TextInputRef, TextInputRefValue, Trans, TriggeredOverlayConfig, TriggeredOverlayContext, TriggeredOverlayRef, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateOnChangePropForCodeComponents, generateStateValueProp, dlv as get, getCurrentInitialValue, getDataProps, getStateCellsInPlasmicProxy, getStateSpecInPlasmicProxy, hasVariant, initializeCodeComponentStates, initializePlasmicStates, is$StateProxy, isPlasmicStateProxy, makeFragment, mergeVariantsWithStates, omit, pick, plasmicHeadMeta, renderPlasmicSlot, resetToInitialValue, set, setPlumeStrictMode, useButton, useCheckbox, useCurrentUser, useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, usePlasmicTranslator, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, withPlasmicPageGuard, wrapWithClassName };
+export { $State, $StateSpec, 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, PlasmicPageGuard, PlasmicRootProvider, PlasmicSlot, PlasmicTranslator, PlumeButtonProps, PlumeTextInputProps, SelectContext, SelectOptionRef, SelectRef, SelectRefValue, SingleBooleanChoiceArg, SingleChoiceArg, Stack, StrictProps, SwitchProps, SwitchRef, SwitchRefValue, TextInputRef, TextInputRefValue, Trans, TriggeredOverlayConfig, TriggeredOverlayContext, TriggeredOverlayRef, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateOnMutateForSpec, generateStateOnChangeProp, generateStateOnChangePropForCodeComponents, generateStateValueProp, dlv as get, getCurrentInitialValue, getDataProps, getStateCellsInPlasmicProxy, getStateSpecInPlasmicProxy, hasVariant, initializeCodeComponentStates, initializePlasmicStates, is$StateProxy, isPlasmicStateProxy, makeFragment, mergeVariantsWithStates, omit, pick, plasmicHeadMeta, renderPlasmicSlot, resetToInitialValue, set, setPlumeStrictMode, useButton, useCheckbox, useCurrentUser, useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, usePlasmicTranslator, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, withPlasmicPageGuard, wrapWithClassName };

package/dist/index.cjs.js

@@ -2045,9 +2045,13 @@ function subscribeToValtio($$state, statePath, node) {
     var maybeValtioProxy = spec.valueProp
         ? $$state.env.$props[spec.valueProp]
         : get__default['default']($$state.stateValues, statePath);
-    if (valtio.getVersion(maybeValtioProxy) && spec.onChangeProp) {
+    if (valtio.getVersion(maybeValtioProxy) &&
+        (spec.onChangeProp || (spec.onMutate && node.isLeaf()))) {
         var unsub = valtio.subscribe(maybeValtioProxy, function () {
             var _a, _b;
+            if (spec.onMutate && node.isLeaf()) {
+                spec.onMutate(maybeValtioProxy, spec.refName ? $$state.env.$refs[spec.refName] : undefined);
+            }
             (_b = (_a = $$state.env.$props)[spec.onChangeProp]) === null || _b === void 0 ? void 0 : _b.call(_a, spec.valueProp
                 ? $$state.env.$props[spec.valueProp]
                 : get__default['default']($$state.stateValues, statePath));
@@ -2216,11 +2220,12 @@ var mkUntrackedValue = function (o) {
     return o != null && typeof o === "object" ? valtio.ref(o) : o;
 };
 var envFieldsAreNonNill = function (env) {
-    var _a, _b;
+    var _a, _b, _c;
     return ({
         $props: env.$props,
         $ctx: (_a = env.$ctx) !== null && _a !== void 0 ? _a : {},
         $queries: (_b = env.$queries) !== null && _b !== void 0 ? _b : {},
+        $refs: (_c = env.$refs) !== null && _c !== void 0 ? _c : {},
     });
 };
 /**
@@ -2457,6 +2462,10 @@ function initializeCodeComponentStates($state, states, repetitionIndex, componen
         finally { if (e_1) throw e_1.error; }
     }
 }
+function generateOnMutateForSpec(stateName, componentHelpers) {
+    var _a, _b;
+    return (_b = (_a = componentHelpers === null || componentHelpers === void 0 ? void 0 : componentHelpers.states) === null || _a === void 0 ? void 0 : _a[stateName]) === null || _b === void 0 ? void 0 : _b.onMutate;
+}
 function initializePlasmicStates($state, states, repetitionIndex) {
     var e_2, _a;
     var _b;
@@ -3886,6 +3895,7 @@ exports.createUseScreenVariants = createUseScreenVariants;
 exports.deriveRenderOpts = deriveRenderOpts;
 exports.ensureGlobalVariants = ensureGlobalVariants;
 exports.genTranslatableString = genTranslatableString;
+exports.generateOnMutateForSpec = generateOnMutateForSpec;
 exports.generateStateOnChangeProp = generateStateOnChangeProp;
 exports.generateStateOnChangePropForCodeComponents = generateStateOnChangePropForCodeComponents;
 exports.generateStateValueProp = generateStateValueProp;