@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.
Files changed (58) hide show
  1. package/dist/.tsbuildinfo +1 -1
  2. package/dist/react-aria.esm.js +55 -25
  3. package/dist/react-aria.esm.js.map +1 -1
  4. package/dist/react-aria.js +55 -25
  5. package/dist/react-aria.js.map +1 -1
  6. package/dist/registerPopover.d.ts +5 -1
  7. package/package.json +2 -2
  8. package/skinny/registerButton.cjs.js +1 -1
  9. package/skinny/registerButton.esm.js +1 -1
  10. package/skinny/registerCheckbox.cjs.js +1 -1
  11. package/skinny/registerCheckbox.esm.js +1 -1
  12. package/skinny/registerCheckboxGroup.cjs.js +1 -1
  13. package/skinny/registerCheckboxGroup.esm.js +1 -1
  14. package/skinny/registerComboBox.cjs.js +1 -1
  15. package/skinny/registerComboBox.esm.js +1 -1
  16. package/skinny/registerDialogTrigger.cjs.js +1 -1
  17. package/skinny/registerDialogTrigger.esm.js +1 -1
  18. package/skinny/registerInput.cjs.js +1 -1
  19. package/skinny/registerInput.esm.js +1 -1
  20. package/skinny/registerListBox.cjs.js +1 -1
  21. package/skinny/registerListBox.esm.js +1 -1
  22. package/skinny/registerListBoxItem.cjs.js +1 -1
  23. package/skinny/registerListBoxItem.esm.js +1 -1
  24. package/skinny/registerPopover.cjs.js +36 -11
  25. package/skinny/registerPopover.cjs.js.map +1 -1
  26. package/skinny/registerPopover.d.ts +5 -1
  27. package/skinny/registerPopover.esm.js +36 -11
  28. package/skinny/registerPopover.esm.js.map +1 -1
  29. package/skinny/registerRadio.cjs.js +1 -1
  30. package/skinny/registerRadio.esm.js +1 -1
  31. package/skinny/registerRadioGroup.cjs.js +1 -1
  32. package/skinny/registerRadioGroup.esm.js +1 -1
  33. package/skinny/registerSelect.cjs.js +1 -1
  34. package/skinny/registerSelect.esm.js +1 -1
  35. package/skinny/registerSlider.cjs.js +1 -1
  36. package/skinny/registerSlider.esm.js +1 -1
  37. package/skinny/registerSliderOutput.cjs.js +1 -1
  38. package/skinny/registerSliderOutput.esm.js +1 -1
  39. package/skinny/registerSliderThumb.cjs.js +1 -1
  40. package/skinny/registerSliderThumb.esm.js +1 -1
  41. package/skinny/registerSliderTrack.cjs.js +1 -1
  42. package/skinny/registerSliderTrack.esm.js +1 -1
  43. package/skinny/registerSwitch.cjs.js +1 -1
  44. package/skinny/registerSwitch.esm.js +1 -1
  45. package/skinny/registerTextArea.cjs.js +1 -1
  46. package/skinny/registerTextArea.esm.js +1 -1
  47. package/skinny/registerTextField.cjs.js +1 -1
  48. package/skinny/registerTextField.esm.js +1 -1
  49. package/skinny/registerTooltip.cjs.js +1 -1
  50. package/skinny/registerTooltip.cjs.js.map +1 -1
  51. package/skinny/registerTooltip.esm.js +1 -1
  52. package/skinny/registerTooltip.esm.js.map +1 -1
  53. package/skinny/{variant-utils-5f90385f.esm.js → variant-utils-7c2ea202.esm.js} +7 -1
  54. package/skinny/variant-utils-7c2ea202.esm.js.map +1 -0
  55. package/skinny/{variant-utils-6c6ef452.cjs.js → variant-utils-8cb38f8f.cjs.js} +7 -1
  56. package/skinny/variant-utils-8cb38f8f.cjs.js.map +1 -0
  57. package/skinny/variant-utils-5f90385f.esm.js.map +0 -1
  58. package/skinny/variant-utils-6c6ef452.cjs.js.map +0 -1
@@ -2,15 +2,19 @@ import { PlasmicElement } from "@plasmicapp/host";
2
2
  import React from "react";
3
3
  import { Popover } from "react-aria-components";
4
4
  import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
5
+ import { WithVariants } from "./variant-utils";
5
6
  export interface PopoverControlContextData {
6
7
  defaultShouldFlip?: boolean;
7
8
  }
8
- export interface BasePopoverProps extends React.ComponentProps<typeof Popover>, HasControlContextData<PopoverControlContextData> {
9
+ declare const POPOVER_VARIANTS: ("placementLeft" | "placementRight" | "placementTop" | "placementBottom")[];
10
+ export interface BasePopoverProps extends React.ComponentProps<typeof Popover>, WithVariants<typeof POPOVER_VARIANTS>, HasControlContextData<PopoverControlContextData> {
9
11
  className?: string;
10
12
  resetClassName?: string;
11
13
  defaultShouldFlip?: boolean;
14
+ children?: React.ReactNode;
12
15
  }
13
16
  export declare function BasePopover(props: BasePopoverProps): React.JSX.Element;
14
17
  export declare const POPOVER_COMPONENT_NAME: string;
15
18
  export declare const POPOVER_ARROW_IMG: PlasmicElement;
16
19
  export declare function registerPopover(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BasePopover>): void;
20
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@plasmicpkgs/react-aria",
3
- "version": "0.0.67",
3
+ "version": "0.0.68",
4
4
  "description": "Plasmic registration calls for react-aria based components",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -74,5 +74,5 @@
74
74
  "publishConfig": {
75
75
  "access": "public"
76
76
  },
77
- "gitHead": "6988a91da90b92e17e2284d4c816c72127fa9c5c"
77
+ "gitHead": "f6cdf4f02bf7b0db735eb59acb91316e1a3699e3"
78
78
  }
@@ -4,7 +4,7 @@ var React = require('react');
4
4
  var reactAriaComponents = require('react-aria-components');
5
5
  var common = require('./common-2e984ab4.cjs.js');
6
6
  var utils = require('./utils-8dbb4d1f.cjs.js');
7
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
7
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
8
8
  require('@plasmicapp/host/registerComponent');
9
9
 
10
10
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { Button } from 'react-aria-components';
3
3
  import { g as getCommonProps } from './common-0c4336fe.esm.js';
4
4
  import { a as makeComponentName, r as registerComponentHelper } from './utils-c7662a47.esm.js';
5
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
5
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
6
6
  import '@plasmicapp/host/registerComponent';
7
7
 
8
8
  var __defProp = Object.defineProperty;
@@ -5,7 +5,7 @@ var reactAriaComponents = require('react-aria-components');
5
5
  var common = require('./common-2e984ab4.cjs.js');
