@plasmicpkgs/react-aria 0.0.113 → 0.0.114

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/dist/.tsbuildinfo +1 -1
  2. package/dist/react-aria.esm.js +47 -24
  3. package/dist/react-aria.esm.js.map +1 -1
  4. package/dist/react-aria.js +47 -24
  5. package/dist/react-aria.js.map +1 -1
  6. package/dist/utils.d.ts +19 -2
  7. package/package.json +2 -2
  8. package/skinny/{common-ceebbaea.esm.js → common-10d1b069.esm.js} +2 -2
  9. package/skinny/{common-ceebbaea.esm.js.map → common-10d1b069.esm.js.map} +1 -1
  10. package/skinny/{common-b3b54c72.cjs.js → common-c8beb360.cjs.js} +2 -2
  11. package/skinny/{common-b3b54c72.cjs.js.map → common-c8beb360.cjs.js.map} +1 -1
  12. package/skinny/registerButton.cjs.js +2 -2
  13. package/skinny/registerButton.esm.js +2 -2
  14. package/skinny/registerButton.stories.cjs.js +2 -2
  15. package/skinny/registerButton.stories.esm.js +2 -2
  16. package/skinny/registerCheckbox.cjs.js +2 -2
  17. package/skinny/registerCheckbox.esm.js +2 -2
  18. package/skinny/registerCheckboxGroup.cjs.js +2 -2
  19. package/skinny/registerCheckboxGroup.esm.js +2 -2
  20. package/skinny/registerCheckboxGroup.stories.cjs.js +2 -2
  21. package/skinny/registerCheckboxGroup.stories.esm.js +2 -2
  22. package/skinny/registerComboBox.cjs.js +3 -3
  23. package/skinny/registerComboBox.esm.js +3 -3
  24. package/skinny/registerComboBox.stories.cjs.js +3 -3
  25. package/skinny/registerComboBox.stories.esm.js +3 -3
  26. package/skinny/registerDescription.cjs.js +2 -2
  27. package/skinny/registerDescription.esm.js +2 -2
  28. package/skinny/registerDialog.cjs.js +2 -2
  29. package/skinny/registerDialog.esm.js +2 -2
  30. package/skinny/registerDialogTrigger.cjs.js +10 -8
  31. package/skinny/registerDialogTrigger.cjs.js.map +1 -1
  32. package/skinny/registerDialogTrigger.esm.js +10 -8
  33. package/skinny/registerDialogTrigger.esm.js.map +1 -1
  34. package/skinny/registerDialogTrigger.stories.cjs.js +7 -2
  35. package/skinny/registerDialogTrigger.stories.cjs.js.map +1 -1
  36. package/skinny/registerDialogTrigger.stories.esm.js +8 -3
  37. package/skinny/registerDialogTrigger.stories.esm.js.map +1 -1
  38. package/skinny/registerFieldError.cjs.js +1 -1
  39. package/skinny/registerFieldError.esm.js +1 -1
  40. package/skinny/registerForm.cjs.js +1 -1
  41. package/skinny/registerForm.esm.js +1 -1
  42. package/skinny/registerHeading.cjs.js +2 -2
  43. package/skinny/registerHeading.esm.js +2 -2
  44. package/skinny/registerInput.cjs.js +2 -2
  45. package/skinny/registerInput.esm.js +2 -2
  46. package/skinny/registerLabel.cjs.js +2 -2
  47. package/skinny/registerLabel.esm.js +2 -2
  48. package/skinny/{registerListBox-a99736df.cjs.js → registerListBox-87d0e61a.cjs.js} +3 -3
  49. package/skinny/{registerListBox-a99736df.cjs.js.map → registerListBox-87d0e61a.cjs.js.map} +1 -1
  50. package/skinny/{registerListBox-49626f55.esm.js → registerListBox-a5fd72be.esm.js} +3 -3
  51. package/skinny/{registerListBox-49626f55.esm.js.map → registerListBox-a5fd72be.esm.js.map} +1 -1
  52. package/skinny/registerListBox.cjs.js +3 -3
  53. package/skinny/registerListBox.esm.js +3 -3
  54. package/skinny/registerListBoxItem.cjs.js +2 -2
  55. package/skinny/registerListBoxItem.esm.js +2 -2
  56. package/skinny/registerListbox.stories.cjs.js +3 -3
  57. package/skinny/registerListbox.stories.esm.js +3 -3
  58. package/skinny/registerModal.cjs.js +18 -14
  59. package/skinny/registerModal.cjs.js.map +1 -1
  60. package/skinny/registerModal.esm.js +19 -15
  61. package/skinny/registerModal.esm.js.map +1 -1
  62. package/skinny/registerModal.stories.cjs.js +2 -2
  63. package/skinny/registerModal.stories.esm.js +2 -2
  64. package/skinny/registerOverlayArrow.cjs.js +2 -2
  65. package/skinny/registerOverlayArrow.esm.js +2 -2
  66. package/skinny/registerPopover.cjs.js +2 -2
  67. package/skinny/registerPopover.esm.js +2 -2
  68. package/skinny/registerPopover.stories.cjs.js +2 -2
  69. package/skinny/registerPopover.stories.esm.js +2 -2
  70. package/skinny/registerRadio.cjs.js +2 -2
  71. package/skinny/registerRadio.esm.js +2 -2
  72. package/skinny/registerRadioGroup.cjs.js +2 -2
  73. package/skinny/registerRadioGroup.esm.js +2 -2
  74. package/skinny/registerRadioGroup.stories.cjs.js +2 -2
  75. package/skinny/registerRadioGroup.stories.esm.js +2 -2
  76. package/skinny/registerSection.cjs.js +3 -3
  77. package/skinny/registerSection.esm.js +3 -3
  78. package/skinny/registerSelect.cjs.js +3 -3
  79. package/skinny/registerSelect.esm.js +3 -3
  80. package/skinny/registerSelect.stories.cjs.js +3 -3
  81. package/skinny/registerSelect.stories.esm.js +3 -3
  82. package/skinny/registerSlider.cjs.js +2 -2
  83. package/skinny/registerSlider.esm.js +2 -2
  84. package/skinny/registerSlider.stories.cjs.js +2 -2
  85. package/skinny/registerSlider.stories.esm.js +2 -2
  86. package/skinny/registerSliderOutput.cjs.js +2 -2
  87. package/skinny/registerSliderOutput.esm.js +2 -2
  88. package/skinny/registerSliderThumb.cjs.js +2 -2
  89. package/skinny/registerSliderThumb.esm.js +2 -2
  90. package/skinny/registerSliderTrack.cjs.js +2 -2
  91. package/skinny/registerSliderTrack.esm.js +2 -2
  92. package/skinny/registerSwitch.cjs.js +2 -2
  93. package/skinny/registerSwitch.esm.js +2 -2
  94. package/skinny/registerSwitch.stories.cjs.js +2 -2
  95. package/skinny/registerSwitch.stories.esm.js +2 -2
  96. package/skinny/registerText.cjs.js +2 -2
  97. package/skinny/registerText.esm.js +2 -2
  98. package/skinny/registerTextArea.cjs.js +2 -2
  99. package/skinny/registerTextArea.esm.js +2 -2
  100. package/skinny/registerTextField-common-stories.cjs.js +2 -2
  101. package/skinny/registerTextField-common-stories.esm.js +2 -2
  102. package/skinny/registerTextField-input.stories.cjs.js +2 -2
  103. package/skinny/registerTextField-input.stories.esm.js +2 -2
  104. package/skinny/registerTextField-textarea.stories.cjs.js +2 -2
  105. package/skinny/registerTextField-textarea.stories.esm.js +2 -2
  106. package/skinny/registerTextField.cjs.js +2 -2
  107. package/skinny/registerTextField.esm.js +2 -2
  108. package/skinny/registerTooltip.cjs.js +12 -10
  109. package/skinny/registerTooltip.cjs.js.map +1 -1
  110. package/skinny/registerTooltip.esm.js +12 -10
  111. package/skinny/registerTooltip.esm.js.map +1 -1
  112. package/skinny/registerTooltip.stories.cjs.js +2 -2
  113. package/skinny/registerTooltip.stories.esm.js +2 -2
  114. package/skinny/{utils-5d1b4c6b.esm.js → utils-59f72eb9.esm.js} +17 -2
  115. package/skinny/utils-59f72eb9.esm.js.map +1 -0
  116. package/skinny/{utils-7d000fa4.cjs.js → utils-91eee672.cjs.js} +17 -1
  117. package/skinny/utils-91eee672.cjs.js.map +1 -0
  118. package/skinny/utils.d.ts +19 -2
  119. package/skinny/utils-5d1b4c6b.esm.js.map +0 -1
  120. package/skinny/utils-7d000fa4.cjs.js.map +0 -1
