@plasmicpkgs/react-aria 0.0.112 → 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.
- package/dist/.tsbuildinfo +1 -1
- package/dist/react-aria.esm.js +60 -27
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js +59 -26
- package/dist/react-aria.js.map +1 -1
- package/dist/registerDialogTrigger.d.ts +6 -0
- package/dist/utils.d.ts +19 -2
- package/package.json +2 -4
- package/skinny/{common-ceebbaea.esm.js → common-10d1b069.esm.js} +2 -2
- package/skinny/{common-ceebbaea.esm.js.map → common-10d1b069.esm.js.map} +1 -1
- package/skinny/{common-b3b54c72.cjs.js → common-c8beb360.cjs.js} +2 -2
- package/skinny/{common-b3b54c72.cjs.js.map → common-c8beb360.cjs.js.map} +1 -1
- package/skinny/registerButton.cjs.js +2 -2
- package/skinny/registerButton.esm.js +2 -2
- package/skinny/registerButton.stories.cjs.js +2 -2
- package/skinny/registerButton.stories.esm.js +2 -2
- package/skinny/registerCheckbox.cjs.js +2 -2
- package/skinny/registerCheckbox.esm.js +2 -2
- package/skinny/registerCheckboxGroup.cjs.js +2 -2
- package/skinny/registerCheckboxGroup.esm.js +2 -2
- package/skinny/registerCheckboxGroup.stories.cjs.js +2 -2
- package/skinny/registerCheckboxGroup.stories.esm.js +2 -2
- package/skinny/registerComboBox.cjs.js +3 -3
- package/skinny/registerComboBox.esm.js +3 -3
- package/skinny/registerComboBox.stories.cjs.js +3 -3
- package/skinny/registerComboBox.stories.esm.js +3 -3
- package/skinny/registerDescription.cjs.js +2 -2
- package/skinny/registerDescription.esm.js +2 -2
- package/skinny/registerDialog.cjs.js +2 -2
- package/skinny/registerDialog.esm.js +2 -2
- package/skinny/registerDialogTrigger.cjs.js +24 -11
- package/skinny/registerDialogTrigger.cjs.js.map +1 -1
- package/skinny/registerDialogTrigger.d.ts +6 -0
- package/skinny/registerDialogTrigger.esm.js +24 -12
- package/skinny/registerDialogTrigger.esm.js.map +1 -1
- package/skinny/registerDialogTrigger.stories.cjs.js +260 -18
- package/skinny/registerDialogTrigger.stories.cjs.js.map +1 -1
- package/skinny/registerDialogTrigger.stories.esm.js +257 -20
- package/skinny/registerDialogTrigger.stories.esm.js.map +1 -1
- package/skinny/registerFieldError.cjs.js +1 -1
- package/skinny/registerFieldError.esm.js +1 -1
- package/skinny/registerForm.cjs.js +1 -1
- package/skinny/registerForm.esm.js +1 -1
- package/skinny/registerHeading.cjs.js +2 -2
- package/skinny/registerHeading.esm.js +2 -2
- package/skinny/registerInput.cjs.js +2 -2
- package/skinny/registerInput.esm.js +2 -2
- package/skinny/registerLabel.cjs.js +2 -2
- package/skinny/registerLabel.esm.js +2 -2
- package/skinny/{registerListBox-a99736df.cjs.js → registerListBox-87d0e61a.cjs.js} +3 -3
- package/skinny/{registerListBox-a99736df.cjs.js.map → registerListBox-87d0e61a.cjs.js.map} +1 -1
- package/skinny/{registerListBox-49626f55.esm.js → registerListBox-a5fd72be.esm.js} +3 -3
- package/skinny/{registerListBox-49626f55.esm.js.map → registerListBox-a5fd72be.esm.js.map} +1 -1
- package/skinny/registerListBox.cjs.js +3 -3
- package/skinny/registerListBox.esm.js +3 -3
- package/skinny/registerListBoxItem.cjs.js +2 -2
- package/skinny/registerListBoxItem.esm.js +2 -2
- package/skinny/registerListbox.stories.cjs.js +3 -3
- package/skinny/registerListbox.stories.esm.js +3 -3
- package/skinny/registerModal.cjs.js +18 -14
- package/skinny/registerModal.cjs.js.map +1 -1
- package/skinny/registerModal.esm.js +19 -15
- package/skinny/registerModal.esm.js.map +1 -1
- package/skinny/registerModal.stories.cjs.js +2 -2
- package/skinny/registerModal.stories.esm.js +2 -2
- package/skinny/registerOverlayArrow.cjs.js +2 -2
- package/skinny/registerOverlayArrow.esm.js +2 -2
- package/skinny/registerPopover.cjs.js +2 -2
- package/skinny/registerPopover.esm.js +2 -2
- package/skinny/registerPopover.stories.cjs.js +2 -2
- package/skinny/registerPopover.stories.esm.js +2 -2
- package/skinny/registerRadio.cjs.js +2 -2
- package/skinny/registerRadio.esm.js +2 -2
- package/skinny/registerRadioGroup.cjs.js +2 -2
- package/skinny/registerRadioGroup.esm.js +2 -2
- package/skinny/registerRadioGroup.stories.cjs.js +2 -2
- package/skinny/registerRadioGroup.stories.esm.js +2 -2
- package/skinny/registerSection.cjs.js +3 -3
- package/skinny/registerSection.esm.js +3 -3
- package/skinny/registerSelect.cjs.js +3 -3
- package/skinny/registerSelect.esm.js +3 -3
- package/skinny/registerSelect.stories.cjs.js +3 -3
- package/skinny/registerSelect.stories.esm.js +3 -3
- package/skinny/registerSlider.cjs.js +2 -2
- package/skinny/registerSlider.esm.js +2 -2
- package/skinny/registerSlider.stories.cjs.js +2 -2
- package/skinny/registerSlider.stories.esm.js +2 -2
- package/skinny/registerSliderOutput.cjs.js +2 -2
- package/skinny/registerSliderOutput.esm.js +2 -2
- package/skinny/registerSliderThumb.cjs.js +2 -2
- package/skinny/registerSliderThumb.esm.js +2 -2
- package/skinny/registerSliderTrack.cjs.js +2 -2
- package/skinny/registerSliderTrack.esm.js +2 -2
- package/skinny/registerSwitch.cjs.js +2 -2
- package/skinny/registerSwitch.esm.js +2 -2
- package/skinny/registerSwitch.stories.cjs.js +2 -2
- package/skinny/registerSwitch.stories.esm.js +2 -2
- package/skinny/registerText.cjs.js +2 -2
- package/skinny/registerText.esm.js +2 -2
- package/skinny/registerTextArea.cjs.js +2 -2
- package/skinny/registerTextArea.esm.js +2 -2
- package/skinny/registerTextField-common-stories.cjs.js +2 -2
- package/skinny/registerTextField-common-stories.esm.js +2 -2
- package/skinny/registerTextField-input.stories.cjs.js +2 -2
- package/skinny/registerTextField-input.stories.esm.js +2 -2
- package/skinny/registerTextField-textarea.stories.cjs.js +2 -2
- package/skinny/registerTextField-textarea.stories.esm.js +2 -2
- package/skinny/registerTextField.cjs.js +2 -2
- package/skinny/registerTextField.esm.js +2 -2
- package/skinny/registerTooltip.cjs.js +12 -10
- package/skinny/registerTooltip.cjs.js.map +1 -1
- package/skinny/registerTooltip.esm.js +12 -10
- package/skinny/registerTooltip.esm.js.map +1 -1
- package/skinny/registerTooltip.stories.cjs.js +2 -2
- package/skinny/registerTooltip.stories.esm.js +2 -2
- package/skinny/{utils-5d1b4c6b.esm.js → utils-59f72eb9.esm.js} +17 -2
- package/skinny/utils-59f72eb9.esm.js.map +1 -0
- package/skinny/{utils-7d000fa4.cjs.js → utils-91eee672.cjs.js} +17 -1
- package/skinny/utils-91eee672.cjs.js.map +1 -0
- package/skinny/utils.d.ts +19 -2
- package/skinny/utils-5d1b4c6b.esm.js.map +0 -1
- package/skinny/utils-7d000fa4.cjs.js.map +0 -1
package/dist/react-aria.js
CHANGED
|
@@ -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
|
-
|
|
2666
|
-
|
|
2667
|
-
|
|
2668
|
-
|
|
2669
|
-
|
|
2670
|
-
|
|
2671
|
-
|
|
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
|
|
@@ -2841,15 +2860,28 @@ var __objRest$b = (source, exclude) => {
|
|
|
2841
2860
|
}
|
|
2842
2861
|
return target;
|
|
2843
2862
|
};
|
|
2863
|
+
function TriggerWrapper$1({ children, className }) {
|
|
2864
|
+
const ref = React__default.default.useRef(null);
|
|
2865
|
+
const { buttonProps } = reactAria.useButton({}, ref);
|
|
2866
|
+
const mergedProps = reactAria.mergeProps(buttonProps, {
|
|
2867
|
+
ref,
|
|
2868
|
+
// We expose className to allow user control over the wrapper div's styling.
|
|
2869
|
+
className,
|
|
2870
|
+
style: COMMON_STYLES
|
|
2871
|
+
});
|
|
2872
|
+
return /* @__PURE__ */ React__default.default.createElement("div", __spreadValues$d({}, mergedProps), children);
|
|
2873
|
+
}
|
|
2844
2874
|
function BaseDialogTrigger(props) {
|
|
2845
|
-
|
|
2846
|
-
const
|
|
2847
|
-
|
|
2848
|
-
|
|
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
|
+
});
|
|
2849
2881
|
const mergedProps = __spreadProps$b(__spreadValues$d({}, rest), {
|
|
2850
|
-
isOpen:
|
|
2882
|
+
isOpen: isOpen2
|
|
2851
2883
|
});
|
|
2852
|
-
return /* @__PURE__ */ React__default.default.createElement(PlasmicDialogTriggerContext.Provider, { value: mergedProps }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.DialogTrigger, __spreadValues$d({}, mergedProps), trigger, dialog));
|
|
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));
|
|
2853
2885
|
}
|
|
2854
2886
|
function registerDialogTrigger(loader, overrides) {
|
|
2855
2887
|
registerComponentHelper(
|
|
@@ -2860,7 +2892,6 @@ function registerDialogTrigger(loader, overrides) {
|
|
|
2860
2892
|
displayName: "Aria Dialog Trigger",
|
|
2861
2893
|
importPath: "@plasmicpkgs/react-aria/skinny/registerDialogTrigger",
|
|
2862
2894
|
importName: "BaseDialogTrigger",
|
|
2863
|
-
styleSections: false,
|
|
2864
2895
|
props: {
|
|
2865
2896
|
trigger: {
|
|
2866
2897
|
type: "slot",
|
|
@@ -4914,7 +4945,6 @@ function UncontrolledBaseTooltip(_a) {
|
|
|
4914
4945
|
);
|
|
4915
4946
|
}
|
|
4916
4947
|
function ControlledBaseTooltip(props) {
|
|
4917
|
-
var _a, _b;
|
|
4918
4948
|
const {
|
|
4919
4949
|
children,
|
|
4920
4950
|
isDisabled = false,
|
|
@@ -4931,11 +4961,14 @@ function ControlledBaseTooltip(props) {
|
|
|
4931
4961
|
className,
|
|
4932
4962
|
onOpenChange = () => {
|
|
4933
4963
|
},
|
|
4934
|
-
plasmicUpdateVariant
|
|
4964
|
+
plasmicUpdateVariant,
|
|
4965
|
+
__plasmic_selection_prop__
|
|
4935
4966
|
} = props;
|
|
4936
|
-
const
|
|
4937
|
-
|
|
4938
|
-
|
|
4967
|
+
const isOpen2 = useIsOpen({
|
|
4968
|
+
triggerSlotName: "children",
|
|
4969
|
+
isOpen,
|
|
4970
|
+
__plasmic_selection_prop__
|
|
4971
|
+
});
|
|
4939
4972
|
const ref = React.useRef(null);
|
|
4940
4973
|
const tooltipId = React.useId();
|
|
4941
4974
|
const state = reactStately.useTooltipTriggerState(__spreadProps(__spreadValues({}, props), {
|
|
@@ -4946,7 +4979,7 @@ function ControlledBaseTooltip(props) {
|
|
|
4946
4979
|
{
|
|
4947
4980
|
ref,
|
|
4948
4981
|
className,
|
|
4949
|
-
tooltipId:
|
|
4982
|
+
tooltipId: isOpen2 ? tooltipId : void 0,
|
|
4950
4983
|
isDisabled,
|
|
4951
4984
|
onOpenChange,
|
|
4952
4985
|
triggerOnFocusOnly: trigger === "focus"
|
|
@@ -4957,7 +4990,7 @@ function ControlledBaseTooltip(props) {
|
|
|
4957
4990
|
{
|
|
4958
4991
|
triggerRef: ref,
|
|
4959
4992
|
id: tooltipId,
|
|
4960
|
-
isOpen:
|
|
4993
|
+
isOpen: isOpen2,
|
|
4961
4994
|
offset,
|
|
4962
4995
|
delay,
|
|
4963
4996
|
closeDelay,
|