@workday/canvas-kit-preview-react 8.0.0 → 8.0.1

package/breadcrumbs/lib/Breadcrumbs/List/Link.tsx

@@ -1,88 +0,0 @@
-import React from 'react';
-import {styled} from '@workday/canvas-kit-react/common';
-import {Hyperlink} from '@workday/canvas-kit-react/button';
-import {type} from '@workday/canvas-kit-react/tokens';
-import {TooltipContainer} from '@workday/canvas-kit-react/tooltip';
-import {Popper} from '@workday/canvas-kit-react/popup';
-
-import {useTruncateTooltip} from './hooks';
-import {truncateStyles} from './styles';
-
-export interface BreadcrumbLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
-  /**
-   * The href url of the anchor tag
-   */
-  href: string;
-  /**
-   * The max-width of the link text
-   *
-   * @default 350px
-   */
-  maxWidth?: number;
-  /**
-   * A handler function for overriding hard-redirects with links
-   */
-  onAction?: (href: string) => void;
-}
-
-type StyledLinkProps = Pick<BreadcrumbLinkProps, 'maxWidth' | 'href'>;
-
-const {color, ...subtextLargeStyles} = type.levels.subtext.large;
-
-const StyledLink = styled(Hyperlink)(
-  {
-    ...subtextLargeStyles,
-  },
-  ({maxWidth}: StyledLinkProps) => ({
-    ...truncateStyles(maxWidth),
-  })
-);
-
-export const BreadcrumbLink = ({
-  maxWidth,
-  onAction,
-  onClick,
-  href,
-  children,
-  ...props
-}: BreadcrumbLinkProps) => {
-  const ref = React.useRef<HTMLAnchorElement>(null);
-  const {isTooltipOpen, openTooltip, closeTooltip, tooltipProps} = useTruncateTooltip(ref);
-
-  const handleClick = (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
-    event.preventDefault();
-    // allow an override to the hard redirect
-    if (onAction) {
-      onAction(href);
-    } else {
-      // default to hard redirecting
-      window.location.href = href;
-    }
-    // don't block the onClick event if it's provided
-    if (onClick) {
-      onClick(event);
-    }
-  };
-
-  return (
-    <React.Fragment>
-      <StyledLink
-        ref={ref}
-        maxWidth={maxWidth}
-        onMouseEnter={openTooltip}
-        onMouseLeave={closeTooltip}
-        onFocus={openTooltip}
-        onBlur={closeTooltip}
-        href={href}
-        role="link"
-        onClick={handleClick}
-        {...props}
-      >
-        {children}
-      </StyledLink>
-      <Popper open={isTooltipOpen} anchorElement={ref} placement="top">
-        <TooltipContainer {...tooltipProps}>{children}</TooltipContainer>
-      </Popper>
-    </React.Fragment>
-  );
-};

package/breadcrumbs/lib/Breadcrumbs/List/ListItem.tsx

@@ -1,30 +0,0 @@
-import React from 'react';
-import {SystemIcon} from '@workday/canvas-kit-react/icon';
-import {chevronLeftSmallIcon, chevronRightSmallIcon} from '@workday/canvas-system-icons-web';
-import {colors} from '@workday/canvas-kit-react/tokens';
-
-import {useRTL} from '../hooks';
-import {Flex} from '@workday/canvas-kit-react/layout';
-
-export type ListItemProps = React.HTMLAttributes<HTMLLIElement>;
-
-export const BreadcrumbsListItem = ({children, ...props}: ListItemProps) => {
-  const {shouldUseRTL} = useRTL();
-  const icon = shouldUseRTL ? chevronLeftSmallIcon : chevronRightSmallIcon;
-
-  return (
-    <Flex as="li" alignItems="center" {...props}>
-      {children}
-      <SystemIcon
-        icon={icon}
-        color={colors.licorice200}
-        colorHover={colors.licorice200}
-        size={20}
-        height={32}
-        width={32}
-        styles={{justifyContent: 'center', alignItems: 'center', display: 'inline-flex'}}
-        aria-hidden
-      />
-    </Flex>
-  );
-};

