@plasmicapp/react-web 0.2.112 → 0.2.113
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/LICENSE.md +21 -0
- package/dist/all.d.ts +36 -16
- package/dist/common.d.ts +3 -3
- package/dist/index-common.d.ts +3 -2
- package/dist/react-web.cjs.development.js +52 -31
- package/dist/react-web.cjs.development.js.map +1 -1
- package/dist/react-web.cjs.production.min.js +1 -1
- package/dist/react-web.cjs.production.min.js.map +1 -1
- package/dist/react-web.esm.js +41 -31
- package/dist/react-web.esm.js.map +1 -1
- package/dist/render/ssr.d.ts +1 -0
- package/package.json +4 -3
- package/skinny/dist/{collection-utils-57c273dc.js → collection-utils-43f97262.js} +14 -13
- package/skinny/dist/collection-utils-43f97262.js.map +1 -0
- package/skinny/dist/{common-182a0b0c.js → common-9ebe374e.js} +1 -1
- package/skinny/dist/common-9ebe374e.js.map +1 -0
- package/skinny/dist/common.d.ts +3 -3
- package/skinny/dist/index-common.d.ts +3 -2
- package/skinny/dist/index.js +40 -42
- package/skinny/dist/index.js.map +1 -1
- package/skinny/dist/plume/button/index.js +7 -7
- package/skinny/dist/plume/button/index.js.map +1 -1
- package/skinny/dist/plume/checkbox/index.js +17 -17
- package/skinny/dist/plume/checkbox/index.js.map +1 -1
- package/skinny/dist/plume/menu/index.js +38 -39
- package/skinny/dist/plume/menu/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/index.js +22 -22
- package/skinny/dist/plume/menu-button/index.js.map +1 -1
- package/skinny/dist/plume/select/index.js +41 -43
- package/skinny/dist/plume/select/index.js.map +1 -1
- package/skinny/dist/plume/switch/index.js +16 -16
- package/skinny/dist/plume/switch/index.js.map +1 -1
- package/skinny/dist/plume/text-input/index.js +10 -10
- package/skinny/dist/plume/text-input/index.js.map +1 -1
- package/skinny/dist/plume/triggered-overlay/index.js +14 -14
- package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
- package/skinny/dist/{plume-utils-d2476af1.js → plume-utils-d9811bf3.js} +2 -2
- package/skinny/dist/{plume-utils-27cd384f.js.map → plume-utils-d9811bf3.js.map} +1 -1
- package/skinny/dist/{props-utils-cac0cccf.js → props-utils-228208e6.js} +2 -2
- package/skinny/dist/{props-utils-7c02c0a8.js.map → props-utils-228208e6.js.map} +1 -1
- package/skinny/dist/{react-utils-35cb2a4e.js → react-utils-7bc53870.js} +6 -6
- package/skinny/dist/{react-utils-35cb2a4e.js.map → react-utils-7bc53870.js.map} +1 -1
- package/skinny/dist/render/PlasmicHead/index.js +6 -6
- package/skinny/dist/render/PlasmicImg/index.js +27 -27
- package/skinny/dist/render/PlasmicImg/index.js.map +1 -1
- package/skinny/dist/render/ssr.d.ts +1 -0
- package/skinny/dist/{ssr-d3321868.js → ssr-b16a1854.js} +10 -9
- package/skinny/dist/ssr-b16a1854.js.map +1 -0
- package/skinny/dist/collection-utils-2745acd4.js +0 -238
- package/skinny/dist/collection-utils-2745acd4.js.map +0 -1
- package/skinny/dist/collection-utils-42de4441.js +0 -244
- package/skinny/dist/collection-utils-42de4441.js.map +0 -1
- package/skinny/dist/collection-utils-57c273dc.js.map +0 -1
- package/skinny/dist/collection-utils-bf37b8fb.js +0 -238
- package/skinny/dist/collection-utils-bf37b8fb.js.map +0 -1
- package/skinny/dist/common-182a0b0c.js.map +0 -1
- package/skinny/dist/common-98719219.js +0 -68
- package/skinny/dist/common-98719219.js.map +0 -1
- package/skinny/dist/common-9efbae57.js +0 -201
- package/skinny/dist/common-9efbae57.js.map +0 -1
- package/skinny/dist/context-4ca6f5cd.js +0 -6
- package/skinny/dist/context-4ca6f5cd.js.map +0 -1
- package/skinny/dist/plume-utils-1e225de5.js +0 -25
- package/skinny/dist/plume-utils-1e225de5.js.map +0 -1
- package/skinny/dist/plume-utils-27cd384f.js +0 -35
- package/skinny/dist/plume-utils-623b91cc.js +0 -35
- package/skinny/dist/plume-utils-623b91cc.js.map +0 -1
- package/skinny/dist/plume-utils-d2476af1.js.map +0 -1
- package/skinny/dist/props-utils-7c02c0a8.js +0 -8
- package/skinny/dist/props-utils-b2ad4997.js +0 -8
- package/skinny/dist/props-utils-b2ad4997.js.map +0 -1
- package/skinny/dist/props-utils-c60d3105.js +0 -8
- package/skinny/dist/props-utils-c60d3105.js.map +0 -1
- package/skinny/dist/props-utils-cac0cccf.js.map +0 -1
- package/skinny/dist/react-utils-6050fadc.js +0 -201
- package/skinny/dist/react-utils-6050fadc.js.map +0 -1
- package/skinny/dist/react-utils-7c01e440.js +0 -172
- package/skinny/dist/react-utils-7c01e440.js.map +0 -1
- package/skinny/dist/react-utils-b5dc6320.js +0 -155
- package/skinny/dist/react-utils-b5dc6320.js.map +0 -1
- package/skinny/dist/render/PlasmicHead.d.ts +0 -35
- package/skinny/dist/ssr-68913b60.js +0 -107
- package/skinny/dist/ssr-68913b60.js.map +0 -1
- package/skinny/dist/ssr-9ebd98ed.js +0 -158
- package/skinny/dist/ssr-9ebd98ed.js.map +0 -1
- package/skinny/dist/ssr-d3321868.js.map +0 -1
- package/skinny/dist/ssr-f4053cdd.js +0 -110
- package/skinny/dist/ssr-f4053cdd.js.map +0 -1
- package/skinny/dist/ssr-fbf922f6.js +0 -108
- package/skinny/dist/ssr-fbf922f6.js.map +0 -1
- package/skinny/dist/states/valtio copy.d.ts +0 -15
- package/skinny/dist/stories/UseDollarState.test.d.ts +0 -11
- package/skinny/dist/stories/UseDollarState2.stories.d.ts +0 -7
- package/skinny/dist/tslib.es6-d26ffe68.js +0 -132
- package/skinny/dist/tslib.es6-d26ffe68.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/plume/menu/context.tsx","../../../../src/plume/menu/menu.tsx","../../../../src/plume/menu/menu-group.tsx","../../../../src/plume/menu/menu-item.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { TreeState } from \"@react-stately/tree\";\nimport type { BaseMenuProps } from \"./menu\";\n\nexport interface MenuContextValue {\n menuProps: BaseMenuProps;\n state: TreeState<any>;\n}\n\nexport const MenuContext = React.createContext<MenuContextValue | undefined>(\n undefined\n);\n","import { AriaMenuProps } from \"@react-types/menu\";\nimport { AriaLabelingProps, DOMProps } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenu as useAriaMenu } from \"@react-aria/menu\";\nimport { useTreeState } from \"@react-stately/tree\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { useEnsureSSRProvider } from \"../../render/ssr\";\nimport {\n renderAsCollectionChild,\n renderCollectionNode,\n useDerivedItemsFromChildren,\n} from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n noOutline,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n VariantDef,\n} from \"../plume-utils\";\nimport { getStyleProps, StyleProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {\n /**\n * List of `Menu.Item`s or `Menu.Group`s that make up the menu\n */\n children?: React.ReactNode;\n\n /**\n * Called with the value of a `Menu.Item` when it is selected.\n */\n onAction?: (value: string) => void;\n}\n\nexport type MenuRef = React.Ref<MenuRefValue>;\nexport interface MenuRefValue extends MenuState {\n getRoot: () => HTMLElement | null;\n}\n\nconst COLLECTION_OPTS = {\n itemPlumeType: \"menu-item\",\n sectionPlumeType: \"menu-group\",\n};\n\nexport interface MenuConfig<C extends AnyPlasmicClass> {\n isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n itemsSlot: keyof PlasmicClassArgs<C>;\n itemsContainer: keyof PlasmicClassOverrides<C>;\n root: keyof PlasmicClassOverrides<C>;\n}\n\n/**\n * Converts props from BaseMenuProps to react-aria's useMenu() props.\n */\nfunction asAriaMenuProps(props: BaseMenuProps) {\n const { children, ...rest } = props;\n const { items, disabledKeys } = useDerivedItemsFromChildren(children, {\n ...COLLECTION_OPTS,\n invalidChildError: `Can only use Menu.Item and Menu.Group as children to Menu`,\n requireItemValue: false,\n });\n\n const collectionChildRenderer = React.useCallback(\n (child) => renderAsCollectionChild(child, COLLECTION_OPTS),\n []\n );\n\n return {\n ariaProps: {\n ...rest,\n children: collectionChildRenderer,\n items,\n disabledKeys,\n } as AriaMenuProps<any>,\n };\n}\n\nexport interface MenuState {\n getFocusedValue: () => string | null;\n setFocusedValue: (value: string) => void;\n}\n\nexport function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(\n plasmicClass: C,\n props: P,\n config: MenuConfig<C>,\n ref: MenuRef = null\n) {\n useEnsureSSRProvider();\n const { ariaProps } = asAriaMenuProps(props);\n const triggerContext = React.useContext(TriggeredOverlayContext);\n const rootRef = React.useRef<HTMLElement>(null);\n\n const state = useTreeState(ariaProps);\n\n const menuListRef = React.useRef<HTMLUListElement>(null);\n\n const { menuProps } = useAriaMenu(\n {\n ...ariaProps,\n autoFocus: triggerContext?.autoFocus,\n },\n state,\n menuListRef\n );\n\n const contextValue = React.useMemo(\n () => ({ state, menuProps: props }),\n [state, props]\n );\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n };\n\n const overrides: Overrides = {\n [config.root]: {\n props: mergeProps(getStyleProps(props), {\n ref: rootRef,\n }),\n },\n [config.itemsContainer]: {\n as: \"ul\",\n props: mergeProps(menuProps, {\n ref: menuListRef,\n style: {\n ...noOutline(),\n },\n }),\n },\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.itemsSlot]: (\n <MenuContext.Provider value={contextValue}>\n {Array.from(state.collection).map((node) => renderCollectionNode(node))}\n </MenuContext.Provider>\n ),\n };\n\n const plumeState: MenuState = React.useMemo(\n () => ({\n getFocusedValue: () => state.selectionManager.focusedKey as string | null,\n setFocusedValue: (value: string) =>\n state.selectionManager.setFocusedKey(value),\n }),\n [state]\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n getRoot: () => rootRef.current,\n getFocusedValue: () => plumeState.getFocusedValue(),\n setFocusedValue: (key) => plumeState.setFocusedValue(key),\n }),\n [rootRef, plumeState]\n );\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n state: plumeState,\n };\n}\n","import { Node } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenuSection } from \"@react-aria/menu\";\nimport { useSeparator } from \"@react-aria/separator\";\nimport { pick } from \"../../common\";\nimport { Overrides } from \"../../render/elements\";\nimport { renderCollectionNode, SectionLikeProps } from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n PLUME_STRICT_MODE,\n} from \"../plume-utils\";\nimport {\n getDefaultPlasmicProps,\n getStyleProps,\n StyleProps,\n} from \"../props-utils\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {}\n\ninterface MenuGroupConfig<C extends AnyPlasmicClass> {\n noTitleVariant: PlasmicClassVariants<C>;\n isFirstVariant: PlasmicClassVariants<C>;\n\n itemsSlot: keyof PlasmicClassArgs<C>;\n titleSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n separator: keyof PlasmicClassOverrides<C>;\n titleContainer: keyof PlasmicClassOverrides<C>;\n itemsContainer: keyof PlasmicClassOverrides<C>;\n}\n\nexport function useMenuGroup<\n P extends BaseMenuGroupProps,\n C extends AnyPlasmicClass\n>(plasmicClass: C, props: P, config: MenuGroupConfig<C>) {\n const context = React.useContext(MenuContext);\n\n const node = (props as any)._node as\n | Node<React.ReactElement<BaseMenuGroupProps>>\n | undefined;\n\n if (!context || !node) {\n if (PLUME_STRICT_MODE) {\n throw new Error(\"You can only use a Menu.Group within a Menu component.\");\n }\n return getDefaultPlasmicProps(plasmicClass, props);\n }\n\n const { headingProps, groupProps } = useMenuSection({\n heading: props.title,\n \"aria-label\": props[\"aria-label\"],\n });\n\n const { separatorProps } = useSeparator({\n elementType: \"li\",\n });\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.noTitleVariant, active: !props.title },\n {\n def: config.isFirstVariant,\n active: context.state.collection.getFirstKey() === node.key,\n }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.titleSlot]: props.title,\n [config.itemsSlot]: Array.from(node.childNodes).map((childNode) =>\n renderCollectionNode(childNode)\n ),\n };\n\n const overrides: Overrides = {\n [config.root]: {\n props: getStyleProps(props),\n },\n [config.separator]: {\n props: {\n ...separatorProps,\n },\n as: \"li\",\n },\n [config.titleContainer]: {\n props: {\n role: \"presentation\",\n ...headingProps,\n },\n ...(!props.title && {\n render: () => null,\n }),\n },\n [config.itemsContainer]: {\n props: {\n ...groupProps,\n },\n as: \"ul\",\n },\n };\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n };\n}\n","import { Node } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenuItem as useAriaMenuItem } from \"@react-aria/menu\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { ItemLikeProps } from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n noOutline,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n PLUME_STRICT_MODE,\n VariantDef,\n} from \"../plume-utils\";\nimport { getDefaultPlasmicProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuItemProps extends ItemLikeProps {\n /**\n * Called when this item is selected\n */\n onAction?: (key: string) => void;\n}\n\ninterface MenuItemConfig<C extends AnyPlasmicClass> {\n isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;\n isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n labelSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n labelContainer: keyof PlasmicClassOverrides<C>;\n}\n\nexport function useMenuItem<\n P extends BaseMenuItemProps,\n C extends AnyPlasmicClass\n>(plasmicClass: C, props: P, config: MenuItemConfig<C>) {\n const menuContext = React.useContext(MenuContext);\n const triggerContext = React.useContext(TriggeredOverlayContext);\n\n if (!menuContext) {\n if (PLUME_STRICT_MODE) {\n throw new Error(\"You can only use a Menu.Item within a Menu component.\");\n }\n\n return getDefaultPlasmicProps(plasmicClass, props);\n }\n\n const { children, onAction } = props;\n\n const { state, menuProps } = menuContext;\n\n // We pass in the Node secretly as an undocumented prop from <Select />\n const node = (props as any)._node as Node<\n React.ReactElement<BaseMenuItemProps>\n >;\n\n const isDisabled = state.disabledKeys.has(node.key);\n const isHighlighted =\n state.selectionManager.isFocused &&\n state.selectionManager.focusedKey === node.key;\n\n const ref = React.useRef<HTMLLIElement>(null);\n\n const { menuItemProps, labelProps } = useAriaMenuItem(\n mergeProps(\n {\n // We need to merge both the onAction on MenuItem and the onAction\n // on Menu\n onAction,\n },\n {\n onAction: menuProps.onAction,\n onClose: triggerContext?.state.close,\n },\n {\n isDisabled,\n \"aria-label\": node && node[\"aria-label\"],\n key: node.key,\n isVirtualized: false,\n closeOnSelect: true,\n }\n ),\n state,\n ref\n );\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.isDisabledVariant, active: isDisabled },\n { def: config.isHighlightedVariant, active: isHighlighted }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.labelSlot]: children,\n };\n\n const overrides: Overrides = {\n [config.root]: {\n as: \"li\",\n props: mergeProps(menuItemProps, { ref, style: noOutline() }),\n },\n [config.labelContainer]: {\n props: { ...labelProps },\n },\n };\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n };\n}\n"],"names":["useAriaMenu","useAriaMenuItem"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/plume/menu/context.tsx","../../../../src/plume/menu/menu.tsx","../../../../src/plume/menu/menu-group.tsx","../../../../src/plume/menu/menu-item.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { TreeState } from \"@react-stately/tree\";\nimport type { BaseMenuProps } from \"./menu\";\n\nexport interface MenuContextValue {\n menuProps: BaseMenuProps;\n state: TreeState<any>;\n}\n\nexport const MenuContext = React.createContext<MenuContextValue | undefined>(\n undefined\n);\n","import { AriaMenuProps } from \"@react-types/menu\";\nimport { AriaLabelingProps, DOMProps } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenu as useAriaMenu } from \"@react-aria/menu\";\nimport { useTreeState } from \"@react-stately/tree\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { useEnsureSSRProvider } from \"../../render/ssr\";\nimport {\n renderAsCollectionChild,\n renderCollectionNode,\n useDerivedItemsFromChildren,\n} from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n noOutline,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n VariantDef,\n} from \"../plume-utils\";\nimport { getStyleProps, StyleProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {\n /**\n * List of `Menu.Item`s or `Menu.Group`s that make up the menu\n */\n children?: React.ReactNode;\n\n /**\n * Called with the value of a `Menu.Item` when it is selected.\n */\n onAction?: (value: string) => void;\n}\n\nexport type MenuRef = React.Ref<MenuRefValue>;\nexport interface MenuRefValue extends MenuState {\n getRoot: () => HTMLElement | null;\n}\n\nconst COLLECTION_OPTS = {\n itemPlumeType: \"menu-item\",\n sectionPlumeType: \"menu-group\",\n};\n\nexport interface MenuConfig<C extends AnyPlasmicClass> {\n isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;\n isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n itemsSlot: keyof PlasmicClassArgs<C>;\n itemsContainer: keyof PlasmicClassOverrides<C>;\n root: keyof PlasmicClassOverrides<C>;\n}\n\n/**\n * Converts props from BaseMenuProps to react-aria's useMenu() props.\n */\nfunction asAriaMenuProps(props: BaseMenuProps) {\n const { children, ...rest } = props;\n const { items, disabledKeys } = useDerivedItemsFromChildren(children, {\n ...COLLECTION_OPTS,\n invalidChildError: `Can only use Menu.Item and Menu.Group as children to Menu`,\n requireItemValue: false,\n });\n\n const collectionChildRenderer = React.useCallback(\n (child) => renderAsCollectionChild(child, COLLECTION_OPTS),\n []\n );\n\n return {\n ariaProps: {\n ...rest,\n children: collectionChildRenderer,\n items,\n disabledKeys,\n } as AriaMenuProps<any>,\n };\n}\n\nexport interface MenuState {\n getFocusedValue: () => string | null;\n setFocusedValue: (value: string) => void;\n}\n\nexport function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(\n plasmicClass: C,\n props: P,\n config: MenuConfig<C>,\n ref: MenuRef = null\n) {\n useEnsureSSRProvider();\n const { ariaProps } = asAriaMenuProps(props);\n const triggerContext = React.useContext(TriggeredOverlayContext);\n const rootRef = React.useRef<HTMLElement>(null);\n\n const state = useTreeState(ariaProps);\n\n const menuListRef = React.useRef<HTMLUListElement>(null);\n\n const { menuProps } = useAriaMenu(\n {\n ...ariaProps,\n autoFocus: triggerContext?.autoFocus,\n },\n state,\n menuListRef\n );\n\n const contextValue = React.useMemo(\n () => ({ state, menuProps: props }),\n [state, props]\n );\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n };\n\n const overrides: Overrides = {\n [config.root]: {\n props: mergeProps(getStyleProps(props), {\n ref: rootRef,\n }),\n },\n [config.itemsContainer]: {\n as: \"ul\",\n props: mergeProps(menuProps, {\n ref: menuListRef,\n style: {\n ...noOutline(),\n },\n }),\n },\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.itemsSlot]: (\n <MenuContext.Provider value={contextValue}>\n {Array.from(state.collection).map((node) => renderCollectionNode(node))}\n </MenuContext.Provider>\n ),\n };\n\n const plumeState: MenuState = React.useMemo(\n () => ({\n getFocusedValue: () => state.selectionManager.focusedKey as string | null,\n setFocusedValue: (value: string) =>\n state.selectionManager.setFocusedKey(value),\n }),\n [state]\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n getRoot: () => rootRef.current,\n getFocusedValue: () => plumeState.getFocusedValue(),\n setFocusedValue: (key) => plumeState.setFocusedValue(key),\n }),\n [rootRef, plumeState]\n );\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n state: plumeState,\n };\n}\n","import { Node } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenuSection } from \"@react-aria/menu\";\nimport { useSeparator } from \"@react-aria/separator\";\nimport { pick } from \"../../common\";\nimport { Overrides } from \"../../render/elements\";\nimport { renderCollectionNode, SectionLikeProps } from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n PLUME_STRICT_MODE,\n} from \"../plume-utils\";\nimport {\n getDefaultPlasmicProps,\n getStyleProps,\n StyleProps,\n} from \"../props-utils\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {}\n\ninterface MenuGroupConfig<C extends AnyPlasmicClass> {\n noTitleVariant: PlasmicClassVariants<C>;\n isFirstVariant: PlasmicClassVariants<C>;\n\n itemsSlot: keyof PlasmicClassArgs<C>;\n titleSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n separator: keyof PlasmicClassOverrides<C>;\n titleContainer: keyof PlasmicClassOverrides<C>;\n itemsContainer: keyof PlasmicClassOverrides<C>;\n}\n\nexport function useMenuGroup<\n P extends BaseMenuGroupProps,\n C extends AnyPlasmicClass\n>(plasmicClass: C, props: P, config: MenuGroupConfig<C>) {\n const context = React.useContext(MenuContext);\n\n const node = (props as any)._node as\n | Node<React.ReactElement<BaseMenuGroupProps>>\n | undefined;\n\n if (!context || !node) {\n if (PLUME_STRICT_MODE) {\n throw new Error(\"You can only use a Menu.Group within a Menu component.\");\n }\n return getDefaultPlasmicProps(plasmicClass, props);\n }\n\n const { headingProps, groupProps } = useMenuSection({\n heading: props.title,\n \"aria-label\": props[\"aria-label\"],\n });\n\n const { separatorProps } = useSeparator({\n elementType: \"li\",\n });\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.noTitleVariant, active: !props.title },\n {\n def: config.isFirstVariant,\n active: context.state.collection.getFirstKey() === node.key,\n }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.titleSlot]: props.title,\n [config.itemsSlot]: Array.from(node.childNodes).map((childNode) =>\n renderCollectionNode(childNode)\n ),\n };\n\n const overrides: Overrides = {\n [config.root]: {\n props: getStyleProps(props),\n },\n [config.separator]: {\n props: {\n ...separatorProps,\n },\n as: \"li\",\n },\n [config.titleContainer]: {\n props: {\n role: \"presentation\",\n ...headingProps,\n },\n ...(!props.title && {\n render: () => null,\n }),\n },\n [config.itemsContainer]: {\n props: {\n ...groupProps,\n },\n as: \"ul\",\n },\n };\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n };\n}\n","import { Node } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useMenuItem as useAriaMenuItem } from \"@react-aria/menu\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { ItemLikeProps } from \"../collection-utils\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n noOutline,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n PLUME_STRICT_MODE,\n VariantDef,\n} from \"../plume-utils\";\nimport { getDefaultPlasmicProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { MenuContext } from \"./context\";\n\nexport interface BaseMenuItemProps extends ItemLikeProps {\n /**\n * Called when this item is selected\n */\n onAction?: (key: string) => void;\n}\n\ninterface MenuItemConfig<C extends AnyPlasmicClass> {\n isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;\n isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n labelSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n labelContainer: keyof PlasmicClassOverrides<C>;\n}\n\nexport function useMenuItem<\n P extends BaseMenuItemProps,\n C extends AnyPlasmicClass\n>(plasmicClass: C, props: P, config: MenuItemConfig<C>) {\n const menuContext = React.useContext(MenuContext);\n const triggerContext = React.useContext(TriggeredOverlayContext);\n\n if (!menuContext) {\n if (PLUME_STRICT_MODE) {\n throw new Error(\"You can only use a Menu.Item within a Menu component.\");\n }\n\n return getDefaultPlasmicProps(plasmicClass, props);\n }\n\n const { children, onAction } = props;\n\n const { state, menuProps } = menuContext;\n\n // We pass in the Node secretly as an undocumented prop from <Select />\n const node = (props as any)._node as Node<\n React.ReactElement<BaseMenuItemProps>\n >;\n\n const isDisabled = state.disabledKeys.has(node.key);\n const isHighlighted =\n state.selectionManager.isFocused &&\n state.selectionManager.focusedKey === node.key;\n\n const ref = React.useRef<HTMLLIElement>(null);\n\n const { menuItemProps, labelProps } = useAriaMenuItem(\n mergeProps(\n {\n // We need to merge both the onAction on MenuItem and the onAction\n // on Menu\n onAction,\n },\n {\n onAction: menuProps.onAction,\n onClose: triggerContext?.state.close,\n },\n {\n isDisabled,\n \"aria-label\": node && node[\"aria-label\"],\n key: node.key,\n isVirtualized: false,\n closeOnSelect: true,\n }\n ),\n state,\n ref\n );\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.isDisabledVariant, active: isDisabled },\n { def: config.isHighlightedVariant, active: isHighlighted }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.labelSlot]: children,\n };\n\n const overrides: Overrides = {\n [config.root]: {\n as: \"li\",\n props: mergeProps(menuItemProps, { ref, style: noOutline() }),\n },\n [config.labelContainer]: {\n props: { ...labelProps },\n },\n };\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n };\n}\n"],"names":["useAriaMenu","useAriaMenuItem"],"mappings":"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"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useMenuTriggerState } from '@react-stately/menu';
|
|
3
|
-
import { m as mergeProps } from '../../react-utils-
|
|
3
|
+
import { m as mergeProps } from '../../react-utils-7bc53870.js';
|
|
4
4
|
import { T as TriggeredOverlayContext } from '../../context-034b8d25.js';
|
|
5
|
-
import { a as __assign, p as pick, b as __spreadArray, c as __read } from '../../common-
|
|
5
|
+
import { a as __assign, p as pick, b as __spreadArray, c as __read } from '../../common-9ebe374e.js';
|
|
6
6
|
import { useMenuTrigger as useMenuTrigger$1 } from '@react-aria/menu';
|
|
7
7
|
import { usePress } from '@react-aria/interactions';
|
|
8
|
-
import { g as getPlumeType, m as mergeVariantToggles } from '../../plume-utils-
|
|
8
|
+
import { g as getPlumeType, m as mergeVariantToggles } from '../../plume-utils-d9811bf3.js';
|
|
9
9
|
import { useFocusable } from '@react-aria/focus';
|
|
10
|
-
import { a as useEnsureSSRProvider } from '../../ssr-
|
|
11
|
-
import { g as getStyleProps } from '../../props-utils-
|
|
10
|
+
import { a as useEnsureSSRProvider } from '../../ssr-b16a1854.js';
|
|
11
|
+
import { g as getStyleProps } from '../../props-utils-228208e6.js';
|
|
12
12
|
import 'classnames';
|
|
13
13
|
import '@plasmicapp/data-sources-context';
|
|
14
14
|
import '@react-aria/ssr';
|
|
@@ -22,7 +22,7 @@ function useMenuTrigger(opts, state) {
|
|
|
22
22
|
var triggerRef = opts.triggerRef, isDisabled = opts.isDisabled, placement = opts.placement, menuMatchTriggerWidth = opts.menuMatchTriggerWidth, menuWidth = opts.menuWidth, menu = opts.menu;
|
|
23
23
|
var _a = useMenuTrigger$1({
|
|
24
24
|
type: "menu",
|
|
25
|
-
isDisabled: isDisabled
|
|
25
|
+
isDisabled: isDisabled
|
|
26
26
|
}, state, triggerRef), triggerPressProps = _a.menuTriggerProps, menuProps = _a.menuProps;
|
|
27
27
|
var triggerProps = usePress(__assign(__assign({}, triggerPressProps), { isDisabled: isDisabled })).pressProps;
|
|
28
28
|
var makeMenu = function () {
|
|
@@ -46,13 +46,13 @@ function useMenuTrigger(opts, state) {
|
|
|
46
46
|
placement: placement,
|
|
47
47
|
overlayMatchTriggerWidth: menuMatchTriggerWidth,
|
|
48
48
|
overlayMinTriggerWidth: true,
|
|
49
|
-
overlayWidth: menuWidth
|
|
49
|
+
overlayWidth: menuWidth
|
|
50
50
|
});
|
|
51
51
|
}, [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]);
|
|
52
52
|
return {
|
|
53
53
|
triggerProps: triggerProps,
|
|
54
54
|
makeMenu: makeMenu,
|
|
55
|
-
triggerContext: triggerContext
|
|
55
|
+
triggerContext: triggerContext
|
|
56
56
|
};
|
|
57
57
|
}
|
|
58
58
|
|
|
@@ -63,12 +63,12 @@ function DropdownMenu(props) {
|
|
|
63
63
|
isOpen: isOpen,
|
|
64
64
|
defaultOpen: defaultOpen,
|
|
65
65
|
onOpenChange: onOpenChange,
|
|
66
|
-
shouldFlip: true
|
|
66
|
+
shouldFlip: true
|
|
67
67
|
});
|
|
68
68
|
var _a = useMenuTrigger({
|
|
69
69
|
triggerRef: triggerRef,
|
|
70
70
|
placement: placement,
|
|
71
|
-
menu: menu
|
|
71
|
+
menu: menu
|
|
72
72
|
}, state), triggerProps = _a.triggerProps, makeMenu = _a.makeMenu, triggerContext = _a.triggerContext;
|
|
73
73
|
return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext },
|
|
74
74
|
React.cloneElement(children, mergeProps(children.props, triggerProps, { ref: triggerRef })),
|
|
@@ -86,7 +86,7 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
86
86
|
isOpen: isOpen,
|
|
87
87
|
defaultOpen: defaultOpen,
|
|
88
88
|
onOpenChange: onOpenChange,
|
|
89
|
-
shouldFlip: true
|
|
89
|
+
shouldFlip: true
|
|
90
90
|
});
|
|
91
91
|
var _c = useMenuTrigger({
|
|
92
92
|
isDisabled: isDisabled,
|
|
@@ -94,17 +94,17 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
94
94
|
placement: placement,
|
|
95
95
|
menuMatchTriggerWidth: menuMatchTriggerWidth,
|
|
96
96
|
menuWidth: menuWidth,
|
|
97
|
-
menu: menu
|
|
97
|
+
menu: menu
|
|
98
98
|
}, state), triggerProps = _c.triggerProps, makeMenu = _c.makeMenu, triggerContext = _c.triggerContext;
|
|
99
99
|
var triggerFocusProps = useFocusable(props, triggerRef).focusableProps;
|
|
100
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps)))), mergeVariantToggles({ def: config.isOpenVariant, active: state.isOpen }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
101
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps)))), (_a = {}, _a[config.menuSlot] = state.isOpen ? makeMenu() : undefined, _a));
|
|
100
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.isOpenVariant, active: state.isOpen }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
101
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.menuSlot] = state.isOpen ? makeMenu() : undefined, _a));
|
|
102
102
|
var overrides = (_b = {},
|
|
103
103
|
_b[config.root] = {
|
|
104
104
|
wrapChildren: function (children) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, children)); },
|
|
105
105
|
props: {
|
|
106
|
-
ref: rootRef
|
|
107
|
-
}
|
|
106
|
+
ref: rootRef
|
|
107
|
+
}
|
|
108
108
|
},
|
|
109
109
|
_b[config.trigger] = {
|
|
110
110
|
props: mergeProps(triggerProps, triggerFocusProps, getStyleProps(props), pick(props, "title"), {
|
|
@@ -112,14 +112,14 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
112
112
|
autoFocus: autoFocus,
|
|
113
113
|
disabled: !!isDisabled,
|
|
114
114
|
// Make sure this button is not interpreted as submit
|
|
115
|
-
type: "button"
|
|
116
|
-
})
|
|
115
|
+
type: "button"
|
|
116
|
+
})
|
|
117
117
|
},
|
|
118
118
|
_b);
|
|
119
119
|
var plumeState = React.useMemo(function () { return ({
|
|
120
120
|
open: function () { return state.open(); },
|
|
121
121
|
close: function () { return state.close(); },
|
|
122
|
-
isOpen: function () { return state.isOpen; }
|
|
122
|
+
isOpen: function () { return state.isOpen; }
|
|
123
123
|
}); }, [state]);
|
|
124
124
|
React.useImperativeHandle(outerRef, function () { return ({
|
|
125
125
|
getRoot: function () { return rootRef.current; },
|
|
@@ -128,15 +128,15 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
128
128
|
blur: function () { return triggerRef.current && triggerRef.current.blur(); },
|
|
129
129
|
open: plumeState.open,
|
|
130
130
|
close: plumeState.close,
|
|
131
|
-
isOpen: plumeState.isOpen
|
|
131
|
+
isOpen: plumeState.isOpen
|
|
132
132
|
}); }, [rootRef, triggerRef, plumeState]);
|
|
133
133
|
return {
|
|
134
134
|
plasmicProps: {
|
|
135
135
|
variants: variants,
|
|
136
136
|
args: args,
|
|
137
|
-
overrides: overrides
|
|
137
|
+
overrides: overrides
|
|
138
138
|
},
|
|
139
|
-
state: plumeState
|
|
139
|
+
state: plumeState
|
|
140
140
|
};
|
|
141
141
|
}
|
|
142
142
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/plume/menu-button/menu-trigger.tsx","../../../../src/plume/menu-button/DropdownMenu.tsx","../../../../src/plume/menu-button/menu-button.tsx"],"sourcesContent":["import { Placement } from \"@react-types/overlays\";\nimport * as React from \"react\";\nimport { useMenuTrigger as useAriaMenuTrigger } from \"@react-aria/menu\";\nimport { usePress } from \"@react-aria/interactions\";\nimport { MenuTriggerState } from \"@react-stately/menu\";\nimport { mergeProps } from \"../../react-utils\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport { getPlumeType, PLUME_STRICT_MODE } from \"../plume-utils\";\nimport { TriggeredOverlayContextValue } from \"../triggered-overlay/context\";\n\n/**\n * A menu trigger hook that combines react-aria's useMenuTrigger, useAriaMenuTrigger,\n * useOverlayPosition, useOverlay, and usePress\n */\nexport function useMenuTrigger(\n opts: {\n isDisabled?: boolean;\n triggerRef: React.RefObject<HTMLElement>;\n placement?: Placement;\n menuMatchTriggerWidth?: boolean;\n menuWidth?: number;\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n },\n state: MenuTriggerState\n) {\n const {\n triggerRef,\n isDisabled,\n placement,\n menuMatchTriggerWidth,\n menuWidth,\n menu,\n } = opts;\n\n const { menuTriggerProps: triggerPressProps, menuProps } = useAriaMenuTrigger(\n {\n type: \"menu\",\n isDisabled,\n },\n state,\n triggerRef\n );\n\n const { pressProps: triggerProps } = usePress({\n ...triggerPressProps,\n isDisabled,\n });\n\n const makeMenu = () => {\n let realMenu = typeof menu === \"function\" ? menu() : menu;\n if (!realMenu) {\n return null;\n }\n if (getPlumeType(realMenu) !== \"menu\") {\n if (PLUME_STRICT_MODE) {\n throw new Error(`Must use an instance of the Menu component.`);\n }\n return null;\n }\n\n return React.cloneElement(realMenu, mergeProps(realMenu.props, menuProps));\n };\n\n const triggerContext: TriggeredOverlayContextValue = React.useMemo(\n () => ({\n triggerRef,\n state,\n autoFocus: state.focusStrategy ?? true,\n placement,\n overlayMatchTriggerWidth: menuMatchTriggerWidth,\n overlayMinTriggerWidth: true,\n overlayWidth: menuWidth,\n }),\n [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]\n );\n\n return {\n triggerProps,\n makeMenu,\n triggerContext,\n };\n}\n","import { Placement } from \"@react-types/overlays\";\nimport * as React from \"react\";\nimport { useMenuTriggerState } from \"@react-stately/menu\";\nimport { mergeProps } from \"../../react-utils\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { useMenuTrigger } from \"./menu-trigger\";\n\nexport interface DropdownMenuProps {\n /**\n * A ReactElement that takes in a `ref` as well as the usual mouse and\n * pointer events. The dropdown menu will be positioned relative to this\n * trigger.\n */\n children: React.ReactElement;\n\n /**\n * The menu to show; must be either a ReactElement of Menu type, or\n * a function that creates one if you prefer to delay creating it until\n * the menu has been triggered.\n */\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n\n /**\n * Where to place the menu relative to the trigger.\n */\n placement?: Placement;\n\n /**\n * Whether the menu is currently shown.\n */\n isOpen?: boolean;\n\n /**\n * Uncontrolled open state.\n */\n defaultOpen?: boolean;\n\n /**\n * Event handler fired when Menu's open state changes\n */\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DropdownMenu(props: DropdownMenuProps) {\n const {\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n placement,\n menu,\n } = props;\n\n const triggerRef = React.useRef<HTMLElement>(null);\n\n const state = useMenuTriggerState({\n isOpen,\n defaultOpen,\n onOpenChange,\n shouldFlip: true,\n });\n\n const { triggerProps, makeMenu, triggerContext } = useMenuTrigger(\n {\n triggerRef,\n placement,\n menu,\n },\n state\n );\n\n return (\n <TriggeredOverlayContext.Provider value={triggerContext}>\n {React.cloneElement(\n children,\n mergeProps(children.props, triggerProps, { ref: triggerRef })\n )}\n {state.isOpen && makeMenu()}\n </TriggeredOverlayContext.Provider>\n );\n}\n","import { Placement } from \"@react-types/overlays\";\nimport { DOMProps, FocusableProps } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useFocusable } from \"@react-aria/focus\";\nimport { useMenuTriggerState } from \"@react-stately/menu\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { useEnsureSSRProvider } from \"../../render/ssr\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n VariantDef,\n} from \"../plume-utils\";\nimport { getStyleProps, StyleProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { useMenuTrigger } from \"./menu-trigger\";\n\nexport interface BaseMenuButtonProps\n extends DOMProps,\n FocusableProps,\n StyleProps,\n Pick<React.ComponentProps<\"button\">, \"title\"> {\n /**\n * The menu to show; can either be a Menu instance, or a function that returns a Menu\n * instance if you want to defer creating the instance till when it's opened.\n */\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n\n /**\n * Whether the button is disabled\n */\n isDisabled?: boolean;\n\n /**\n * Whether the menu is currently shown.\n */\n isOpen?: boolean;\n\n /**\n * Uncontrolled open state\n */\n defaultOpen?: boolean;\n\n /**\n * Event handler fired when Menu's open state changes\n */\n onOpenChange?: (isOpen: boolean) => void;\n\n /**\n * Desired placement location of the Select dropdown\n */\n placement?: Placement;\n /**\n * If true, menu width will always match the trigger button width.\n * If false, then menu width will have min-width matching the\n * trigger button width.\n */\n menuMatchTriggerWidth?: boolean;\n\n /**\n * If set, menu width will be exactly this width, overriding\n * menuMatchTriggerWidth.\n */\n menuWidth?: number;\n}\n\nexport interface MenuButtonConfig<C extends AnyPlasmicClass> {\n isOpenVariant: VariantDef<PlasmicClassVariants<C>>;\n isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n menuSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n trigger: keyof PlasmicClassOverrides<C>;\n}\n\ninterface MenuButtonState {\n open: () => void;\n close: () => void;\n isOpen: () => boolean;\n}\n\nexport type MenuButtonRef = React.Ref<MenuButtonRefValue>;\n\nexport interface MenuButtonRefValue extends MenuButtonState {\n getRoot: () => HTMLElement | null;\n getTrigger: () => HTMLElement | null;\n focus: () => void;\n blur: () => void;\n}\n\nexport function useMenuButton<\n P extends BaseMenuButtonProps,\n C extends AnyPlasmicClass\n>(\n plasmicClass: C,\n props: P,\n config: MenuButtonConfig<C>,\n outerRef: MenuButtonRef = null\n) {\n const {\n placement,\n isOpen,\n defaultOpen,\n onOpenChange,\n isDisabled,\n menu,\n autoFocus,\n menuMatchTriggerWidth,\n menuWidth,\n } = props;\n\n useEnsureSSRProvider();\n const rootRef = React.useRef<HTMLElement>(null);\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n\n const state = useMenuTriggerState({\n isOpen,\n defaultOpen,\n onOpenChange,\n shouldFlip: true,\n });\n\n const { triggerProps, makeMenu, triggerContext } = useMenuTrigger(\n {\n isDisabled,\n triggerRef,\n placement,\n menuMatchTriggerWidth,\n menuWidth,\n menu,\n },\n state\n );\n\n const { focusableProps: triggerFocusProps } = useFocusable(props, triggerRef);\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.isOpenVariant, active: state.isOpen },\n { def: config.isDisabledVariant, active: isDisabled }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.menuSlot]: state.isOpen ? makeMenu() : undefined,\n };\n\n const overrides: Overrides = {\n [config.root]: {\n wrapChildren: (children) => (\n <TriggeredOverlayContext.Provider value={triggerContext}>\n {children}\n </TriggeredOverlayContext.Provider>\n ),\n props: {\n ref: rootRef,\n },\n },\n [config.trigger]: {\n props: mergeProps(\n triggerProps,\n triggerFocusProps,\n getStyleProps(props),\n pick(props, \"title\"),\n {\n ref: triggerRef,\n autoFocus,\n disabled: !!isDisabled,\n // Make sure this button is not interpreted as submit\n type: \"button\",\n }\n ),\n },\n };\n\n const plumeState: MenuButtonState = React.useMemo(\n () => ({\n open: () => state.open(),\n close: () => state.close(),\n isOpen: () => state.isOpen,\n }),\n [state]\n );\n\n React.useImperativeHandle(\n outerRef,\n () => ({\n getRoot: () => rootRef.current,\n getTrigger: () => triggerRef.current,\n focus: () => triggerRef.current && triggerRef.current.focus(),\n blur: () => triggerRef.current && triggerRef.current.blur(),\n open: plumeState.open,\n close: plumeState.close,\n isOpen: plumeState.isOpen,\n }),\n [rootRef, triggerRef, plumeState]\n );\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n state: plumeState,\n };\n}\n"],"names":["useAriaMenuTrigger"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/plume/menu-button/menu-trigger.tsx","../../../../src/plume/menu-button/DropdownMenu.tsx","../../../../src/plume/menu-button/menu-button.tsx"],"sourcesContent":["import { Placement } from \"@react-types/overlays\";\nimport * as React from \"react\";\nimport { useMenuTrigger as useAriaMenuTrigger } from \"@react-aria/menu\";\nimport { usePress } from \"@react-aria/interactions\";\nimport { MenuTriggerState } from \"@react-stately/menu\";\nimport { mergeProps } from \"../../react-utils\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport { getPlumeType, PLUME_STRICT_MODE } from \"../plume-utils\";\nimport { TriggeredOverlayContextValue } from \"../triggered-overlay/context\";\n\n/**\n * A menu trigger hook that combines react-aria's useMenuTrigger, useAriaMenuTrigger,\n * useOverlayPosition, useOverlay, and usePress\n */\nexport function useMenuTrigger(\n opts: {\n isDisabled?: boolean;\n triggerRef: React.RefObject<HTMLElement>;\n placement?: Placement;\n menuMatchTriggerWidth?: boolean;\n menuWidth?: number;\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n },\n state: MenuTriggerState\n) {\n const {\n triggerRef,\n isDisabled,\n placement,\n menuMatchTriggerWidth,\n menuWidth,\n menu,\n } = opts;\n\n const { menuTriggerProps: triggerPressProps, menuProps } = useAriaMenuTrigger(\n {\n type: \"menu\",\n isDisabled,\n },\n state,\n triggerRef\n );\n\n const { pressProps: triggerProps } = usePress({\n ...triggerPressProps,\n isDisabled,\n });\n\n const makeMenu = () => {\n let realMenu = typeof menu === \"function\" ? menu() : menu;\n if (!realMenu) {\n return null;\n }\n if (getPlumeType(realMenu) !== \"menu\") {\n if (PLUME_STRICT_MODE) {\n throw new Error(`Must use an instance of the Menu component.`);\n }\n return null;\n }\n\n return React.cloneElement(realMenu, mergeProps(realMenu.props, menuProps));\n };\n\n const triggerContext: TriggeredOverlayContextValue = React.useMemo(\n () => ({\n triggerRef,\n state,\n autoFocus: state.focusStrategy ?? true,\n placement,\n overlayMatchTriggerWidth: menuMatchTriggerWidth,\n overlayMinTriggerWidth: true,\n overlayWidth: menuWidth,\n }),\n [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]\n );\n\n return {\n triggerProps,\n makeMenu,\n triggerContext,\n };\n}\n","import { Placement } from \"@react-types/overlays\";\nimport * as React from \"react\";\nimport { useMenuTriggerState } from \"@react-stately/menu\";\nimport { mergeProps } from \"../../react-utils\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { useMenuTrigger } from \"./menu-trigger\";\n\nexport interface DropdownMenuProps {\n /**\n * A ReactElement that takes in a `ref` as well as the usual mouse and\n * pointer events. The dropdown menu will be positioned relative to this\n * trigger.\n */\n children: React.ReactElement;\n\n /**\n * The menu to show; must be either a ReactElement of Menu type, or\n * a function that creates one if you prefer to delay creating it until\n * the menu has been triggered.\n */\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n\n /**\n * Where to place the menu relative to the trigger.\n */\n placement?: Placement;\n\n /**\n * Whether the menu is currently shown.\n */\n isOpen?: boolean;\n\n /**\n * Uncontrolled open state.\n */\n defaultOpen?: boolean;\n\n /**\n * Event handler fired when Menu's open state changes\n */\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DropdownMenu(props: DropdownMenuProps) {\n const {\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n placement,\n menu,\n } = props;\n\n const triggerRef = React.useRef<HTMLElement>(null);\n\n const state = useMenuTriggerState({\n isOpen,\n defaultOpen,\n onOpenChange,\n shouldFlip: true,\n });\n\n const { triggerProps, makeMenu, triggerContext } = useMenuTrigger(\n {\n triggerRef,\n placement,\n menu,\n },\n state\n );\n\n return (\n <TriggeredOverlayContext.Provider value={triggerContext}>\n {React.cloneElement(\n children,\n mergeProps(children.props, triggerProps, { ref: triggerRef })\n )}\n {state.isOpen && makeMenu()}\n </TriggeredOverlayContext.Provider>\n );\n}\n","import { Placement } from \"@react-types/overlays\";\nimport { DOMProps, FocusableProps } from \"@react-types/shared\";\nimport * as React from \"react\";\nimport { useFocusable } from \"@react-aria/focus\";\nimport { useMenuTriggerState } from \"@react-stately/menu\";\nimport { pick } from \"../../common\";\nimport { mergeProps } from \"../../react-utils\";\nimport { Overrides } from \"../../render/elements\";\nimport { useEnsureSSRProvider } from \"../../render/ssr\";\nimport { BaseMenuProps } from \"../menu/menu\";\nimport {\n AnyPlasmicClass,\n mergeVariantToggles,\n PlasmicClassArgs,\n PlasmicClassOverrides,\n PlasmicClassVariants,\n VariantDef,\n} from \"../plume-utils\";\nimport { getStyleProps, StyleProps } from \"../props-utils\";\nimport { TriggeredOverlayContext } from \"../triggered-overlay/context\";\nimport { useMenuTrigger } from \"./menu-trigger\";\n\nexport interface BaseMenuButtonProps\n extends DOMProps,\n FocusableProps,\n StyleProps,\n Pick<React.ComponentProps<\"button\">, \"title\"> {\n /**\n * The menu to show; can either be a Menu instance, or a function that returns a Menu\n * instance if you want to defer creating the instance till when it's opened.\n */\n menu:\n | React.ReactElement<BaseMenuProps>\n | (() => React.ReactElement<BaseMenuProps>);\n\n /**\n * Whether the button is disabled\n */\n isDisabled?: boolean;\n\n /**\n * Whether the menu is currently shown.\n */\n isOpen?: boolean;\n\n /**\n * Uncontrolled open state\n */\n defaultOpen?: boolean;\n\n /**\n * Event handler fired when Menu's open state changes\n */\n onOpenChange?: (isOpen: boolean) => void;\n\n /**\n * Desired placement location of the Select dropdown\n */\n placement?: Placement;\n /**\n * If true, menu width will always match the trigger button width.\n * If false, then menu width will have min-width matching the\n * trigger button width.\n */\n menuMatchTriggerWidth?: boolean;\n\n /**\n * If set, menu width will be exactly this width, overriding\n * menuMatchTriggerWidth.\n */\n menuWidth?: number;\n}\n\nexport interface MenuButtonConfig<C extends AnyPlasmicClass> {\n isOpenVariant: VariantDef<PlasmicClassVariants<C>>;\n isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;\n\n menuSlot: keyof PlasmicClassArgs<C>;\n\n root: keyof PlasmicClassOverrides<C>;\n trigger: keyof PlasmicClassOverrides<C>;\n}\n\ninterface MenuButtonState {\n open: () => void;\n close: () => void;\n isOpen: () => boolean;\n}\n\nexport type MenuButtonRef = React.Ref<MenuButtonRefValue>;\n\nexport interface MenuButtonRefValue extends MenuButtonState {\n getRoot: () => HTMLElement | null;\n getTrigger: () => HTMLElement | null;\n focus: () => void;\n blur: () => void;\n}\n\nexport function useMenuButton<\n P extends BaseMenuButtonProps,\n C extends AnyPlasmicClass\n>(\n plasmicClass: C,\n props: P,\n config: MenuButtonConfig<C>,\n outerRef: MenuButtonRef = null\n) {\n const {\n placement,\n isOpen,\n defaultOpen,\n onOpenChange,\n isDisabled,\n menu,\n autoFocus,\n menuMatchTriggerWidth,\n menuWidth,\n } = props;\n\n useEnsureSSRProvider();\n const rootRef = React.useRef<HTMLElement>(null);\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n\n const state = useMenuTriggerState({\n isOpen,\n defaultOpen,\n onOpenChange,\n shouldFlip: true,\n });\n\n const { triggerProps, makeMenu, triggerContext } = useMenuTrigger(\n {\n isDisabled,\n triggerRef,\n placement,\n menuMatchTriggerWidth,\n menuWidth,\n menu,\n },\n state\n );\n\n const { focusableProps: triggerFocusProps } = useFocusable(props, triggerRef);\n\n const variants = {\n ...pick(props, ...plasmicClass.internalVariantProps),\n ...mergeVariantToggles(\n { def: config.isOpenVariant, active: state.isOpen },\n { def: config.isDisabledVariant, active: isDisabled }\n ),\n };\n\n const args = {\n ...pick(props, ...plasmicClass.internalArgProps),\n [config.menuSlot]: state.isOpen ? makeMenu() : undefined,\n };\n\n const overrides: Overrides = {\n [config.root]: {\n wrapChildren: (children) => (\n <TriggeredOverlayContext.Provider value={triggerContext}>\n {children}\n </TriggeredOverlayContext.Provider>\n ),\n props: {\n ref: rootRef,\n },\n },\n [config.trigger]: {\n props: mergeProps(\n triggerProps,\n triggerFocusProps,\n getStyleProps(props),\n pick(props, \"title\"),\n {\n ref: triggerRef,\n autoFocus,\n disabled: !!isDisabled,\n // Make sure this button is not interpreted as submit\n type: \"button\",\n }\n ),\n },\n };\n\n const plumeState: MenuButtonState = React.useMemo(\n () => ({\n open: () => state.open(),\n close: () => state.close(),\n isOpen: () => state.isOpen,\n }),\n [state]\n );\n\n React.useImperativeHandle(\n outerRef,\n () => ({\n getRoot: () => rootRef.current,\n getTrigger: () => triggerRef.current,\n focus: () => triggerRef.current && triggerRef.current.focus(),\n blur: () => triggerRef.current && triggerRef.current.blur(),\n open: plumeState.open,\n close: plumeState.close,\n isOpen: plumeState.isOpen,\n }),\n [rootRef, triggerRef, plumeState]\n );\n\n return {\n plasmicProps: {\n variants: variants as PlasmicClassVariants<C>,\n args: args as PlasmicClassArgs<C>,\n overrides: overrides as PlasmicClassOverrides<C>,\n },\n state: plumeState,\n };\n}\n"],"names":["useAriaMenuTrigger"],"mappings":";;;;;;;;;;;;;;;;AAUA;;;;SAIgB,cAAc,CAC5B,IASC,EACD,KAAuB;IAGrB,IAAA,UAAU,GAMR,IAAI,WANI,EACV,UAAU,GAKR,IAAI,WALI,EACV,SAAS,GAIP,IAAI,UAJG,EACT,qBAAqB,GAGnB,IAAI,sBAHe,EACrB,SAAS,GAEP,IAAI,UAFG,EACT,IAAI,GACF,IAAI,KADF,CACG;IAEH,IAAA,KAAqDA,gBAAkB,CAC3E;QACE,IAAI,EAAE,MAAM;QACZ,UAAU,YAAA;KACX,EACD,KAAK,EACL,UAAU,CACX,EAPyB,iBAAiB,sBAAA,EAAE,SAAS,eAOrD,CAAC;IAEM,IAAY,YAAY,GAAK,QAAQ,uBACxC,iBAAiB,KACpB,UAAU,YAAA,IACV,WAH8B,CAG7B;IAEH,IAAM,QAAQ,GAAG;QACf,IAAI,QAAQ,GAAG,OAAO,IAAI,KAAK,UAAU,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;QAC1D,IAAI,CAAC,QAAQ,EAAE;YACb,OAAO,IAAI,CAAC;SACb;QACD,IAAI,YAAY,CAAC,QAAQ,CAAC,KAAK,MAAM,EAAE;YACd;gBACrB,MAAM,IAAI,KAAK,CAAC,6CAA6C,CAAC,CAAC;aAChE;SAEF;QAED,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC;KAC5E,CAAC;IAEF,IAAM,cAAc,GAAiC,KAAK,CAAC,OAAO,CAChE;;QAAM,QAAC;YACL,UAAU,YAAA;YACV,KAAK,OAAA;YACL,SAAS,EAAE,MAAA,KAAK,CAAC,aAAa,mCAAI,IAAI;YACtC,SAAS,WAAA;YACT,wBAAwB,EAAE,qBAAqB;YAC/C,sBAAsB,EAAE,IAAI;YAC5B,YAAY,EAAE,SAAS;SACxB,EAAC;KAAA,EACF,CAAC,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,qBAAqB,EAAE,SAAS,CAAC,CACjE,CAAC;IAEF,OAAO;QACL,YAAY,cAAA;QACZ,QAAQ,UAAA;QACR,cAAc,gBAAA;KACf,CAAC;AACJ;;SCrCgB,YAAY,CAAC,KAAwB;IAEjD,IAAA,MAAM,GAMJ,KAAK,OAND,EACN,WAAW,GAKT,KAAK,YALI,EACX,YAAY,GAIV,KAAK,aAJK,EACZ,QAAQ,GAGN,KAAK,SAHC,EACR,SAAS,GAEP,KAAK,UAFE,EACT,IAAI,GACF,KAAK,KADH,CACI;IAEV,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;IAEnD,IAAM,KAAK,GAAG,mBAAmB,CAAC;QAChC,MAAM,QAAA;QACN,WAAW,aAAA;QACX,YAAY,cAAA;QACZ,UAAU,EAAE,IAAI;KACjB,CAAC,CAAC;IAEG,IAAA,KAA6C,cAAc,CAC/D;QACE,UAAU,YAAA;QACV,SAAS,WAAA;QACT,IAAI,MAAA;KACL,EACD,KAAK,CACN,EAPO,YAAY,kBAAA,EAAE,QAAQ,cAAA,EAAE,cAAc,oBAO7C,CAAC;IAEF,QACE,oBAAC,uBAAuB,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc;QACpD,KAAK,CAAC,YAAY,CACjB,QAAQ,EACR,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAC9D;QACA,KAAK,CAAC,MAAM,IAAI,QAAQ,EAAE,CACM,EACnC;AACJ;;SCegB,aAAa,CAI3B,YAAe,EACf,KAAQ,EACR,MAA2B,EAC3B,QAA8B;;IAA9B,yBAAA,EAAA,eAA8B;IAG5B,IAAA,SAAS,GASP,KAAK,UATE,EACT,MAAM,GAQJ,KAAK,OARD,EACN,WAAW,GAOT,KAAK,YAPI,EACX,YAAY,GAMV,KAAK,aANK,EACZ,UAAU,GAKR,KAAK,WALG,EACV,IAAI,GAIF,KAAK,KAJH,EACJ,SAAS,GAGP,KAAK,UAHE,EACT,qBAAqB,GAEnB,KAAK,sBAFc,EACrB,SAAS,GACP,KAAK,UADE,CACD;IAEV,oBAAoB,EAAE,CAAC;IACvB,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;IAChD,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEzD,IAAM,KAAK,GAAG,mBAAmB,CAAC;QAChC,MAAM,QAAA;QACN,WAAW,aAAA;QACX,YAAY,cAAA;QACZ,UAAU,EAAE,IAAI;KACjB,CAAC,CAAC;IAEG,IAAA,KAA6C,cAAc,CAC/D;QACE,UAAU,YAAA;QACV,UAAU,YAAA;QACV,SAAS,WAAA;QACT,qBAAqB,uBAAA;QACrB,SAAS,WAAA;QACT,IAAI,MAAA;KACL,EACD,KAAK,CACN,EAVO,YAAY,kBAAA,EAAE,QAAQ,cAAA,EAAE,cAAc,oBAU7C,CAAC;IAEM,IAAgB,iBAAiB,GAAK,YAAY,CAAC,KAAK,EAAE,UAAU,CAAC,eAApC,CAAqC;IAE9E,IAAM,QAAQ,yBACT,IAAI,8BAAC,KAAK,UAAK,YAAY,CAAC,oBAAoB,aAChD,mBAAmB,CACpB,EAAE,GAAG,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,EACnD,EAAE,GAAG,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,EAAE,UAAU,EAAE,CACtD,CACF,CAAC;IAEF,IAAM,IAAI,yBACL,IAAI,8BAAC,KAAK,UAAK,YAAY,CAAC,gBAAgB,0BAC9C,MAAM,CAAC,QAAQ,IAAG,KAAK,CAAC,MAAM,GAAG,QAAQ,EAAE,GAAG,SAAS,MACzD,CAAC;IAEF,IAAM,SAAS;QACb,GAAC,MAAM,CAAC,IAAI,IAAG;YACb,YAAY,EAAE,UAAC,QAAQ,IAAK,QAC1B,oBAAC,uBAAuB,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc,IACpD,QAAQ,CACwB,IACpC;YACD,KAAK,EAAE;gBACL,GAAG,EAAE,OAAO;aACb;SACF;QACD,GAAC,MAAM,CAAC,OAAO,IAAG;YAChB,KAAK,EAAE,UAAU,CACf,YAAY,EACZ,iBAAiB,EACjB,aAAa,CAAC,KAAK,CAAC,EACpB,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,EACpB;gBACE,GAAG,EAAE,UAAU;gBACf,SAAS,WAAA;gBACT,QAAQ,EAAE,CAAC,CAAC,UAAU;;gBAEtB,IAAI,EAAE,QAAQ;aACf,CACF;SACF;WACF,CAAC;IAEF,IAAM,UAAU,GAAoB,KAAK,CAAC,OAAO,CAC/C,cAAM,QAAC;QACL,IAAI,EAAE,cAAM,OAAA,KAAK,CAAC,IAAI,EAAE,GAAA;QACxB,KAAK,EAAE,cAAM,OAAA,KAAK,CAAC,KAAK,EAAE,GAAA;QAC1B,MAAM,EAAE,cAAM,OAAA,KAAK,CAAC,MAAM,GAAA;KAC3B,IAAC,EACF,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,KAAK,CAAC,mBAAmB,CACvB,QAAQ,EACR,cAAM,QAAC;QACL,OAAO,EAAE,cAAM,OAAA,OAAO,CAAC,OAAO,GAAA;QAC9B,UAAU,EAAE,cAAM,OAAA,UAAU,CAAC,OAAO,GAAA;QACpC,KAAK,EAAE,cAAM,OAAA,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,GAAA;QAC7D,IAAI,EAAE,cAAM,OAAA,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,CAAC,IAAI,EAAE,GAAA;QAC3D,IAAI,EAAE,UAAU,CAAC,IAAI;QACrB,KAAK,EAAE,UAAU,CAAC,KAAK;QACvB,MAAM,EAAE,UAAU,CAAC,MAAM;KAC1B,IAAC,EACF,CAAC,OAAO,EAAE,UAAU,EAAE,UAAU,CAAC,CAClC,CAAC;IAEF,OAAO;QACL,YAAY,EAAE;YACZ,QAAQ,EAAE,QAAmC;YAC7C,IAAI,EAAE,IAA2B;YACjC,SAAS,EAAE,SAAqC;SACjD;QACD,KAAK,EAAE,UAAU;KAClB,CAAC;AACJ;;;;"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { a as __assign, p as pick, b as __spreadArray, c as __read, _ as __rest } from '../../common-
|
|
1
|
+
import { a as __assign, p as pick, b as __spreadArray, c as __read, _ as __rest } from '../../common-9ebe374e.js';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { useSelect as useSelect$1, HiddenSelect } from '@react-aria/select';
|
|
4
4
|
import { useListBox, useOption, useListBoxSection } from '@react-aria/listbox';
|
|
5
5
|
import { usePress } from '@react-aria/interactions';
|
|
6
6
|
import { useSelectState } from '@react-stately/select';
|
|
7
|
-
import { m as mergeProps, d as mergeRefs } from '../../react-utils-
|
|
8
|
-
import { a as useEnsureSSRProvider } from '../../ssr-
|
|
9
|
-
import { g as getChildProp, r as renderCollectionNode, u as useDerivedItemsFromChildren, a as renderAsCollectionChild } from '../../collection-utils-
|
|
10
|
-
import { m as mergeVariantToggles, n as noOutline } from '../../plume-utils-
|
|
11
|
-
import { g as getStyleProps } from '../../props-utils-
|
|
7
|
+
import { m as mergeProps, d as mergeRefs } from '../../react-utils-7bc53870.js';
|
|
8
|
+
import { a as useEnsureSSRProvider } from '../../ssr-b16a1854.js';
|
|
9
|
+
import { g as getChildProp, r as renderCollectionNode, u as useDerivedItemsFromChildren, a as renderAsCollectionChild } from '../../collection-utils-43f97262.js';
|
|
10
|
+
import { m as mergeVariantToggles, n as noOutline } from '../../plume-utils-d9811bf3.js';
|
|
11
|
+
import { g as getStyleProps } from '../../props-utils-228208e6.js';
|
|
12
12
|
import { T as TriggeredOverlayContext } from '../../context-034b8d25.js';
|
|
13
13
|
import { useSeparator } from '@react-aria/separator';
|
|
14
14
|
import 'classnames';
|
|
@@ -21,7 +21,7 @@ var SelectContext = React.createContext(undefined);
|
|
|
21
21
|
|
|
22
22
|
var COLLECTION_OPTS = {
|
|
23
23
|
itemPlumeType: "select-option",
|
|
24
|
-
sectionPlumeType: "select-option-group"
|
|
24
|
+
sectionPlumeType: "select-option-group"
|
|
25
25
|
};
|
|
26
26
|
/**
|
|
27
27
|
* Converts props in our BaseSelectProps into props that react-aria's
|
|
@@ -73,9 +73,7 @@ function useAriaSelectProps(props) {
|
|
|
73
73
|
}
|
|
74
74
|
}, [onChange]);
|
|
75
75
|
return {
|
|
76
|
-
ariaProps: __assign(__assign(__assign({}, rest), { children: collectionChildRenderer, onSelectionChange: onSelectionChange,
|
|
77
|
-
items: items,
|
|
78
|
-
disabledKeys: disabledKeys, defaultSelectedKey: defaultValue }), ("value" in props && { selectedKey: value !== null && value !== void 0 ? value : null })),
|
|
76
|
+
ariaProps: __assign(__assign(__assign({}, rest), { children: collectionChildRenderer, onSelectionChange: onSelectionChange, items: items, disabledKeys: disabledKeys, defaultSelectedKey: defaultValue }), ("value" in props && { selectedKey: value !== null && value !== void 0 ? value : null }))
|
|
79
77
|
};
|
|
80
78
|
}
|
|
81
79
|
function useSelect(plasmicClass, props, config, ref) {
|
|
@@ -93,23 +91,23 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
93
91
|
var triggerContent = state.selectedItem
|
|
94
92
|
? selectedContent !== null && selectedContent !== void 0 ? selectedContent : getChildProp(state.selectedItem.value, "children")
|
|
95
93
|
: null;
|
|
96
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps)))), mergeVariantToggles({ def: config.isOpenVariant, active: state.isOpen }, { def: config.placeholderVariant, active: !state.selectedItem }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
94
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.isOpenVariant, active: state.isOpen }, { def: config.placeholderVariant, active: !state.selectedItem }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
97
95
|
var triggerContext = React.useMemo(function () { return ({
|
|
98
96
|
triggerRef: triggerRef,
|
|
99
97
|
state: state,
|
|
100
98
|
placement: placement,
|
|
101
99
|
overlayMatchTriggerWidth: menuMatchTriggerWidth,
|
|
102
100
|
overlayMinTriggerWidth: true,
|
|
103
|
-
overlayWidth: menuWidth
|
|
101
|
+
overlayWidth: menuWidth
|
|
104
102
|
}); }, [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]);
|
|
105
103
|
var overrides = (_a = {},
|
|
106
104
|
_a[config.root] = {
|
|
107
105
|
props: mergeProps(getStyleProps(props), {
|
|
108
|
-
ref: rootRef
|
|
106
|
+
ref: rootRef
|
|
109
107
|
}),
|
|
110
108
|
wrapChildren: function (children) { return (React.createElement(React.Fragment, null,
|
|
111
109
|
React.createElement(HiddenSelect, { state: state, triggerRef: triggerRef, name: name, isDisabled: isDisabled }),
|
|
112
|
-
children)); }
|
|
110
|
+
children)); }
|
|
113
111
|
},
|
|
114
112
|
_a[config.trigger] = {
|
|
115
113
|
props: mergeProps(triggerProps, {
|
|
@@ -117,25 +115,25 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
117
115
|
autoFocus: autoFocus,
|
|
118
116
|
disabled: !!isDisabled,
|
|
119
117
|
// Don't trigger form submission!
|
|
120
|
-
type: "button"
|
|
121
|
-
})
|
|
118
|
+
type: "button"
|
|
119
|
+
})
|
|
122
120
|
},
|
|
123
121
|
_a[config.overlay] = {
|
|
124
|
-
wrap: function (content) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, content)); }
|
|
122
|
+
wrap: function (content) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, content)); }
|
|
125
123
|
},
|
|
126
124
|
_a[config.optionsContainer] = {
|
|
127
|
-
wrap: function (content) { return (React.createElement(ListBoxWrapper, { state: state, menuProps: menuProps }, content)); }
|
|
125
|
+
wrap: function (content) { return (React.createElement(ListBoxWrapper, { state: state, menuProps: menuProps }, content)); }
|
|
128
126
|
},
|
|
129
127
|
_a);
|
|
130
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps)))), (_b = {}, _b[config.triggerContentSlot] = triggerContent, _b[config.placeholderSlot] = placeholder, _b[config.optionsSlot] = (React.createElement(SelectContext.Provider, { value: state }, Array.from(state.collection).map(function (node) { return renderCollectionNode(node); }))), _b));
|
|
128
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_b = {}, _b[config.triggerContentSlot] = triggerContent, _b[config.placeholderSlot] = placeholder, _b[config.optionsSlot] = (React.createElement(SelectContext.Provider, { value: state }, Array.from(state.collection).map(function (node) { return renderCollectionNode(node); }))), _b));
|
|
131
129
|
var plumeState = React.useMemo(function () { return ({
|
|
132
130
|
open: function () { return state.open(); },
|
|
133
131
|
close: function () { return state.close(); },
|
|
134
132
|
isOpen: function () { return state.isOpen; },
|
|
135
133
|
getSelectedValue: function () {
|
|
136
|
-
return state.selectedKey ? ""
|
|
134
|
+
return state.selectedKey ? "".concat(state.selectedKey) : null;
|
|
137
135
|
},
|
|
138
|
-
setSelectedValue: function (key) { return state.setSelectedKey(key); }
|
|
136
|
+
setSelectedValue: function (key) { return state.setSelectedKey(key); }
|
|
139
137
|
}); }, [state]);
|
|
140
138
|
React.useImperativeHandle(ref, function () { return ({
|
|
141
139
|
getRoot: function () { return rootRef.current; },
|
|
@@ -146,15 +144,15 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
146
144
|
close: function () { return plumeState.close(); },
|
|
147
145
|
isOpen: function () { return plumeState.isOpen(); },
|
|
148
146
|
getSelectedValue: function () { return plumeState.getSelectedValue(); },
|
|
149
|
-
setSelectedValue: function (key) { return plumeState.setSelectedValue(key); }
|
|
147
|
+
setSelectedValue: function (key) { return plumeState.setSelectedValue(key); }
|
|
150
148
|
}); }, [rootRef, triggerRef, plumeState]);
|
|
151
149
|
return {
|
|
152
150
|
plasmicProps: {
|
|
153
151
|
variants: variants,
|
|
154
152
|
args: args,
|
|
155
|
-
overrides: overrides
|
|
153
|
+
overrides: overrides
|
|
156
154
|
},
|
|
157
|
-
state: plumeState
|
|
155
|
+
state: plumeState
|
|
158
156
|
};
|
|
159
157
|
}
|
|
160
158
|
function ListBoxWrapper(props) {
|
|
@@ -192,27 +190,27 @@ function useSelectOption(plasmicClass, props, config, outerRef) {
|
|
|
192
190
|
key: node.key,
|
|
193
191
|
shouldSelectOnPressUp: true,
|
|
194
192
|
shouldFocusOnHover: true,
|
|
195
|
-
isVirtualized: false
|
|
193
|
+
isVirtualized: false
|
|
196
194
|
}, state, rootRef), optionProps = _c.optionProps, labelProps = _c.labelProps;
|
|
197
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps)))), mergeVariantToggles({ def: config.isSelectedVariant, active: isSelected }, { def: config.isDisabledVariant, active: isDisabled }, { def: config.isHighlightedVariant, active: isHighlighted }));
|
|
198
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps)))), (_a = {}, _a[config.labelSlot] = children, _a));
|
|
195
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.isSelectedVariant, active: isSelected }, { def: config.isDisabledVariant, active: isDisabled }, { def: config.isHighlightedVariant, active: isHighlighted }));
|
|
196
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.labelSlot] = children, _a));
|
|
199
197
|
var overrides = (_b = {},
|
|
200
198
|
_b[config.root] = {
|
|
201
199
|
props: mergeProps(optionProps, getStyleProps(props), {
|
|
202
200
|
ref: onRef,
|
|
203
|
-
style: noOutline()
|
|
204
|
-
})
|
|
201
|
+
style: noOutline()
|
|
202
|
+
})
|
|
205
203
|
},
|
|
206
204
|
_b[config.labelContainer] = {
|
|
207
|
-
props: labelProps
|
|
205
|
+
props: labelProps
|
|
208
206
|
},
|
|
209
207
|
_b);
|
|
210
208
|
return {
|
|
211
209
|
plasmicProps: {
|
|
212
210
|
variants: variants,
|
|
213
211
|
args: args,
|
|
214
|
-
overrides: overrides
|
|
215
|
-
}
|
|
212
|
+
overrides: overrides
|
|
213
|
+
}
|
|
216
214
|
};
|
|
217
215
|
}
|
|
218
216
|
|
|
@@ -229,38 +227,38 @@ function useSelectOptionGroup(plasmicClass, props, config) {
|
|
|
229
227
|
}
|
|
230
228
|
var _c = useListBoxSection({
|
|
231
229
|
heading: props.title,
|
|
232
|
-
"aria-label": props["aria-label"]
|
|
230
|
+
"aria-label": props["aria-label"]
|
|
233
231
|
}), headingProps = _c.headingProps, groupProps = _c.groupProps;
|
|
234
232
|
var separatorProps = useSeparator({
|
|
235
|
-
elementType: "li"
|
|
233
|
+
elementType: "li"
|
|
236
234
|
}).separatorProps;
|
|
237
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps)))), mergeVariantToggles({ def: config.noTitleVariant, active: !props.title }, {
|
|
235
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.noTitleVariant, active: !props.title }, {
|
|
238
236
|
def: config.isFirstVariant,
|
|
239
|
-
active: state.collection.getFirstKey() === node.key
|
|
237
|
+
active: state.collection.getFirstKey() === node.key
|
|
240
238
|
}));
|
|
241
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps)))), (_a = {}, _a[config.titleSlot] = props.title, _a[config.optionsSlot] = Array.from(node.childNodes).map(function (childNode) {
|
|
239
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.titleSlot] = props.title, _a[config.optionsSlot] = Array.from(node.childNodes).map(function (childNode) {
|
|
242
240
|
return renderCollectionNode(childNode);
|
|
243
241
|
}), _a));
|
|
244
242
|
var overrides = (_b = {},
|
|
245
243
|
_b[config.root] = {
|
|
246
|
-
props: getStyleProps(props)
|
|
244
|
+
props: getStyleProps(props)
|
|
247
245
|
},
|
|
248
246
|
_b[config.separator] = {
|
|
249
|
-
props: __assign({}, separatorProps)
|
|
247
|
+
props: __assign({}, separatorProps)
|
|
250
248
|
},
|
|
251
249
|
_b[config.titleContainer] = __assign({ props: __assign({ role: "presentation" }, headingProps) }, (!props.title && {
|
|
252
|
-
render: function () { return null; }
|
|
250
|
+
render: function () { return null; }
|
|
253
251
|
})),
|
|
254
252
|
_b[config.optionsContainer] = {
|
|
255
|
-
props: __assign({}, groupProps)
|
|
253
|
+
props: __assign({}, groupProps)
|
|
256
254
|
},
|
|
257
255
|
_b);
|
|
258
256
|
return {
|
|
259
257
|
plasmicProps: {
|
|
260
258
|
variants: variants,
|
|
261
259
|
args: args,
|
|
262
|
-
overrides: overrides
|
|
263
|
-
}
|
|
260
|
+
overrides: overrides
|
|
261
|
+
}
|
|
264
262
|
};
|
|
265
263
|
}
|
|
266
264
|
|