@plasmicapp/react-web 0.2.110 → 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 +65 -28
- package/dist/common.d.ts +3 -3
- package/dist/index-common.d.ts +4 -3
- package/dist/index.d.ts +1 -1
- package/dist/react-web.cjs.development.js +415 -370
- 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 +401 -370
- package/dist/react-web.esm.js.map +1 -1
- package/dist/render/elements.d.ts +5 -0
- package/dist/render/ssr.d.ts +1 -0
- package/dist/states/helpers.d.ts +5 -0
- package/dist/states/index.d.ts +1 -1
- package/dist/states/valtio.d.ts +16 -0
- package/dist/stories/UseDollarState.stories.d.ts +11 -0
- package/package.json +8 -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 +4 -3
- package/skinny/dist/index.d.ts +1 -1
- package/skinny/dist/index.js +53 -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 +18 -17
- package/skinny/dist/plume/checkbox/index.js.map +1 -1
- package/skinny/dist/plume/menu/index.js +39 -39
- package/skinny/dist/plume/menu/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/index.js +23 -22
- package/skinny/dist/plume/menu-button/index.js.map +1 -1
- package/skinny/dist/plume/select/index.js +42 -43
- package/skinny/dist/plume/select/index.js.map +1 -1
- package/skinny/dist/plume/switch/index.js +17 -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-623b91cc.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-b2ad4997.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/elements.d.ts +5 -0
- package/skinny/dist/render/ssr.d.ts +1 -0
- package/skinny/dist/{ssr-b1615b80.js → ssr-b16a1854.js} +16 -10
- package/skinny/dist/ssr-b16a1854.js.map +1 -0
- package/skinny/dist/states/helpers.d.ts +5 -0
- package/skinny/dist/states/index.d.ts +1 -1
- package/skinny/dist/states/valtio.d.ts +16 -0
- package/skinny/dist/stories/UseDollarState.stories.d.ts +11 -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-3487dd27.js +0 -238
- package/skinny/dist/collection-utils-3487dd27.js.map +0 -1
- package/skinny/dist/collection-utils-57c273dc.js.map +0 -1
- package/skinny/dist/common-182a0b0c.js.map +0 -1
- package/skinny/dist/plume-utils-27cd384f.js +0 -35
- package/skinny/dist/plume-utils-623b91cc.js.map +0 -1
- package/skinny/dist/props-utils-7c02c0a8.js +0 -8
- package/skinny/dist/props-utils-b2ad4997.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/render/PlasmicHead.d.ts +0 -35
- package/skinny/dist/ssr-14264281.js +0 -158
- package/skinny/dist/ssr-14264281.js.map +0 -1
- package/skinny/dist/ssr-5141fc77.js +0 -158
- package/skinny/dist/ssr-5141fc77.js.map +0 -1
- package/skinny/dist/ssr-579df58f.js +0 -158
- package/skinny/dist/ssr-579df58f.js.map +0 -1
- package/skinny/dist/ssr-84e27ffb.js +0 -110
- package/skinny/dist/ssr-84e27ffb.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-b1615b80.js.map +0 -1
- package/skinny/dist/ssr-d2fd94f2.js +0 -31
- package/skinny/dist/ssr-d2fd94f2.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/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,15 +1,16 @@
|
|
|
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
|
+
import '@plasmicapp/data-sources-context';
|
|
13
14
|
import '@react-aria/ssr';
|
|
14
15
|
import '../../render/PlasmicHead/index.js';
|
|
15
16
|
|
|
@@ -21,7 +22,7 @@ function useMenuTrigger(opts, state) {
|
|
|
21
22
|
var triggerRef = opts.triggerRef, isDisabled = opts.isDisabled, placement = opts.placement, menuMatchTriggerWidth = opts.menuMatchTriggerWidth, menuWidth = opts.menuWidth, menu = opts.menu;
|
|
22
23
|
var _a = useMenuTrigger$1({
|
|
23
24
|
type: "menu",
|
|
24
|
-
isDisabled: isDisabled
|
|
25
|
+
isDisabled: isDisabled
|
|
25
26
|
}, state, triggerRef), triggerPressProps = _a.menuTriggerProps, menuProps = _a.menuProps;
|
|
26
27
|
var triggerProps = usePress(__assign(__assign({}, triggerPressProps), { isDisabled: isDisabled })).pressProps;
|
|
27
28
|
var makeMenu = function () {
|
|
@@ -45,13 +46,13 @@ function useMenuTrigger(opts, state) {
|
|
|
45
46
|
placement: placement,
|
|
46
47
|
overlayMatchTriggerWidth: menuMatchTriggerWidth,
|
|
47
48
|
overlayMinTriggerWidth: true,
|
|
48
|
-
overlayWidth: menuWidth
|
|
49
|
+
overlayWidth: menuWidth
|
|
49
50
|
});
|
|
50
51
|
}, [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]);
|
|
51
52
|
return {
|
|
52
53
|
triggerProps: triggerProps,
|
|
53
54
|
makeMenu: makeMenu,
|
|
54
|
-
triggerContext: triggerContext
|
|
55
|
+
triggerContext: triggerContext
|
|
55
56
|
};
|
|
56
57
|
}
|
|
57
58
|
|
|
@@ -62,12 +63,12 @@ function DropdownMenu(props) {
|
|
|
62
63
|
isOpen: isOpen,
|
|
63
64
|
defaultOpen: defaultOpen,
|
|
64
65
|
onOpenChange: onOpenChange,
|
|
65
|
-
shouldFlip: true
|
|
66
|
+
shouldFlip: true
|
|
66
67
|
});
|
|
67
68
|
var _a = useMenuTrigger({
|
|
68
69
|
triggerRef: triggerRef,
|
|
69
70
|
placement: placement,
|
|
70
|
-
menu: menu
|
|
71
|
+
menu: menu
|
|
71
72
|
}, state), triggerProps = _a.triggerProps, makeMenu = _a.makeMenu, triggerContext = _a.triggerContext;
|
|
72
73
|
return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext },
|
|
73
74
|
React.cloneElement(children, mergeProps(children.props, triggerProps, { ref: triggerRef })),
|
|
@@ -85,7 +86,7 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
85
86
|
isOpen: isOpen,
|
|
86
87
|
defaultOpen: defaultOpen,
|
|
87
88
|
onOpenChange: onOpenChange,
|
|
88
|
-
shouldFlip: true
|
|
89
|
+
shouldFlip: true
|
|
89
90
|
});
|
|
90
91
|
var _c = useMenuTrigger({
|
|
91
92
|
isDisabled: isDisabled,
|
|
@@ -93,17 +94,17 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
93
94
|
placement: placement,
|
|
94
95
|
menuMatchTriggerWidth: menuMatchTriggerWidth,
|
|
95
96
|
menuWidth: menuWidth,
|
|
96
|
-
menu: menu
|
|
97
|
+
menu: menu
|
|
97
98
|
}, state), triggerProps = _c.triggerProps, makeMenu = _c.makeMenu, triggerContext = _c.triggerContext;
|
|
98
99
|
var triggerFocusProps = useFocusable(props, triggerRef).focusableProps;
|
|
99
|
-
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 }));
|
|
100
|
-
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));
|
|
101
102
|
var overrides = (_b = {},
|
|
102
103
|
_b[config.root] = {
|
|
103
104
|
wrapChildren: function (children) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, children)); },
|
|
104
105
|
props: {
|
|
105
|
-
ref: rootRef
|
|
106
|
-
}
|
|
106
|
+
ref: rootRef
|
|
107
|
+
}
|
|
107
108
|
},
|
|
108
109
|
_b[config.trigger] = {
|
|
109
110
|
props: mergeProps(triggerProps, triggerFocusProps, getStyleProps(props), pick(props, "title"), {
|
|
@@ -111,14 +112,14 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
111
112
|
autoFocus: autoFocus,
|
|
112
113
|
disabled: !!isDisabled,
|
|
113
114
|
// Make sure this button is not interpreted as submit
|
|
114
|
-
type: "button"
|
|
115
|
-
})
|
|
115
|
+
type: "button"
|
|
116
|
+
})
|
|
116
117
|
},
|
|
117
118
|
_b);
|
|
118
119
|
var plumeState = React.useMemo(function () { return ({
|
|
119
120
|
open: function () { return state.open(); },
|
|
120
121
|
close: function () { return state.close(); },
|
|
121
|
-
isOpen: function () { return state.isOpen; }
|
|
122
|
+
isOpen: function () { return state.isOpen; }
|
|
122
123
|
}); }, [state]);
|
|
123
124
|
React.useImperativeHandle(outerRef, function () { return ({
|
|
124
125
|
getRoot: function () { return rootRef.current; },
|
|
@@ -127,15 +128,15 @@ function useMenuButton(plasmicClass, props, config, outerRef) {
|
|
|
127
128
|
blur: function () { return triggerRef.current && triggerRef.current.blur(); },
|
|
128
129
|
open: plumeState.open,
|
|
129
130
|
close: plumeState.close,
|
|
130
|
-
isOpen: plumeState.isOpen
|
|
131
|
+
isOpen: plumeState.isOpen
|
|
131
132
|
}); }, [rootRef, triggerRef, plumeState]);
|
|
132
133
|
return {
|
|
133
134
|
plasmicProps: {
|
|
134
135
|
variants: variants,
|
|
135
136
|
args: args,
|
|
136
|
-
overrides: overrides
|
|
137
|
+
overrides: overrides
|
|
137
138
|
},
|
|
138
|
-
state: plumeState
|
|
139
|
+
state: plumeState
|
|
139
140
|
};
|
|
140
141
|
}
|
|
141
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":"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"}
|
|
@@ -1,17 +1,18 @@
|
|
|
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';
|
|
15
|
+
import '@plasmicapp/data-sources-context';
|
|
15
16
|
import '@react-aria/ssr';
|
|
16
17
|
import '../../render/PlasmicHead/index.js';
|
|
17
18
|
import '@react-stately/collections';
|
|
@@ -20,7 +21,7 @@ var SelectContext = React.createContext(undefined);
|
|
|
20
21
|
|
|
21
22
|
var COLLECTION_OPTS = {
|
|
22
23
|
itemPlumeType: "select-option",
|
|
23
|
-
sectionPlumeType: "select-option-group"
|
|
24
|
+
sectionPlumeType: "select-option-group"
|
|
24
25
|
};
|
|
25
26
|
/**
|
|
26
27
|
* Converts props in our BaseSelectProps into props that react-aria's
|
|
@@ -72,9 +73,7 @@ function useAriaSelectProps(props) {
|
|
|
72
73
|
}
|
|
73
74
|
}, [onChange]);
|
|
74
75
|
return {
|
|
75
|
-
ariaProps: __assign(__assign(__assign({}, rest), { children: collectionChildRenderer, onSelectionChange: onSelectionChange,
|
|
76
|
-
items: items,
|
|
77
|
-
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 }))
|
|
78
77
|
};
|
|
79
78
|
}
|
|
80
79
|
function useSelect(plasmicClass, props, config, ref) {
|
|
@@ -92,23 +91,23 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
92
91
|
var triggerContent = state.selectedItem
|
|
93
92
|
? selectedContent !== null && selectedContent !== void 0 ? selectedContent : getChildProp(state.selectedItem.value, "children")
|
|
94
93
|
: null;
|
|
95
|
-
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 }));
|
|
96
95
|
var triggerContext = React.useMemo(function () { return ({
|
|
97
96
|
triggerRef: triggerRef,
|
|
98
97
|
state: state,
|
|
99
98
|
placement: placement,
|
|
100
99
|
overlayMatchTriggerWidth: menuMatchTriggerWidth,
|
|
101
100
|
overlayMinTriggerWidth: true,
|
|
102
|
-
overlayWidth: menuWidth
|
|
101
|
+
overlayWidth: menuWidth
|
|
103
102
|
}); }, [triggerRef, state, placement, menuMatchTriggerWidth, menuWidth]);
|
|
104
103
|
var overrides = (_a = {},
|
|
105
104
|
_a[config.root] = {
|
|
106
105
|
props: mergeProps(getStyleProps(props), {
|
|
107
|
-
ref: rootRef
|
|
106
|
+
ref: rootRef
|
|
108
107
|
}),
|
|
109
108
|
wrapChildren: function (children) { return (React.createElement(React.Fragment, null,
|
|
110
109
|
React.createElement(HiddenSelect, { state: state, triggerRef: triggerRef, name: name, isDisabled: isDisabled }),
|
|
111
|
-
children)); }
|
|
110
|
+
children)); }
|
|
112
111
|
},
|
|
113
112
|
_a[config.trigger] = {
|
|
114
113
|
props: mergeProps(triggerProps, {
|
|
@@ -116,25 +115,25 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
116
115
|
autoFocus: autoFocus,
|
|
117
116
|
disabled: !!isDisabled,
|
|
118
117
|
// Don't trigger form submission!
|
|
119
|
-
type: "button"
|
|
120
|
-
})
|
|
118
|
+
type: "button"
|
|
119
|
+
})
|
|
121
120
|
},
|
|
122
121
|
_a[config.overlay] = {
|
|
123
|
-
wrap: function (content) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, content)); }
|
|
122
|
+
wrap: function (content) { return (React.createElement(TriggeredOverlayContext.Provider, { value: triggerContext }, content)); }
|
|
124
123
|
},
|
|
125
124
|
_a[config.optionsContainer] = {
|
|
126
|
-
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)); }
|
|
127
126
|
},
|
|
128
127
|
_a);
|
|
129
|
-
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));
|
|
130
129
|
var plumeState = React.useMemo(function () { return ({
|
|
131
130
|
open: function () { return state.open(); },
|
|
132
131
|
close: function () { return state.close(); },
|
|
133
132
|
isOpen: function () { return state.isOpen; },
|
|
134
133
|
getSelectedValue: function () {
|
|
135
|
-
return state.selectedKey ? ""
|
|
134
|
+
return state.selectedKey ? "".concat(state.selectedKey) : null;
|
|
136
135
|
},
|
|
137
|
-
setSelectedValue: function (key) { return state.setSelectedKey(key); }
|
|
136
|
+
setSelectedValue: function (key) { return state.setSelectedKey(key); }
|
|
138
137
|
}); }, [state]);
|
|
139
138
|
React.useImperativeHandle(ref, function () { return ({
|
|
140
139
|
getRoot: function () { return rootRef.current; },
|
|
@@ -145,15 +144,15 @@ function useSelect(plasmicClass, props, config, ref) {
|
|
|
145
144
|
close: function () { return plumeState.close(); },
|
|
146
145
|
isOpen: function () { return plumeState.isOpen(); },
|
|
147
146
|
getSelectedValue: function () { return plumeState.getSelectedValue(); },
|
|
148
|
-
setSelectedValue: function (key) { return plumeState.setSelectedValue(key); }
|
|
147
|
+
setSelectedValue: function (key) { return plumeState.setSelectedValue(key); }
|
|
149
148
|
}); }, [rootRef, triggerRef, plumeState]);
|
|
150
149
|
return {
|
|
151
150
|
plasmicProps: {
|
|
152
151
|
variants: variants,
|
|
153
152
|
args: args,
|
|
154
|
-
overrides: overrides
|
|
153
|
+
overrides: overrides
|
|
155
154
|
},
|
|
156
|
-
state: plumeState
|
|
155
|
+
state: plumeState
|
|
157
156
|
};
|
|
158
157
|
}
|
|
159
158
|
function ListBoxWrapper(props) {
|
|
@@ -191,27 +190,27 @@ function useSelectOption(plasmicClass, props, config, outerRef) {
|
|
|
191
190
|
key: node.key,
|
|
192
191
|
shouldSelectOnPressUp: true,
|
|
193
192
|
shouldFocusOnHover: true,
|
|
194
|
-
isVirtualized: false
|
|
193
|
+
isVirtualized: false
|
|
195
194
|
}, state, rootRef), optionProps = _c.optionProps, labelProps = _c.labelProps;
|
|
196
|
-
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 }));
|
|
197
|
-
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));
|
|
198
197
|
var overrides = (_b = {},
|
|
199
198
|
_b[config.root] = {
|
|
200
199
|
props: mergeProps(optionProps, getStyleProps(props), {
|
|
201
200
|
ref: onRef,
|
|
202
|
-
style: noOutline()
|
|
203
|
-
})
|
|
201
|
+
style: noOutline()
|
|
202
|
+
})
|
|
204
203
|
},
|
|
205
204
|
_b[config.labelContainer] = {
|
|
206
|
-
props: labelProps
|
|
205
|
+
props: labelProps
|
|
207
206
|
},
|
|
208
207
|
_b);
|
|
209
208
|
return {
|
|
210
209
|
plasmicProps: {
|
|
211
210
|
variants: variants,
|
|
212
211
|
args: args,
|
|
213
|
-
overrides: overrides
|
|
214
|
-
}
|
|
212
|
+
overrides: overrides
|
|
213
|
+
}
|
|
215
214
|
};
|
|
216
215
|
}
|
|
217
216
|
|
|
@@ -228,38 +227,38 @@ function useSelectOptionGroup(plasmicClass, props, config) {
|
|
|
228
227
|
}
|
|
229
228
|
var _c = useListBoxSection({
|
|
230
229
|
heading: props.title,
|
|
231
|
-
"aria-label": props["aria-label"]
|
|
230
|
+
"aria-label": props["aria-label"]
|
|
232
231
|
}), headingProps = _c.headingProps, groupProps = _c.groupProps;
|
|
233
232
|
var separatorProps = useSeparator({
|
|
234
|
-
elementType: "li"
|
|
233
|
+
elementType: "li"
|
|
235
234
|
}).separatorProps;
|
|
236
|
-
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 }, {
|
|
237
236
|
def: config.isFirstVariant,
|
|
238
|
-
active: state.collection.getFirstKey() === node.key
|
|
237
|
+
active: state.collection.getFirstKey() === node.key
|
|
239
238
|
}));
|
|
240
|
-
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) {
|
|
241
240
|
return renderCollectionNode(childNode);
|
|
242
241
|
}), _a));
|
|
243
242
|
var overrides = (_b = {},
|
|
244
243
|
_b[config.root] = {
|
|
245
|
-
props: getStyleProps(props)
|
|
244
|
+
props: getStyleProps(props)
|
|
246
245
|
},
|
|
247
246
|
_b[config.separator] = {
|
|
248
|
-
props: __assign({}, separatorProps)
|
|
247
|
+
props: __assign({}, separatorProps)
|
|
249
248
|
},
|
|
250
249
|
_b[config.titleContainer] = __assign({ props: __assign({ role: "presentation" }, headingProps) }, (!props.title && {
|
|
251
|
-
render: function () { return null; }
|
|
250
|
+
render: function () { return null; }
|
|
252
251
|
})),
|
|
253
252
|
_b[config.optionsContainer] = {
|
|
254
|
-
props: __assign({}, groupProps)
|
|
253
|
+
props: __assign({}, groupProps)
|
|
255
254
|
},
|
|
256
255
|
_b);
|
|
257
256
|
return {
|
|
258
257
|
plasmicProps: {
|
|
259
258
|
variants: variants,
|
|
260
259
|
args: args,
|
|
261
|
-
overrides: overrides
|
|
262
|
-
}
|
|
260
|
+
overrides: overrides
|
|
261
|
+
}
|
|
263
262
|
};
|
|
264
263
|
}
|
|
265
264
|
|