@plasmicpkgs/react-aria 0.0.63 → 0.0.64

package/dist/react-aria.esm.js

@@ -1,15 +1,15 @@
 import React, { useEffect, useState, useMemo, forwardRef, useImperativeHandle, Component } from 'react';
-import { Button, Checkbox, Text, FieldError, Label, CheckboxGroup, Input, ListBoxItem, ListBox, Section, Header, PopoverContext, Popover, ComboBox, Heading, ModalOverlay, Modal, Dialog, DialogTrigger, Radio, RadioGroup, Select, SelectValue, SliderOutput, SliderThumb, Slider, SliderTrack, Switch, TextArea, TextField } from 'react-aria-components';
+import { Button, Checkbox, Text, FieldError, Label, CheckboxGroup, Input, ListBoxItem, ListBox, Section, Header, PopoverContext, Popover, ComboBox, ComboBoxStateContext, Heading, ModalOverlay, Modal, Dialog, DialogTrigger, Radio, RadioGroup, Select, SelectValue, SliderOutput, SliderThumb, Slider, SliderTrack, Switch, TextArea, TextField } from 'react-aria-components';
 import registerComponent from '@plasmicapp/host/registerComponent';
+import { usePlasmicCanvasContext, usePlasmicCanvasComponentInfo } from '@plasmicapp/host';
 import { mergeProps, useTooltipTrigger } from 'react-aria';
 import { mergeProps as mergeProps$1 } from '@react-aria/utils';
-import { usePlasmicCanvasContext } from '@plasmicapp/host';
 import flattenChildren from 'react-keyed-flatten-children';
 import { useTooltipTriggerState } from 'react-stately';
 
 var __defProp$r = Object.defineProperty;
-var __defProps$f = Object.defineProperties;
-var __getOwnPropDescs$f = Object.getOwnPropertyDescriptors;
+var __defProps$g = Object.defineProperties;
+var __getOwnPropDescs$g = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$r = Object.getOwnPropertySymbols;
 var __hasOwnProp$r = Object.prototype.hasOwnProperty;
 var __propIsEnum$r = Object.prototype.propertyIsEnumerable;
@@ -25,16 +25,16 @@ var __spreadValues$r = (a, b) => {
     }
   return a;
 };
