@workday/canvas-kit-preview-react 10.0.0-alpha.516-next.0 → 10.0.0-alpha.517-next.0

package/dist/commonjs/index.d.ts

@@ -1,5 +1,6 @@
 export * from './color-picker';
 export * from './form-field';
+export * from './menu';
 export * from './pill';
 export * from './segmented-control';
 export * from './select';

package/dist/commonjs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC;AACpC,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC;AACpC,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/commonjs/index.js

@@ -12,6 +12,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./color-picker"), exports);
 __exportStar(require("./form-field"), exports);
+__exportStar(require("./menu"), exports);
 __exportStar(require("./pill"), exports);
 __exportStar(require("./segmented-control"), exports);
 __exportStar(require("./select"), exports);

package/dist/commonjs/menu/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/Menu';
+export * from './lib/MenuItem';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC"}

package/dist/commonjs/menu/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./lib/Menu"), exports);
+__exportStar(require("./lib/MenuItem"), exports);

package/dist/commonjs/menu/lib/Menu.d.ts

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import { DeprecatedMenuItemProps } from './MenuItem';
+import { GrowthBehavior } from '@workday/canvas-kit-react/common';
+/**
+ * ### Deprecated Menu
+ *
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export interface DeprecatedMenuProps extends GrowthBehavior, React.HTMLAttributes<HTMLUListElement> {
+    /**
+     * The DeprecatedMenuItem children of the DeprecatedMenu (must be at least one). Also accepts other components which share the same interface as `DeprecatedMenuItem`.
+     */
+    children?: React.ReactElement<DeprecatedMenuItemProps> | React.ReactElement<DeprecatedMenuItemProps>[];
+    /**
+     * If true, set the DeprecatedMenu to the open state. Useful for showing and hiding the DeprecatedMenu from a parent component such as a menu button.
+     * @default true
+     */
+    isOpen?: boolean;
+    /**
+     * The width of the DeprecatedMenu. If no value is provided, the DeprecatedMenu will collapse around its content.
+     */
+    width?: number | string;
+    /**
+     * The function called when a menu item is selected.
+     */
+    onSelect?: () => void;
+    /**
+     * The function called when the DeprecatedMenu should close. This is called after a menu item is selected or if the escape shortcut key is used. This will not fire if the menu item sets `shouldClose` to false.
+     */
+    onClose?: () => void;
+    /**
+     * The zero-based index of the menu item which should initially receive focus.
+     */
+    initialSelectedItem?: number;
+    /**
+     * The unique id of the DeprecatedMenu used for ARIA and HTML `id` attributes.
+     */
+    id?: string;
+    /**
+     * The HTML `id` of the element that labels the DeprecatedMenu. Often used with menu buttons.
+     */
+    'aria-labelledby'?: string;
+}
+/**
+ * ### Deprecated Menu State
+ *
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export interface DeprecatedMenuState {
+    selectedItemIndex: number;
+}
+/**
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the [upgrade
+ * guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page) for
+ * more information.
+ *
+ * `DeprecatedMenu` renders a styled `<ul role="menu">` element within a {@link Card} and follows
+ * the [Active Menu
+ * pattern](https://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-actions-active-descendant.html)
+ * using `aria-activedescendant`.
+ *
+ * Undocumented props are spread to the underlying `<ul>` element.
+ *
+ * @deprecated
+ */
+export declare class DeprecatedMenu extends React.Component<DeprecatedMenuProps, DeprecatedMenuState> {
+    private id;
+    private animateId;
+    private menuRef;
+    private firstCharacters;
+    constructor(props: DeprecatedMenuProps);
+    componentDidUpdate(prevProps: DeprecatedMenuProps): void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    getNormalizedItemIndex: (index: number | undefined) => number;
+    setNormalizedItemIndex: (index: number | undefined) => void;
+    private handleKeyboardShortcuts;
+    private handleClick;
+    private getIndexFirstChars;
+    private setFirstCharacters;
+    private getInitialSelectedItem;
+    private setInitialSelectedItem;
+}
+//# sourceMappingURL=Menu.d.ts.map

