@plasmicpkgs/react-aria 0.0.53 → 0.0.55

package/dist/react-aria.js

@@ -520,7 +520,7 @@ const BUTTON_VARIANTS = [
 ];
 const { variants: variants$d, withObservedValues: withObservedValues$b } = pickAriaComponentVariants(BUTTON_VARIANTS);
 function BaseButton(props) {
-  const _a = props, { submitsForm, resetsForm, children, updateVariant } = _a, rest = __objRest$o(_a, ["submitsForm", "resetsForm", "children", "updateVariant"]);
+  const _a = props, { submitsForm, resetsForm, children, plasmicUpdateVariant } = _a, rest = __objRest$o(_a, ["submitsForm", "resetsForm", "children", "plasmicUpdateVariant"]);
   const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
   return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues$q({ type }, rest), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues$b(
     children,
@@ -531,7 +531,7 @@ function BaseButton(props) {
       focusVisible: isFocusVisible,
       disabled: isDisabled
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
 }
 const BUTTON_COMPONENT_NAME = makeComponentName("button");
@@ -647,7 +647,7 @@ const CHECKBOX_VARIANTS = [
 ];
 const { variants: variants$c, withObservedValues: withObservedValues$a } = pickAriaComponentVariants(CHECKBOX_VARIANTS);
 function BaseCheckbox(props) {
-  const _a = props, { children, updateVariant, setControlContextData } = _a, rest = __objRest$n(_a, ["children", "updateVariant", "setControlContextData"]);
+  const _a = props, { children, plasmicUpdateVariant, setControlContextData } = _a, rest = __objRest$n(_a, ["children", "plasmicUpdateVariant", "setControlContextData"]);
   const contextProps = React__default.default.useContext(PlasmicCheckboxGroupContext);
   setControlContextData == null ? void 0 : setControlContextData({
     parent: contextProps
@@ -673,7 +673,7 @@ function BaseCheckbox(props) {
       selected: isSelected,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   )));
 }
 const makeDefaultCheckboxChildren = ({
@@ -1073,7 +1073,12 @@ function registerLabel(loader, overrides) {
       },
       props: {
         children: {
-          type: "slot"
+          type: "slot",
+          mergeWithParent: true,
+          defaultValue: {
+            type: "text",
+            value: "Label"
+          }
         }
       },
       trapsFocus: true
@@ -1118,14 +1123,14 @@ const { variants: variants$b, withObservedValues: withObservedValues$9 } = pickA
   CHECKBOX_GROUP_VARIANTS
 );
 function BaseCheckboxGroup(props) {
-  const _a = props, { children, updateVariant } = _a, rest = __objRest$k(_a, ["children", "updateVariant"]);
+  const _a = props, { children, plasmicUpdateVariant } = _a, rest = __objRest$k(_a, ["children", "plasmicUpdateVariant"]);
   return /* @__PURE__ */ React__default.default.createElement(PlasmicCheckboxGroupContext.Provider, { value: rest }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadValues$l({}, rest), ({ isDisabled, isReadOnly }) => withObservedValues$9(
     children,
     {
       disabled: isDisabled,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   )));
 }
 const componentName = makeComponentName("checkboxGroup");
@@ -1153,12 +1158,10 @@ function registerCheckboxGroup(loader, overrides) {
         "isDisabled",
         "isReadOnly",
         "aria-label",
-        "children",
         "isRequired"
       ])), {
         children: {
           type: "slot",
-          mergeWithParent: true,
           defaultValue: [
             {
               type: "vbox",
@@ -1359,12 +1362,12 @@ const inputHelpers$1 = {
 function BaseInput(props) {
   var _b;
   const _a = props, {
-    updateVariant,
+    plasmicUpdateVariant,
     setControlContextData,
     disabled,
     autoComplete
   } = _a, rest = __objRest$j(_a, [
-    "updateVariant",
+    "plasmicUpdateVariant",
     "setControlContextData",
     "disabled",
     "autoComplete"
@@ -1382,26 +1385,26 @@ function BaseInput(props) {
     disabled: (_b = textFieldContext == null ? void 0 : textFieldContext.isDisabled) != null ? _b : disabled
   });
   React.useEffect(() => {
-    updateVariant == null ? void 0 : updateVariant({
+    plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
       disabled: mergedProps.disabled
     });
-  }, [mergedProps.disabled, updateVariant]);
+  }, [mergedProps.disabled, plasmicUpdateVariant]);
   return /* @__PURE__ */ React__default.default.createElement(
     reactAriaComponents.Input,
     __spreadValues$k({
       autoComplete: resolveAutoComplete(autoComplete),
       onHoverChange: (isHovered) => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           hovered: isHovered
         });
       },
       onFocus: () => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           focused: true
         });
       },
       onBlur: () => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           focused: false
         });
       }