package/breadcrumbs/lib/Breadcrumbs/List/hooks.ts

@@ -1,114 +0,0 @@
-import React, {Children, useLayoutEffect, useState, useEffect} from 'react';
-
-import {BreadcrumbLink} from './Link';
-import {Breadcrumb} from '../types';
-
-export const useCollapse = <E extends HTMLElement>(listEl: React.RefObject<E>, maxWidth = 0) => {
-  const [shouldCollapseList, setShouldCollapseList] = useState<boolean>(false);
-
-  useLayoutEffect(() => {
-    const listWidth = listEl.current?.clientWidth || 0;
-    setShouldCollapseList(listWidth > maxWidth);
-  }, [listEl, maxWidth]);
-
-  return {shouldCollapseList};
-};
-
-const getBreadcrumbLink = (breadcrumb: React.ReactElement) => {
-  return Children.toArray(breadcrumb.props.children).filter(child => {
-    return React.isValidElement(child) && child.type === BreadcrumbLink;
-  })[0] as React.ReactElement;
-};
-
-const buildCollapsedList = (
-  list: Breadcrumb[],
-  containerWidth: number,
-  maxWidth: number,
-  collapsedList: Breadcrumb[] = []
-): Breadcrumb[] => {
-  // TODO: Calculate expander width dynamically
-  const EXPANDER_WIDTH = 66;
-  // recurse over the breadcrumb items until the containerWidth is less than or equal to the maxWidth
-  if (!list.length || containerWidth + EXPANDER_WIDTH <= maxWidth) {
-    return collapsedList;
-  }
-
-  const [firstCrumb, ...restList] = list;
-  const updatedCollapsedList = collapsedList.concat(firstCrumb);
-  const adjustedWidth = containerWidth - firstCrumb.width;
-  return buildCollapsedList(restList, adjustedWidth, maxWidth, updatedCollapsedList);
-};
-
-export const useBuildCollapsedList = <E extends HTMLElement>(
-  listEl: React.RefObject<E>,
-  children: React.ReactNode,
-  maxWidth: number
-) => {
-  const [collapsedItems, setCollapsedItems] = useState<Breadcrumb[]>([]);
-
-  useLayoutEffect(() => {
-    const listItemNodes = listEl.current ? listEl.current.querySelectorAll('li') : [];
-    const containerWidth = listEl.current ? listEl.current.clientWidth : 0;
-    const listItems: Breadcrumb[] = [];
-    Children.forEach(children, (child, index) => {
-      if (!React.isValidElement(child)) {
-        return;
-      }
-      const breadcrumbLink = getBreadcrumbLink(child);
-      // We should make this match work better
-      const listItemNode = listItemNodes[index];
-
-      // We might need to allow folks to spread more props from the link
-      listItems.push({
-        index: index, // TODO: use unique identifiers instead of indices
-        link: breadcrumbLink?.props?.href || '',
-        text: listItemNode ? listItemNode.innerText : '',
-        width: listItemNode ? listItemNode.clientWidth : 0,
-        onAction: breadcrumbLink?.props?.onAction,
-      } as Breadcrumb);
-    });
-
-    // don't collapse the root breadcrumb
-    const collapsibleListItems = listItems.slice(1);
-    const collapsedList = buildCollapsedList(collapsibleListItems, containerWidth, maxWidth);
-    setCollapsedItems(collapsedList);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [maxWidth]);
-
-  const collapsedItemIndices = collapsedItems.map(child => child.index);
-  return {collapsedItems, collapsedItemIndices};
-};
-
-export const useTruncateTooltip = (ref?: React.RefObject<HTMLSpanElement>) => {
-  const [isTooltipOpen, setIsTooltipOpen] = useState(false);
-  const [shouldShowTooltip, setShouldShowTooltip] = useState(false);
-  useEffect(() => {
-    if (ref?.current) {
-      setShouldShowTooltip(ref.current.scrollWidth > ref.current.clientWidth);
-    }
-  }, [ref]);
-
-  const openTooltip = (event: React.MouseEvent | React.FocusEvent) => {
-    const {currentTarget} = event;
-    // if the target is truncated, show the tooltip
-    if (currentTarget.scrollWidth > currentTarget.clientWidth) {
-      setIsTooltipOpen(true);
-    }
-  };
-
-  const closeTooltip = () => {
-    setIsTooltipOpen(false);
-  };
-
-  const tooltipProps = {
-    role: 'tooltip',
-  };
-
-  return {
-    isTooltipOpen,
-    openTooltip,
-    closeTooltip,
-    shouldShowTooltip,
-    tooltipProps,
-  };
-};

package/breadcrumbs/lib/Breadcrumbs/List/index.tsx

@@ -1,28 +0,0 @@
-import React from 'react';
-import {createComponent} from '@workday/canvas-kit-react/common';
-import {Flex} from '@workday/canvas-kit-react/layout';
-
-export type BreadcrumbsListProps = React.HTMLAttributes<HTMLUListElement>;
-
-export const BreadcrumbsList = createComponent('ul')({
-  displayName: 'BreadcrumbsList',
-  Component: ({children, ...elemProps}: BreadcrumbsListProps, ref) => {
-    return (
-      <Flex
-        padding="zero"
-        margin="zero"
-        display="inline-flex"
-        alignItems="center"
-        minHeight={40}
-        listStyle="none"
-        style={{boxSizing: 'border-box'}}
-        as="ul"
-        role="list"
-        ref={ref}
-        {...elemProps}
-      >
-        {children}
-      </Flex>
-    );
-  },
-});

package/breadcrumbs/lib/Breadcrumbs/List/styles.ts

@@ -1,12 +0,0 @@
-import {CSSObject} from '@emotion/styled';
-
-// default max-width for truncating text
-const DEFAULT_MAX_WIDTH = 350;
-
-export const truncateStyles = (maxWidth: number = DEFAULT_MAX_WIDTH): CSSObject => ({
-  display: 'inline-block',
-  maxWidth,
-  overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap',
-});

package/breadcrumbs/lib/Breadcrumbs/Nav.tsx

@@ -1,14 +0,0 @@
-import React from 'react';
-
-export interface BreadcrumbsNavProps extends React.HTMLAttributes<HTMLElement> {
-  /**
-   * The accessibility label to indicate the type of navigation.
-   *
-   * Suggested value: "breadcrumb"
-   */
-  'aria-label': string;
-}
-
-export const BreadcrumbsNav = ({'aria-label': ariaLabel, ...elemProps}: BreadcrumbsNavProps) => {
-  return <nav role="navigation" aria-label={ariaLabel} {...elemProps} />;
-};

package/breadcrumbs/lib/Breadcrumbs/hooks.ts

@@ -1,13 +0,0 @@
-import {
-  useTheme,
-  PartialEmotionCanvasTheme,
-  ContentDirection,
-} from '@workday/canvas-kit-react/common';
-
-export const useRTL = (partialTheme?: PartialEmotionCanvasTheme) => {
-  const theme = useTheme(partialTheme);
-  const shouldUseRTL = theme.canvas.direction === ContentDirection.RTL;
-  return {
-    shouldUseRTL,
-  };
-};

package/breadcrumbs/lib/Breadcrumbs/index.tsx

@@ -1,15 +0,0 @@
-import {CurrentItem} from './List/CurrentItem';
-import {BreadcrumbLink} from './List/Link';
-import {BreadcrumbsNav} from './Nav';
-import {CollapsibleList} from './List/Collapsible';
-import {BreadcrumbsListItem} from './List/ListItem';
-import {BreadcrumbsList} from './List';
-
-export const Breadcrumbs = {
-  Nav: BreadcrumbsNav,
-  CollapsibleList,
-  List: BreadcrumbsList,
-  ListItem: BreadcrumbsListItem,
-  Link: BreadcrumbLink,
-  CurrentItem,
-};

package/breadcrumbs/lib/Breadcrumbs/types.ts

@@ -1,7 +0,0 @@
-export interface Breadcrumb extends React.HTMLAttributes<HTMLAnchorElement> {
-  index: number;
-  link: string;
-  text: string;
-  width: number;
-  onAction?: (href: string) => void;
-}

package/breadcrumbs/package.json

@@ -1,6 +0,0 @@
-{
-  "main": "../dist/commonjs/breadcrumbs",
-  "module": "../dist/es6/breadcrumbs",
-  "sideEffects": false,
-  "types": "../dist/es6/breadcrumbs"
-}

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

@@ -1,5 +0,0 @@
-import { Breadcrumbs } from './lib/Breadcrumbs';
-export default Breadcrumbs;
-export { Breadcrumbs };
-export * from './lib/Breadcrumbs';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../breadcrumbs/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,mBAAmB,CAAC;AAE9C,eAAe,WAAW,CAAC;AAC3B,OAAO,EAAC,WAAW,EAAC,CAAC;AACrB,cAAc,mBAAmB,CAAC"}

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Button.d.ts

@@ -1,20 +0,0 @@
-import React from 'react';
-import { CanvasSystemIcon } from '@workday/design-assets-types';
-export interface DropdownButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
-    /**
-     * The accessibility label for the button
-     */
-    'aria-label': string;
-    /**
-     * The Canvas System Icon for the button
-     *
-     * @default relatedActionsIcon
-     */
-    buttonIcon?: CanvasSystemIcon;
-    /**
-     * The boolean to determine whether the button should be in a 'toggled' state
-     */
-    toggled: boolean;
-}
-export declare const DropdownButton: import("@workday/canvas-kit-react/common").ElementComponent<"button", DropdownButtonProps>;
-//# sourceMappingURL=Button.d.ts.map

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../../breadcrumbs/lib/Breadcrumbs/Dropdown/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;IAClF;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,cAAc,4FA2BzB,CAAC"}

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Button.js