6
6
  var contexts = require('./contexts-baa37b74.cjs.js');
7
7
  var utils = require('./utils-8dbb4d1f.cjs.js');
8
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
8
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
9
9
  require('@plasmicapp/host/registerComponent');
10
10
 
11
11
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -3,7 +3,7 @@ import { Checkbox } from 'react-aria-components';
3
3
  import { g as getCommonProps, h as hasParent } from './common-0c4336fe.esm.js';
4
4
  import { P as PlasmicCheckboxGroupContext } from './contexts-081d65a0.esm.js';
5
5
  import { r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
6
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
6
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
7
7
  import '@plasmicapp/host/registerComponent';
8
8
 
9
9
  var __defProp = Object.defineProperty;
@@ -9,7 +9,7 @@ var registerDescription = require('./registerDescription.cjs.js');
9
9
  var registerFieldError = require('./registerFieldError.cjs.js');
10
10
  var registerLabel = require('./registerLabel.cjs.js');
11
11
  var utils = require('./utils-8dbb4d1f.cjs.js');
12
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
12
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
13
13
  require('./registerText.cjs.js');
14
14
  require('@plasmicapp/host/registerComponent');
15
15
 
@@ -7,7 +7,7 @@ import { DESCRIPTION_COMPONENT_NAME } from './registerDescription.esm.js';
7
7
  import { registerFieldError } from './registerFieldError.esm.js';
8
8
  import { registerLabel, LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
9
9
  import { m as makeChildComponentName, r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
10
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
10
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
11
11
  import './registerText.esm.js';
12
12
  import '@plasmicapp/host/registerComponent';
13
13
 
@@ -14,7 +14,7 @@ var utils = require('./utils-8dbb4d1f.cjs.js');
14
14
  require('./registerListBoxItem.cjs.js');
15
15
  require('./registerDescription.cjs.js');
16
16
  require('./registerText.cjs.js');
17
- require('./variant-utils-6c6ef452.cjs.js');
17
+ require('./variant-utils-8cb38f8f.cjs.js');
18
18
  require('./registerSection.cjs.js');
19
19
  require('@react-aria/utils');
20
20
  require('react-aria');
@@ -12,7 +12,7 @@ import { r as registerComponentHelper, a as makeComponentName } from './utils-c7
12
12
  import './registerListBoxItem.esm.js';
13
13
  import './registerDescription.esm.js';
14
14
  import './registerText.esm.js';
15
- import './variant-utils-5f90385f.esm.js';
15
+ import './variant-utils-7c2ea202.esm.js';
16
16
  import './registerSection.esm.js';
17
17
  import '@react-aria/utils';
18
18
  import 'react-aria';
@@ -8,7 +8,7 @@ var registerButton = require('./registerButton.cjs.js');
8
8
  var registerModal = require('./registerModal.cjs.js');
9
9
  var utils = require('./utils-8dbb4d1f.cjs.js');
10
10
  require('./common-2e984ab4.cjs.js');
11
- require('./variant-utils-6c6ef452.cjs.js');
11
+ require('./variant-utils-8cb38f8f.cjs.js');
12
12
  require('react-aria');
13
13
  require('./registerHeading.cjs.js');
14
14
  require('@plasmicapp/host/registerComponent');
@@ -6,7 +6,7 @@ import { BUTTON_COMPONENT_NAME } from './registerButton.esm.js';
6
6
  import { MODAL_COMPONENT_NAME } from './registerModal.esm.js';
7
7
  import { r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
8
8
  import './common-0c4336fe.esm.js';
9
- import './variant-utils-5f90385f.esm.js';
9
+ import './variant-utils-7c2ea202.esm.js';
10
10
  import 'react-aria';
11
11
  import './registerHeading.esm.js';
12
12
  import '@plasmicapp/host/registerComponent';
@@ -6,7 +6,7 @@ var reactAriaComponents = require('react-aria-components');
6
6
  var common = require('./common-2e984ab4.cjs.js');
7
7
  var contexts = require('./contexts-baa37b74.cjs.js');
8
8
  var utils = require('./utils-8dbb4d1f.cjs.js');
9
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
9
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
10
10
  require('@plasmicapp/host/registerComponent');
11
11
 
12
12
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -4,7 +4,7 @@ import { Input } from 'react-aria-components';
4
4
  import { r as resolveAutoComplete, g as getCommonProps } from './common-0c4336fe.esm.js';
5
5
  import { g as PlasmicTextFieldContext, c as PlasmicInputContext } from './contexts-081d65a0.esm.js';
6
6
  import { a as makeComponentName, r as registerComponentHelper } from './utils-c7662a47.esm.js';
7
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
7
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
8
8
  import '@plasmicapp/host/registerComponent';
9
9
 
10
10
  var __defProp = Object.defineProperty;
@@ -10,7 +10,7 @@ require('./utils-8dbb4d1f.cjs.js');
10
10
  require('./registerDescription.cjs.js');
11
11
  require('./registerText.cjs.js');
12
12
  require('@plasmicapp/host/registerComponent');
13
- require('./variant-utils-6c6ef452.cjs.js');
13
+ require('./variant-utils-8cb38f8f.cjs.js');
14
14
  require('@react-aria/utils');
15
15
 
16
16
 
@@ -8,6 +8,6 @@ import './utils-c7662a47.esm.js';
8
8
  import './registerDescription.esm.js';
9
9
  import './registerText.esm.js';
10
10
  import '@plasmicapp/host/registerComponent';
11
- import './variant-utils-5f90385f.esm.js';
11
+ import './variant-utils-7c2ea202.esm.js';
12
12
  import '@react-aria/utils';
13
13
  //# sourceMappingURL=registerListBox.esm.js.map
@@ -6,7 +6,7 @@ var contexts = require('./contexts-baa37b74.cjs.js');
6
6
  var registerDescription = require('./registerDescription.cjs.js');
7
7
  var registerText = require('./registerText.cjs.js');
8
8
  var utils = require('./utils-8dbb4d1f.cjs.js');
9
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
9
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
10
10
  require('@plasmicapp/host/registerComponent');
11
11
 
12
12
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -4,7 +4,7 @@ import { b as PlasmicListBoxContext } from './contexts-081d65a0.esm.js';
4
4
  import { DESCRIPTION_COMPONENT_NAME } from './registerDescription.esm.js';
5
5
  import { TEXT_COMPONENT_NAME } from './registerText.esm.js';
6
6
  import { r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
7
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
7
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
8
8
  import '@plasmicapp/host/registerComponent';
9
9
 
10
10
  var __defProp = Object.defineProperty;
@@ -6,6 +6,7 @@ var React = require('react');
6
6
  var reactAriaComponents = require('react-aria-components');
7
7
  var contexts = require('./contexts-baa37b74.cjs.js');
8
8
  var utils$1 = require('./utils-8dbb4d1f.cjs.js');
9
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
9
10
  require('@plasmicapp/host/registerComponent');
10
11
 
11
12
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -40,14 +41,29 @@ var __objRest = (source, exclude) => {
40
41
  }
41
42
  return target;
42
43
  };
44
+ const POPOVER_VARIANTS = [
45
+ "placementTop",
46
+ "placementBottom",
47
+ "placementLeft",
48
+ "placementRight"
49
+ ];
50
+ const { variants, withObservedValues } = variantUtils.pickAriaComponentVariants(POPOVER_VARIANTS);
43
51
  function BasePopover(props) {
44
- var _b;
45
- const _a = props, { resetClassName, setControlContextData } = _a, restProps = __objRest(_a, ["resetClassName", "setControlContextData"]);
52
+ var _c;
53
+ const _a = props, {
54
+ resetClassName,
55
+ setControlContextData,
56
+ plasmicUpdateVariant
57
+ } = _a, restProps = __objRest(_a, [
58
+ "resetClassName",
59
+ "setControlContextData",
60
+ "plasmicUpdateVariant"
61
+ ]);
46
62
  const isStandalone = !React__default.default.useContext(reactAriaComponents.PopoverContext);
47
63
  const context = React__default.default.useContext(contexts.PlasmicPopoverContext);
48
64
  const triggerRef = React__default.default.useRef(null);
49
65
  const isEditMode = !!host.usePlasmicCanvasContext();
50
- const mergedProps = utils.mergeProps(
66
+ const _b = utils.mergeProps(
51
67
  {
52
68
  isOpen: context == null ? void 0 : context.isOpen,
53
69
  shouldFlip: context == null ? void 0 : context.defaultShouldFlip
@@ -70,11 +86,20 @@ function BasePopover(props) {
70
86
  * */
71
87
  isOpen: true
72
88
  } : null
73
- );
89
+ ), { children } = _b, mergedProps = __objRest(_b, ["children"]);
74
90
  setControlContextData == null ? void 0 : setControlContextData({
75
- defaultShouldFlip: (_b = context == null ? void 0 : context.defaultShouldFlip) != null ? _b : true
91
+ defaultShouldFlip: (_c = context == null ? void 0 : context.defaultShouldFlip) != null ? _c : true
76
92
  });
77
- 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({}, mergedProps)));
93
+ 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({}, mergedProps), ({ placement }) => withObservedValues(
94
+ children,
95
+ {
96
+ placementTop: placement === "top",
97
+ placementBottom: placement === "bottom",
98
+ placementLeft: placement === "left",
99
+ placementRight: placement === "right"
100
+ },
101
+ plasmicUpdateVariant
102
+ )));
78
103
  }
79
104
  const POPOVER_COMPONENT_NAME = utils$1.makeComponentName("popover");
80
105
  const POPOVER_ARROW_IMG = {
@@ -98,6 +123,7 @@ function registerPopover(loader, overrides) {
98
123
  displayName: "Aria Popover",
99
124
  importPath: "@plasmicpkgs/react-aria/skinny/registerPopover",
100
125
  importName: "BasePopover",
126
+ variants,
101
127
  defaultStyles: {
102
128
  borderWidth: "1px",
103
129
  borderStyle: "solid",
@@ -155,12 +181,11 @@ function registerPopover(loader, overrides) {
155
181
  description: "Default placement of the popover relative to the trigger, if there is enough space",
156
182
  defaultValueHint: "bottom",
157
183
  options: [
158
- "bottom",
159
- "bottom left",
160
- "bottom right",
184
+ // Not allowing other placement options here because of https://github.com/adobe/react-spectrum/issues/6825
161
185
  "top",
162
- "top left",
163
- "top right"
186
+ "bottom",
187
+ "left",
188
+ "right"
164
189
  ]
165
190
  },
166
191
  resetClassName: {
@@ -1 +1 @@
1
- {"version":3,"file":"registerPopover.cjs.js","sources":["../src/registerPopover.tsx"],"sourcesContent":["import { PlasmicElement, usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport React from \"react\";\nimport { Popover, PopoverContext } from \"react-aria-components\";\nimport { PlasmicPopoverContext } from \"./contexts\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface PopoverControlContextData {\n defaultShouldFlip?: boolean;\n}\n\nexport interface BasePopoverProps\n extends React.ComponentProps<typeof Popover>,\n HasControlContextData<PopoverControlContextData> {\n className?: string;\n resetClassName?: string;\n defaultShouldFlip?: boolean;\n}\n\nexport function BasePopover(props: BasePopoverProps) {\n const { resetClassName, setControlContextData, ...restProps } = props;\n // Popover can be inside DialogTrigger, Select, Combobox, etc. So we can't just use a particular context like DialogTrigger (like we do in Modal) to decide if it is standalone\n const isStandalone = !React.useContext(PopoverContext);\n const context = React.useContext(PlasmicPopoverContext);\n const triggerRef = React.useRef<any>(null);\n const isEditMode = !!usePlasmicCanvasContext();\n\n const mergedProps = mergeProps(\n {\n isOpen: context?.isOpen,\n shouldFlip: context?.defaultShouldFlip,\n },\n /**\n * isNonModal: Whether the popover is non-modal, i.e. elements outside the popover may be interacted with by assistive technologies. *\n *\n * Setting isNonModal to true in edit mode (canvas) means that the popover will not prevent the user from interacting with the canvas while the popover is open.\n */\n isEditMode ? { isNonModal: true } : null,\n restProps,\n { className: `${resetClassName}` },\n // Override some props if the popover is standalone\n isStandalone\n ? {\n triggerRef,\n isNonModal: true,\n /**\n * 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\n * In component view, we never want to start with an empty artboard, so isOpen has to be true\n * */\n\n isOpen: true,\n }\n : null\n );\n\n setControlContextData?.({\n defaultShouldFlip: context?.defaultShouldFlip ?? true,\n });\n\n return (\n <>\n {isStandalone && <div ref={triggerRef} />}\n <Popover {...mergedProps} />\n </>\n );\n}\n\nexport const POPOVER_COMPONENT_NAME = makeComponentName(\"popover\");\nexport const POPOVER_ARROW_IMG: PlasmicElement = {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n position: \"absolute\",\n top: \"-14px\",\n // center the arrow horizontally on the popover\n left: \"50%\",\n transform: \"translateX(-50%)\",\n width: \"15px\",\n },\n};\n\nexport function registerPopover(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BasePopover>\n) {\n registerComponentHelper(\n loader,\n BasePopover,\n {\n name: POPOVER_COMPONENT_NAME,\n displayName: \"Aria Popover\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerPopover\",\n importName: \"BasePopover\",\n defaultStyles: {\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n width: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n POPOVER_ARROW_IMG,\n {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n rowGap: \"10px\",\n },\n children: [\n {\n type: \"text\",\n value: \"This is a Popover!\",\n },\n {\n type: \"text\",\n value: \"You can put anything you can imagine here!\",\n styles: {\n fontWeight: 500,\n },\n },\n {\n type: \"text\",\n value:\n \"Use it in a `Aria Dialog Trigger` component to trigger it on a button click!\",\n },\n ],\n },\n ],\n },\n offset: {\n type: \"number\",\n displayName: \"Offset\",\n description:\n \"Additional offset applied vertically between the popover and its trigger\",\n defaultValueHint: 8,\n },\n shouldFlip: {\n type: \"boolean\",\n description:\n \"Whether the element should flip its orientation (e.g. top to bottom or left to right) when there is insufficient room for it to render completely.\",\n defaultValueHint: (_props, ctx) => ctx?.defaultShouldFlip,\n },\n placement: {\n type: \"choice\",\n description:\n \"Default placement of the popover relative to the trigger, if there is enough space\",\n defaultValueHint: \"bottom\",\n options: [\n \"bottom\",\n \"bottom left\",\n \"bottom right\",\n \"top\",\n \"top left\",\n \"top right\",\n ],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n // 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.\n styleSections: true,\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["React","PopoverContext","PlasmicPopoverContext","usePlasmicCanvasContext","mergeProps","Popover","makeComponentName","registerComponentHelper"],"mappings":"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"}
1
+ {"version":3,"file":"registerPopover.cjs.js","sources":["../src/registerPopover.tsx"],"sourcesContent":["import { PlasmicElement, usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport React from \"react\";\nimport { Popover, PopoverContext } from \"react-aria-components\";\nimport { PlasmicPopoverContext } from \"./contexts\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\nexport interface PopoverControlContextData {\n defaultShouldFlip?: boolean;\n}\n\n/*\n NOTE: Placement should be managed as variants, not just props.\n When `shouldFlip` is true, the placement prop may not represent the final position\n (e.g., if placement is set to \"bottom\" but lacks space, the popover may flip to \"top\").\n However, data-selectors will consistently indicate the actual placement of the popover.\n */\nconst POPOVER_VARIANTS = [\n \"placementTop\" as const,\n \"placementBottom\" as const,\n \"placementLeft\" as const,\n \"placementRight\" as const,\n];\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(POPOVER_VARIANTS);\n\nexport interface BasePopoverProps\n extends React.ComponentProps<typeof Popover>,\n WithVariants<typeof POPOVER_VARIANTS>,\n HasControlContextData<PopoverControlContextData> {\n className?: string;\n resetClassName?: string;\n defaultShouldFlip?: boolean;\n children?: React.ReactNode;\n}\n\nexport function BasePopover(props: BasePopoverProps) {\n const {\n resetClassName,\n setControlContextData,\n plasmicUpdateVariant,\n ...restProps\n } = props;\n // Popover can be inside DialogTrigger, Select, Combobox, etc. So we can't just use a particular context like DialogTrigger (like we do in Modal) to decide if it is standalone\n const isStandalone = !React.useContext(PopoverContext);\n const context = React.useContext(PlasmicPopoverContext);\n const triggerRef = React.useRef<any>(null);\n const isEditMode = !!usePlasmicCanvasContext();\n\n const { children, ...mergedProps } = mergeProps(\n {\n isOpen: context?.isOpen,\n shouldFlip: context?.defaultShouldFlip,\n },\n /**\n * isNonModal: Whether the popover is non-modal, i.e. elements outside the popover may be interacted with by assistive technologies. *\n *\n * Setting isNonModal to true in edit mode (canvas) means that the popover will not prevent the user from interacting with the canvas while the popover is open.\n */\n isEditMode ? { isNonModal: true } : null,\n restProps,\n { className: `${resetClassName}` },\n // Override some props if the popover is standalone\n isStandalone\n ? {\n triggerRef,\n isNonModal: true,\n /**\n * 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\n * In component view, we never want to start with an empty artboard, so isOpen has to be true\n * */\n\n isOpen: true,\n }\n : null\n );\n\n setControlContextData?.({\n defaultShouldFlip: context?.defaultShouldFlip ?? true,\n });\n return (\n <>\n {isStandalone && <div ref={triggerRef} />}\n <Popover {...mergedProps}>\n {({ placement }) =>\n withObservedValues(\n children,\n {\n placementTop: placement === \"top\",\n placementBottom: placement === \"bottom\",\n placementLeft: placement === \"left\",\n placementRight: placement === \"right\",\n },\n plasmicUpdateVariant\n )\n }\n </Popover>\n </>\n );\n}\n\nexport const POPOVER_COMPONENT_NAME = makeComponentName(\"popover\");\nexport const POPOVER_ARROW_IMG: PlasmicElement = {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n position: \"absolute\",\n top: \"-14px\",\n // center the arrow horizontally on the popover\n left: \"50%\",\n transform: \"translateX(-50%)\",\n width: \"15px\",\n },\n};\n\nexport function registerPopover(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BasePopover>\n) {\n registerComponentHelper(\n loader,\n BasePopover,\n {\n name: POPOVER_COMPONENT_NAME,\n displayName: \"Aria Popover\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerPopover\",\n importName: \"BasePopover\",\n variants,\n defaultStyles: {\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n width: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n POPOVER_ARROW_IMG,\n {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n rowGap: \"10px\",\n },\n children: [\n {\n type: \"text\",\n value: \"This is a Popover!\",\n },\n {\n type: \"text\",\n value: \"You can put anything you can imagine here!\",\n styles: {\n fontWeight: 500,\n },\n },\n {\n type: \"text\",\n value:\n \"Use it in a `Aria Dialog Trigger` component to trigger it on a button click!\",\n },\n ],\n },\n ],\n },\n offset: {\n type: \"number\",\n displayName: \"Offset\",\n description:\n \"Additional offset applied vertically between the popover and its trigger\",\n defaultValueHint: 8,\n },\n shouldFlip: {\n type: \"boolean\",\n description:\n \"Whether the element should flip its orientation (e.g. top to bottom or left to right) when there is insufficient room for it to render completely.\",\n defaultValueHint: (_props, ctx) => ctx?.defaultShouldFlip,\n },\n placement: {\n type: \"choice\",\n description:\n \"Default placement of the popover relative to the trigger, if there is enough space\",\n defaultValueHint: \"bottom\",\n options: [\n // Not allowing other placement options here because of https://github.com/adobe/react-spectrum/issues/6825\n \"top\",\n \"bottom\",\n \"left\",\n \"right\",\n ],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n // 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.\n styleSections: true,\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["pickAriaComponentVariants","React","PopoverContext","PlasmicPopoverContext","usePlasmicCanvasContext","mergeProps","Popover","makeComponentName","registerComponentHelper"],"mappings":"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"}
@@ -2,15 +2,19 @@ import { PlasmicElement } from "@plasmicapp/host";
2
2
  import React from "react";
3
3
  import { Popover } from "react-aria-components";
4
4
  import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
5
+ import { WithVariants } from "./variant-utils";
5
6
  export interface PopoverControlContextData {
6
7
  defaultShouldFlip?: boolean;
7
8
  }
8
- export interface BasePopoverProps extends React.ComponentProps<typeof Popover>, HasControlContextData<PopoverControlContextData> {
9
+ declare const POPOVER_VARIANTS: ("placementLeft" | "placementRight" | "placementTop" | "placementBottom")[];
10
+ export interface BasePopoverProps extends React.ComponentProps<typeof Popover>, WithVariants<typeof POPOVER_VARIANTS>, HasControlContextData<PopoverControlContextData> {
9
11
  className?: string;
10
12
  resetClassName?: string;
11
13
  defaultShouldFlip?: boolean;
14
+ children?: React.ReactNode;
12
15
  }
13
16
  export declare function BasePopover(props: BasePopoverProps): React.JSX.Element;
14
17
  export declare const POPOVER_COMPONENT_NAME: string;
15
18
  export declare const POPOVER_ARROW_IMG: PlasmicElement;
16
19
  export declare function registerPopover(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BasePopover>): void;
20
+ export {};
@@ -4,6 +4,7 @@ import React from 'react';
4
4
  import { PopoverContext, Popover } from 'react-aria-components';
5
5
  import { a as PlasmicPopoverContext } from './contexts-081d65a0.esm.js';
6
6
  import { a as makeComponentName, r as registerComponentHelper } from './utils-c7662a47.esm.js';
7
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
7
8
  import '@plasmicapp/host/registerComponent';
8
9
 
9
10
  var __defProp = Object.defineProperty;
@@ -34,14 +35,29 @@ var __objRest = (source, exclude) => {
34
35
  }
35
36
  return target;
36
37
  };
38
+ const POPOVER_VARIANTS = [
39
+ "placementTop",
40
+ "placementBottom",
41
+ "placementLeft",
42
+ "placementRight"
43
+ ];
44
+ const { variants, withObservedValues } = pickAriaComponentVariants(POPOVER_VARIANTS);
37
45
  function BasePopover(props) {
38
- var _b;
39
- const _a = props, { resetClassName, setControlContextData } = _a, restProps = __objRest(_a, ["resetClassName", "setControlContextData"]);
46
+ var _c;
47
+ const _a = props, {
48
+ resetClassName,
49
+ setControlContextData,
50
+ plasmicUpdateVariant
51
+ } = _a, restProps = __objRest(_a, [
52
+ "resetClassName",
53
+ "setControlContextData",
54
+ "plasmicUpdateVariant"
55
+ ]);
40
56
  const isStandalone = !React.useContext(PopoverContext);
41
57
  const context = React.useContext(PlasmicPopoverContext);
42
58
  const triggerRef = React.useRef(null);
43
59
  const isEditMode = !!usePlasmicCanvasContext();
44
- const mergedProps = mergeProps(
60
+ const _b = mergeProps(
45
61
  {
46
62
  isOpen: context == null ? void 0 : context.isOpen,
47
63
  shouldFlip: context == null ? void 0 : context.defaultShouldFlip
@@ -64,11 +80,20 @@ function BasePopover(props) {
64
80
  * */
65
81
  isOpen: true
66
82
  } : null
67
- );
83
+ ), { children } = _b, mergedProps = __objRest(_b, ["children"]);
68
84
  setControlContextData == null ? void 0 : setControlContextData({
69
- defaultShouldFlip: (_b = context == null ? void 0 : context.defaultShouldFlip) != null ? _b : true
85
+ defaultShouldFlip: (_c = context == null ? void 0 : context.defaultShouldFlip) != null ? _c : true
70
86
  });
71
- return /* @__PURE__ */ React.createElement(React.Fragment, null, isStandalone && /* @__PURE__ */ React.createElement("div", { ref: triggerRef }), /* @__PURE__ */ React.createElement(Popover, __spreadValues({}, mergedProps)));
87
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, isStandalone && /* @__PURE__ */ React.createElement("div", { ref: triggerRef }), /* @__PURE__ */ React.createElement(Popover, __spreadValues({}, mergedProps), ({ placement }) => withObservedValues(
88
+ children,
89
+ {
90
+ placementTop: placement === "top",
91
+ placementBottom: placement === "bottom",
92
+ placementLeft: placement === "left",
93
+ placementRight: placement === "right"
94
+ },
95
+ plasmicUpdateVariant
96
+ )));
72
97
  }
73
98
  const POPOVER_COMPONENT_NAME = makeComponentName("popover");
74
99
  const POPOVER_ARROW_IMG = {
@@ -92,6 +117,7 @@ function registerPopover(loader, overrides) {
92
117
  displayName: "Aria Popover",
93
118
  importPath: "@plasmicpkgs/react-aria/skinny/registerPopover",
94
119
  importName: "BasePopover",
120
+ variants,
95
121
  defaultStyles: {
96
122
  borderWidth: "1px",
97
123
  borderStyle: "solid",
@@ -149,12 +175,11 @@ function registerPopover(loader, overrides) {
149
175
  description: "Default placement of the popover relative to the trigger, if there is enough space",
150
176
  defaultValueHint: "bottom",
151
177
  options: [
152
- "bottom",
153
- "bottom left",
154
- "bottom right",
178
+ // Not allowing other placement options here because of https://github.com/adobe/react-spectrum/issues/6825
155
179
  "top",
156
- "top left",
157
- "top right"
180
+ "bottom",
181
+ "left",
182
+ "right"
158
183
  ]
159
184
  },
160
185
  resetClassName: {
@@ -1 +1 @@
1
- {"version":3,"file":"registerPopover.esm.js","sources":["../src/registerPopover.tsx"],"sourcesContent":["import { PlasmicElement, usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport React from \"react\";\nimport { Popover, PopoverContext } from \"react-aria-components\";\nimport { PlasmicPopoverContext } from \"./contexts\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface PopoverControlContextData {\n defaultShouldFlip?: boolean;\n}\n\nexport interface BasePopoverProps\n extends React.ComponentProps<typeof Popover>,\n HasControlContextData<PopoverControlContextData> {\n className?: string;\n resetClassName?: string;\n defaultShouldFlip?: boolean;\n}\n\nexport function BasePopover(props: BasePopoverProps) {\n const { resetClassName, setControlContextData, ...restProps } = props;\n // Popover can be inside DialogTrigger, Select, Combobox, etc. So we can't just use a particular context like DialogTrigger (like we do in Modal) to decide if it is standalone\n const isStandalone = !React.useContext(PopoverContext);\n const context = React.useContext(PlasmicPopoverContext);\n const triggerRef = React.useRef<any>(null);\n const isEditMode = !!usePlasmicCanvasContext();\n\n const mergedProps = mergeProps(\n {\n isOpen: context?.isOpen,\n shouldFlip: context?.defaultShouldFlip,\n },\n /**\n * isNonModal: Whether the popover is non-modal, i.e. elements outside the popover may be interacted with by assistive technologies. *\n *\n * Setting isNonModal to true in edit mode (canvas) means that the popover will not prevent the user from interacting with the canvas while the popover is open.\n */\n isEditMode ? { isNonModal: true } : null,\n restProps,\n { className: `${resetClassName}` },\n // Override some props if the popover is standalone\n isStandalone\n ? {\n triggerRef,\n isNonModal: true,\n /**\n * 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\n * In component view, we never want to start with an empty artboard, so isOpen has to be true\n * */\n\n isOpen: true,\n }\n : null\n );\n\n setControlContextData?.({\n defaultShouldFlip: context?.defaultShouldFlip ?? true,\n });\n\n return (\n <>\n {isStandalone && <div ref={triggerRef} />}\n <Popover {...mergedProps} />\n </>\n );\n}\n\nexport const POPOVER_COMPONENT_NAME = makeComponentName(\"popover\");\nexport const POPOVER_ARROW_IMG: PlasmicElement = {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n position: \"absolute\",\n top: \"-14px\",\n // center the arrow horizontally on the popover\n left: \"50%\",\n transform: \"translateX(-50%)\",\n width: \"15px\",\n },\n};\n\nexport function registerPopover(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BasePopover>\n) {\n registerComponentHelper(\n loader,\n BasePopover,\n {\n name: POPOVER_COMPONENT_NAME,\n displayName: \"Aria Popover\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerPopover\",\n importName: \"BasePopover\",\n defaultStyles: {\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n width: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n POPOVER_ARROW_IMG,\n {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n rowGap: \"10px\",\n },\n children: [\n {\n type: \"text\",\n value: \"This is a Popover!\",\n },\n {\n type: \"text\",\n value: \"You can put anything you can imagine here!\",\n styles: {\n fontWeight: 500,\n },\n },\n {\n type: \"text\",\n value:\n \"Use it in a `Aria Dialog Trigger` component to trigger it on a button click!\",\n },\n ],\n },\n ],\n },\n offset: {\n type: \"number\",\n displayName: \"Offset\",\n description:\n \"Additional offset applied vertically between the popover and its trigger\",\n defaultValueHint: 8,\n },\n shouldFlip: {\n type: \"boolean\",\n description:\n \"Whether the element should flip its orientation (e.g. top to bottom or left to right) when there is insufficient room for it to render completely.\",\n defaultValueHint: (_props, ctx) => ctx?.defaultShouldFlip,\n },\n placement: {\n type: \"choice\",\n description:\n \"Default placement of the popover relative to the trigger, if there is enough space\",\n defaultValueHint: \"bottom\",\n options: [\n \"bottom\",\n \"bottom left\",\n \"bottom right\",\n \"top\",\n \"top left\",\n \"top right\",\n ],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n // 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.\n styleSections: true,\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,SAAS,YAAY,KAAyB,EAAA;AAzBrD,EAAA,IAAA,EAAA,CAAA;AA0BE,EAAgE,MAAA,EAAA,GAAA,KAAA,EAAxD,kBAAgB,qBA1B1B,EAAA,GA0BkE,IAAd,SAAc,GAAA,SAAA,CAAA,EAAA,EAAd,CAA1C,gBAAgB,EAAA,uBAAA,CAAA,CAAA,CAAA;AAExB,EAAA,MAAM,YAAe,GAAA,CAAC,KAAM,CAAA,UAAA,CAAW,cAAc,CAAA,CAAA;AACrD,EAAM,MAAA,OAAA,GAAU,KAAM,CAAA,UAAA,CAAW,qBAAqB,CAAA,CAAA;AACtD,EAAM,MAAA,UAAA,GAAa,KAAM,CAAA,MAAA,CAAY,IAAI,CAAA,CAAA;AACzC,EAAM,MAAA,UAAA,GAAa,CAAC,CAAC,uBAAwB,EAAA,CAAA;AAE7C,EAAA,MAAM,WAAc,GAAA,UAAA;AAAA,IAClB;AAAA,MACE,QAAQ,OAAS,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,MAAA;AAAA,MACjB,YAAY,OAAS,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,iBAAA;AAAA,KACvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAa,GAAA,EAAE,UAAY,EAAA,IAAA,EAAS,GAAA,IAAA;AAAA,IACpC,SAAA;AAAA,IACA,EAAE,SAAW,EAAA,CAAA,EAAG,cAAiB,CAAA,CAAA,EAAA;AAAA;AAAA,IAEjC,YACI,GAAA;AAAA,MACE,UAAA;AAAA,MACA,UAAY,EAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMZ,MAAQ,EAAA,IAAA;AAAA,KAEV,GAAA,IAAA;AAAA,GACN,CAAA;AAEA,EAAwB,qBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,qBAAA,CAAA;AAAA,IACtB,iBAAA,EAAA,CAAmB,EAAS,GAAA,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,iBAAA,KAAT,IAA8B,GAAA,EAAA,GAAA,IAAA;AAAA,GACnD,CAAA,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACG,YAAgB,oBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAK,YAAY,CACvC,kBAAA,KAAA,CAAA,aAAA,CAAC,OAAY,EAAA,cAAA,CAAA,EAAA,EAAA,WAAA,CAAa,CAC5B,CAAA,CAAA;AAEJ,CAAA;AAEa,MAAA,sBAAA,GAAyB,kBAAkB,SAAS,EAAA;AAC1D,MAAM,iBAAoC,GAAA;AAAA,EAC/C,IAAM,EAAA,KAAA;AAAA,EACN,GAAK,EAAA,0CAAA;AAAA,EACL,MAAQ,EAAA;AAAA,IACN,QAAU,EAAA,UAAA;AAAA,IACV,GAAK,EAAA,OAAA;AAAA;AAAA,IAEL,IAAM,EAAA,KAAA;AAAA,IACN,SAAW,EAAA,kBAAA;AAAA,IACX,KAAO,EAAA,MAAA;AAAA,GACT;AACF,EAAA;AAEgB,SAAA,eAAA,CACd,QACA,SACA,EAAA;AACA,EAAA,uBAAA;AAAA,IACE,MAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,MACE,IAAM,EAAA,sBAAA;AAAA,MACN,WAAa,EAAA,cAAA;AAAA,MACb,UAAY,EAAA,gDAAA;AAAA,MACZ,UAAY,EAAA,aAAA;AAAA,MACZ,aAAe,EAAA;AAAA,QACb,WAAa,EAAA,KAAA;AAAA,QACb,WAAa,EAAA,OAAA;AAAA,QACb,WAAa,EAAA,OAAA;AAAA,QACb,OAAS,EAAA,MAAA;AAAA,QACT,KAAO,EAAA,OAAA;AAAA,QACP,eAAiB,EAAA,SAAA;AAAA,OACnB;AAAA,MACA,KAAO,EAAA;AAAA,QACL,QAAU,EAAA;AAAA,UACR,IAAM,EAAA,MAAA;AAAA,UACN,eAAiB,EAAA,IAAA;AAAA,UACjB,YAAc,EAAA;AAAA,YACZ,iBAAA;AAAA,YACA;AAAA,cACE,IAAM,EAAA,MAAA;AAAA,cACN,MAAQ,EAAA;AAAA,gBACN,KAAO,EAAA,SAAA;AAAA,gBACP,OAAS,EAAA,CAAA;AAAA,gBACT,MAAQ,EAAA,MAAA;AAAA,eACV;AAAA,cACA,QAAU,EAAA;AAAA,gBACR;AAAA,kBACE,IAAM,EAAA,MAAA;AAAA,kBACN,KAAO,EAAA,oBAAA;AAAA,iBACT;AAAA,gBACA;AAAA,kBACE,IAAM,EAAA,MAAA;AAAA,kBACN,KAAO,EAAA,4CAAA;AAAA,kBACP,MAAQ,EAAA;AAAA,oBACN,UAAY,EAAA,GAAA;AAAA,mBACd;AAAA,iBACF;AAAA,gBACA;AAAA,kBACE,IAAM,EAAA,MAAA;AAAA,kBACN,KACE,EAAA,8EAAA;AAAA,iBACJ;AAAA,eACF;AAAA,aACF;AAAA,WACF;AAAA,SACF;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,IAAM,EAAA,QAAA;AAAA,UACN,WAAa,EAAA,QAAA;AAAA,UACb,WACE,EAAA,0EAAA;AAAA,UACF,gBAAkB,EAAA,CAAA;AAAA,SACpB;AAAA,QACA,UAAY,EAAA;AAAA,UACV,IAAM,EAAA,SAAA;AAAA,UACN,WACE,EAAA,oJAAA;AAAA,UACF,gBAAkB,EAAA,CAAC,MAAQ,EAAA,GAAA,KAAQ,GAAK,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,GAAA,CAAA,iBAAA;AAAA,SAC1C;AAAA,QACA,SAAW,EAAA;AAAA,UACT,IAAM,EAAA,QAAA;AAAA,UACN,WACE,EAAA,oFAAA;AAAA,UACF,gBAAkB,EAAA,QAAA;AAAA,UAClB,OAAS,EAAA;AAAA,YACP,QAAA;AAAA,YACA,aAAA;AAAA,YACA,cAAA;AAAA,YACA,KAAA;AAAA,YACA,UAAA;AAAA,YACA,WAAA;AAAA,WACF;AAAA,SACF;AAAA,QACA,cAAgB,EAAA;AAAA,UACd,IAAM,EAAA,iBAAA;AAAA,SACR;AAAA,OACF;AAAA;AAAA,MAEA,aAAe,EAAA,IAAA;AAAA,MACf,UAAY,EAAA,IAAA;AAAA,KACd;AAAA,IACA,SAAA;AAAA,GACF,CAAA;AACF;;;;"}
1
+ {"version":3,"file":"registerPopover.esm.js","sources":["../src/registerPopover.tsx"],"sourcesContent":["import { PlasmicElement, usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport React from \"react\";\nimport { Popover, PopoverContext } from \"react-aria-components\";\nimport { PlasmicPopoverContext } from \"./contexts\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\nexport interface PopoverControlContextData {\n defaultShouldFlip?: boolean;\n}\n\n/*\n NOTE: Placement should be managed as variants, not just props.\n When `shouldFlip` is true, the placement prop may not represent the final position\n (e.g., if placement is set to \"bottom\" but lacks space, the popover may flip to \"top\").\n However, data-selectors will consistently indicate the actual placement of the popover.\n */\nconst POPOVER_VARIANTS = [\n \"placementTop\" as const,\n \"placementBottom\" as const,\n \"placementLeft\" as const,\n \"placementRight\" as const,\n];\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(POPOVER_VARIANTS);\n\nexport interface BasePopoverProps\n extends React.ComponentProps<typeof Popover>,\n WithVariants<typeof POPOVER_VARIANTS>,\n HasControlContextData<PopoverControlContextData> {\n className?: string;\n resetClassName?: string;\n defaultShouldFlip?: boolean;\n children?: React.ReactNode;\n}\n\nexport function BasePopover(props: BasePopoverProps) {\n const {\n resetClassName,\n setControlContextData,\n plasmicUpdateVariant,\n ...restProps\n } = props;\n // Popover can be inside DialogTrigger, Select, Combobox, etc. So we can't just use a particular context like DialogTrigger (like we do in Modal) to decide if it is standalone\n const isStandalone = !React.useContext(PopoverContext);\n const context = React.useContext(PlasmicPopoverContext);\n const triggerRef = React.useRef<any>(null);\n const isEditMode = !!usePlasmicCanvasContext();\n\n const { children, ...mergedProps } = mergeProps(\n {\n isOpen: context?.isOpen,\n shouldFlip: context?.defaultShouldFlip,\n },\n /**\n * isNonModal: Whether the popover is non-modal, i.e. elements outside the popover may be interacted with by assistive technologies. *\n *\n * Setting isNonModal to true in edit mode (canvas) means that the popover will not prevent the user from interacting with the canvas while the popover is open.\n */\n isEditMode ? { isNonModal: true } : null,\n restProps,\n { className: `${resetClassName}` },\n // Override some props if the popover is standalone\n isStandalone\n ? {\n triggerRef,\n isNonModal: true,\n /**\n * 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\n * In component view, we never want to start with an empty artboard, so isOpen has to be true\n * */\n\n isOpen: true,\n }\n : null\n );\n\n setControlContextData?.({\n defaultShouldFlip: context?.defaultShouldFlip ?? true,\n });\n return (\n <>\n {isStandalone && <div ref={triggerRef} />}\n <Popover {...mergedProps}>\n {({ placement }) =>\n withObservedValues(\n children,\n {\n placementTop: placement === \"top\",\n placementBottom: placement === \"bottom\",\n placementLeft: placement === \"left\",\n placementRight: placement === \"right\",\n },\n plasmicUpdateVariant\n )\n }\n </Popover>\n </>\n );\n}\n\nexport const POPOVER_COMPONENT_NAME = makeComponentName(\"popover\");\nexport const POPOVER_ARROW_IMG: PlasmicElement = {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n position: \"absolute\",\n top: \"-14px\",\n // center the arrow horizontally on the popover\n left: \"50%\",\n transform: \"translateX(-50%)\",\n width: \"15px\",\n },\n};\n\nexport function registerPopover(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BasePopover>\n) {\n registerComponentHelper(\n loader,\n BasePopover,\n {\n name: POPOVER_COMPONENT_NAME,\n displayName: \"Aria Popover\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerPopover\",\n importName: \"BasePopover\",\n variants,\n defaultStyles: {\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n width: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n POPOVER_ARROW_IMG,\n {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n rowGap: \"10px\",\n },\n children: [\n {\n type: \"text\",\n value: \"This is a Popover!\",\n },\n {\n type: \"text\",\n value: \"You can put anything you can imagine here!\",\n styles: {\n fontWeight: 500,\n },\n },\n {\n type: \"text\",\n value:\n \"Use it in a `Aria Dialog Trigger` component to trigger it on a button click!\",\n },\n ],\n },\n ],\n },\n offset: {\n type: \"number\",\n displayName: \"Offset\",\n description:\n \"Additional offset applied vertically between the popover and its trigger\",\n defaultValueHint: 8,\n },\n shouldFlip: {\n type: \"boolean\",\n description:\n \"Whether the element should flip its orientation (e.g. top to bottom or left to right) when there is insufficient room for it to render completely.\",\n defaultValueHint: (_props, ctx) => ctx?.defaultShouldFlip,\n },\n placement: {\n type: \"choice\",\n description:\n \"Default placement of the popover relative to the trigger, if there is enough space\",\n defaultValueHint: \"bottom\",\n options: [\n // Not allowing other placement options here because of https://github.com/adobe/react-spectrum/issues/6825\n \"top\",\n \"bottom\",\n \"left\",\n \"right\",\n ],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n // 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.\n styleSections: true,\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":"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"}
@@ -6,7 +6,7 @@ var common = require('./common-2e984ab4.cjs.js');
6
6
  var contexts = require('./contexts-baa37b74.cjs.js');
7
7
  var registerLabel = require('./registerLabel.cjs.js');
8
8
  var utils = require('./utils-8dbb4d1f.cjs.js');
9
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
9
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
10
10
  require('@plasmicapp/host/registerComponent');
11
11
 
12
12
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -4,7 +4,7 @@ import { g as getCommonProps } from './common-0c4336fe.esm.js';
4
4
  import { e as PlasmicRadioGroupContext } from './contexts-081d65a0.esm.js';
5
5
  import { LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
6
6
  import { r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
7
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
7
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
8
8
  import '@plasmicapp/host/registerComponent';
9
9
 
10
10
  var __defProp = Object.defineProperty;
@@ -9,7 +9,7 @@ var registerFieldError = require('./registerFieldError.cjs.js');
9
9
  var registerLabel = require('./registerLabel.cjs.js');
10
10
  var registerRadio = require('./registerRadio.cjs.js');
11
11
  var utils = require('./utils-8dbb4d1f.cjs.js');
12
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
12
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
13
13
  require('./registerText.cjs.js');
14
14
  require('@plasmicapp/host/registerComponent');
15
15
 
@@ -7,7 +7,7 @@ import { registerFieldError } from './registerFieldError.esm.js';
7
7
  import { registerLabel, LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
8
8
  import { registerRadio, makeDefaultRadioChildren } from './registerRadio.esm.js';
9
9
  import { m as makeChildComponentName, r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
10
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
10
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
11
11
  import './registerText.esm.js';
12
12
  import '@plasmicapp/host/registerComponent';
13
13
 
@@ -13,7 +13,7 @@ var utils = require('./utils-8dbb4d1f.cjs.js');
13
13
  require('./registerListBoxItem.cjs.js');
14
14
  require('./registerDescription.cjs.js');
15
15
  require('./registerText.cjs.js');
16
- require('./variant-utils-6c6ef452.cjs.js');
16
+ require('./variant-utils-8cb38f8f.cjs.js');
17
17
  require('./registerSection.cjs.js');
18
18
  require('@react-aria/utils');
19
19
  require('@plasmicapp/host/registerComponent');
@@ -11,7 +11,7 @@ import { e as extractPlasmicDataProps, r as registerComponentHelper, a as makeCo
11
11
  import './registerListBoxItem.esm.js';
12
12
  import './registerDescription.esm.js';
13
13
  import './registerText.esm.js';
14
- import './variant-utils-5f90385f.esm.js';
14
+ import './variant-utils-7c2ea202.esm.js';
15
15
  import './registerSection.esm.js';
16
16
  import '@react-aria/utils';
17
17
  import '@plasmicapp/host/registerComponent';
@@ -9,7 +9,7 @@ var registerSliderOutput = require('./registerSliderOutput.cjs.js');
9
9
  var registerSliderThumb = require('./registerSliderThumb.cjs.js');
10
10
  var registerSliderTrack = require('./registerSliderTrack.cjs.js');
11
11
  var utils = require('./utils-8dbb4d1f.cjs.js');
12
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
12
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
13
13
  require('react-aria');
14
14
  require('react-keyed-flatten-children');
15
15
  require('@plasmicapp/host/registerComponent');
@@ -7,7 +7,7 @@ import { registerSliderOutput } from './registerSliderOutput.esm.js';
7
7
  import { registerSliderThumb } from './registerSliderThumb.esm.js';
8
8
  import { registerSliderTrack } from './registerSliderTrack.esm.js';
9
9
  import { r as registerComponentHelper, a as makeComponentName } from './utils-c7662a47.esm.js';
10
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
10
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
11
11
  import 'react-aria';
12
12
  import 'react-keyed-flatten-children';
13
13
  import '@plasmicapp/host/registerComponent';
@@ -3,7 +3,7 @@
3
3
  var React = require('react');
4
4
  var reactAriaComponents = require('react-aria-components');
5
5
  var utils = require('./utils-8dbb4d1f.cjs.js');
6
- var variantUtils = require('./variant-utils-6c6ef452.cjs.js');
6
+ var variantUtils = require('./variant-utils-8cb38f8f.cjs.js');
7
7
  require('@plasmicapp/host/registerComponent');
8
8
 
9
9
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { SliderOutput } from 'react-aria-components';
3
3
  import { a as makeComponentName, r as registerComponentHelper } from './utils-c7662a47.esm.js';
4
- import { p as pickAriaComponentVariants } from './variant-utils-5f90385f.esm.js';
4
+ import { p as pickAriaComponentVariants } from './variant-utils-7c2ea202.esm.js';
5
5
  import '@plasmicapp/host/registerComponent';
6
6
 
7
7
  var __defProp = Object.defineProperty;