package/dist/commonjs/menu/lib/Menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../menu/lib/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,uBAAuB,EAAC,MAAM,YAAY,CAAC;AAGnD,OAAO,EAAiB,cAAc,EAAmB,MAAM,kCAAkC,CAAC;AAElG;;;;;;;GAOG;AACH,MAAM,WAAW,mBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC;IACxC;;OAEG;IACH,QAAQ,CAAC,EACL,KAAK,CAAC,YAAY,CAAC,uBAAuB,CAAC,GAC3C,KAAK,CAAC,YAAY,CAAC,uBAAuB,CAAC,EAAE,CAAC;IAClD;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,mBAAmB;IAClC,iBAAiB,EAAE,MAAM,CAAC;CAC3B;AAaD;;;;;;;;;;;;;;GAcG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,SAAS,CAAC,mBAAmB,EAAE,mBAAmB,CAAC;IAC3F,OAAO,CAAC,EAAE,CAAsB;IAChC,OAAO,CAAC,SAAS,CAAU;IAE3B,OAAO,CAAC,OAAO,CAAoC;IACnD,OAAO,CAAC,eAAe,CAAY;gBAEvB,KAAK,EAAE,mBAAmB;IAetC,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;IAejD,iBAAiB;IAYjB,oBAAoB;IAIb,MAAM;IAyDN,sBAAsB,UAAW,MAAM,GAAG,SAAS,KAAG,MAAM,CAQjE;IAEK,sBAAsB,UAAW,MAAM,GAAG,SAAS,KAAG,IAAI,CAE/D;IAEF,OAAO,CAAC,uBAAuB,CA+E7B;IAEF,OAAO,CAAC,WAAW,CAoBjB;IAEF,OAAO,CAAC,kBAAkB,CAWxB;IAEF,OAAO,CAAC,kBAAkB,CAkCxB;IAEF,OAAO,CAAC,sBAAsB,CAU5B;IAEF,OAAO,CAAC,sBAAsB,CAG5B;CACH"}

package/dist/commonjs/menu/lib/Menu.js