@@ -1,69 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownButton = void 0;
-var react_1 = __importDefault(require("react"));
-var button_1 = require("@workday/canvas-kit-react/button");
-var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
-var common_1 = require("@workday/canvas-kit-react/common");
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-exports.DropdownButton = common_1.createComponent('button')({
-    displayName: 'DropdownButton',
-    Component: function (_a, ref, Element) {
-        var _b = _a.buttonIcon, buttonIcon = _b === void 0 ? canvas_system_icons_web_1.relatedActionsIcon : _b, toggled = _a.toggled, elemProps = __rest(_a, ["buttonIcon", "toggled"]);
-        var theme = common_1.useTheme();
-        return (react_1.default.createElement(button_1.BaseButton, __assign({ as: Element, ref: ref, "aria-pressed": undefined, "aria-expanded": toggled, "aria-haspopup": true, "aria-controls": "menu", size: "small", height: tokens_1.space.l, width: tokens_1.space.l, padding: tokens_1.space.zero, colors: getDropdownColors(toggled, theme) }, elemProps),
-            react_1.default.createElement(button_1.BaseButton.Icon, { icon: buttonIcon })));
-    },
-});
-var getDropdownColors = function (toggled, theme) {
-    var themePrimary = theme.canvas.palette.primary;
-    return {
-        default: {
-            icon: toggled ? themePrimary.main : tokens_1.colors.blackPepper400,
-            label: themePrimary.main,
-        },
-        hover: {
-            background: tokens_1.colors.soap200,
-            icon: toggled ? themePrimary.dark : tokens_1.colors.blackPepper500,
-            label: themePrimary.dark,
-        },
-        active: {
-            background: tokens_1.colors.soap300,
-            icon: toggled ? themePrimary.dark : tokens_1.colors.blackPepper500,
-            label: themePrimary.dark,
-        },
-        focus: {
-            icon: toggled ? themePrimary.main : tokens_1.colors.blackPepper500,
-            label: themePrimary.main,
-        },
-        disabled: {
-            icon: toggled ? themePrimary.main : tokens_1.colors.blackPepper400,
-            label: themePrimary.main,
-        },
-    };
-};

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Menu.d.ts

