@launchpad-ui/menu 0.1.0

package/README.md

@@ -0,0 +1,14 @@
+# @launchpad-ui/menu
+
+> An element that presents a list of items a user can choose from.
+
+[![See it on NPM!](https://img.shields.io/npm/v/@launchpad-ui/menu?style=for-the-badge)](https://www.npmjs.com/package/@launchpad-ui/menu)
+[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@launchpad-ui/menu?style=for-the-badge)](https://bundlephobia.com/result?p=@launchpad-ui/menu)
+
+## Installation
+
+```sh
+$ yarn add @launchpad-ui/menu
+# or
+$ npm install @launchpad-ui/menu
+```

package/dist/Menu.d.ts

@@ -0,0 +1,42 @@
+import type { ReactElement } from 'react';
+import { FocusManager } from '@react-aria/focus';
+declare type ControlledMenuProps<T> = {
+    children: React.ReactNode;
+    onSelect?: (item: T) => void;
+    /**
+     * Menus items are rendered using react-virtual for
+     * additional rendering performance.
+     */
+    enableVirtualization?: boolean;
+    /**
+     * Class name to be applied to all MenuItem and MenuItemLink components
+     * in the menu.
+     */
+    menuItemClassName?: string;
+    /**
+     * Sets the width of the menu. This is especially useful when using virtual items
+     * since the width cannot be automatically set by the widest element.
+     */
+    menuWidth?: 'tiny' | 'small' | 'med' | 'large' | 'xLarge';
+    /**
+     * Sets the number out of elements rendered outside of the view window
+     * when using virtualization
+     */
+    overscan?: number;
+    /**
+     * Sets the height for each menu item when using virtualization.
+     *
+     */
+    itemHeight?: number;
+};
+declare type MenuProps<T extends number | string> = ControlledMenuProps<T>;
+declare const Menu: <T extends string | number>(props: MenuProps<T>) => JSX.Element;
+declare type ItemVirtualizerProps<T> = Omit<ControlledMenuProps<T>, 'children'> & {
+    items: ReactElement[] | null;
+    searchElement?: React.ReactElement | null;
+    focusManager: FocusManager;
+};
+declare const ItemVirtualizer: <T extends string | number>(props: ItemVirtualizerProps<T>) => JSX.Element;
+export { Menu, ItemVirtualizer };
+export type { MenuProps, ItemVirtualizerProps };
+//# sourceMappingURL=Menu.d.ts.map

package/dist/Menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../src/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,YAAY,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAmB,MAAM,mBAAmB,CAAC;AAmBlE,aAAK,mBAAmB,CAAC,CAAC,IAAI;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CAAC;IAC1D;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,aAAK,SAAS,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,mBAAmB,CAAC,CAAC,CAAC,CAAC;AAEnE,QAAA,MAAM,IAAI,iEA6HT,CAAC;AAEF,aAAK,oBAAoB,CAAC,CAAC,IAAI,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,GAAG;IACxE,KAAK,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;IAC7B,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;IAC1C,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAEF,QAAA,MAAM,eAAe,4EAoNpB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC;AACjC,YAAY,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC"}

package/dist/MenuBase.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import './styles.css';
+declare type MenuBaseProps = React.ComponentPropsWithRef<'div'>;
+declare const MenuBase: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { MenuBase };
+export type { MenuBaseProps };
+//# sourceMappingURL=MenuBase.d.ts.map

package/dist/MenuBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuBase.d.ts","sourceRoot":"","sources":["../src/MenuBase.tsx"],"names":[],"mappings":";AAGA,OAAO,cAAc,CAAC;AAEtB,aAAK,aAAa,GAAG,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAGxD,QAAA,MAAM,QAAQ,2IASb,CAAC;AAIF,OAAO,EAAE,QAAQ,EAAE,CAAC;AACpB,YAAY,EAAE,aAAa,EAAE,CAAC"}

package/dist/MenuDivider.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { SeparatorProps } from '@react-aria/separator';
+import './styles.css';
+declare type MenuDividerProps = SeparatorProps & {
+    innerRef?: React.RefObject<HTMLDivElement>;
+};
+declare const MenuDivider: ({ elementType, orientation, innerRef }: MenuDividerProps) => JSX.Element;
+export { MenuDivider };
+export type { MenuDividerProps };
+//# sourceMappingURL=MenuDivider.d.ts.map

package/dist/MenuDivider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuDivider.d.ts","sourceRoot":"","sources":["../src/MenuDivider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAgB,MAAM,uBAAuB,CAAC;AAErE,OAAO,cAAc,CAAC;AAEtB,aAAK,gBAAgB,GAAG,cAAc,GAAG;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CAC5C,CAAC;AAEF,QAAA,MAAM,WAAW,2CAAoD,gBAAgB,gBAOpF,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,CAAC;AACvB,YAAY,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/MenuItem.d.ts

@@ -0,0 +1,47 @@
+/// <reference types="react" />
+import type { PopoverPlacement } from '@launchpad-ui/popover';
+import { Icon } from '@launchpad-ui/icons';
+import { Tooltip } from '@launchpad-ui/tooltip';
+import { Link } from 'react-router-dom';
+import './styles.css';
+declare type Merge<T, U> = Omit<T, keyof U> & U;
+declare type PropsWithComponent<P, T extends React.ElementType> = P & {
+    component?: T;
+};
+declare type PolymorphicPropsWithRef<P, T extends React.ElementType> = Merge<T extends keyof JSX.IntrinsicElements ? React.PropsWithRef<JSX.IntrinsicElements[T]> : React.ComponentPropsWithRef<T>, PropsWithComponent<P, T>>;
+declare type MenuItemOwnProps = {
+    isHighlighted?: boolean;
+    icon?: typeof Icon | null;
+    disabled?: boolean;
+    nested?: boolean;
+    groupHeader?: boolean;
+    innerRef?: React.RefObject<HTMLDivElement>;
+    tooltip?: string | React.ReactElement;
+    tooltipOptions?: typeof Tooltip;
+    tooltipPlacement?: PopoverPlacement;
+};
+declare const defaultElement = "button";
+declare type MenuItemProps<P, T extends React.ElementType = typeof defaultElement> = PolymorphicPropsWithRef<(MenuItemOwnProps & {
+    item: P;
+}) | (MenuItemOwnProps & {
+    item?: undefined;
+}), T>;
+declare const MenuItem: <P, T extends import("react").ElementType<any> = "button">({ ...props }: MenuItemProps<P, T>) => JSX.Element;
+declare type MenuItemLinkOwnProps = {
+    disabled?: boolean;
+    useHistory?: boolean;
+    newTab?: boolean;
+};
+declare type MenuItemLinkProps<P, T extends React.ElementType = typeof Link> = Merge<Omit<MenuItemProps<P, T>, 'component' | 'item'>, MenuItemLinkOwnProps> & ({
+    item?: undefined;
+} | {
+    item: P;
+});
+declare const MenuItemLink: <P, T extends import("react").ElementType<any> = typeof Link>({ to, disabled, useHistory, newTab, children, ...props }: Omit<Omit<MenuItemProps<P, T>, "item" | "component">, keyof MenuItemLinkOwnProps> & MenuItemLinkOwnProps & ({
+    item?: undefined;
+} | {
+    item: P;
+})) => JSX.Element;
+export { MenuItem, MenuItemLink };
+export type { MenuItemProps, MenuItemLinkProps };
+//# sourceMappingURL=MenuItem.d.ts.map

package/dist/MenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../src/MenuItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9D,OAAO,EAAE,IAAI,EAAY,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGhD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,OAAO,cAAc,CAAC;AAGtB,aAAK,KAAK,CAAC,CAAC,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;AAExC,aAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,CAAC,CAAA;CAAE,CAAC;AAEhF,aAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAClE,CAAC,SAAS,MAAM,GAAG,CAAC,iBAAiB,GACjC,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,GAC5C,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAClC,kBAAkB,CAAC,CAAC,EAAE,CAAC,CAAC,CACzB,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,IAAI,GAAG,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC3C,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC;IACtC,cAAc,CAAC,EAAE,OAAO,OAAO,CAAC;IAChC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC,CAAC;AAEF,QAAA,MAAM,cAAc,WAAW,CAAC;AAEhC,aAAK,aAAa,CAChB,CAAC,EACD,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,OAAO,cAAc,IACjD,uBAAuB,CACvB,CAAC,gBAAgB,GAAG;IAClB,IAAI,EAAE,CAAC,CAAC;CACT,CAAC,GACF,CAAC,gBAAgB,GAAG;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC,EACJ,CAAC,CACF,CAAC;AAEF,QAAA,MAAM,QAAQ,8GAkEb,CAAC;AAEF,aAAK,oBAAoB,GAAG;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,aAAK,iBAAiB,CAAC,CAAC,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,OAAO,IAAI,IAC/D,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,EAAE,oBAAoB,CAAC,GAC1E,CACI;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,GACD;IACE,IAAI,EAAE,CAAC,CAAC;CACT,CACJ,CAAC;AAIR,QAAA,MAAM,YAAY;WATC,SAAS;;;kBA8B3B,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,CAAC;AAClC,YAAY,EAAE,aAAa,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/MenuItemList.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import './styles.css';
+declare type MenuItemListProps = Omit<React.ComponentPropsWithRef<'div'>, 'className'>;
+declare const MenuItemList: import("react").ForwardRefExoticComponent<Pick<MenuItemListProps, "key" | "id" | "color" | "translate" | "hidden" | "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "lang" | "prefix" | "children" | "contentEditable" | "inputMode" | "tabIndex" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLDivElement>>;
+export { MenuItemList };
+export type { MenuItemListProps };
+//# sourceMappingURL=MenuItemList.d.ts.map

package/dist/MenuItemList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemList.d.ts","sourceRoot":"","sources":["../src/MenuItemList.tsx"],"names":[],"mappings":";AAEA,OAAO,cAAc,CAAC;AAEtB,aAAK,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC,CAAC;AAE/E,QAAA,MAAM,YAAY,4lJAIhB,CAAC;AAIH,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,YAAY,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/MenuSearch.d.ts

@@ -0,0 +1,12 @@
+import type { ChangeEvent } from 'react';
+import './styles.css';
+declare type MenuSearchProps = {
+    ariaLabel?: string;
+    value?: string;
+    placeholder?: string;
+    onChange?(event: ChangeEvent<HTMLInputElement>): void;
+};
+declare const MenuSearch: import("react").ForwardRefExoticComponent<MenuSearchProps & import("react").RefAttributes<HTMLInputElement>>;
+export { MenuSearch };
+export type { MenuSearchProps };
+//# sourceMappingURL=MenuSearch.d.ts.map

package/dist/MenuSearch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSearch.d.ts","sourceRoot":"","sources":["../src/MenuSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAIzC,OAAO,cAAc,CAAC;AAEtB,aAAK,eAAe,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;CACvD,CAAC;AAEF,QAAA,MAAM,UAAU,8GAsBd,CAAC;AAIH,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,YAAY,EAAE,eAAe,EAAE,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+export type { MenuBaseProps } from './MenuBase';
+export type { MenuDividerProps } from './MenuDivider';
+export type { MenuItemProps, MenuItemLinkProps } from './MenuItem';
+export type { MenuItemListProps } from './MenuItemList';
+export type { MenuSearchProps } from './MenuSearch';
+export type { MenuProps } from './Menu';
+export { MenuBase } from './MenuBase';
+export { MenuDivider } from './MenuDivider';
+export { MenuItem, MenuItemLink } from './MenuItem';
+export { MenuItemList } from './MenuItemList';
+export { MenuSearch } from './MenuSearch';
+export { Menu } from './Menu';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AACnE,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC"}

package/dist/index.es.js

@@ -0,0 +1,418 @@
+// ../../scripts/react-shim.js
+import * as React from "react";
+
+// src/MenuBase.tsx
+import cx from "clsx";
+import { forwardRef } from "react";
+import "./styles.css";
+var MenuBase = forwardRef(({ children, ...props }, ref) => {
+  const className = cx("Menu", props.className);
+  return /* @__PURE__ */ React.createElement("div", {
+    ...props,
+    className,
+    ref
+  }, children);
+});
+MenuBase.displayName = "MenuBase";
+
+// src/MenuDivider.tsx
+import { useSeparator } from "@react-aria/separator";
+import "./styles.css";
+var MenuDivider = ({ elementType = "div", orientation, innerRef }) => {
+  const { separatorProps } = useSeparator({
+    orientation,
+    elementType
+  });
+  return /* @__PURE__ */ React.createElement("div", {
+    ...separatorProps,
+    ref: innerRef,
+    className: "Menu-divider"
+  });
+};
+
+// src/MenuItem.tsx
+import { IconSize } from "@launchpad-ui/icons";
+import { Tooltip } from "@launchpad-ui/tooltip";
+import { FocusRing } from "@react-aria/focus";
+import cx2 from "clsx";
+import { Link } from "react-router-dom";
+import "./styles.css";
+var defaultElement = "button";
+var MenuItem = ({
+  ...props
+}) => {
+  const {
+    component,
+    children,
+    isHighlighted,
+    icon: Icon2,
+    nested,
+    groupHeader,
+    item,
+    disabled,
+    className,
+    innerRef,
+    tooltip,
+    role = "menuitem",
+    tooltipPlacement,
+    onKeyDown,
+    tooltipOptions,
+    ...rest
+  } = props;
+  const Component = component || defaultElement;
+  const renderedItem = /* @__PURE__ */ React.createElement(FocusRing, {
+    focusRingClass: "has-focus"
+  }, /* @__PURE__ */ React.createElement(Component, {
+    ...rest,
+    ref: innerRef,
+    disabled,
+    "aria-disabled": disabled ? disabled : void 0,
+    className: cx2("Menu-item", className, { "is-highlighted": isHighlighted }, { "Menu-item--nested": nested }, { "u-fw-medium": groupHeader }),
+    role,
+    onKeyDown
+  }, Icon2 && /* @__PURE__ */ React.createElement("span", {
+    className: "Menu-item-icon"
+  }, /* @__PURE__ */ React.createElement(Icon2, {
+    size: IconSize.SMALL
+  })), children));
+  if (tooltip) {
+    return /* @__PURE__ */ React.createElement(Tooltip, {
+      content: tooltip,
+      rootElementStyle: { display: "block" },
+      allowBoundaryElementOverflow: true,
+      placement: tooltipPlacement ? tooltipPlacement : "bottom",
+      ...tooltipOptions || {}
+    }, renderedItem);
+  }
+  return renderedItem;
+};
+var MenuItemLink = ({
+  to,
+  disabled = false,
+  useHistory = true,
+  newTab = false,
+  children,
+  ...props
+}) => {
+  const finalProps = {
+    ...props,
+    disabled,
+    component: useHistory ? Link : "a",
+    [useHistory ? "to" : "href"]: disabled ? "" : to,
+    rel: newTab ? "noopener noreferrer" : void 0,
+    target: newTab ? "_blank" : void 0
+  };
+  return /* @__PURE__ */ React.createElement(MenuItem, {
+    ...finalProps
+  }, children);
+};
+
+// src/MenuItemList.tsx
+import { forwardRef as forwardRef2 } from "react";
+import "./styles.css";
+var MenuItemList = forwardRef2(({ children, ...rest }, ref) => /* @__PURE__ */ React.createElement("div", {
+  ...rest,
+  ref,
+  "data-test-id": "menu-item-list",
+  className: "Menu-item-list"
+}, children));
+MenuItemList.displayName = "MenuItemList";
+
+// src/MenuSearch.tsx
+import { forwardRef as forwardRef3 } from "react";
+import "./styles.css";
+var MenuSearch = forwardRef3((props, ref) => {
+  const { ariaLabel, placeholder, ...finalProps } = props;
+  return /* @__PURE__ */ React.createElement("div", {
+    className: "Menu-search"
+  }, /* @__PURE__ */ React.createElement("input", {
+    ...finalProps,
+    ref,
+    className: "Menu-search-input FormInput FormInput--tiny",
+    type: "search",
+    autoComplete: "off",
+    placeholder,
+    "aria-label": ariaLabel || "Search"
+  }), /* @__PURE__ */ React.createElement("div", {
+    className: "Menu-search-hidden-placeholder Menu-search-input FormInput FormInput--tiny",
+    "aria-hidden": "true"
+  }, placeholder));
+});
+MenuSearch.displayName = "MenuSearch";
+
+// src/Menu.tsx
+import { useFocusManager } from "@react-aria/focus";
+import cx3 from "clsx";
+import { isNil, noop } from "lodash-es";
+import { Children, cloneElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useVirtual } from "react-virtual";
+import { v4 } from "uuid";
+
+// src/utils.ts
+import { isFunction } from "lodash-es";
+var createItemId = (index, id) => `${id}-item-${index}`;
+var getNodeForIndex = (index, menuId) => index === null ? index : document.getElementById(createItemId(index, menuId));
+var handleKeyboardInteractions = (event, keyHandlers) => {
+  const ops = {
+    ArrowUp: keyHandlers.handleUp,
+    ArrowDown: keyHandlers.handleDown,
+    Enter: keyHandlers.handleEnter
+  };
+  if (ops[event.key]) {
+    event.preventDefault();
+    ops[event.key]?.call(void 0, event);
+  }
+};
+var chainEventHandlers = (...handlers) => (event) => {
+  handlers.forEach((h) => isFunction(h) && h(event));
+};
+
+// src/Menu.tsx
+var Menu = (props) => {
+  const {
+    children,
+    menuItemClassName,
+    onSelect,
+    enableVirtualization,
+    itemHeight,
+    menuWidth,
+    overscan = 1
+  } = props;
+  const focusManager = useFocusManager();
+  const handleArrowDown = useCallback(() => {
+    focusManager.focusNext({ wrap: true });
+  }, [focusManager]);
+  const handleArrowUp = useCallback(() => {
+    focusManager.focusPrevious({ wrap: true });
+  }, [focusManager]);
+  const reduceItems = useMemo(() => {
+    const childrenProps = Children.toArray(children);
+    if (enableVirtualization) {
+      let searchElem = null;
+      let elements = [];
+      childrenProps.forEach((child) => {
+        switch (child.type) {
+          case MenuSearch:
+            searchElem = child;
+            break;
+          case MenuItem:
+          case MenuItemLink:
+          case MenuDivider:
+            elements = elements.concat(child);
+            break;
+          default:
+            break;
+        }
+      });
+      return { items: elements, searchElement: searchElem };
+    }
+    return childrenProps.reduce(({ items, searchElement }, child) => {
+      switch (child.type) {
+        case MenuSearch:
+          return {
+            items,
+            searchElement: cloneElement(child, {
+              onKeyDown: (e) => handleKeyboardInteractions(e, {
+                handleDown: handleArrowDown,
+                handleUp: handleArrowUp
+              })
+            })
+          };
+        case MenuItem:
+        case MenuItemLink:
+          return {
+            items: items.concat(child.props.disabled ? cloneElement(child, {
+              onClick: noop,
+              onKeyDown: noop,
+              tabIndex: -1,
+              disabled: true
+            }) : cloneElement(child, {
+              className: cx3(child.props.className, menuItemClassName),
+              item: child.props.item ?? items.length,
+              onClick: chainEventHandlers(child.props.onClick, () => {
+                onSelect?.(child.props.item ?? items.length);
+              }),
+              onKeyDown: (e) => handleKeyboardInteractions(e, {
+                handleDown: handleArrowDown,
+                handleUp: handleArrowUp
+              })
+            })),
+            searchElement
+          };
+        case MenuDivider:
+          return { items: items.concat(child), searchElement };
+        default:
+          return { items, searchElement };
+      }
+    }, { items: [], searchElement: null });
+  }, [children, enableVirtualization, menuItemClassName, handleArrowDown, handleArrowUp, onSelect]);
+  const menuClassName = cx3({ "Menu--isVirtual": enableVirtualization }, { [`MenuSize--${menuWidth}`]: menuWidth });
+  if (enableVirtualization) {
+    return /* @__PURE__ */ React.createElement(MenuBase, {
+      role: "menu",
+      className: menuClassName
+    }, /* @__PURE__ */ React.createElement(ItemVirtualizer, {
+      items: Children.toArray(reduceItems.items),
+      searchElement: reduceItems.searchElement,
+      overscan,
+      menuItemClassName,
+      onSelect,
+      itemHeight,
+      focusManager
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(MenuBase, {
+    role: "menu",
+    className: menuClassName
+  }, reduceItems.searchElement, /* @__PURE__ */ React.createElement(MenuItemList, {
+    role: "presentation"
+  }, reduceItems.items));
+};
+var ItemVirtualizer = (props) => {
+  const {
+    overscan,
+    searchElement,
+    itemHeight = 33,
+    menuItemClassName,
+    items,
+    focusManager,
+    onSelect
+  } = props;
+  const menuId = useRef(`menu-ctrl-${v4()}`);
+  const focusedItemIndex = useRef(null);
+  const parentRef = useRef(null);
+  const searchRef = useRef();
+  const [nextFocusValue, setNextFocusValue] = useState(null);
+  const hasSearch = !!searchElement;
+  const lastVirtualItemIndex = items ? items.length - 1 : 0;
+  const rowVirtualizer = useVirtual({
+    size: items !== null ? items.length : 0,
+    parentRef,
+    estimateSize: useCallback(() => itemHeight, [itemHeight]),
+    overscan
+  });
+  const focusSearchBar = useCallback(() => {
+    rowVirtualizer.scrollToIndex(0);
+    searchRef.current?.focus?.();
+  }, [rowVirtualizer]);
+  const focusMenuItem = useCallback((index) => {
+    rowVirtualizer.scrollToIndex(index);
+    setNextFocusValue(index);
+  }, [rowVirtualizer]);
+  const handleKeyboardFocusInteraction = useCallback((direction) => {
+    if (isNil(focusedItemIndex.current)) {
+      return;
+    }
+    const nextIndex = direction === "next" ? focusedItemIndex.current + 1 : focusedItemIndex.current - 1;
+    const shouldWrap = direction === "next" && focusedItemIndex.current === lastVirtualItemIndex || direction === "previous" && focusedItemIndex.current === 0;
+    if (shouldWrap) {
+      if (hasSearch) {
+        focusSearchBar();
+      } else {
+        focusMenuItem(direction === "next" ? 0 : lastVirtualItemIndex);
+      }
+      return;
+    }
+    switch (direction) {
+      case "next":
+        rowVirtualizer.scrollToIndex(nextIndex);
+        focusManager.focusNext();
+        break;
+      case "previous":
+        rowVirtualizer.scrollToIndex(nextIndex);
+        focusManager.focusPrevious();
+        break;
+      default:
+        break;
+    }
+  }, [focusManager, focusMenuItem, focusSearchBar, hasSearch, lastVirtualItemIndex, rowVirtualizer]);
+  const getItemProps = useCallback((itemElem, index) => {
+    const childProps = itemElem.props;
+    switch (itemElem.type) {
+      case MenuItem:
+      case MenuItemLink:
+        return {
+          className: cx3(childProps.className, menuItemClassName),
+          onKeyDown: childProps.disabled ? noop : (e) => handleKeyboardFocusKeydown(e, {
+            handleFocusBackward: handleKeyboardFocusInteraction,
+            handleFocusForward: handleKeyboardFocusInteraction
+          }),
+          onFocus: chainEventHandlers(childProps.onFocus, () => {
+            focusedItemIndex.current = index;
+          }),
+          id: createItemId(index, menuId.current),
+          onBlur: chainEventHandlers(childProps.onBlur, () => {
+            focusedItemIndex.current = null;
+          }),
+          onClick: childProps.disabled ? noop : chainEventHandlers(childProps.onClick, () => {
+            onSelect?.(childProps.item);
+          })
+        };
+      default:
+        return {};
+    }
+  }, [handleKeyboardFocusInteraction, menuItemClassName, onSelect]);
+  useEffect(() => {
+    if (nextFocusValue !== null) {
+      requestAnimationFrame(() => {
+        const element = getNodeForIndex(nextFocusValue, menuId.current);
+        element?.focus();
+      });
+      setNextFocusValue(null);
+    }
+  }, [nextFocusValue]);
+  const handleKeyboardFocusKeydown = (e, callbacks) => {
+    const keyOps = ["Tab", "ArrowUp", "ArrowDown"];
+    if (keyOps.includes(e.key)) {
+      e.preventDefault();
+      e.stopPropagation();
+      if (e.key === "Tab" && e.shiftKey || e.key === "ArrowUp") {
+        callbacks.handleFocusBackward?.("previous");
+      } else if (e.key === "ArrowDown" || e.key === "Tab") {
+        callbacks.handleFocusForward?.("next");
+      }
+    }
+  };
+  const renderSearch = useMemo(() => searchElement ? cloneElement(searchElement, {
+    onKeyDown: (e) => handleKeyboardFocusKeydown(e, {
+      handleFocusBackward: () => focusMenuItem(lastVirtualItemIndex),
+      handleFocusForward: () => focusMenuItem(0)
+    }),
+    ref: searchRef
+  }) : null, [searchElement, lastVirtualItemIndex, focusMenuItem]);
+  const renderItems = useMemo(() => rowVirtualizer.virtualItems.map((virtualRow) => {
+    if (!items) {
+      return null;
+    }
+    const elem = items[virtualRow.index];
+    return /* @__PURE__ */ React.createElement("div", {
+      key: virtualRow.index,
+      ref: elem.type !== MenuItem || elem.type !== MenuItemLink ? virtualRow.measureRef : void 0,
+      role: "presentation",
+      className: cx3("VirtualMenu-item"),
+      style: {
+        transform: `translateY(${virtualRow.start}px)`
+      }
+    }, cloneElement(elem, getItemProps(elem, virtualRow.index)));
+  }), [rowVirtualizer.virtualItems, items, getItemProps]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, renderSearch, /* @__PURE__ */ React.createElement(MenuItemList, {
+    ref: parentRef,
+    role: "presentation"
+  }, /* @__PURE__ */ React.createElement("div", {
+    role: "presentation",
+    className: "VirtualMenu-item-list",
+    style: {
+      height: `${rowVirtualizer.totalSize}px`
+    }
+  }, renderItems)));
+};
+export {
+  Menu,
+  MenuBase,
+  MenuDivider,
+  MenuItem,
+  MenuItemLink,
+  MenuItemList,
+  MenuSearch
+};
+//# sourceMappingURL=index.es.js.map