@@ -1468,8 +1471,7 @@ function registerInput(loader, overrides) {
         helpers: inputHelpers$1,
         importName: "inputHelpers",
         importPath: "@plasmicpkgs/react-aria/skinny/registerInput"
-      },
-      trapsFocus: true
+      }
     },
     overrides
   );
@@ -1515,7 +1517,7 @@ const { variants: variants$9, withObservedValues: withObservedValues$8 } = pickA
   LIST_BOX_ITEM_VARIANTS
 );
 function BaseListBoxItem(props) {
-  const _a = props, { children, setControlContextData, updateVariant, id } = _a, rest = __objRest$i(_a, ["children", "setControlContextData", "updateVariant", "id"]);
+  const _a = props, { children, setControlContextData, plasmicUpdateVariant, id } = _a, rest = __objRest$i(_a, ["children", "setControlContextData", "plasmicUpdateVariant", "id"]);
   const listboxContext = React__default.default.useContext(PlasmicListBoxContext);
   const isStandalone = !listboxContext;
   const [registeredId, setRegisteredId] = React.useState();
@@ -1551,7 +1553,7 @@ function BaseListBoxItem(props) {
       selected: isSelected,
       disabled: isDisabled
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
   if (isStandalone) {
     return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.ListBox, { selectionMode: "single" }, listboxItem);
@@ -1623,9 +1625,11 @@ function registerListBoxItem(loader, overrides) {
         },
         children: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: makeDefaultListBoxItemChildren("Item")
         }
-      }
+      },
+      trapsFocus: true
     },
     overrides
   );
@@ -1681,6 +1685,7 @@ function registerSection(loader, overrides) {
       props: {
         header: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: [
             {
               type: "text",
@@ -1689,9 +1694,11 @@ function registerSection(loader, overrides) {
           ]
         },
         items: {
-          type: "slot"
+          type: "slot",
+          mergeWithParent: true
         }
-      }
+      },
+      trapsFocus: true
     },
     overrides
   );
@@ -2051,6 +2058,7 @@ function registerPopover(loader, overrides) {
       props: {
         children: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: [
             POPOVER_ARROW_IMG,
             {
@@ -2058,7 +2066,7 @@ function registerPopover(loader, overrides) {
               styles: {
                 width: "stretch",
                 padding: 0,
-                gap: "10px"
+                rowGap: "10px"
               },
               children: [
                 {
@@ -2111,7 +2119,8 @@ function registerPopover(loader, overrides) {
           type: "themeResetClass"
         }
       },
-      styleSections: true
+      styleSections: true,
+      trapsFocus: true
     },
     overrides
   );
@@ -2297,7 +2306,8 @@ function registerComboBox(loader) {
         onChangeProp: "onOpenChange",
         variableType: "boolean"
       }
-    }
+    },
+    trapsFocus: true
   });
 }
 