@@ -1,38 +0,0 @@
-import React from 'react';
-import { Breadcrumb } from '../types';
-export interface DropdownMenuProps {
-    /**
-     * The active dropdown item in the menu
-     */
-    activeDropdownItem: Breadcrumb;
-    /**
-     * The HTML `id` of the element that labels the Menu. It should match the id of the menu button.
-     */
-    'aria-labelledby': string;
-    /**
-     * An array of Breadcrumb items to render in the dropdown menu
-     */
-    dropdownItems: Breadcrumb[];
-    /**
-     * A function to set the active dropdown item
-     */
-    setActiveDropdownItem: React.Dispatch<React.SetStateAction<Breadcrumb>>;
-    /**
-     * The ref of the rendered HTMLAnchorElement
-     */
-    activeDropdownItemRef: React.RefObject<HTMLAnchorElement>;
-    /**
-     * A function to return the focus to the dropdown button
-     */
-    resetFocus: () => void;
-    /**
-     * A function to toggle the focus to the previous list item
-     */
-    toggleActiveItemUp: () => void;
-    /**
-     * A function to toggle the focus to the next list item
-     */
-    toggleActiveItemDown: () => void;
-}
-export declare const DropdownMenu: ({ activeDropdownItemRef, activeDropdownItem, dropdownItems, resetFocus, setActiveDropdownItem, toggleActiveItemDown, toggleActiveItemUp, ...elemProps }: DropdownMenuProps) => JSX.Element;
-//# sourceMappingURL=Menu.d.ts.map

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Menu.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../../../breadcrumbs/lib/Breadcrumbs/Dropdown/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,OAAO,EAAC,UAAU,EAAC,MAAM,UAAU,CAAC;AAKpC,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,kBAAkB,EAAE,UAAU,CAAC;IAC/B;;OAEG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,aAAa,EAAE,UAAU,EAAE,CAAC;IAC5B;;OAEG;IACH,qBAAqB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;IACxE;;OAEG;IACH,qBAAqB,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC1D;;OAEG;IACH,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB;;OAEG;IACH,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B;;OAEG;IACH,oBAAoB,EAAE,MAAM,IAAI,CAAC;CAClC;AAgCD,eAAO,MAAM,YAAY,4JAStB,iBAAiB,gBA4DnB,CAAC"}

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/Menu.js