@@ -34,6 +34,21 @@ var __spreadValues$s = (a, b) => {
34
34
  return a;
35
35
  };
36
36
  var __spreadProps$n = (a, b) => __defProps$n(a, __getOwnPropDescs$n(b));
37
+ function useIsOpen({
38
+ triggerSlotName,
39
+ isOpen,
40
+ __plasmic_selection_prop__
41
+ }) {
42
+ var _a, _b;
43
+ const canvasContext = host.usePlasmicCanvasContext();
44
+ const { isSelected, selectedSlotName } = (_b = (_a = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _a({ __plasmic_selection_prop__ })) != null ? _b : {};
45
+ if (!canvasContext) {
46
+ return isOpen;
47
+ }
48
+ const isTriggerSlotSelected = isDefined(selectedSlotName) && selectedSlotName === triggerSlotName;
49
+ const isAutoOpenedBySelection = isSelected && !isTriggerSlotSelected;
50
+ return Boolean(isAutoOpenedBySelection || isOpen);
51
+ }
37
52
  function useAutoOpen({
38
53
  props,
39
54
  open,
@@ -2638,7 +2653,6 @@ var __objRest$c = (source, exclude) => {
2638
2653
  };
2639
2654
  const BaseModal = React.forwardRef(
2640
2655
  function BaseModalInner(props, ref) {
2641
- var _b, _c, _d;
2642
2656
  const _a = props, {
2643
2657
  children,
2644
2658
  modalOverlayClass,
@@ -2646,7 +2660,9 @@ const BaseModal = React.forwardRef(
2646
2660
  isOpen,
2647
2661
  resetClassName,
2648
2662
  setControlContextData,
2649
- isDismissable
2663
+ isDismissable,
2664
+ defaultOpen,
2665
+ __plasmic_selection_prop__
2650
2666
  } = _a, rest = __objRest$c(_a, [
2651
2667
  "children",
2652
2668
  "modalOverlayClass",
@@ -2654,22 +2670,24 @@ const BaseModal = React.forwardRef(
2654
2670
  "isOpen",
2655
2671
  "resetClassName",
2656
2672
  "setControlContextData",
2657
- "isDismissable"
2673
+ "isDismissable",
2674
+ "defaultOpen",
2675
+ "__plasmic_selection_prop__"
2658
2676
  ]);
2659
2677
  const canvasCtx = host.usePlasmicCanvasContext();
2660
2678
  const isEditMode = canvasCtx && canvasCtx.interactive === false;
2661
- const isSelected = (_d = (_c = (_b = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _b(props)) == null ? void 0 : _c.isSelected) != null ? _d : false;
2662
2679
  const contextProps = React__default.default.useContext(PlasmicDialogTriggerContext);
2663
2680
  const isStandalone = !contextProps;
2681
+ const isOpen2 = useIsOpen({ isOpen, __plasmic_selection_prop__ });
2664
2682
  const mergedProps = reactAria.mergeProps(rest, {
2665
- isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen,
2666
- /*
2667
- isDismissable on canvas (non-interactive mode) causes the following two issues:
2668
- 1. Clicking anywhere inside the modal dismisses it
2669
- 2. If the modal is auto-opened due to selection in outline tab, the modal stays open despite issue #1, but the text elements inside the modal are no longer selectable, and therefore the text or headings inside the modal are not editable.
2670
-
2671
- To fix the above issue, we set an interim isDismissable state to false in edit mode, because it only matters in interactive mode.
2672
- */
2683
+ // Since open/defaultOpen props are hidden when the modal is inside dialogTrigger, we also unset them here.
2684
+ isOpen: isStandalone ? isOpen2 : void 0,
2685
+ defaultOpen: isStandalone ? defaultOpen : void 0,
2686
+ // isDismissable on canvas (non-interactive mode) causes the following two issues:
2687
+ // 1. Clicking anywhere inside the modal dismisses it
2688
+ // 2. If the modal is auto-opened due to selection in outline tab, the modal stays open despite issue #1, but the text elements inside the modal are no longer selectable, and therefore the text or headings inside the modal are not editable.
2689
+ //
2690
+ // To fix the above issue, we set an interim isDismissable state to false in edit mode, because it only matters in interactive mode.
2673
2691
  isDismissable: isEditMode ? false : isDismissable
2674
2692
  });
2675
2693
  setControlContextData == null ? void 0 : setControlContextData({
@@ -2775,6 +2793,7 @@ function registerModal(loader, overrides) {
2775
2793
  type: "boolean",
2776
2794
  editOnly: true,
2777
2795
  uncontrolledProp: "defaultOpen",
2796
+ // standalone Modals should default to open so that they are visible when inserted
2778
2797
  defaultValueHint: true,
2779
2798
  defaultValue: true,
2780
2799
  hidden: hasParent
@@ -2853,12 +2872,14 @@ function TriggerWrapper$1({ children, className }) {
2853
2872
  return /* @__PURE__ */ React__default.default.createElement("div", __spreadValues$d({}, mergedProps), children);
2854
2873
  }
2855
2874
  function BaseDialogTrigger(props) {
2856
- var _b, _c;
2857
- const _a = props, { trigger, dialog, isOpen, className } = _a, rest = __objRest$b(_a, ["trigger", "dialog", "isOpen", "className"]);
2858
- const { isSelected, selectedSlotName } = (_c = (_b = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _b(props)) != null ? _c : {};
2859
- const isAutoOpen = selectedSlotName !== "trigger" && isSelected;
2875
+ const _a = props, { trigger, dialog, isOpen, className, __plasmic_selection_prop__ } = _a, rest = __objRest$b(_a, ["trigger", "dialog", "isOpen", "className", "__plasmic_selection_prop__"]);
2876
+ const isOpen2 = useIsOpen({
2877
+ triggerSlotName: "trigger",
2878
+ isOpen,
2879
+ __plasmic_selection_prop__
2880
+ });
2860
2881
  const mergedProps = __spreadProps$b(__spreadValues$d({}, rest), {
2861
- isOpen: isAutoOpen || isOpen
2882
+ isOpen: isOpen2
2862
2883
  });
2863
2884
  return /* @__PURE__ */ React__default.default.createElement(PlasmicDialogTriggerContext.Provider, { value: mergedProps }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.DialogTrigger, __spreadValues$d({}, mergedProps), trigger && /* @__PURE__ */ React__default.default.createElement(TriggerWrapper$1, { className }, trigger), dialog));
2864
2885
  }
@@ -4924,7 +4945,6 @@ function UncontrolledBaseTooltip(_a) {
4924
4945
  );
4925
4946
  }
4926
4947
  function ControlledBaseTooltip(props) {
4927
- var _a, _b;
4928
4948
  const {
4929
4949
  children,
4930
4950
  isDisabled = false,
@@ -4941,11 +4961,14 @@ function ControlledBaseTooltip(props) {
4941
4961
  className,
4942
4962
  onOpenChange = () => {
4943
4963
  },
4944
- plasmicUpdateVariant
4964
+ plasmicUpdateVariant,
4965
+ __plasmic_selection_prop__
4945
4966
  } = props;
4946
- const { isSelected, selectedSlotName } = (_b = (_a = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _a(props)) != null ? _b : {};
4947
- const isSelectedOnCanvas = selectedSlotName !== "children" && isSelected;
4948
- const _isOpen = isSelectedOnCanvas || isOpen;
4967
+ const isOpen2 = useIsOpen({
4968
+ triggerSlotName: "children",
4969
+ isOpen,
4970
+ __plasmic_selection_prop__
4971
+ });
4949
4972
  const ref = React.useRef(null);
4950
4973
  const tooltipId = React.useId();
4951
4974
  const state = reactStately.useTooltipTriggerState(__spreadProps(__spreadValues({}, props), {
@@ -4956,7 +4979,7 @@ function ControlledBaseTooltip(props) {
4956
4979
  {
4957
4980
  ref,
4958
4981
  className,
4959
- tooltipId: _isOpen ? tooltipId : void 0,
4982
+ tooltipId: isOpen2 ? tooltipId : void 0,
4960
4983
  isDisabled,
4961
4984
  onOpenChange,
4962
4985
  triggerOnFocusOnly: trigger === "focus"
@@ -4967,7 +4990,7 @@ function ControlledBaseTooltip(props) {
4967
4990
  {
4968
4991
  triggerRef: ref,
4969
4992
  id: tooltipId,
4970
- isOpen: _isOpen,
4993
+ isOpen: isOpen2,
4971
4994
  offset,
4972
4995
  delay,
4973
4996
  closeDelay,