@@ -2488,6 +2498,7 @@ function registerModal(loader, overrides) {
       props: {
         children: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: {
             type: "vbox",
             styles: {
@@ -2608,6 +2619,7 @@ function registerDialogTrigger(loader, overrides) {
       props: {
         trigger: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: {
             type: "component",
             name: BUTTON_COMPONENT_NAME,
@@ -2621,6 +2633,7 @@ function registerDialogTrigger(loader, overrides) {
         },
         dialog: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: {
             type: "component",
             name: MODAL_COMPONENT_NAME
@@ -2716,7 +2729,8 @@ function registerForm(loader, overrides) {
       importName: "BaseForm",
       props: {
         children: {
-          type: "slot"
+          type: "slot",
+          mergeWithParent: true
         },
         onSubmit: {
           type: "eventHandler",
@@ -2776,7 +2790,7 @@ const RADIO_VARIANTS = [
 ];
 const { variants: variants$8, withObservedValues: withObservedValues$7 } = pickAriaComponentVariants(RADIO_VARIANTS);
 function BaseRadio(props) {
-  const _a = props, { children, setControlContextData, updateVariant } = _a, rest = __objRest$9(_a, ["children", "setControlContextData", "updateVariant"]);
+  const _a = props, { children, setControlContextData, plasmicUpdateVariant } = _a, rest = __objRest$9(_a, ["children", "setControlContextData", "plasmicUpdateVariant"]);
   const contextProps = React__default.default.useContext(PlasmicRadioGroupContext);
   const isStandalone = !contextProps;
   setControlContextData == null ? void 0 : setControlContextData({
@@ -2801,7 +2815,7 @@ function BaseRadio(props) {
       disabled: isDisabled,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
   if (isStandalone) {
     return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.RadioGroup, null, radio);
@@ -2905,14 +2919,14 @@ var __objRest$8 = (source, exclude) => {
 const RADIO_GROUP_VARIANTS = ["disabled", "readonly"];
 const { variants: variants$7, withObservedValues: withObservedValues$6 } = pickAriaComponentVariants(RADIO_GROUP_VARIANTS);
 function BaseRadioGroup(props) {
-  const _a = props, { children, updateVariant } = _a, rest = __objRest$8(_a, ["children", "updateVariant"]);
+  const _a = props, { children, plasmicUpdateVariant } = _a, rest = __objRest$8(_a, ["children", "plasmicUpdateVariant"]);
   return /* @__PURE__ */ React__default.default.createElement(PlasmicRadioGroupContext.Provider, { value: props }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.RadioGroup, __spreadValues$9({}, rest), ({ isDisabled, isReadOnly }) => withObservedValues$6(
     children,
     {
       disabled: isDisabled,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   )));
 }
 const RADIO_GROUP_COMPONENT_NAME = makeComponentName("radioGroup");
@@ -2942,7 +2956,6 @@ function registerRadioGroup(loader, overrides) {
       ])), {
         children: {
           type: "slot",
-          mergeWithParent: true,
           defaultValue: [
             {
               type: "vbox",
@@ -3145,7 +3158,8 @@ function registerSelect(loader) {
           }
         ]
       }
-    }
+    },
+    trapsFocus: true
   });
   registerComponentHelper(loader, BaseSelect, {
     name: SELECT_NAME,
@@ -3199,6 +3213,7 @@ function registerSelect(loader) {
       },
       children: {
         type: "slot",
+        mergeWithParent: true,
         defaultValue: [
           {
             type: "vbox",
@@ -3294,7 +3309,8 @@ function registerSelect(loader) {
         onChangeProp: "onOpenChange",
         variableType: "boolean"
       }
-    }
+    },
+    trapsFocus: true
   });
 }
 
@@ -3331,13 +3347,13 @@ const { variants: variants$6, withObservedValues: withObservedValues$5 } = pickA
   SLIDER_OUTPUT_VARIANTS
 );
 function BaseSliderOutput(props) {
-  const _a = props, { updateVariant, children } = _a, rest = __objRest$7(_a, ["updateVariant", "children"]);
+  const _a = props, { plasmicUpdateVariant, children } = _a, rest = __objRest$7(_a, ["plasmicUpdateVariant", "children"]);
   return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.SliderOutput, __spreadValues$7({}, rest), ({ isDisabled }) => withObservedValues$5(
     children,
     {
       disabled: isDisabled
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
 }
 const SLIDER_OUTPUT_COMPONENT_NAME = makeComponentName("sliderOutput");
@@ -3352,7 +3368,10 @@ function registerSliderOutput(loader, overrides) {
       importName: "BaseSliderOutput",
       variants: variants$6,
       props: {
-        children: { type: "slot" }
+        children: {
+          mergeWithParent: true,
+          type: "slot"
+        }
       },
       trapsFocus: true
     },
@@ -3421,11 +3440,11 @@ function BaseSliderThumb(_a) {
   var _b = _a, {
     children,
     advanced,
-    updateVariant
+    plasmicUpdateVariant
   } = _b, rest = __objRest$6(_b, [
     "children",
     "advanced",
-    "updateVariant"
+    "plasmicUpdateVariant"
   ]);
   const context = React__default.default.useContext(PlasmicSliderContext);
   const mergedProps = reactAria.mergeProps(context, rest);
@@ -3438,7 +3457,7 @@ function BaseSliderThumb(_a) {
       focusVisible: isFocusVisible,
       disabled: isDisabled
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
   return /* @__PURE__ */ React__default.default.createElement(
     ErrorBoundary,
@@ -3480,6 +3499,7 @@ function registerSliderThumb(loader, overrides) {
         },
         children: {
           type: "slot",
+          mergeWithParent: true,
           hidden: (ps) => !ps.advanced
         }
       }),
@@ -3543,7 +3563,7 @@ function BaseSliderTrack(props) {
   const context = React__default.default.useContext(PlasmicSliderContext);
   const isStandalone = !context;
   const mergedProps = reactAria.mergeProps(context, props);
-  const _a = mergedProps, { children, progressBar, updateVariant } = _a, rest = __objRest$5(_a, ["children", "progressBar", "updateVariant"]);
+  const _a = mergedProps, { children, progressBar, plasmicUpdateVariant } = _a, rest = __objRest$5(_a, ["children", "progressBar", "plasmicUpdateVariant"]);
   const isMultiValue = isMultiValueGuard(mergedProps.value);
   const { minIndex, maxIndex } = React.useMemo(() => {
     if (!context || !Array.isArray(context.value) || context.value.length <= 1) {
@@ -3592,7 +3612,7 @@ function BaseSliderTrack(props) {
     {
       hovered: isHovered
     },
-    updateVariant
+    plasmicUpdateVariant
   )));
   if (isStandalone) {
     return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Slider, { style: { height: "100%", width: "100%" } }, track);
@@ -3620,6 +3640,11 @@ function registerSliderTrack(sliderThumbMeta, loader, overrides) {
       props: {
         children: {
           type: "slot",
+          /**
+           * NOTE: We don't merge with parent here, because we want to allow the user to select the thumbs without having to first select the slider track.
+           * Also, there can be more than one thumbs (e.g. in a range slider), but `mergeWithParent` only shows prop controls of the slot content if there is only one direct descendant of the slot.
+           * */
+          // mergeWithParent: true,
           displayName: "Thumbs",
           description: "The thumbs of the slider. For range slider, you can add more than one thumb.",
           allowedComponents: [sliderThumbMeta.name],
@@ -3633,6 +3658,7 @@ function registerSliderTrack(sliderThumbMeta, loader, overrides) {
         },
         progressBar: {
           type: "slot",
+          mergeWithParent: true,
           displayName: "Progress Bar",
           defaultValue: [
             {
@@ -3658,8 +3684,7 @@ function registerSliderTrack(sliderThumbMeta, loader, overrides) {
           type: "eventHandler",
           argTypes: [{ name: "isHovering", type: "boolean" }]
         }
-      },
-      trapsFocus: true
+      }
     },
     overrides
   );
@@ -3701,7 +3726,7 @@ const RANGE_SLIDER_COMPONENT_NAME = makeComponentName("range-slider");
 const SLIDER_VARIANTS = ["disabled"];
 const { variants: variants$3, withObservedValues: withObservedValues$2 } = pickAriaComponentVariants(SLIDER_VARIANTS);
 function BaseSlider(props) {
-  const _a = props, { children, updateVariant } = _a, rest = __objRest$4(_a, ["children", "updateVariant"]);
+  const _a = props, { children, plasmicUpdateVariant } = _a, rest = __objRest$4(_a, ["children", "plasmicUpdateVariant"]);
   return /* @__PURE__ */ React__default.default.createElement(
     PlasmicSliderContext.Provider,
     {
@@ -3716,7 +3741,7 @@ function BaseSlider(props) {
       {
         disabled: isDisabled
       },
-      updateVariant
+      plasmicUpdateVariant
     ))
   );
 }
@@ -3996,7 +4021,7 @@ const SWITCH_VARIANTS = [
 ];
 const { variants: variants$2, withObservedValues: withObservedValues$1 } = pickAriaComponentVariants(SWITCH_VARIANTS);
 function BaseSwitch(props) {
-  const _a = props, { children, updateVariant } = _a, rest = __objRest$3(_a, ["children", "updateVariant"]);
+  const _a = props, { children, plasmicUpdateVariant } = _a, rest = __objRest$3(_a, ["children", "plasmicUpdateVariant"]);
   return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Switch, __spreadValues$3({}, rest), ({
     isHovered,
     isPressed,
@@ -4016,7 +4041,7 @@ function BaseSwitch(props) {
       disabled: isDisabled,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   ));
 }
 function registerSwitch(loader, overrides) {
@@ -4191,16 +4216,16 @@ const inputHelpers = {
 };
 function BaseTextArea(props) {
   var _b;
-  const _a = props, { disabled, updateVariant, setControlContextData } = _a, rest = __objRest$2(_a, ["disabled", "updateVariant", "setControlContextData"]);
+  const _a = props, { disabled, plasmicUpdateVariant, setControlContextData } = _a, rest = __objRest$2(_a, ["disabled", "plasmicUpdateVariant", "setControlContextData"]);
   const textFieldContext = React__default.default.useContext(PlasmicTextFieldContext);
   const mergedProps = reactAria.mergeProps(rest, {
     disabled: (_b = textFieldContext == null ? void 0 : textFieldContext.isDisabled) != null ? _b : disabled
   });
   React.useEffect(() => {
-    updateVariant == null ? void 0 : updateVariant({
+    plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
       disabled: mergedProps.disabled
     });
-  }, [mergedProps.disabled, updateVariant]);
+  }, [mergedProps.disabled, plasmicUpdateVariant]);
   setControlContextData == null ? void 0 : setControlContextData({
     parent: textFieldContext
   });
@@ -4208,17 +4233,17 @@ function BaseTextArea(props) {
     reactAriaComponents.TextArea,
     __spreadValues$2({
       onFocus: () => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           focused: true
         });
       },
       onBlur: () => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           focused: false
         });
       },
       onHoverChange: (isHovered) => {
-        updateVariant == null ? void 0 : updateVariant({
+        plasmicUpdateVariant == null ? void 0 : plasmicUpdateVariant({
           hovered: isHovered
         });
       }
@@ -4274,8 +4299,7 @@ function registerTextArea(loader, overrides) {
         helpers: inputHelpers,
         importName: "inputHelpers",
         importPath: "@plasmicpkgs/react-aria/skinny/registerTextArea"
-      },
-      trapsFocus: true
+      }
     },
     overrides
   );
@@ -4315,14 +4339,14 @@ var __objRest$1 = (source, exclude) => {
 const TEXT_FIELD_VARIANTS = ["disabled", "readonly"];
 const { variants, withObservedValues } = pickAriaComponentVariants(TEXT_FIELD_VARIANTS);
 function BaseTextField(props) {
-  const _a = props, { children, updateVariant, autoComplete } = _a, rest = __objRest$1(_a, ["children", "updateVariant", "autoComplete"]);
+  const _a = props, { children, plasmicUpdateVariant, autoComplete } = _a, rest = __objRest$1(_a, ["children", "plasmicUpdateVariant", "autoComplete"]);
   return /* @__PURE__ */ React__default.default.createElement(PlasmicTextFieldContext.Provider, { value: props }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.TextField, __spreadValues$1({ autoComplete: resolveAutoComplete(autoComplete) }, rest), ({ isDisabled, isReadOnly }) => withObservedValues(
     children,
     {
       disabled: isDisabled,
       readonly: isReadOnly
     },
-    updateVariant
+    plasmicUpdateVariant
   )));
 }
 const TEXT_FIELD_COMPONENT_NAME = makeComponentName("textField");
@@ -4516,6 +4540,7 @@ function registerTooltip(loader, overrides) {
       props: {
         children: {
           type: "slot",
+          mergeWithParent: true,
           defaultValue: {
             type: "text",
             value: "Hover me!"
@@ -4523,6 +4548,7 @@ function registerTooltip(loader, overrides) {
         },
         tooltipContent: {
           type: "slot",
+          mergeWithParent: true,
           displayName: "Tooltip Content",
           // NOTE: This is not applied in attachment
           defaultValue: {
@@ -4570,7 +4596,8 @@ function registerTooltip(loader, overrides) {
           onChangeProp: "onOpenChange",
           variableType: "boolean"
         }
-      }
+      },
+      trapsFocus: true
     },
     overrides
   );