@@ -1,94 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownMenu = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-// local components
-var MenuItemLink_1 = require("./MenuItemLink");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var StyledDropdownMenu = common_1.styled(layout_1.Box)(__assign(__assign(__assign({}, tokens_1.type.levels.subtext.large), tokens_1.depth[3]), { backgroundColor: tokens_1.commonColors.background, border: "1px solid " + tokens_1.colors.soap500, borderRadius: tokens_1.borderRadius.m, boxSizing: 'border-box', display: 'inline-block', marginTop: tokens_1.space.xxxs, maxHeight: 200, outline: 'none', overflowY: 'auto', position: 'relative', width: 'max-content' }));
-var StyledMenuList = common_1.styled('ul')({
-    boxSizing: 'border-box',
-    listStyle: 'none',
-    margin: tokens_1.space.xxs + " 0",
-    padding: 0,
-    width: 280,
-    wordBreak: 'break-word',
-    wordWrap: 'break-word',
-});
-var MenuList = function (elemProps) {
-    return react_1.default.createElement(StyledMenuList, __assign({ role: "menu" }, elemProps));
-};
-var DropdownMenu = function (_a) {
-    var activeDropdownItemRef = _a.activeDropdownItemRef, activeDropdownItem = _a.activeDropdownItem, _b = _a.dropdownItems, dropdownItems = _b === void 0 ? [] : _b, resetFocus = _a.resetFocus, setActiveDropdownItem = _a.setActiveDropdownItem, toggleActiveItemDown = _a.toggleActiveItemDown, toggleActiveItemUp = _a.toggleActiveItemUp, elemProps = __rest(_a, ["activeDropdownItemRef", "activeDropdownItem", "dropdownItems", "resetFocus", "setActiveDropdownItem", "toggleActiveItemDown", "toggleActiveItemUp"]);
-    var handleItemKeyUp = function (event) {
-        switch (event.key) {
-            case 'ArrowUp':
-            case 'Up': // IE/Edge specific value
-            case 'ArrowLeft':
-            case 'Left': // IE/Edge specific value
-                toggleActiveItemUp();
-                break;
-            case 'ArrowDown':
-            case 'Down': // IE/Edge specific value
-            case 'ArrowRight':
-            case 'Right': // IE/Edge specific value
-                toggleActiveItemDown();
-                break;
-            default:
-                break;
-        }
-    };
-    var handleItemKeyDown = function (event, item) {
-        switch (event.key) {
-            case 'Tab':
-                event.preventDefault();
-                break;
-            case 'Enter':
-                event.preventDefault();
-                if (item.onAction) {
-                    item.onAction(item.link);
-                    resetFocus();
-                    break;
-                }
-                window.location.href = item.link;
-                break;
-            default:
-                break;
-        }
-    };
-    return (react_1.default.createElement(StyledDropdownMenu, null,
-        react_1.default.createElement(MenuList, __assign({}, elemProps), dropdownItems.map(function (item, i) {
-            var index = item.index, link = item.link, text = item.text, elemProps = __rest(item, ["index", "link", "text"]);
-            var isFocused = index === activeDropdownItem.index;
-            return (react_1.default.createElement("li", { onKeyUp: handleItemKeyUp, onKeyDown: function (e) { return handleItemKeyDown(e, item); }, key: i },
-                react_1.default.createElement(MenuItemLink_1.DropdownMenuItemLink, __assign({ ref: isFocused ? activeDropdownItemRef : null, href: link }, elemProps), text)));
-        }))));
-};
-exports.DropdownMenu = DropdownMenu;

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/MenuItemLink.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-interface DropdownMenuItemLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {
-    /**
-     * The href url of the anchor tag
-     */
-    href: string;
-    /**
-     * A handler function for overriding hard-redirects with links
-     */
-    onAction?: (href: string) => void;
-}
-export declare const DropdownMenuItemLink: React.ForwardRefExoticComponent<DropdownMenuItemLinkProps & React.RefAttributes<HTMLAnchorElement>>;
-export {};
-//# sourceMappingURL=MenuItemLink.d.ts.map

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/MenuItemLink.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MenuItemLink.d.ts","sourceRoot":"","sources":["../../../../../../breadcrumbs/lib/Breadcrumbs/Dropdown/MenuItemLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,UAAU,yBAA0B,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;IACjF;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAuBD,eAAO,MAAM,oBAAoB,qGA0BhC,CAAC"}

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/hooks.d.ts