-var __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
+var __spreadProps$g = (a, b) => __defProps$g(a, __getOwnPropDescs$g(b));
 function registerComponentHelper(loader, component, meta, overrides) {
   var _a;
-  meta = __spreadProps$f(__spreadValues$r({}, meta), {
+  meta = __spreadProps$g(__spreadValues$r({}, meta), {
     defaultStyles: __spreadValues$r({
       boxSizing: "border-box"
     }, (_a = meta.defaultStyles) != null ? _a : {})
   });
   if (overrides) {
-    meta = __spreadProps$f(__spreadValues$r(__spreadValues$r({}, meta), overrides), {
+    meta = __spreadProps$g(__spreadValues$r(__spreadValues$r({}, meta), overrides), {
       props: __spreadValues$r(__spreadValues$r({}, meta.props), overrides.props)
     });
     if (overrides.parentComponentName) {
@@ -477,8 +477,8 @@ function pickAriaComponentVariants(keys) {
 }
 
 var __defProp$q = Object.defineProperty;
-var __defProps$e = Object.defineProperties;
-var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
+var __defProps$f = Object.defineProperties;
+var __getOwnPropDescs$f = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$q = Object.getOwnPropertySymbols;
 var __hasOwnProp$q = Object.prototype.hasOwnProperty;
 var __propIsEnum$q = Object.prototype.propertyIsEnumerable;
@@ -494,7 +494,7 @@ var __spreadValues$q = (a, b) => {
     }
   return a;
 };
-var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
+var __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
 var __objRest$o = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -548,7 +548,7 @@ function registerButton(loader, overrides) {
         padding: "2px 10px",
         cursor: "pointer"
       },
-      props: __spreadProps$e(__spreadValues$q({}, getCommonProps("button", [
+      props: __spreadProps$f(__spreadValues$q({}, getCommonProps("button", [
         "autoFocus",
         "isDisabled",
         "aria-label"
@@ -600,8 +600,8 @@ React.createContext(void 0);
 const PlasmicInputContext = React.createContext(void 0);
 
 var __defProp$p = Object.defineProperty;
-var __defProps$d = Object.defineProperties;
-var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
+var __defProps$e = Object.defineProperties;
+var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$p = Object.getOwnPropertySymbols;
 var __hasOwnProp$p = Object.prototype.hasOwnProperty;
 var __propIsEnum$p = Object.prototype.propertyIsEnumerable;
@@ -617,7 +617,7 @@ var __spreadValues$p = (a, b) => {
     }
   return a;
 };
-var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
+var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
 var __objRest$n = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -728,7 +728,7 @@ function registerCheckbox(loader, overrides) {
       importPath: "@plasmicpkgs/react-aria/skinny/registerCheckbox",
       importName: "BaseCheckbox",
       variants: variants$c,
-      props: __spreadProps$d(__spreadValues$p({}, getCommonProps("checkbox", [
+      props: __spreadProps$e(__spreadValues$p({}, getCommonProps("checkbox", [
         "name",
         "isDisabled",
         "isReadOnly",
@@ -797,8 +797,8 @@ function registerCheckbox(loader, overrides) {
 }
 
 var __defProp$o = Object.defineProperty;
-var __defProps$c = Object.defineProperties;
-var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
+var __defProps$d = Object.defineProperties;
+var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$o = Object.getOwnPropertySymbols;
 var __hasOwnProp$o = Object.prototype.hasOwnProperty;
 var __propIsEnum$o = Object.prototype.propertyIsEnumerable;
@@ -814,7 +814,7 @@ var __spreadValues$o = (a, b) => {
     }
   return a;
 };
-var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
+var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
 var __objRest$m = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -829,7 +829,7 @@ var __objRest$m = (source, exclude) => {
 };
 function BaseText(_a) {
   var _b = _a, { children, slot, className } = _b, rest = __objRest$m(_b, ["children", "slot", "className"]);
-  return /* @__PURE__ */ React.createElement(Text, __spreadProps$c(__spreadValues$o({}, extractPlasmicDataProps(rest)), { slot, className }), children);
+  return /* @__PURE__ */ React.createElement(Text, __spreadProps$d(__spreadValues$o({}, extractPlasmicDataProps(rest)), { slot, className }), children);
 }
 const TEXT_COMPONENT_NAME = makeComponentName("text");
 function registerText(loader, overrides) {
@@ -864,8 +864,8 @@ function registerText(loader, overrides) {
 }
 
 var __defProp$n = Object.defineProperty;
-var __defProps$b = Object.defineProperties;
-var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
+var __defProps$c = Object.defineProperties;
+var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$n = Object.getOwnPropertySymbols;
 var __hasOwnProp$n = Object.prototype.hasOwnProperty;
 var __propIsEnum$n = Object.prototype.propertyIsEnumerable;
@@ -881,10 +881,10 @@ var __spreadValues$n = (a, b) => {
     }
   return a;
 };
-var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
+var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
 const DESCRIPTION_COMPONENT_NAME = makeComponentName("description");
 function registerDescription(loader, overrides) {
-  return registerText(loader, __spreadProps$b(__spreadValues$n({}, overrides), {
+  return registerText(loader, __spreadProps$c(__spreadValues$n({}, overrides), {
     name: DESCRIPTION_COMPONENT_NAME,
     displayName: "Aria Description",
     props: {
@@ -1057,8 +1057,8 @@ function registerFieldError(loader, overrides) {
 }
 
 var __defProp$l = Object.defineProperty;
-var __defProps$a = Object.defineProperties;
-var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
+var __defProps$b = Object.defineProperties;
+var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$l = Object.getOwnPropertySymbols;
 var __hasOwnProp$l = Object.prototype.hasOwnProperty;
 var __propIsEnum$l = Object.prototype.propertyIsEnumerable;
@@ -1074,7 +1074,7 @@ var __spreadValues$l = (a, b) => {
     }
   return a;
 };
-var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
+var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
 var __objRest$k = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -1089,7 +1089,7 @@ var __objRest$k = (source, exclude) => {
 };
 function BaseLabel(_a) {
   var _b = _a, { children, className } = _b, rest = __objRest$k(_b, ["children", "className"]);
-  return /* @__PURE__ */ React.createElement(Label, __spreadProps$a(__spreadValues$l({}, extractPlasmicDataProps(rest)), { className }), children);
+  return /* @__PURE__ */ React.createElement(Label, __spreadProps$b(__spreadValues$l({}, extractPlasmicDataProps(rest)), { className }), children);
 }
 const LABEL_COMPONENT_NAME = makeComponentName("label");
 function registerLabel(loader, overrides) {
@@ -1121,8 +1121,8 @@ function registerLabel(loader, overrides) {
 }
 
 var __defProp$k = Object.defineProperty;
-var __defProps$9 = Object.defineProperties;
-var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
+var __defProps$a = Object.defineProperties;
+var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$k = Object.getOwnPropertySymbols;
 var __hasOwnProp$k = Object.prototype.hasOwnProperty;
 var __propIsEnum$k = Object.prototype.propertyIsEnumerable;
@@ -1138,7 +1138,7 @@ var __spreadValues$k = (a, b) => {
     }
   return a;
 };
-var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
+var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
 var __objRest$j = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -1186,7 +1186,7 @@ function registerCheckboxGroup(loader, overrides) {
       importPath: "@plasmicpkgs/react-aria/skinny/registerCheckboxGroup",
       importName: "BaseCheckboxGroup",
       variants: variants$b,
-      props: __spreadProps$9(__spreadValues$k({}, getCommonProps("checkbox group", [
+      props: __spreadProps$a(__spreadValues$k({}, getCommonProps("checkbox group", [
         "name",
         "isDisabled",
         "isReadOnly",
@@ -2075,6 +2075,10 @@ function BasePopover(props) {
     isStandalone ? {
       triggerRef,
       isNonModal: true,
+      /**
+       * Always true, because we assume that popover is always going to be controlled by a parent like Select, Combobox, DialogTrigger, etc, and its only really standalone in component view
+       * In component view, we never want to start with an empty artboard, so isOpen has to be true
+       *  */
       isOpen: true
     } : null
   );
@@ -2174,6 +2178,7 @@ function registerPopover(loader, overrides) {
           type: "themeResetClass"
         }
       },
+      // No isOpen state for popover, because we assume that its open state is always going to be controlled by a parent like Select, Combobox, DialogTrigger, etc.
       styleSections: true,
       trapsFocus: true
     },
@@ -2182,8 +2187,8 @@ function registerPopover(loader, overrides) {
 }
 
 var __defProp$e = Object.defineProperty;
-var __defProps$8 = Object.defineProperties;
-var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
+var __defProps$9 = Object.defineProperties;
+var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
 var __hasOwnProp$e = Object.prototype.hasOwnProperty;
 var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
@@ -2199,7 +2204,7 @@ var __spreadValues$e = (a, b) => {
     }
   return a;
 };
-var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
+var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
 var __objRest$d = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -2213,6 +2218,23 @@ var __objRest$d = (source, exclude) => {
   return target;
 };
 const COMBOBOX_NAME = makeComponentName("combobox");
+function ComboboxAutoOpen(props) {
+  var _a, _b;
+  const isEditMode = !!usePlasmicCanvasContext();
+  const { isSelected } = (_a = usePlasmicCanvasComponentInfo(props)) != null ? _a : {};
+  const { open, close } = (_b = React.useContext(ComboBoxStateContext)) != null ? _b : {};
+  useEffect(() => {
+    if (!isEditMode) {
+      return;
+    }
+    if (isSelected) {
+      open == null ? void 0 : open(void 0, "manual");
+    } else {
+      close == null ? void 0 : close();
+    }
+  }, [isSelected, isEditMode]);
+  return null;
+}
 function BaseComboBox(props) {
   const _a = props, { children, setControlContextData, isOpen } = _a, rest = __objRest$d(_a, ["children", "setControlContextData", "isOpen"]);
   const idManager = useMemo(() => new ListBoxItemIdManager(), []);
@@ -2235,7 +2257,7 @@ function BaseComboBox(props) {
           idManager
         }
       },
-      /* @__PURE__ */ React.createElement(PlasmicInputContext.Provider, { value: { isUncontrolled: true } }, children)
+      /* @__PURE__ */ React.createElement(PlasmicInputContext.Provider, { value: { isUncontrolled: true } }, /* @__PURE__ */ React.createElement(ComboboxAutoOpen, __spreadValues$e({}, props)), children)
     )
   ));
 }
@@ -2245,7 +2267,7 @@ function registerComboBox(loader) {
     displayName: "Aria ComboBox",
     importPath: "@plasmicpkgs/react-aria/skinny/registerComboBox",
     importName: "BaseComboBox",
-    props: __spreadProps$8(__spreadValues$e({}, getCommonProps("ComboBox", [
+    props: __spreadProps$9(__spreadValues$e({}, getCommonProps("ComboBox", [
       "name",
       "aria-label",
       "placeholder",
@@ -2448,8 +2470,8 @@ function registerHeading(loader, overrides) {
 }
 
 var __defProp$c = Object.defineProperty;
-var __defProps$7 = Object.defineProperties;
-var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
+var __defProps$8 = Object.defineProperties;
+var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
 var __hasOwnProp$c = Object.prototype.hasOwnProperty;
 var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
@@ -2465,7 +2487,7 @@ var __spreadValues$c = (a, b) => {
     }
   return a;
 };
-var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
+var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
 var __objRest$b = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -2483,6 +2505,7 @@ const INLINE_STYLES = {
 };
 const BaseModal = forwardRef(
   function _BaseModal(props, ref) {
+    var _b;
     const _a = props, {
       children,
       modalOverlayClass,
@@ -2498,10 +2521,11 @@ const BaseModal = forwardRef(
       "resetClassName",
       "setControlContextData"
     ]);
+    const { isSelected } = (_b = usePlasmicCanvasComponentInfo(props)) != null ? _b : {};
     const contextProps = React.useContext(PlasmicDialogTriggerContext);
     const isStandalone = !contextProps;
     const mergedProps = mergeProps(contextProps, rest, {
-      isOpen: isStandalone ? isOpen : contextProps.isOpen
+      isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen
     });
     setControlContextData == null ? void 0 : setControlContextData({
       parent: isStandalone ? void 0 : {}
@@ -2521,7 +2545,7 @@ const BaseModal = forwardRef(
     const bodyInPreview = /* @__PURE__ */ React.createElement(Dialog, { style: INLINE_STYLES }, children);
     return /* @__PURE__ */ React.createElement(
       ModalOverlay,
-      __spreadProps$7(__spreadValues$c({}, mergedProps), {
+      __spreadProps$8(__spreadValues$c({}, mergedProps), {
         className: `${resetClassName} ${modalOverlayClass}`
       }),
       /* @__PURE__ */ React.createElement(Modal, { className }, isCanvas ? bodyInCanvas : bodyInPreview)
@@ -2607,7 +2631,7 @@ function registerModal(loader, overrides) {
           type: "boolean",
           editOnly: true,
           uncontrolledProp: "defaultOpen",
-          defaultValueHint: false,
+          defaultValueHint: true,
           defaultValue: true,
           hidden: hasParent
         },
@@ -2643,6 +2667,8 @@ function registerModal(loader, overrides) {
 }
 
 var __defProp$b = Object.defineProperty;
+var __defProps$7 = Object.defineProperties;
+var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
 var __hasOwnProp$b = Object.prototype.hasOwnProperty;
 var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
@@ -2658,6 +2684,7 @@ var __spreadValues$b = (a, b) => {
     }
   return a;
 };
+var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
 var __objRest$a = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -2671,8 +2698,14 @@ var __objRest$a = (source, exclude) => {
   return target;
 };
 function BaseDialogTrigger(props) {
-  const _a = props, { trigger, dialog } = _a, rest = __objRest$a(_a, ["trigger", "dialog"]);
-  return /* @__PURE__ */ React.createElement(PlasmicDialogTriggerContext.Provider, { value: props }, /* @__PURE__ */ React.createElement(DialogTrigger, __spreadValues$b({}, rest), trigger, dialog));
+  var _b, _c;
+  const _a = props, { trigger, dialog, isOpen } = _a, rest = __objRest$a(_a, ["trigger", "dialog", "isOpen"]);
+  const { isSelected, selectedSlotName } = (_b = usePlasmicCanvasComponentInfo(props)) != null ? _b : {};
+  const isAutoOpen = selectedSlotName !== "trigger" && isSelected;
+  const mergedProps = __spreadProps$7(__spreadValues$b({}, rest), {
+    isOpen: (_c = isAutoOpen || isOpen) != null ? _c : false
+  });
+  return /* @__PURE__ */ React.createElement(PlasmicDialogTriggerContext.Provider, { value: mergedProps }, /* @__PURE__ */ React.createElement(DialogTrigger, __spreadValues$b({}, mergedProps), trigger, dialog));
 }
 function registerDialogTrigger(loader, overrides) {
   registerComponentHelper(
@@ -3062,11 +3095,11 @@ const BaseSelectValue = (props) => {
 };
 const SELECT_NAME = makeComponentName("select");
 function BaseSelect(props) {
+  var _a, _b;
   const {
     selectedKey,
     onSelectionChange,
     placeholder,
-    previewOpen,
     onOpenChange,
     isDisabled,
     className,
@@ -3078,8 +3111,8 @@ function BaseSelect(props) {
     setControlContextData,
     "aria-label": ariaLabel
   } = props;
-  const isEditMode = !!usePlasmicCanvasContext();
-  const openProp = isEditMode && previewOpen ? true : isOpen;
+  const { isSelected } = (_a = usePlasmicCanvasComponentInfo(props)) != null ? _a : {};
+  const _isOpen = (_b = isSelected || isOpen) != null ? _b : false;
   let idManager = useMemo(() => new ListBoxItemIdManager(), []);
   useEffect(() => {
     idManager.subscribe((ids) => {
@@ -3101,12 +3134,12 @@ function BaseSelect(props) {
       name,
       disabledKeys,
       "aria-label": ariaLabel,
-      isOpen: openProp
+      isOpen: _isOpen
     }, extractPlasmicDataProps(props)),
     /* @__PURE__ */ React.createElement(
       PlasmicPopoverContext.Provider,
       {
-        value: { isOpen: openProp, defaultShouldFlip: false }
+        value: { isOpen: _isOpen, defaultShouldFlip: false }
       },
       /* @__PURE__ */ React.createElement(
         PlasmicListBoxContext.Provider,
@@ -3187,13 +3220,6 @@ function registerSelect(loader) {
         multiSelect: true,
         advanced: true
       },
-      previewOpen: {
-        type: "boolean",
-        displayName: "Preview opened?",
-        description: "Preview opened state while designing in Plasmic editor",
-        editOnly: true,
-        defaultValue: false
-      },
       isOpen: {
         type: "boolean",
         defaultValue: false,
@@ -4491,7 +4517,10 @@ var __objRest = (source, exclude) => {
   return target;
 };
 function BaseTooltip(props) {
+  var _b;
   const _a = props, { children, tooltipContent, className, resetClassName } = _a, restProps = __objRest(_a, ["children", "tooltipContent", "className", "resetClassName"]);
+  const { isSelected, selectedSlotName } = (_b = usePlasmicCanvasComponentInfo(props)) != null ? _b : {};
+  const isAutoOpen = selectedSlotName !== "children" && isSelected;
   const state = useTooltipTriggerState(restProps);
   const ref = React.useRef(null);
   const { triggerProps, tooltipProps } = useTooltipTrigger(
@@ -4513,7 +4542,7 @@ function BaseTooltip(props) {
       focusableChild.props,
       triggerProps
     ))) : null,
-    state.isOpen && /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(
+    (isAutoOpen || state.isOpen) && /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(
       hasContent ? tooltipContent : /* @__PURE__ */ React.createElement("p", null, "Add some content to the tooltip..."),
       mergeProps$1(tooltipProps, tooltipContent == null ? void 0 : tooltipContent.props.attrs, { className })
     ))
@@ -4533,6 +4562,7 @@ function registerTooltip(loader, overrides) {
       props: {
         children: {
           type: "slot",
+          displayName: "Trigger",
           mergeWithParent: true,
           defaultValue: {
             type: "text",
@@ -4570,13 +4600,6 @@ function registerTooltip(loader, overrides) {
           options: ["focus", "focus and hover"],
           defaultValueHint: "focus and hover"
         },
-        isOpen: {
-          type: "boolean",
-          editOnly: true,
-          uncontrolledProp: "defaultOpen",
-          description: "Whether the overlay is open by default",
-          defaultValueHint: false
-        },
         onOpenChange: {
           type: "eventHandler",
           argTypes: [{ name: "isOpen", type: "boolean" }]
@@ -4584,8 +4607,7 @@ function registerTooltip(loader, overrides) {
       },
       states: {
         isOpen: {
-          type: "writable",
-          valueProp: "isOpen",
+          type: "readonly",
           onChangeProp: "onOpenChange",
           variableType: "boolean"
         }