@@ -0,0 +1,284 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DeprecatedMenu = void 0;
+const React = __importStar(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const card_1 = require("@workday/canvas-kit-react/card");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const List = styled_1.default('ul')({
+    background: tokens_1.commonColors.background,
+    borderRadius: tokens_1.borderRadius.m,
+    padding: 0,
+    margin: `${tokens_1.space.xxs} 0`,
+    '&:focus': {
+        outline: 'none',
+    },
+    ...common_1.hideMouseFocus,
+});
+/**
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the [upgrade
+ * guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page) for
+ * more information.
+ *
+ * `DeprecatedMenu` renders a styled `<ul role="menu">` element within a {@link Card} and follows
+ * the [Active Menu
+ * pattern](https://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-actions-active-descendant.html)
+ * using `aria-activedescendant`.
+ *
+ * Undocumented props are spread to the underlying `<ul>` element.
+ *
+ * @deprecated
+ */
+class DeprecatedMenu extends React.Component {
+    constructor(props) {
+        super(props);
+        this.id = common_1.generateUniqueId();
+        this.getNormalizedItemIndex = (index) => {
+            const itemCount = React.Children.count(this.props.children);
+            const firstItem = 0;
+            const lastItem = itemCount - 1;
+            if (!index) {
+                return firstItem;
+            }
+            return index < 0 ? firstItem : index >= itemCount ? lastItem : index;
+        };
+        this.setNormalizedItemIndex = (index) => {
+            this.setState({ selectedItemIndex: this.getNormalizedItemIndex(index) });
+        };
+        this.handleKeyboardShortcuts = (event) => {
+            if (event.ctrlKey || event.altKey || event.metaKey) {
+                return;
+            }
+            const children = React.Children.toArray(this.props.children);
+            let nextSelectedIndex = 0;
+            let isShortcut = false;
+            const interactiveItems = children.filter(child => {
+                var _a, _b;
+                return !((_b = (_a = child) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.isHeader);
+            });
+            const interactiveItemCount = interactiveItems.length;
+            const firstIndex = 0;
+            const lastIndex = interactiveItemCount - 1;
+            if (event.key.length === 1 && event.key.match(/\S/)) {
+                let start = this.state.selectedItemIndex + 1;
+                let searchIndex;
+                if (start === children.length) {
+                    start = 0;
+                }
+                searchIndex = this.getIndexFirstChars(start, event.key.toLowerCase());
+                if (searchIndex === -1) {
+                    searchIndex = this.getIndexFirstChars(0, event.key.toLowerCase(), start);
+                }
+                if (searchIndex > -1) {
+                    isShortcut = true;
+                    nextSelectedIndex = searchIndex;
+                }
+            }
+            else {
+                switch (event.key) {
+                    case 'ArrowUp':
+                    case 'ArrowDown':
+                        const direction = event.key === 'ArrowUp' ? -1 : 1;
+                        isShortcut = true;
+                        const nextIndex = this.state.selectedItemIndex + direction;
+                        nextSelectedIndex =
+                            nextIndex < 0 ? lastIndex : nextIndex >= interactiveItemCount ? firstIndex : nextIndex;
+                        break;
+                    case 'Home':
+                    case 'End':
+                        const skipTo = event.key === 'Home' ? firstIndex : lastIndex;
+                        isShortcut = true;
+                        nextSelectedIndex = skipTo;
+                        break;
+                    case 'Tab':
+                        if (this.props.onClose) {
+                            this.props.onClose();
+                        }
+                        break;
+                    case 'Escape':
+                    case 'Esc': // IE/Edge specific value
+                        isShortcut = true;
+                        if (this.props.onClose) {
+                            this.props.onClose();
+                        }
+                        break;
+                    case 'Spacebar':
+                    case ' ':
+                    case 'Enter':
+                        nextSelectedIndex = this.state.selectedItemIndex;
+                        const child = interactiveItems[this.state.selectedItemIndex];
+                        this.handleClick(event, child.props);
+                        isShortcut = true;
+                        break;
+                    default:
+                }
+            }
+            if (isShortcut) {
+                this.setNormalizedItemIndex(nextSelectedIndex);
+                event.stopPropagation();
+                event.preventDefault();
+            }
+        };
+        this.handleClick = (event, menuItemProps) => {
+            /* istanbul ignore next line for coverage */
+            if (menuItemProps.isDisabled) {
+                // You should only hit this point if you are using a custom DeprecatedMenuItem implementation.
+                return;
+            }
+            if (menuItemProps.onClick) {
+                menuItemProps.onClick(event);
+            }
+            if (this.props.onSelect) {
+                this.props.onSelect();
+            }
+            if (this.props.onClose) {
+                if (menuItemProps.shouldClose) {
+                    this.props.onClose();
+                }
+            }
+        };
+        this.getIndexFirstChars = (startIndex, character, lastIndex = this.firstCharacters.length) => {
+            for (let i = startIndex; i < lastIndex; i++) {
+                if (character === this.firstCharacters[i]) {
+                    return i;
+                }
+            }
+            return -1;
+        };
+        this.setFirstCharacters = () => {
+            const getFirstCharacter = (child) => {
+                let character = '';
+                if (!child || typeof child === 'boolean') {
+                    character = '';
+                }
+                else if (typeof child === 'string' || typeof child === 'number') {
+                    character = child
+                        .toString()
+                        .trim()
+                        .substring(0, 1)
+                        .toLowerCase();
+                }
+                else if (Array.isArray(child) && child[0]) {
+                    // TODO test React.ReactNodeArray
+                    character = getFirstCharacter(child[0]);
+                }
+                else if ('props' in child) {
+                    const { children } = child.props;
+                    if (Array.isArray(children)) {
+                        character = getFirstCharacter(children[0]);
+                    }
+                    else {
+                        character = getFirstCharacter(children);
+                    }
+                }
+                return character;
+            };
+            const firstCharacters = React.Children.map(this.props.children, child => {
+                var _a, _b;
+                if ((_b = (_a = child) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.isHeader) {
+                    return;
+                }
+                return getFirstCharacter(child);
+            });
+            this.firstCharacters = firstCharacters;
+        };
+        this.getInitialSelectedItem = () => {
+            let selected = this.props.initialSelectedItem || 0;
+            selected = selected < 0 ? React.Children.count(this.props.children) + selected : selected;
+            if (selected < 0) {
+                selected = 0;
+            }
+            else if (selected > React.Children.count(this.props.children) - 1) {
+                selected = React.Children.count(this.props.children) - 1;
+            }
+            return selected;
+        };
+        this.setInitialSelectedItem = () => {
+            const selected = this.getInitialSelectedItem();
+            this.setState({ selectedItemIndex: selected });
+        };
+        this.menuRef = React.createRef();
+        const selected = this.getInitialSelectedItem();
+        // We track the active menu item by index so we can avoid setting a bunch of refs
+        // for doing things like selecting an item by first character (or really calling .focus() at all)
+        // It allows us to use the activedescendant design pattern
+        // https://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-actions-active-descendant.html
+        this.state = {
+            selectedItemIndex: selected,
+        };
+    }
+    componentDidUpdate(prevProps) {
+        if (this.props.children !== prevProps.children) {
+            this.setFirstCharacters();
+            this.setInitialSelectedItem();
+        }
+        if (this.props.isOpen && !prevProps.isOpen) {
+            this.setInitialSelectedItem();
+        }
+        this.animateId = requestAnimationFrame(() => {
+            if (this.props.isOpen && this.menuRef.current) {
+                this.menuRef.current.focus();
+            }
+        });
+    }
+    componentDidMount() {
+        console.warn(`This component is being deprecated and will be removed in a future major version.\n
+      For more information, please see the V8 upgrade guide:\n
+      https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page
+      `);
+        this.setFirstCharacters();
+        this.setInitialSelectedItem();
+    }
+    componentWillUnmount() {
+        cancelAnimationFrame(this.animateId);
+    }
+    render() {
+        // TODO: Standardize on prop spread location (see #150)
+        const { id = this.id, isOpen = true, children, 'aria-labelledby': ariaLabelledby, grow, width, onSelect, onClose, initialSelectedItem, ...elemProps } = this.props;
+        const { selectedItemIndex } = this.state;
+        const cardWidth = grow ? '100%' : width;
+        let interactiveItemIndex = null;
+        return (React.createElement(card_1.Card, { display: "inline-block", padding: tokens_1.space.zero, width: cardWidth, depth: 3 },
+            React.createElement(card_1.Card.Body, null,
+                React.createElement(List, Object.assign({ role: "menu", tabIndex: 0, id: id, "aria-labelledby": ariaLabelledby, "aria-activedescendant": `${id}-${selectedItemIndex}`, onKeyDown: this.handleKeyboardShortcuts, ref: this.menuRef }, elemProps), React.Children.map(children, menuItem => {
+                    if (!React.isValidElement(menuItem)) {
+                        return;
+                    }
+                    let itemId;
+                    if (!menuItem.props.isHeader) {
+                        interactiveItemIndex = (interactiveItemIndex !== null && interactiveItemIndex !== void 0 ? interactiveItemIndex : -1) + 1;
+                        itemId = `${id}-${interactiveItemIndex}`;
+                    }
+                    return (React.createElement(React.Fragment, { key: itemId }, React.cloneElement(menuItem, {
+                        onClick: (event) => this.handleClick(event, menuItem.props),
+                        id: itemId,
+                        isFocused: selectedItemIndex === interactiveItemIndex && !menuItem.props.isHeader,
+                    })));
+                })))));
+    }
+}
+exports.DeprecatedMenu = DeprecatedMenu;

package/dist/commonjs/menu/lib/MenuItem.d.ts

@@ -0,0 +1,84 @@
+import * as React from 'react';
+import { CanvasSystemIcon } from '@workday/design-assets-types';
+/**
+ * ### Deprecated Menu Item Props
+ *
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export interface DeprecatedMenuItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    /**
+     * The function called when the DeprecatedMenuItem is clicked. If the item is a child of the DeprecatedMenu component, this callback will be decorated with the onSelect and onClose DeprecatedMenu callbacks. This callback will not fire if the item is disabled (see below).
+     */
+    onClick?: (event: React.MouseEvent) => void;
+    /**
+     * The unique id for the DeprecatedMenuItem used for ARIA attributes. If the item is a child of the `DeprecatedMenu` component, this property will be generated and overridden.
+     */
+    id?: string;
+    /**
+     * The icon of the DeprecatedMenuItem. This icon is displayed before what you supplied for the children.
+     */
+    icon?: CanvasSystemIcon;
+    /**
+     * The secondary icon of the DeprecatedMenuItem. This icon is displayed after what you supplied for the children.
+     */
+    secondaryIcon?: CanvasSystemIcon;
+    /**
+     * If true, render a top border on the DeprecatedMenuItem.
+     * @default false
+     */
+    hasDivider?: boolean;
+    /**
+     * If true, render a header to group data, this menu item will not be intractable.
+     * @default false
+     */
+    isHeader?: boolean;
+    /**
+     * If true, set the DeprecatedMenuItem to the disabled state so it is not clickable.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * If true, set the DeprecatedMenuItem to be the currently selected item. If the item is a child of the DeprecatedMenu component, this property will be generated and overridden.
+     * @default false
+     */
+    isFocused?: boolean;
+    /**
+     * The role of the DeprecatedMenuItem. Use this to override the role of the item (e.g. you can use this element as an option in a Combobox).
+     * @default menuItem
+     */
+    role?: string;
+    /**
+     * If true, allow the onClose DeprecatedMenu callback to be fired after the DeprecatedMenuItem has been clicked.
+     * @default true
+     */
+    shouldClose?: boolean;
+}
+/**
+ * `DeprecatedMenuItem` renders an `<li>` element with the correct attributes to ensure it is
+ * accessible. If you choose to implement your own custom menu items, be sure to use semantic `<li>`
+ * elements with the following attributes:
+ *
+ * - `role="menuitem"`
+ * - `tabindex={-1}`
+ * - `id`s following this pattern: `${MenuId}-${index}`
+ *
+ * As of Canvas Kit v8, Menu is being deprecated.
+ * It will be removed in a future major version. Please see the [upgrade
+ * guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page) for
+ * more information.
+ *
+ * Undocumented props are spread to the underlying `<li>` element.
+ *
+ * @deprecated
+ */
+export declare class DeprecatedMenuItem extends React.Component<DeprecatedMenuItemProps> {
+    ref: React.RefObject<HTMLLIElement>;
+    componentDidMount(): void;
+    componentDidUpdate: (prevProps: DeprecatedMenuItemProps) => void;
+    render(): JSX.Element;
+    private handleClick;
+}
+//# sourceMappingURL=MenuItem.d.ts.map

package/dist/commonjs/menu/lib/MenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAG9D;;;;;;;GAOG;AACH,MAAM,WAAW,uBAAwB,SAAQ,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACpF;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AA2LD;;;;;;;;;;;;;;;;;GAiBG;AACH,qBAAa,kBAAmB,SAAQ,KAAK,CAAC,SAAS,CAAC,uBAAuB,CAAC;IAC9E,GAAG,iCAAoC;IAEvC,iBAAiB;IASjB,kBAAkB,cAAe,uBAAuB,UAMtD;IAEF,MAAM;IA4CN,OAAO,CAAC,WAAW,CAOjB;CACH"}