@@ -1,13 +0,0 @@
-import { usePopupPopper } from '@workday/canvas-kit-react/popup';
-import { DropdownButtonProps } from './Button';
-import { DropdownMenuProps } from './Menu';
-import { Breadcrumb } from '../types';
-export declare const useFocusActiveItemElement: <E extends HTMLElement>(activeDropdownItemRef: import("react").RefObject<E>) => void;
-interface UseDropdown {
-    dropdownButtonProps: Omit<DropdownButtonProps, 'aria-label'>;
-    dropdownMenuProps: DropdownMenuProps;
-    popperProps: ReturnType<typeof usePopupPopper>;
-}
-export declare const useDropdown: (activeDropdownItemRef: React.RefObject<HTMLAnchorElement>, items: Breadcrumb[], buttonId?: string | undefined) => UseDropdown;
-export {};
-//# sourceMappingURL=hooks.d.ts.map

package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/Dropdown/hooks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../../../../breadcrumbs/lib/Breadcrumbs/Dropdown/hooks.ts"],"names":[],"mappings":"AAEA,OAAO,EAML,cAAc,EACf,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EAAC,mBAAmB,EAAC,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAC,iBAAiB,EAAC,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAC,UAAU,EAAC,MAAM,UAAU,CAAC;AAEpC,eAAO,MAAM,yBAAyB,sFAQrC,CAAC;AASF,UAAU,WAAW;IACnB,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAAE,YAAY,CAAC,CAAC;IAC7D,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,WAAW,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;CAChD;AAED,eAAO,MAAM,WAAW,0BACC,MAAM,SAAS,CAAC,iBAAiB,CAAC,SAClD,UAAU,EAAE,oCAElB,WAkEF,CAAC"}