@plasmicpkgs/react-aria 0.0.62 → 0.0.64
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 +90 -67
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js +89 -66
- package/dist/react-aria.js.map +1 -1
- package/dist/registerDialogTrigger.d.ts +2 -2
- package/dist/registerSelect.d.ts +0 -1
- package/dist/utils.d.ts +1 -1
- package/package.json +2 -2
- package/skinny/registerComboBox.cjs.js +20 -3
- package/skinny/registerComboBox.cjs.js.map +1 -1
- package/skinny/registerComboBox.esm.js +21 -4
- package/skinny/registerComboBox.esm.js.map +1 -1
- package/skinny/registerDialogTrigger.cjs.js +12 -3
- package/skinny/registerDialogTrigger.cjs.js.map +1 -1
- package/skinny/registerDialogTrigger.d.ts +2 -2
- package/skinny/registerDialogTrigger.esm.js +12 -3
- package/skinny/registerDialogTrigger.esm.js.map +1 -1
- package/skinny/{registerListBox-ad33e1e2.cjs.js → registerListBox-4761c48d.cjs.js} +3 -2
- package/skinny/registerListBox-4761c48d.cjs.js.map +1 -0
- package/skinny/{registerListBox-3842316b.esm.js → registerListBox-8c096263.esm.js} +3 -2
- package/skinny/registerListBox-8c096263.esm.js.map +1 -0
- package/skinny/registerListBox.cjs.js +1 -1
- package/skinny/registerListBox.esm.js +1 -1
- package/skinny/registerModal.cjs.js +4 -2
- package/skinny/registerModal.cjs.js.map +1 -1
- package/skinny/registerModal.esm.js +5 -3
- package/skinny/registerModal.esm.js.map +1 -1
- package/skinny/registerPopover.cjs.js +5 -0
- package/skinny/registerPopover.cjs.js.map +1 -1
- package/skinny/registerPopover.esm.js +5 -0
- package/skinny/registerPopover.esm.js.map +1 -1
- package/skinny/registerSelect.cjs.js +6 -13
- package/skinny/registerSelect.cjs.js.map +1 -1
- package/skinny/registerSelect.d.ts +0 -1
- package/skinny/registerSelect.esm.js +7 -14
- package/skinny/registerSelect.esm.js.map +1 -1
- package/skinny/registerTooltip.cjs.js +7 -10
- package/skinny/registerTooltip.cjs.js.map +1 -1
- package/skinny/registerTooltip.esm.js +7 -10
- package/skinny/registerTooltip.esm.js.map +1 -1
- package/skinny/utils-8dbb4d1f.cjs.js.map +1 -1
- package/skinny/utils-c7662a47.esm.js.map +1 -1
- package/skinny/utils.d.ts +1 -1
- package/skinny/registerListBox-3842316b.esm.js.map +0 -1
- package/skinny/registerListBox-ad33e1e2.cjs.js.map +0 -1
|
@@ -50,6 +50,7 @@ const INLINE_STYLES = {
|
|
|
50
50
|
};
|
|
51
51
|
const BaseModal = React.forwardRef(
|
|
52
52
|
function _BaseModal(props, ref) {
|
|
53
|
+
var _b;
|
|
53
54
|
const _a = props, {
|
|
54
55
|
children,
|
|
55
56
|
modalOverlayClass,
|
|
@@ -65,10 +66,11 @@ const BaseModal = React.forwardRef(
|
|
|
65
66
|
"resetClassName",
|
|
66
67
|
"setControlContextData"
|
|
67
68
|
]);
|
|
69
|
+
const { isSelected } = (_b = host.usePlasmicCanvasComponentInfo(props)) != null ? _b : {};
|
|
68
70
|
const contextProps = React__default.default.useContext(contexts.PlasmicDialogTriggerContext);
|
|
69
71
|
const isStandalone = !contextProps;
|
|
70
72
|
const mergedProps = reactAria.mergeProps(contextProps, rest, {
|
|
71
|
-
isOpen: isStandalone ? isOpen : contextProps.isOpen
|
|
73
|
+
isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen
|
|
72
74
|
});
|
|
73
75
|
setControlContextData == null ? void 0 : setControlContextData({
|
|
74
76
|
parent: isStandalone ? void 0 : {}
|
|
@@ -174,7 +176,7 @@ function registerModal(loader, overrides) {
|
|
|
174
176
|
type: "boolean",
|
|
175
177
|
editOnly: true,
|
|
176
178
|
uncontrolledProp: "defaultOpen",
|
|
177
|
-
defaultValueHint:
|
|
179
|
+
defaultValueHint: true,
|
|
178
180
|
defaultValue: true,
|
|
179
181
|
hidden: common.hasParent
|
|
180
182
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerModal.cjs.js","sources":["../src/registerModal.tsx"],"sourcesContent":["import { usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport React, { forwardRef, useImperativeHandle } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n Dialog,\n Modal,\n ModalOverlay,\n ModalOverlayProps,\n} from \"react-aria-components\";\nimport { hasParent } from \"./common\";\nimport { PlasmicDialogTriggerContext } from \"./contexts\";\nimport { HEADING_COMPONENT_NAME } from \"./registerHeading\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseModalProps\n extends ModalOverlayProps,\n HasControlContextData {\n heading: React.ReactNode;\n modalOverlayClass: string;\n resetClassName?: string;\n children?: React.ReactNode;\n}\n\nexport interface BaseModalActions {\n close(): void;\n open(): void;\n}\n\nconst INLINE_STYLES = {\n outline: \"none\",\n};\n\nexport const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(\n function _BaseModal(props, ref) {\n const {\n children,\n modalOverlayClass,\n className,\n isOpen,\n resetClassName,\n setControlContextData,\n ...rest\n } = props;\n\n const contextProps = React.useContext(PlasmicDialogTriggerContext);\n const isStandalone = !contextProps;\n const mergedProps = mergeProps(contextProps, rest, {\n isOpen: isStandalone ? isOpen : contextProps.isOpen,\n });\n\n setControlContextData?.({\n parent: isStandalone ? undefined : {},\n });\n\n // Expose close operation using useImperativeHandle\n useImperativeHandle(ref, () => ({\n close: () => {\n mergedProps.onOpenChange?.(false);\n },\n open: () => {\n mergedProps.onOpenChange?.(true);\n },\n }));\n\n const isCanvas = usePlasmicCanvasContext();\n\n {\n /* <Dialog> cannot be used in canvas, because while the dialog is open on the canvas, the focus is trapped inside it, so any Studio modals like the Color Picker modal would glitch due to focus jumping back and forth */\n }\n const bodyInCanvas = <div style={INLINE_STYLES}>{children}</div>;\n\n const bodyInPreview = <Dialog style={INLINE_STYLES}>{children}</Dialog>;\n\n return (\n <ModalOverlay\n {...mergedProps}\n className={`${resetClassName} ${modalOverlayClass}`}\n >\n <Modal className={className}>\n {isCanvas ? bodyInCanvas : bodyInPreview}\n </Modal>\n </ModalOverlay>\n );\n }\n);\n\nexport const MODAL_COMPONENT_NAME = makeComponentName(\"modal\");\n\nexport function registerModal(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseModal>\n) {\n registerComponentHelper(\n loader,\n BaseModal,\n {\n name: MODAL_COMPONENT_NAME,\n displayName: \"Aria Modal\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerModal\",\n importName: \"BaseModal\",\n styleSections: true,\n defaultStyles: {\n // centering the modal on the page by default\n position: \"fixed\",\n top: \"10%\",\n left: \"50%\",\n width: \"50%\",\n transform: \"translateX(-50%)\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n maxWidth: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n refActions: {\n open: {\n description: \"Open the modal\",\n argTypes: [],\n },\n close: {\n description: \"Close the modal\",\n argTypes: [],\n },\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n gap: \"10px\",\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n },\n children: [\n {\n type: \"component\",\n name: HEADING_COMPONENT_NAME,\n },\n {\n type: \"text\",\n value: \"This is a Modal!\",\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 modalOverlayClass: {\n type: \"class\",\n displayName: \"Modal Overlay\",\n },\n isOpen: {\n type: \"boolean\",\n editOnly: true,\n uncontrolledProp: \"defaultOpen\",\n defaultValueHint: false,\n defaultValue: true,\n hidden: hasParent,\n },\n isDismissable: {\n type: \"boolean\",\n description:\n \"Whether to close the modal when the user interacts outside it.\",\n },\n isKeyboardDismissDisabled: {\n type: \"boolean\",\n description:\n \"Whether pressing the escape key to close the modal should be disabled.\",\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n states: {\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["forwardRef","React","PlasmicDialogTriggerContext","mergeProps","useImperativeHandle","_a","usePlasmicCanvasContext","Dialog","ModalOverlay","Modal","makeComponentName","registerComponentHelper","HEADING_COMPONENT_NAME","hasParent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerModal.cjs.js","sources":["../src/registerModal.tsx"],"sourcesContent":["import {\n usePlasmicCanvasComponentInfo,\n usePlasmicCanvasContext,\n} from \"@plasmicapp/host\";\nimport React, { forwardRef, useImperativeHandle } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n Dialog,\n Modal,\n ModalOverlay,\n ModalOverlayProps,\n} from \"react-aria-components\";\nimport { hasParent } from \"./common\";\nimport { PlasmicDialogTriggerContext } from \"./contexts\";\nimport { HEADING_COMPONENT_NAME } from \"./registerHeading\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseModalProps\n extends ModalOverlayProps,\n HasControlContextData {\n heading: React.ReactNode;\n modalOverlayClass: string;\n resetClassName?: string;\n children?: React.ReactNode;\n}\n\nexport interface BaseModalActions {\n close(): void;\n open(): void;\n}\n\nconst INLINE_STYLES = {\n outline: \"none\",\n};\n\nexport const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(\n function _BaseModal(props, ref) {\n const {\n children,\n modalOverlayClass,\n className,\n isOpen,\n resetClassName,\n setControlContextData,\n ...rest\n } = props;\n\n const { isSelected } = usePlasmicCanvasComponentInfo(props) ?? {};\n\n const contextProps = React.useContext(PlasmicDialogTriggerContext);\n const isStandalone = !contextProps;\n const mergedProps = mergeProps(contextProps, rest, {\n isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen,\n });\n\n setControlContextData?.({\n parent: isStandalone ? undefined : {},\n });\n\n // Expose close operation using useImperativeHandle\n useImperativeHandle(ref, () => ({\n close: () => {\n mergedProps.onOpenChange?.(false);\n },\n open: () => {\n mergedProps.onOpenChange?.(true);\n },\n }));\n\n const isCanvas = usePlasmicCanvasContext();\n\n {\n /* <Dialog> cannot be used in canvas, because while the dialog is open on the canvas, the focus is trapped inside it, so any Studio modals like the Color Picker modal would glitch due to focus jumping back and forth */\n }\n const bodyInCanvas = <div style={INLINE_STYLES}>{children}</div>;\n\n const bodyInPreview = <Dialog style={INLINE_STYLES}>{children}</Dialog>;\n\n return (\n <ModalOverlay\n {...mergedProps}\n className={`${resetClassName} ${modalOverlayClass}`}\n >\n <Modal className={className}>\n {isCanvas ? bodyInCanvas : bodyInPreview}\n </Modal>\n </ModalOverlay>\n );\n }\n);\n\nexport const MODAL_COMPONENT_NAME = makeComponentName(\"modal\");\n\nexport function registerModal(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseModal>\n) {\n registerComponentHelper(\n loader,\n BaseModal,\n {\n name: MODAL_COMPONENT_NAME,\n displayName: \"Aria Modal\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerModal\",\n importName: \"BaseModal\",\n styleSections: true,\n defaultStyles: {\n // centering the modal on the page by default\n position: \"fixed\",\n top: \"10%\",\n left: \"50%\",\n width: \"50%\",\n transform: \"translateX(-50%)\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n maxWidth: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n refActions: {\n open: {\n description: \"Open the modal\",\n argTypes: [],\n },\n close: {\n description: \"Close the modal\",\n argTypes: [],\n },\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n gap: \"10px\",\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n },\n children: [\n {\n type: \"component\",\n name: HEADING_COMPONENT_NAME,\n },\n {\n type: \"text\",\n value: \"This is a Modal!\",\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 modalOverlayClass: {\n type: \"class\",\n displayName: \"Modal Overlay\",\n },\n isOpen: {\n type: \"boolean\",\n editOnly: true,\n uncontrolledProp: \"defaultOpen\",\n defaultValueHint: true,\n defaultValue: true,\n hidden: hasParent,\n },\n isDismissable: {\n type: \"boolean\",\n description:\n \"Whether to close the modal when the user interacts outside it.\",\n },\n isKeyboardDismissDisabled: {\n type: \"boolean\",\n description:\n \"Whether pressing the escape key to close the modal should be disabled.\",\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n states: {\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["forwardRef","React","PlasmicDialogTriggerContext","mergeProps","useImperativeHandle","_a","usePlasmicCanvasContext","Dialog","ModalOverlay","Modal","makeComponentName","registerComponentHelper","HEADING_COMPONENT_NAME","hasParent"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { usePlasmicCanvasContext } from '@plasmicapp/host';
|
|
1
|
+
import { usePlasmicCanvasComponentInfo, usePlasmicCanvasContext } from '@plasmicapp/host';
|
|
2
2
|
import React, { forwardRef, useImperativeHandle } from 'react';
|
|
3
3
|
import { mergeProps } from 'react-aria';
|
|
4
4
|
import { ModalOverlay, Modal, Dialog } from 'react-aria-components';
|
|
@@ -44,6 +44,7 @@ const INLINE_STYLES = {
|
|
|
44
44
|
};
|
|
45
45
|
const BaseModal = forwardRef(
|
|
46
46
|
function _BaseModal(props, ref) {
|
|
47
|
+
var _b;
|
|
47
48
|
const _a = props, {
|
|
48
49
|
children,
|
|
49
50
|
modalOverlayClass,
|
|
@@ -59,10 +60,11 @@ const BaseModal = forwardRef(
|
|
|
59
60
|
"resetClassName",
|
|
60
61
|
"setControlContextData"
|
|
61
62
|
]);
|
|
63
|
+
const { isSelected } = (_b = usePlasmicCanvasComponentInfo(props)) != null ? _b : {};
|
|
62
64
|
const contextProps = React.useContext(PlasmicDialogTriggerContext);
|
|
63
65
|
const isStandalone = !contextProps;
|
|
64
66
|
const mergedProps = mergeProps(contextProps, rest, {
|
|
65
|
-
isOpen: isStandalone ? isOpen : contextProps.isOpen
|
|
67
|
+
isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen
|
|
66
68
|
});
|
|
67
69
|
setControlContextData == null ? void 0 : setControlContextData({
|
|
68
70
|
parent: isStandalone ? void 0 : {}
|
|
@@ -168,7 +170,7 @@ function registerModal(loader, overrides) {
|
|
|
168
170
|
type: "boolean",
|
|
169
171
|
editOnly: true,
|
|
170
172
|
uncontrolledProp: "defaultOpen",
|
|
171
|
-
defaultValueHint:
|
|
173
|
+
defaultValueHint: true,
|
|
172
174
|
defaultValue: true,
|
|
173
175
|
hidden: hasParent
|
|
174
176
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerModal.esm.js","sources":["../src/registerModal.tsx"],"sourcesContent":["import { usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport React, { forwardRef, useImperativeHandle } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n Dialog,\n Modal,\n ModalOverlay,\n ModalOverlayProps,\n} from \"react-aria-components\";\nimport { hasParent } from \"./common\";\nimport { PlasmicDialogTriggerContext } from \"./contexts\";\nimport { HEADING_COMPONENT_NAME } from \"./registerHeading\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseModalProps\n extends ModalOverlayProps,\n HasControlContextData {\n heading: React.ReactNode;\n modalOverlayClass: string;\n resetClassName?: string;\n children?: React.ReactNode;\n}\n\nexport interface BaseModalActions {\n close(): void;\n open(): void;\n}\n\nconst INLINE_STYLES = {\n outline: \"none\",\n};\n\nexport const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(\n function _BaseModal(props, ref) {\n const {\n children,\n modalOverlayClass,\n className,\n isOpen,\n resetClassName,\n setControlContextData,\n ...rest\n } = props;\n\n const contextProps = React.useContext(PlasmicDialogTriggerContext);\n const isStandalone = !contextProps;\n const mergedProps = mergeProps(contextProps, rest, {\n isOpen: isStandalone ? isOpen : contextProps.isOpen,\n });\n\n setControlContextData?.({\n parent: isStandalone ? undefined : {},\n });\n\n // Expose close operation using useImperativeHandle\n useImperativeHandle(ref, () => ({\n close: () => {\n mergedProps.onOpenChange?.(false);\n },\n open: () => {\n mergedProps.onOpenChange?.(true);\n },\n }));\n\n const isCanvas = usePlasmicCanvasContext();\n\n {\n /* <Dialog> cannot be used in canvas, because while the dialog is open on the canvas, the focus is trapped inside it, so any Studio modals like the Color Picker modal would glitch due to focus jumping back and forth */\n }\n const bodyInCanvas = <div style={INLINE_STYLES}>{children}</div>;\n\n const bodyInPreview = <Dialog style={INLINE_STYLES}>{children}</Dialog>;\n\n return (\n <ModalOverlay\n {...mergedProps}\n className={`${resetClassName} ${modalOverlayClass}`}\n >\n <Modal className={className}>\n {isCanvas ? bodyInCanvas : bodyInPreview}\n </Modal>\n </ModalOverlay>\n );\n }\n);\n\nexport const MODAL_COMPONENT_NAME = makeComponentName(\"modal\");\n\nexport function registerModal(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseModal>\n) {\n registerComponentHelper(\n loader,\n BaseModal,\n {\n name: MODAL_COMPONENT_NAME,\n displayName: \"Aria Modal\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerModal\",\n importName: \"BaseModal\",\n styleSections: true,\n defaultStyles: {\n // centering the modal on the page by default\n position: \"fixed\",\n top: \"10%\",\n left: \"50%\",\n width: \"50%\",\n transform: \"translateX(-50%)\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n maxWidth: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n refActions: {\n open: {\n description: \"Open the modal\",\n argTypes: [],\n },\n close: {\n description: \"Close the modal\",\n argTypes: [],\n },\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n gap: \"10px\",\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n },\n children: [\n {\n type: \"component\",\n name: HEADING_COMPONENT_NAME,\n },\n {\n type: \"text\",\n value: \"This is a Modal!\",\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 modalOverlayClass: {\n type: \"class\",\n displayName: \"Modal Overlay\",\n },\n isOpen: {\n type: \"boolean\",\n editOnly: true,\n uncontrolledProp: \"defaultOpen\",\n defaultValueHint: false,\n defaultValue: true,\n hidden: hasParent,\n },\n isDismissable: {\n type: \"boolean\",\n description:\n \"Whether to close the modal when the user interacts outside it.\",\n },\n isKeyboardDismissDisabled: {\n type: \"boolean\",\n description:\n \"Whether pressing the escape key to close the modal should be disabled.\",\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n states: {\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["_a"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerModal.esm.js","sources":["../src/registerModal.tsx"],"sourcesContent":["import {\n usePlasmicCanvasComponentInfo,\n usePlasmicCanvasContext,\n} from \"@plasmicapp/host\";\nimport React, { forwardRef, useImperativeHandle } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n Dialog,\n Modal,\n ModalOverlay,\n ModalOverlayProps,\n} from \"react-aria-components\";\nimport { hasParent } from \"./common\";\nimport { PlasmicDialogTriggerContext } from \"./contexts\";\nimport { HEADING_COMPONENT_NAME } from \"./registerHeading\";\nimport {\n CodeComponentMetaOverrides,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseModalProps\n extends ModalOverlayProps,\n HasControlContextData {\n heading: React.ReactNode;\n modalOverlayClass: string;\n resetClassName?: string;\n children?: React.ReactNode;\n}\n\nexport interface BaseModalActions {\n close(): void;\n open(): void;\n}\n\nconst INLINE_STYLES = {\n outline: \"none\",\n};\n\nexport const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(\n function _BaseModal(props, ref) {\n const {\n children,\n modalOverlayClass,\n className,\n isOpen,\n resetClassName,\n setControlContextData,\n ...rest\n } = props;\n\n const { isSelected } = usePlasmicCanvasComponentInfo(props) ?? {};\n\n const contextProps = React.useContext(PlasmicDialogTriggerContext);\n const isStandalone = !contextProps;\n const mergedProps = mergeProps(contextProps, rest, {\n isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen,\n });\n\n setControlContextData?.({\n parent: isStandalone ? undefined : {},\n });\n\n // Expose close operation using useImperativeHandle\n useImperativeHandle(ref, () => ({\n close: () => {\n mergedProps.onOpenChange?.(false);\n },\n open: () => {\n mergedProps.onOpenChange?.(true);\n },\n }));\n\n const isCanvas = usePlasmicCanvasContext();\n\n {\n /* <Dialog> cannot be used in canvas, because while the dialog is open on the canvas, the focus is trapped inside it, so any Studio modals like the Color Picker modal would glitch due to focus jumping back and forth */\n }\n const bodyInCanvas = <div style={INLINE_STYLES}>{children}</div>;\n\n const bodyInPreview = <Dialog style={INLINE_STYLES}>{children}</Dialog>;\n\n return (\n <ModalOverlay\n {...mergedProps}\n className={`${resetClassName} ${modalOverlayClass}`}\n >\n <Modal className={className}>\n {isCanvas ? bodyInCanvas : bodyInPreview}\n </Modal>\n </ModalOverlay>\n );\n }\n);\n\nexport const MODAL_COMPONENT_NAME = makeComponentName(\"modal\");\n\nexport function registerModal(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseModal>\n) {\n registerComponentHelper(\n loader,\n BaseModal,\n {\n name: MODAL_COMPONENT_NAME,\n displayName: \"Aria Modal\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerModal\",\n importName: \"BaseModal\",\n styleSections: true,\n defaultStyles: {\n // centering the modal on the page by default\n position: \"fixed\",\n top: \"10%\",\n left: \"50%\",\n width: \"50%\",\n transform: \"translateX(-50%)\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n padding: \"20px\",\n maxWidth: \"300px\",\n backgroundColor: \"#FDE3C3\",\n },\n refActions: {\n open: {\n description: \"Open the modal\",\n argTypes: [],\n },\n close: {\n description: \"Close the modal\",\n argTypes: [],\n },\n },\n props: {\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"vbox\",\n styles: {\n width: \"stretch\",\n padding: 0,\n gap: \"10px\",\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n },\n children: [\n {\n type: \"component\",\n name: HEADING_COMPONENT_NAME,\n },\n {\n type: \"text\",\n value: \"This is a Modal!\",\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 modalOverlayClass: {\n type: \"class\",\n displayName: \"Modal Overlay\",\n },\n isOpen: {\n type: \"boolean\",\n editOnly: true,\n uncontrolledProp: \"defaultOpen\",\n defaultValueHint: true,\n defaultValue: true,\n hidden: hasParent,\n },\n isDismissable: {\n type: \"boolean\",\n description:\n \"Whether to close the modal when the user interacts outside it.\",\n },\n isKeyboardDismissDisabled: {\n type: \"boolean\",\n description:\n \"Whether pressing the escape key to close the modal should be disabled.\",\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n resetClassName: {\n type: \"themeResetClass\",\n },\n },\n states: {\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -64,6 +64,10 @@ function BasePopover(props) {
|
|
|
64
64
|
isStandalone ? {
|
|
65
65
|
triggerRef,
|
|
66
66
|
isNonModal: true,
|
|
67
|
+
/**
|
|
68
|
+
* 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
|
|
69
|
+
* In component view, we never want to start with an empty artboard, so isOpen has to be true
|
|
70
|
+
* */
|
|
67
71
|
isOpen: true
|
|
68
72
|
} : null
|
|
69
73
|
);
|
|
@@ -163,6 +167,7 @@ function registerPopover(loader, overrides) {
|
|
|
163
167
|
type: "themeResetClass"
|
|
164
168
|
}
|
|
165
169
|
},
|
|
170
|
+
// 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.
|
|
166
171
|
styleSections: true,
|
|
167
172
|
trapsFocus: true
|
|
168
173
|
},
|
|
@@ -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 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 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 styleSections: true,\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["React","PopoverContext","PlasmicPopoverContext","usePlasmicCanvasContext","mergeProps","Popover","makeComponentName","registerComponentHelper"],"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;
|
|
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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"}
|
|
@@ -58,6 +58,10 @@ function BasePopover(props) {
|
|
|
58
58
|
isStandalone ? {
|
|
59
59
|
triggerRef,
|
|
60
60
|
isNonModal: true,
|
|
61
|
+
/**
|
|
62
|
+
* 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
|
|
63
|
+
* In component view, we never want to start with an empty artboard, so isOpen has to be true
|
|
64
|
+
* */
|
|
61
65
|
isOpen: true
|
|
62
66
|
} : null
|
|
63
67
|
);
|
|
@@ -157,6 +161,7 @@ function registerPopover(loader, overrides) {
|
|
|
157
161
|
type: "themeResetClass"
|
|
158
162
|
}
|
|
159
163
|
},
|
|
164
|
+
// 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.
|
|
160
165
|
styleSections: true,
|
|
161
166
|
trapsFocus: true
|
|
162
167
|
},
|
|
@@ -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 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 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 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;
|
|
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":"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"}
|
|
@@ -5,7 +5,7 @@ var React = require('react');
|
|
|
5
5
|
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
|
-
var registerListBox = require('./registerListBox-
|
|
8
|
+
var registerListBox = require('./registerListBox-4761c48d.cjs.js');
|
|
9
9
|
var registerButton = require('./registerButton.cjs.js');
|
|
10
10
|
var registerLabel = require('./registerLabel.cjs.js');
|
|
11
11
|
var registerPopover = require('./registerPopover.cjs.js');
|
|
@@ -47,11 +47,11 @@ const BaseSelectValue = (props) => {
|
|
|
47
47
|
};
|
|
48
48
|
const SELECT_NAME = utils.makeComponentName("select");
|
|
49
49
|
function BaseSelect(props) {
|
|
50
|
+
var _a, _b;
|
|
50
51
|
const {
|
|
51
52
|
selectedKey,
|
|
52
53
|
onSelectionChange,
|
|
53
54
|
placeholder,
|
|
54
|
-
previewOpen,
|
|
55
55
|
onOpenChange,
|
|
56
56
|
isDisabled,
|
|
57
57
|
className,
|
|
@@ -63,8 +63,8 @@ function BaseSelect(props) {
|
|
|
63
63
|
setControlContextData,
|
|
64
64
|
"aria-label": ariaLabel
|
|
65
65
|
} = props;
|
|
66
|
-
const
|
|
67
|
-
const
|
|
66
|
+
const { isSelected } = (_a = host.usePlasmicCanvasComponentInfo(props)) != null ? _a : {};
|
|
67
|
+
const _isOpen = (_b = isSelected || isOpen) != null ? _b : false;
|
|
68
68
|
let idManager = React.useMemo(() => new registerListBox.ListBoxItemIdManager(), []);
|
|
69
69
|
React.useEffect(() => {
|
|
70
70
|
idManager.subscribe((ids) => {
|
|
@@ -86,12 +86,12 @@ function BaseSelect(props) {
|
|
|
86
86
|
name,
|
|
87
87
|
disabledKeys,
|
|
88
88
|
"aria-label": ariaLabel,
|
|
89
|
-
isOpen:
|
|
89
|
+
isOpen: _isOpen
|
|
90
90
|
}, utils.extractPlasmicDataProps(props)),
|
|
91
91
|
/* @__PURE__ */ React__default.default.createElement(
|
|
92
92
|
contexts.PlasmicPopoverContext.Provider,
|
|
93
93
|
{
|
|
94
|
-
value: { isOpen:
|
|
94
|
+
value: { isOpen: _isOpen, defaultShouldFlip: false }
|
|
95
95
|
},
|
|
96
96
|
/* @__PURE__ */ React__default.default.createElement(
|
|
97
97
|
contexts.PlasmicListBoxContext.Provider,
|
|
@@ -172,13 +172,6 @@ function registerSelect(loader) {
|
|
|
172
172
|
multiSelect: true,
|
|
173
173
|
advanced: true
|
|
174
174
|
},
|
|
175
|
-
previewOpen: {
|
|
176
|
-
type: "boolean",
|
|
177
|
-
displayName: "Preview opened?",
|
|
178
|
-
description: "Preview opened state while designing in Plasmic editor",
|
|
179
|
-
editOnly: true,
|
|
180
|
-
defaultValue: false
|
|
181
|
-
},
|
|
182
175
|
isOpen: {
|
|
183
176
|
type: "boolean",
|
|
184
177
|
defaultValue: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerSelect.cjs.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import { usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport React, { useEffect, useMemo } from \"react\";\nimport { Select, SelectProps, SelectValue } from \"react-aria-components\";\nimport { getCommonProps } from \"./common\";\nimport { PlasmicListBoxContext, PlasmicPopoverContext } from \"./contexts\";\nimport { ListBoxItemIdManager } from \"./ListBoxItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n extractPlasmicDataProps,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n customize?: boolean;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children, customize } = props;\n return (\n <SelectValue>\n {({ isPlaceholder, selectedText }) => (\n <>\n {isPlaceholder ? (\n <span>Select an item</span>\n ) : (\n <>\n <span>\n {customize ? (children as React.ReactNode) : selectedText}\n </span>\n </>\n )}\n {}\n </>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n HasControlContextData<BaseSelectControlContextData> {\n previewOpen?: boolean;\n children?: React.ReactNode;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n placeholder,\n previewOpen,\n onOpenChange,\n isDisabled,\n className,\n style,\n children,\n disabledKeys,\n name,\n isOpen,\n setControlContextData,\n \"aria-label\": ariaLabel,\n } = props;\n\n const isEditMode = !!usePlasmicCanvasContext();\n const openProp = isEditMode && previewOpen ? true : isOpen;\n\n let idManager = useMemo(() => new ListBoxItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n return (\n <Select\n placeholder={placeholder}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={className}\n style={style}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n isOpen={openProp}\n {...extractPlasmicDataProps(props)}\n >\n <PlasmicPopoverContext.Provider\n value={{ isOpen: openProp, defaultShouldFlip: false }}\n >\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n customize: {\n type: \"boolean\",\n description: \"Whether to customize the selected value display\",\n },\n children: {\n type: \"slot\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Selected value...\",\n },\n ],\n hidden: (props) => !props.customize,\n },\n className: {\n type: \"class\",\n selectors: [\n {\n selector: \":self[data-placeholder]\",\n label: \"Placeholder\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"placeholder\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n description: \"The selected keys of the listbox\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected key\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"value\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n description:\n \"The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n previewOpen: {\n type: \"boolean\",\n displayName: \"Preview opened?\",\n description: \"Preview opened state while designing in Plasmic editor\",\n editOnly: true,\n defaultValue: false,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: \"2px 5px\",\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n height: \"20px\",\n width: \"20px\",\n transform: \"rotate(180deg)\",\n },\n },\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedKey: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["React","SelectValue","makeComponentName","usePlasmicCanvasContext","useMemo","ListBoxItemIdManager","useEffect","Select","extractPlasmicDataProps","PlasmicPopoverContext","PlasmicListBoxContext","registerComponentHelper","getCommonProps","LABEL_COMPONENT_NAME","BUTTON_COMPONENT_NAME","POPOVER_COMPONENT_NAME","LIST_BOX_COMPONENT_NAME"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBa,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA,EAAE,QAAU,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAChC,EACE,uBAAAA,sBAAA,CAAA,aAAA,CAACC,uCACE,CAAC,EAAE,eAAe,YAAa,EAAA,iGAE3B,aACC,mBAAAD,sBAAA,CAAA,aAAA,CAAC,cAAK,gBAAc,CAAA,+GAGjBA,sBAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EACE,YAAa,QAA+B,GAAA,YAC/C,CACF,CAGJ,CAEJ,CAAA,CAAA;AAEJ,EAAA;AAEA,MAAM,WAAA,GAAcE,wBAAkB,QAAQ,CAAA,CAAA;AAavC,SAAS,WAAW,KAAwB,EAAA;AACjD,EAAM,MAAA;AAAA,IACJ,WAAA;AAAA,IACA,iBAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,qBAAA;AAAA,IACA,YAAc,EAAA,SAAA;AAAA,GACZ,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,UAAA,GAAa,CAAC,CAACC,4BAAwB,EAAA,CAAA;AAC7C,EAAM,MAAA,QAAA,GAAW,UAAc,IAAA,WAAA,GAAc,IAAO,GAAA,MAAA,CAAA;AAEpD,EAAA,IAAI,YAAYC,aAAQ,CAAA,MAAM,IAAIC,oCAAqB,EAAA,EAAG,EAAE,CAAA,CAAA;AAE5D,EAAAC,eAAA,CAAU,MAAM;AACd,IAAU,SAAA,CAAA,SAAA,CAAU,CAAC,GAAkB,KAAA;AACrC,MAAwB,qBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,qBAAA,CAAA;AAAA,QACtB,OAAS,EAAA,GAAA;AAAA,OACX,CAAA,CAAA;AAAA,KACD,CAAA,CAAA;AAAA,GACH,EAAG,EAAE,CAAA,CAAA;AAEL,EACE,uBAAAN,sBAAA,CAAA,aAAA;AAAA,IAACO,0BAAA;AAAA,IAAA,cAAA,CAAA;AAAA,MACC,WAAA;AAAA,MACA,WAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,YAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAQ,EAAA,QAAA;AAAA,KAAA,EACJC,8BAAwB,KAAK,CAAA,CAAA;AAAA,oBAEjCR,sBAAA,CAAA,aAAA;AAAA,MAACS,8BAAsB,CAAA,QAAA;AAAA,MAAtB;AAAA,QACC,KAAO,EAAA,EAAE,MAAQ,EAAA,QAAA,EAAU,mBAAmB,KAAM,EAAA;AAAA,OAAA;AAAA,sBAEpDT,sBAAA,CAAA,aAAA;AAAA,QAACU,8BAAsB,CAAA,QAAA;AAAA,QAAtB;AAAA,UACC,KAAO,EAAA;AAAA,YACL,SAAA;AAAA,WACF;AAAA,SAAA;AAAA,QAEC,QAAA;AAAA,OACH;AAAA,KACF;AAAA,GACF,CAAA;AAEJ,CAAA;AAEO,SAAS,eAAe,MAAuB,EAAA;AACpD,EAAM,MAAA,eAAA,GAAkBC,6BAAwB,CAAA,MAAA,EAAQ,eAAiB,EAAA;AAAA,IACvE,IAAA,EAAMT,wBAAkB,cAAc,CAAA;AAAA,IACtC,WAAa,EAAA,qBAAA;AAAA,IACb,UAAY,EAAA,+CAAA;AAAA,IACZ,UAAY,EAAA,iBAAA;AAAA,IACZ,mBAAqB,EAAA,WAAA;AAAA,IACrB,KAAO,EAAA;AAAA,MACL,SAAW,EAAA;AAAA,QACT,IAAM,EAAA,SAAA;AAAA,QACN,WAAa,EAAA,iDAAA;AAAA,OACf;AAAA,MACA,QAAU,EAAA;AAAA,QACR,IAAM,EAAA,MAAA;AAAA,QACN,YAAc,EAAA;AAAA,UACZ;AAAA,YACE,IAAM,EAAA,MAAA;AAAA,YACN,KAAO,EAAA,mBAAA;AAAA,WACT;AAAA,SACF;AAAA,QACA,MAAQ,EAAA,CAAC,KAAU,KAAA,CAAC,KAAM,CAAA,SAAA;AAAA,OAC5B;AAAA,MACA,SAAW,EAAA;AAAA,QACT,IAAM,EAAA,OAAA;AAAA,QACN,SAAW,EAAA;AAAA,UACT;AAAA,YACE,QAAU,EAAA,yBAAA;AAAA,YACV,KAAO,EAAA,aAAA;AAAA,WACT;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,UAAY,EAAA,IAAA;AAAA,GACb,CAAA,CAAA;AAED,EAAAS,6BAAA,CAAwB,QAAQ,UAAY,EAAA;AAAA,IAC1C,IAAM,EAAA,WAAA;AAAA,IACN,WAAa,EAAA,aAAA;AAAA,IACb,UAAY,EAAA,+CAAA;AAAA,IACZ,UAAY,EAAA,YAAA;AAAA,IACZ,KAAA,EAAO,aACF,CAAA,cAAA,CAAA,EAAA,EAAAC,qBAAA,CAAgC,QAAU,EAAA;AAAA,MAC3C,MAAA;AAAA,MACA,YAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,WAAA;AAAA,KACD,CAPI,CAAA,EAAA;AAAA,MAQL,WAAa,EAAA;AAAA,QACX,IAAM,EAAA,QAAA;AAAA,QACN,WAAa,EAAA,kCAAA;AAAA,QACb,QAAU,EAAA,IAAA;AAAA,QACV,gBAAkB,EAAA,oBAAA;AAAA,QAClB,WAAa,EAAA,sBAAA;AAAA,QACb,OAAA,EAAS,CAAC,MAAA,EAAQ,GAAS,KAAA,CAAA,GAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,GAAA,CAAK,OAAU,IAAA,KAAA,CAAM,IAAK,CAAA,GAAA,CAAI,OAAO,CAAA,GAAI,EAAC;AAAA;AAAA,QAErE,WAAa,EAAA,KAAA;AAAA,OACf;AAAA,MACA,iBAAmB,EAAA;AAAA,QACjB,IAAM,EAAA,cAAA;AAAA,QACN,UAAU,CAAC,EAAE,MAAM,OAAS,EAAA,IAAA,EAAM,UAAU,CAAA;AAAA,OAC9C;AAAA,MACA,YAAc,EAAA;AAAA,QACZ,IAAM,EAAA,QAAA;AAAA,QACN,WACE,EAAA,yGAAA;AAAA,QACF,OAAA,EAAS,CAAC,MAAA,EAAQ,GAAS,KAAA,CAAA,GAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,GAAA,CAAK,OAAU,IAAA,KAAA,CAAM,IAAK,CAAA,GAAA,CAAI,OAAO,CAAA,GAAI,EAAC;AAAA,QACrE,WAAa,EAAA,IAAA;AAAA,QACb,QAAU,EAAA,IAAA;AAAA,OACZ;AAAA,MACA,WAAa,EAAA;AAAA,QACX,IAAM,EAAA,SAAA;AAAA,QACN,WAAa,EAAA,iBAAA;AAAA,QACb,WAAa,EAAA,wDAAA;AAAA,QACb,QAAU,EAAA,IAAA;AAAA,QACV,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,IAAM,EAAA,SAAA;AAAA,QACN,YAAc,EAAA,KAAA;AAAA;AAAA,QAEd,QAAQ,MAAM,IAAA;AAAA,OAChB;AAAA,MACA,YAAc,EAAA;AAAA,QACZ,IAAM,EAAA,cAAA;AAAA,QACN,UAAU,CAAC,EAAE,MAAM,QAAU,EAAA,IAAA,EAAM,WAAW,CAAA;AAAA,OAChD;AAAA,MACA,QAAU,EAAA;AAAA,QACR,IAAM,EAAA,MAAA;AAAA,QACN,eAAiB,EAAA,IAAA;AAAA,QACjB,YAAc,EAAA;AAAA,UACZ;AAAA,YACE,IAAM,EAAA,MAAA;AAAA,YACN,MAAQ,EAAA;AAAA,cACN,cAAgB,EAAA,YAAA;AAAA,cAChB,UAAY,EAAA,YAAA;AAAA,cACZ,KAAO,EAAA,OAAA;AAAA,cACP,OAAS,EAAA,CAAA;AAAA,aACX;AAAA,YACA,QAAU,EAAA;AAAA,cACR;AAAA,gBACE,IAAM,EAAA,WAAA;AAAA,gBACN,IAAM,EAAAC,kCAAA;AAAA,gBACN,KAAO,EAAA;AAAA,kBACL,QAAU,EAAA;AAAA,oBACR,IAAM,EAAA,MAAA;AAAA,oBACN,KAAO,EAAA,OAAA;AAAA,mBACT;AAAA,iBACF;AAAA,eACF;AAAA,cACA;AAAA,gBACE,IAAM,EAAA,WAAA;AAAA,gBACN,IAAM,EAAAC,oCAAA;AAAA,gBACN,MAAQ,EAAA;AAAA,kBACN,KAAO,EAAA,MAAA;AAAA,iBACT;AAAA,gBACA,KAAO,EAAA;AAAA,kBACL,QAAU,EAAA;AAAA,oBACR,IAAM,EAAA,MAAA;AAAA,oBACN,MAAQ,EAAA;AAAA,sBACN,KAAO,EAAA,SAAA;AAAA,sBACP,cAAgB,EAAA,eAAA;AAAA,sBAChB,UAAY,EAAA,QAAA;AAAA,sBACZ,OAAS,EAAA,SAAA;AAAA,qBACX;AAAA,oBACA,QAAU,EAAA;AAAA,sBACR;AAAA,wBACE,IAAM,EAAA,WAAA;AAAA,wBACN,MAAM,eAAgB,CAAA,IAAA;AAAA,uBACxB;AAAA,sBACA;AAAA,wBACE,IAAM,EAAA,KAAA;AAAA,wBACN,GAAK,EAAA,0CAAA;AAAA,wBACL,MAAQ,EAAA;AAAA,0BACN,MAAQ,EAAA,MAAA;AAAA,0BACR,KAAO,EAAA,MAAA;AAAA,0BACP,SAAW,EAAA,gBAAA;AAAA,yBACb;AAAA,uBACF;AAAA,qBACF;AAAA,mBACF;AAAA,iBACF;AAAA,eACF;AAAA,cACA;AAAA,gBACE,IAAM,EAAA,WAAA;AAAA,gBACN,IAAM,EAAAC,sCAAA;AAAA,gBACN,MAAQ,EAAA;AAAA,kBACN,eAAiB,EAAA,OAAA;AAAA,kBACjB,OAAS,EAAA,MAAA;AAAA,kBACT,QAAU,EAAA,QAAA;AAAA,iBACZ;AAAA,gBACA,KAAO,EAAA;AAAA,kBACL,QAAU,EAAA;AAAA,oBACR;AAAA,sBACE,IAAM,EAAA,WAAA;AAAA,sBACN,IAAM,EAAAC,uCAAA;AAAA,sBACN,KAAO,EAAA;AAAA,wBACL,aAAe,EAAA,QAAA;AAAA,uBACjB;AAAA,sBACA,MAAQ,EAAA;AAAA,wBACN,WAAa,EAAA,CAAA;AAAA,wBACb,KAAO,EAAA,SAAA;AAAA,uBACT;AAAA,qBACF;AAAA,mBACF;AAAA,iBACF;AAAA,eACF;AAAA,aACF;AAAA,WACF;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,WAAa,EAAA;AAAA,QACX,IAAM,EAAA,UAAA;AAAA,QACN,SAAW,EAAA,aAAA;AAAA,QACX,YAAc,EAAA,mBAAA;AAAA,QACd,YAAc,EAAA,MAAA;AAAA,OAChB;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,IAAM,EAAA,UAAA;AAAA,QACN,SAAW,EAAA,QAAA;AAAA,QACX,YAAc,EAAA,cAAA;AAAA,QACd,YAAc,EAAA,SAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA,UAAY,EAAA,IAAA;AAAA,GACb,CAAA,CAAA;AACH;;;;;;"}
|
|
1
|
+
{"version":3,"file":"registerSelect.cjs.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React, { useEffect, useMemo } from \"react\";\nimport { Select, SelectProps, SelectValue } from \"react-aria-components\";\nimport { getCommonProps } from \"./common\";\nimport { PlasmicListBoxContext, PlasmicPopoverContext } from \"./contexts\";\nimport { ListBoxItemIdManager } from \"./ListBoxItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n extractPlasmicDataProps,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n customize?: boolean;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children, customize } = props;\n return (\n <SelectValue>\n {({ isPlaceholder, selectedText }) => (\n <>\n {isPlaceholder ? (\n <span>Select an item</span>\n ) : (\n <>\n <span>\n {customize ? (children as React.ReactNode) : selectedText}\n </span>\n </>\n )}\n {}\n </>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n placeholder,\n onOpenChange,\n isDisabled,\n className,\n style,\n children,\n disabledKeys,\n name,\n isOpen,\n setControlContextData,\n \"aria-label\": ariaLabel,\n } = props;\n\n const { isSelected } = usePlasmicCanvasComponentInfo(props) ?? {};\n const _isOpen = (isSelected || isOpen) ?? false;\n\n let idManager = useMemo(() => new ListBoxItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n return (\n <Select\n placeholder={placeholder}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={className}\n style={style}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n isOpen={_isOpen}\n {...extractPlasmicDataProps(props)}\n >\n <PlasmicPopoverContext.Provider\n value={{ isOpen: _isOpen, defaultShouldFlip: false }}\n >\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n customize: {\n type: \"boolean\",\n description: \"Whether to customize the selected value display\",\n },\n children: {\n type: \"slot\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Selected value...\",\n },\n ],\n hidden: (props) => !props.customize,\n },\n className: {\n type: \"class\",\n selectors: [\n {\n selector: \":self[data-placeholder]\",\n label: \"Placeholder\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"placeholder\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n description: \"The selected keys of the listbox\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected key\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"value\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n description:\n \"The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: \"2px 5px\",\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n height: \"20px\",\n width: \"20px\",\n transform: \"rotate(180deg)\",\n },\n },\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedKey: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["React","SelectValue","makeComponentName","useMemo","ListBoxItemIdManager","useEffect","Select","extractPlasmicDataProps","PlasmicPopoverContext","PlasmicListBoxContext","registerComponentHelper","getCommonProps","LABEL_COMPONENT_NAME","BUTTON_COMPONENT_NAME","POPOVER_COMPONENT_NAME","LIST_BOX_COMPONENT_NAME"],"mappings":"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"}
|
|
@@ -10,7 +10,6 @@ export interface BaseSelectControlContextData {
|
|
|
10
10
|
}
|
|
11
11
|
export interface BaseSelectProps extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy
|
|
12
12
|
HasControlContextData<BaseSelectControlContextData> {
|
|
13
|
-
previewOpen?: boolean;
|
|
14
13
|
children?: React.ReactNode;
|
|
15
14
|
}
|
|
16
15
|
export declare function BaseSelect(props: BaseSelectProps): React.JSX.Element;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { usePlasmicCanvasComponentInfo } from '@plasmicapp/host';
|
|
2
2
|
import React, { useMemo, useEffect } from 'react';
|
|
3
3
|
import { SelectValue, Select } from 'react-aria-components';
|
|
4
4
|
import { g as getCommonProps } from './common-0c4336fe.esm.js';
|
|
5
5
|
import { a as PlasmicPopoverContext, b as PlasmicListBoxContext } from './contexts-081d65a0.esm.js';
|
|
6
|
-
import { L as ListBoxItemIdManager, a as LIST_BOX_COMPONENT_NAME } from './registerListBox-
|
|
6
|
+
import { L as ListBoxItemIdManager, a as LIST_BOX_COMPONENT_NAME } from './registerListBox-8c096263.esm.js';
|
|
7
7
|
import { BUTTON_COMPONENT_NAME } from './registerButton.esm.js';
|
|
8
8
|
import { LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
|
|
9
9
|
import { POPOVER_COMPONENT_NAME } from './registerPopover.esm.js';
|
|
@@ -41,11 +41,11 @@ const BaseSelectValue = (props) => {
|
|
|
41
41
|
};
|
|
42
42
|
const SELECT_NAME = makeComponentName("select");
|
|
43
43
|
function BaseSelect(props) {
|
|
44
|
+
var _a, _b;
|
|
44
45
|
const {
|
|
45
46
|
selectedKey,
|
|
46
47
|
onSelectionChange,
|
|
47
48
|
placeholder,
|
|
48
|
-
previewOpen,
|
|
49
49
|
onOpenChange,
|
|
50
50
|
isDisabled,
|
|
51
51
|
className,
|
|
@@ -57,8 +57,8 @@ function BaseSelect(props) {
|
|
|
57
57
|
setControlContextData,
|
|
58
58
|
"aria-label": ariaLabel
|
|
59
59
|
} = props;
|
|
60
|
-
const
|
|
61
|
-
const
|
|
60
|
+
const { isSelected } = (_a = usePlasmicCanvasComponentInfo(props)) != null ? _a : {};
|
|
61
|
+
const _isOpen = (_b = isSelected || isOpen) != null ? _b : false;
|
|
62
62
|
let idManager = useMemo(() => new ListBoxItemIdManager(), []);
|
|
63
63
|
useEffect(() => {
|
|
64
64
|
idManager.subscribe((ids) => {
|
|
@@ -80,12 +80,12 @@ function BaseSelect(props) {
|
|
|
80
80
|
name,
|
|
81
81
|
disabledKeys,
|
|
82
82
|
"aria-label": ariaLabel,
|
|
83
|
-
isOpen:
|
|
83
|
+
isOpen: _isOpen
|
|
84
84
|
}, extractPlasmicDataProps(props)),
|
|
85
85
|
/* @__PURE__ */ React.createElement(
|
|
86
86
|
PlasmicPopoverContext.Provider,
|
|
87
87
|
{
|
|
88
|
-
value: { isOpen:
|
|
88
|
+
value: { isOpen: _isOpen, defaultShouldFlip: false }
|
|
89
89
|
},
|
|
90
90
|
/* @__PURE__ */ React.createElement(
|
|
91
91
|
PlasmicListBoxContext.Provider,
|
|
@@ -166,13 +166,6 @@ function registerSelect(loader) {
|
|
|
166
166
|
multiSelect: true,
|
|
167
167
|
advanced: true
|
|
168
168
|
},
|
|
169
|
-
previewOpen: {
|
|
170
|
-
type: "boolean",
|
|
171
|
-
displayName: "Preview opened?",
|
|
172
|
-
description: "Preview opened state while designing in Plasmic editor",
|
|
173
|
-
editOnly: true,
|
|
174
|
-
defaultValue: false
|
|
175
|
-
},
|
|
176
169
|
isOpen: {
|
|
177
170
|
type: "boolean",
|
|
178
171
|
defaultValue: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerSelect.esm.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import { usePlasmicCanvasContext } from \"@plasmicapp/host\";\nimport React, { useEffect, useMemo } from \"react\";\nimport { Select, SelectProps, SelectValue } from \"react-aria-components\";\nimport { getCommonProps } from \"./common\";\nimport { PlasmicListBoxContext, PlasmicPopoverContext } from \"./contexts\";\nimport { ListBoxItemIdManager } from \"./ListBoxItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n extractPlasmicDataProps,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n customize?: boolean;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children, customize } = props;\n return (\n <SelectValue>\n {({ isPlaceholder, selectedText }) => (\n <>\n {isPlaceholder ? (\n <span>Select an item</span>\n ) : (\n <>\n <span>\n {customize ? (children as React.ReactNode) : selectedText}\n </span>\n </>\n )}\n {}\n </>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n HasControlContextData<BaseSelectControlContextData> {\n previewOpen?: boolean;\n children?: React.ReactNode;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n placeholder,\n previewOpen,\n onOpenChange,\n isDisabled,\n className,\n style,\n children,\n disabledKeys,\n name,\n isOpen,\n setControlContextData,\n \"aria-label\": ariaLabel,\n } = props;\n\n const isEditMode = !!usePlasmicCanvasContext();\n const openProp = isEditMode && previewOpen ? true : isOpen;\n\n let idManager = useMemo(() => new ListBoxItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n return (\n <Select\n placeholder={placeholder}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={className}\n style={style}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n isOpen={openProp}\n {...extractPlasmicDataProps(props)}\n >\n <PlasmicPopoverContext.Provider\n value={{ isOpen: openProp, defaultShouldFlip: false }}\n >\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n customize: {\n type: \"boolean\",\n description: \"Whether to customize the selected value display\",\n },\n children: {\n type: \"slot\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Selected value...\",\n },\n ],\n hidden: (props) => !props.customize,\n },\n className: {\n type: \"class\",\n selectors: [\n {\n selector: \":self[data-placeholder]\",\n label: \"Placeholder\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"placeholder\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n description: \"The selected keys of the listbox\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected key\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"value\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n description:\n \"The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n previewOpen: {\n type: \"boolean\",\n displayName: \"Preview opened?\",\n description: \"Preview opened state while designing in Plasmic editor\",\n editOnly: true,\n defaultValue: false,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: \"2px 5px\",\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n height: \"20px\",\n width: \"20px\",\n transform: \"rotate(180deg)\",\n },\n },\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedKey: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerSelect.esm.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React, { useEffect, useMemo } from \"react\";\nimport { Select, SelectProps, SelectValue } from \"react-aria-components\";\nimport { getCommonProps } from \"./common\";\nimport { PlasmicListBoxContext, PlasmicPopoverContext } from \"./contexts\";\nimport { ListBoxItemIdManager } from \"./ListBoxItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n extractPlasmicDataProps,\n HasControlContextData,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n customize?: boolean;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children, customize } = props;\n return (\n <SelectValue>\n {({ isPlaceholder, selectedText }) => (\n <>\n {isPlaceholder ? (\n <span>Select an item</span>\n ) : (\n <>\n <span>\n {customize ? (children as React.ReactNode) : selectedText}\n </span>\n </>\n )}\n {}\n </>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n placeholder,\n onOpenChange,\n isDisabled,\n className,\n style,\n children,\n disabledKeys,\n name,\n isOpen,\n setControlContextData,\n \"aria-label\": ariaLabel,\n } = props;\n\n const { isSelected } = usePlasmicCanvasComponentInfo(props) ?? {};\n const _isOpen = (isSelected || isOpen) ?? false;\n\n let idManager = useMemo(() => new ListBoxItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n return (\n <Select\n placeholder={placeholder}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={className}\n style={style}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n isOpen={_isOpen}\n {...extractPlasmicDataProps(props)}\n >\n <PlasmicPopoverContext.Provider\n value={{ isOpen: _isOpen, defaultShouldFlip: false }}\n >\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n customize: {\n type: \"boolean\",\n description: \"Whether to customize the selected value display\",\n },\n children: {\n type: \"slot\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Selected value...\",\n },\n ],\n hidden: (props) => !props.customize,\n },\n className: {\n type: \"class\",\n selectors: [\n {\n selector: \":self[data-placeholder]\",\n label: \"Placeholder\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"placeholder\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n description: \"The selected keys of the listbox\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected key\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"value\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n description:\n \"The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: \"2px 5px\",\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n {\n type: \"img\",\n src: \"https://static1.plasmic.app/arrow-up.svg\",\n styles: {\n height: \"20px\",\n width: \"20px\",\n transform: \"rotate(180deg)\",\n },\n },\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedKey: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":[],"mappings":"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"}
|