@plasmicpkgs/react-aria 0.0.67 → 0.0.68
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 +55 -25
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js +55 -25
- package/dist/react-aria.js.map +1 -1
- package/dist/registerPopover.d.ts +5 -1
- package/package.json +2 -2
- package/skinny/registerButton.cjs.js +1 -1
- package/skinny/registerButton.esm.js +1 -1
- package/skinny/registerCheckbox.cjs.js +1 -1
- package/skinny/registerCheckbox.esm.js +1 -1
- package/skinny/registerCheckboxGroup.cjs.js +1 -1
- package/skinny/registerCheckboxGroup.esm.js +1 -1
- package/skinny/registerComboBox.cjs.js +1 -1
- package/skinny/registerComboBox.esm.js +1 -1
- package/skinny/registerDialogTrigger.cjs.js +1 -1
- package/skinny/registerDialogTrigger.esm.js +1 -1
- package/skinny/registerInput.cjs.js +1 -1
- package/skinny/registerInput.esm.js +1 -1
- package/skinny/registerListBox.cjs.js +1 -1
- package/skinny/registerListBox.esm.js +1 -1
- package/skinny/registerListBoxItem.cjs.js +1 -1
- package/skinny/registerListBoxItem.esm.js +1 -1
- package/skinny/registerPopover.cjs.js +36 -11
- package/skinny/registerPopover.cjs.js.map +1 -1
- package/skinny/registerPopover.d.ts +5 -1
- package/skinny/registerPopover.esm.js +36 -11
- package/skinny/registerPopover.esm.js.map +1 -1
- package/skinny/registerRadio.cjs.js +1 -1
- package/skinny/registerRadio.esm.js +1 -1
- package/skinny/registerRadioGroup.cjs.js +1 -1
- package/skinny/registerRadioGroup.esm.js +1 -1
- package/skinny/registerSelect.cjs.js +1 -1
- package/skinny/registerSelect.esm.js +1 -1
- package/skinny/registerSlider.cjs.js +1 -1
- package/skinny/registerSlider.esm.js +1 -1
- package/skinny/registerSliderOutput.cjs.js +1 -1
- package/skinny/registerSliderOutput.esm.js +1 -1
- package/skinny/registerSliderThumb.cjs.js +1 -1
- package/skinny/registerSliderThumb.esm.js +1 -1
- package/skinny/registerSliderTrack.cjs.js +1 -1
- package/skinny/registerSliderTrack.esm.js +1 -1
- package/skinny/registerSwitch.cjs.js +1 -1
- package/skinny/registerSwitch.esm.js +1 -1
- package/skinny/registerTextArea.cjs.js +1 -1
- package/skinny/registerTextArea.esm.js +1 -1
- package/skinny/registerTextField.cjs.js +1 -1
- package/skinny/registerTextField.esm.js +1 -1
- package/skinny/registerTooltip.cjs.js +1 -1
- package/skinny/registerTooltip.cjs.js.map +1 -1
- package/skinny/registerTooltip.esm.js +1 -1
- package/skinny/registerTooltip.esm.js.map +1 -1
- package/skinny/{variant-utils-5f90385f.esm.js → variant-utils-7c2ea202.esm.js} +7 -1
- package/skinny/variant-utils-7c2ea202.esm.js.map +1 -0
- package/skinny/{variant-utils-6c6ef452.cjs.js → variant-utils-8cb38f8f.cjs.js} +7 -1
- package/skinny/variant-utils-8cb38f8f.cjs.js.map +1 -0
- package/skinny/variant-utils-5f90385f.esm.js.map +0 -1
- package/skinny/variant-utils-6c6ef452.cjs.js.map +0 -1
package/dist/react-aria.js
CHANGED
|
@@ -458,6 +458,12 @@ const ARIA_COMPONENTS_VARIANTS = {
|
|
|
458
458
|
cssSelector: "[data-indeterminate]",
|
|
459
459
|
displayName: "Indeterminate"
|
|
460
460
|
},
|
|
461
|
+
/*
|
|
462
|
+
NOTE: Placement should be managed as variants, not just props.
|
|
463
|
+
When `shouldFlip` is true, the placement prop may not represent the final position
|
|
464
|
+
(e.g., if placement is set to "bottom" but lacks space, the popover/tooltip may flip to "top").
|
|
465
|
+
However, data-selectors will consistently indicate the actual placement of the popover/tooltip.
|
|
466
|
+
*/
|
|
461
467
|
placementLeft: {
|
|
462
468
|
cssSelector: "[data-placement]=left",
|
|
463
469
|
displayName: "Placement (Left)"
|
|
@@ -537,12 +543,12 @@ const BUTTON_VARIANTS = [
|
|
|
537
543
|
"focusVisible",
|
|
538
544
|
"disabled"
|
|
539
545
|
];
|
|
540
|
-
const { variants: variants$
|
|
546
|
+
const { variants: variants$f, withObservedValues: withObservedValues$d } = pickAriaComponentVariants(BUTTON_VARIANTS);
|
|
541
547
|
const BaseButton = React__default.default.forwardRef(
|
|
542
548
|
(props, ref) => {
|
|
543
549
|
const _a = props, { submitsForm, resetsForm, children, plasmicUpdateVariant } = _a, rest = __objRest$n(_a, ["submitsForm", "resetsForm", "children", "plasmicUpdateVariant"]);
|
|
544
550
|
const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
|
|
545
|
-
return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues$q({ type, ref }, rest), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues$
|
|
551
|
+
return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues$q({ type, ref }, rest), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues$d(
|
|
546
552
|
children,
|
|
547
553
|
{
|
|
548
554
|
hovered: isHovered,
|
|
@@ -565,7 +571,7 @@ function registerButton(loader, overrides) {
|
|
|
565
571
|
displayName: "Aria Button",
|
|
566
572
|
importPath: "@plasmicpkgs/react-aria/skinny/registerButton",
|
|
567
573
|
importName: "BaseButton",
|
|
568
|
-
variants: variants$
|
|
574
|
+
variants: variants$f,
|
|
569
575
|
defaultStyles: {
|
|
570
576
|
borderWidth: "1px",
|
|
571
577
|
borderStyle: "solid",
|
|
@@ -666,7 +672,7 @@ const CHECKBOX_VARIANTS = [
|
|
|
666
672
|
"readonly",
|
|
667
673
|
"selected"
|
|
668
674
|
];
|
|
669
|
-
const { variants: variants$
|
|
675
|
+
const { variants: variants$e, withObservedValues: withObservedValues$c } = pickAriaComponentVariants(CHECKBOX_VARIANTS);
|
|
670
676
|
function BaseCheckbox(props) {
|
|
671
677
|
const _a = props, { children, plasmicUpdateVariant, setControlContextData } = _a, rest = __objRest$m(_a, ["children", "plasmicUpdateVariant", "setControlContextData"]);
|
|
672
678
|
const contextProps = React__default.default.useContext(PlasmicCheckboxGroupContext);
|
|
@@ -682,7 +688,7 @@ function BaseCheckbox(props) {
|
|
|
682
688
|
isIndeterminate,
|
|
683
689
|
isSelected,
|
|
684
690
|
isReadOnly
|
|
685
|
-
}) => withObservedValues$
|
|
691
|
+
}) => withObservedValues$c(
|
|
686
692
|
children,
|
|
687
693
|
{
|
|
688
694
|
hovered: isHovered,
|
|
@@ -752,7 +758,7 @@ function registerCheckbox(loader, overrides) {
|
|
|
752
758
|
displayName: "Aria Checkbox",
|
|
753
759
|
importPath: "@plasmicpkgs/react-aria/skinny/registerCheckbox",
|
|
754
760
|
importName: "BaseCheckbox",
|
|
755
|
-
variants: variants$
|
|
761
|
+
variants: variants$e,
|
|
756
762
|
props: __spreadProps$f(__spreadValues$p({}, getCommonProps("checkbox", [
|
|
757
763
|
"name",
|
|
758
764
|
"isDisabled",
|
|
@@ -1177,12 +1183,12 @@ var __objRest$i = (source, exclude) => {
|
|
|
1177
1183
|
return target;
|
|
1178
1184
|
};
|
|
1179
1185
|
const CHECKBOX_GROUP_VARIANTS = ["disabled", "readonly"];
|
|
1180
|
-
const { variants: variants$
|
|
1186
|
+
const { variants: variants$d, withObservedValues: withObservedValues$b } = pickAriaComponentVariants(
|
|
1181
1187
|
CHECKBOX_GROUP_VARIANTS
|
|
1182
1188
|
);
|
|
1183
1189
|
function BaseCheckboxGroup(props) {
|
|
1184
1190
|
const _a = props, { children, plasmicUpdateVariant } = _a, rest = __objRest$i(_a, ["children", "plasmicUpdateVariant"]);
|
|
1185
|
-
return /* @__PURE__ */ React__default.default.createElement(PlasmicCheckboxGroupContext.Provider, { value: rest }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadValues$k({}, rest), ({ isDisabled, isReadOnly }) => withObservedValues$
|
|
1191
|
+
return /* @__PURE__ */ React__default.default.createElement(PlasmicCheckboxGroupContext.Provider, { value: rest }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadValues$k({}, rest), ({ isDisabled, isReadOnly }) => withObservedValues$b(
|
|
1186
1192
|
children,
|
|
1187
1193
|
{
|
|
1188
1194
|
disabled: isDisabled,
|
|
@@ -1210,7 +1216,7 @@ function registerCheckboxGroup(loader, overrides) {
|
|
|
1210
1216
|
displayName: "Aria Checkbox Group",
|
|
1211
1217
|
importPath: "@plasmicpkgs/react-aria/skinny/registerCheckboxGroup",
|
|
1212
1218
|
importName: "BaseCheckboxGroup",
|
|
1213
|
-
variants: variants$
|
|
1219
|
+
variants: variants$d,
|
|
1214
1220
|
props: __spreadProps$b(__spreadValues$k({}, getCommonProps("checkbox group", [
|
|
1215
1221
|
"name",
|
|
1216
1222
|
"isDisabled",
|
|
@@ -1409,7 +1415,7 @@ const INPUT_VARIANTS = [
|
|
|
1409
1415
|
"hovered",
|
|
1410
1416
|
"disabled"
|
|
1411
1417
|
];
|
|
1412
|
-
const { variants: variants$
|
|
1418
|
+
const { variants: variants$c } = pickAriaComponentVariants(INPUT_VARIANTS);
|
|
1413
1419
|
const inputHelpers$1 = {
|
|
1414
1420
|
states: {
|
|
1415
1421
|
value: {
|
|
@@ -1490,7 +1496,7 @@ function registerInput(loader, overrides) {
|
|
|
1490
1496
|
displayName: "Aria Input",
|
|
1491
1497
|
importPath: "@plasmicpkgs/react-aria/skinny/registerInput",
|
|
1492
1498
|
importName: "BaseInput",
|
|
1493
|
-
variants: variants$
|
|
1499
|
+
variants: variants$c,
|
|
1494
1500
|
defaultStyles: {
|
|
1495
1501
|
width: "300px",
|
|
1496
1502
|
borderWidth: "1px",
|
|
@@ -1582,7 +1588,7 @@ const LIST_BOX_ITEM_VARIANTS = [
|
|
|
1582
1588
|
"selected",
|
|
1583
1589
|
"disabled"
|
|
1584
1590
|
];
|
|
1585
|
-
const { variants: variants$
|
|
1591
|
+
const { variants: variants$b, withObservedValues: withObservedValues$a } = pickAriaComponentVariants(
|
|
1586
1592
|
LIST_BOX_ITEM_VARIANTS
|
|
1587
1593
|
);
|
|
1588
1594
|
function BaseListBoxItem(props) {
|
|
@@ -1625,7 +1631,7 @@ function BaseListBoxItem(props) {
|
|
|
1625
1631
|
isFocusVisible,
|
|
1626
1632
|
isSelected,
|
|
1627
1633
|
isDisabled
|
|
1628
|
-
}) => withObservedValues$
|
|
1634
|
+
}) => withObservedValues$a(
|
|
1629
1635
|
children,
|
|
1630
1636
|
{
|
|
1631
1637
|
hovered: isHovered,
|
|
@@ -1688,7 +1694,7 @@ function registerListBoxItem(loader, overrides) {
|
|
|
1688
1694
|
displayName: "Aria ListBoxItem",
|
|
1689
1695
|
importPath: "@plasmicpkgs/react-aria/skinny/registerListBoxItem",
|
|
1690
1696
|
importName: "BaseListBoxItem",
|
|
1691
|
-
variants: variants$
|
|
1697
|
+
variants: variants$b,
|
|
1692
1698
|
props: {
|
|
1693
1699
|
id: {
|
|
1694
1700
|
type: "string",
|
|
@@ -2078,14 +2084,29 @@ var __objRest$d = (source, exclude) => {
|
|
|
2078
2084
|
}
|
|
2079
2085
|
return target;
|
|
2080
2086
|
};
|
|
2087
|
+
const POPOVER_VARIANTS = [
|
|
2088
|
+
"placementTop",
|
|
2089
|
+
"placementBottom",
|
|
2090
|
+
"placementLeft",
|
|
2091
|
+
"placementRight"
|
|
2092
|
+
];
|
|
2093
|
+
const { variants: variants$a, withObservedValues: withObservedValues$9 } = pickAriaComponentVariants(POPOVER_VARIANTS);
|
|
2081
2094
|
function BasePopover(props) {
|
|
2082
|
-
var
|
|
2083
|
-
const _a = props, {
|
|
2095
|
+
var _c;
|
|
2096
|
+
const _a = props, {
|
|
2097
|
+
resetClassName,
|
|
2098
|
+
setControlContextData,
|
|
2099
|
+
plasmicUpdateVariant
|
|
2100
|
+
} = _a, restProps = __objRest$d(_a, [
|
|
2101
|
+
"resetClassName",
|
|
2102
|
+
"setControlContextData",
|
|
2103
|
+
"plasmicUpdateVariant"
|
|
2104
|
+
]);
|
|
2084
2105
|
const isStandalone = !React__default.default.useContext(reactAriaComponents.PopoverContext);
|
|
2085
2106
|
const context = React__default.default.useContext(PlasmicPopoverContext);
|
|
2086
2107
|
const triggerRef = React__default.default.useRef(null);
|
|
2087
2108
|
const isEditMode = !!host.usePlasmicCanvasContext();
|
|
2088
|
-
const
|
|
2109
|
+
const _b = utils.mergeProps(
|
|
2089
2110
|
{
|
|
2090
2111
|
isOpen: context == null ? void 0 : context.isOpen,
|
|
2091
2112
|
shouldFlip: context == null ? void 0 : context.defaultShouldFlip
|
|
@@ -2108,11 +2129,20 @@ function BasePopover(props) {
|
|
|
2108
2129
|
* */
|
|
2109
2130
|
isOpen: true
|
|
2110
2131
|
} : null
|
|
2111
|
-
);
|
|
2132
|
+
), { children } = _b, mergedProps = __objRest$d(_b, ["children"]);
|
|
2112
2133
|
setControlContextData == null ? void 0 : setControlContextData({
|
|
2113
|
-
defaultShouldFlip: (
|
|
2134
|
+
defaultShouldFlip: (_c = context == null ? void 0 : context.defaultShouldFlip) != null ? _c : true
|
|
2114
2135
|
});
|
|
2115
|
-
return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, isStandalone && /* @__PURE__ */ React__default.default.createElement("div", { ref: triggerRef }), /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Popover, __spreadValues$f({}, mergedProps))
|
|
2136
|
+
return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, isStandalone && /* @__PURE__ */ React__default.default.createElement("div", { ref: triggerRef }), /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Popover, __spreadValues$f({}, mergedProps), ({ placement }) => withObservedValues$9(
|
|
2137
|
+
children,
|
|
2138
|
+
{
|
|
2139
|
+
placementTop: placement === "top",
|
|
2140
|
+
placementBottom: placement === "bottom",
|
|
2141
|
+
placementLeft: placement === "left",
|
|
2142
|
+
placementRight: placement === "right"
|
|
2143
|
+
},
|
|
2144
|
+
plasmicUpdateVariant
|
|
2145
|
+
)));
|
|
2116
2146
|
}
|
|
2117
2147
|
const POPOVER_COMPONENT_NAME = makeComponentName("popover");
|
|
2118
2148
|
const POPOVER_ARROW_IMG = {
|
|
@@ -2136,6 +2166,7 @@ function registerPopover(loader, overrides) {
|
|
|
2136
2166
|
displayName: "Aria Popover",
|
|
2137
2167
|
importPath: "@plasmicpkgs/react-aria/skinny/registerPopover",
|
|
2138
2168
|
importName: "BasePopover",
|
|
2169
|
+
variants: variants$a,
|
|
2139
2170
|
defaultStyles: {
|
|
2140
2171
|
borderWidth: "1px",
|
|
2141
2172
|
borderStyle: "solid",
|
|
@@ -2193,12 +2224,11 @@ function registerPopover(loader, overrides) {
|
|
|
2193
2224
|
description: "Default placement of the popover relative to the trigger, if there is enough space",
|
|
2194
2225
|
defaultValueHint: "bottom",
|
|
2195
2226
|
options: [
|
|
2196
|
-
|
|
2197
|
-
"bottom left",
|
|
2198
|
-
"bottom right",
|
|
2227
|
+
// Not allowing other placement options here because of https://github.com/adobe/react-spectrum/issues/6825
|
|
2199
2228
|
"top",
|
|
2200
|
-
"
|
|
2201
|
-
"
|
|
2229
|
+
"bottom",
|
|
2230
|
+
"left",
|
|
2231
|
+
"right"
|
|
2202
2232
|
]
|
|
2203
2233
|
},
|
|
2204
2234
|
resetClassName: {
|