@workday/canvas-kit-react 7.0.0-alpha.0-next.6 → 7.0.0-alpha.79-next.7

package/dist/es6/tabs/lib/TabsItem.d.ts

@@ -1,9 +1,7 @@
 import * as React from 'react';
 import { StyledType, ExtractProps } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
-import { SystemIcon } from '@workday/canvas-kit-react/icon';
+import { Box, StackProps } from '@workday/canvas-kit-react/layout';
 import { TabsModel } from './useTabsModel';
-import { StackProps } from '@workday/canvas-kit-labs-react/layout';
 export interface TabsItemProps extends ExtractProps<typeof Box, never>, Partial<Pick<StackProps, 'spacing'>> {
     /**
      * Optionally pass index to tab item. This should be done if `Tabs.Item` components were created
@@ -72,7 +70,7 @@ export interface TabsItemProps extends ExtractProps<typeof Box, never>, Partial<
      */
     hasIcon?: boolean;
 }
-export declare const StyledTabItem: import("@emotion/styled").StyledComponent<import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderShorthandStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderColorStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderRadiusStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLineStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderWidthStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLogicalStyleProps & import("@workday/canvas-kit-labs-react/common").ColorStyleProps & import("@workday/canvas-kit-labs-react/common").DepthStyleProps & import("@workday/canvas-kit-labs-react/common").FlexItemStyleProps & import("@workday/canvas-kit-labs-react/common").LayoutStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionLogicalProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceLogicalProps & Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "hidden" | "style" | "disabled" | "translate" | "prefix" | "form" | "slot" | "title" | "children" | "ref" | "key" | "className" | "name" | "dir" | "value" | "type" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "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" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & {
+export declare const StyledTabItem: import("@emotion/styled").StyledComponent<import("../../layout").BorderShorthandStyleProps & import("../../layout").BorderColorStyleProps & import("../../layout").BorderRadiusStyleProps & import("../../layout").BorderLineStyleProps & import("../../layout").BorderWidthStyleProps & import("../../layout").BorderLogicalStyleProps & import("../../layout").ColorStyleProps & import("../../layout").DepthStyleProps & import("../../layout").FlexItemStyleProps & import("../../layout").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../../layout").PositionStandardProps & import("../../layout").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps & Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "hidden" | "style" | "disabled" | "translate" | "prefix" | "form" | "slot" | "title" | "children" | "ref" | "key" | "className" | "name" | "dir" | "value" | "type" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "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" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 } & {
     theme?: import("@emotion/react").Theme | undefined;
@@ -80,7 +78,7 @@ export declare const StyledTabItem: import("@emotion/styled").StyledComponent<im
     hasIcon?: boolean | undefined;
 } & Pick<TabsItemProps, "spacing">, {}, {}>;
 export declare const TabsItem: import("../../common").ElementComponent<"button", TabsItemProps> & {
-    Icon: typeof SystemIcon;
+    Icon: import("../../common").ElementComponent<"span", import("../../icon").SystemIconProps>;
     Text: import("../../common").ElementComponent<"span", {}>;
 };
 export declare const useTabsItem: <P extends {}, R>(model: import("./list").ListModel<unknown>, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {} & P & (R extends HTMLOrSVGElement ? {

package/dist/es6/tabs/lib/TabsItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsItem.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAKL,UAAU,EAIV,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAC,MAAM,uCAAuC,CAAC;AAE1D,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAO1D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAC,UAAU,EAAC,MAAM,uCAAuC,CAAC;AACjE,MAAM,WAAW,aACf,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC,EACrC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;;OAaG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,aAAa;;;;;;2CA2FzB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;CAkCnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OAoBvB,CAAC"}
+{"version":3,"file":"TabsItem.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAKL,UAAU,EAIV,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAE,UAAU,EAAC,MAAM,kCAAkC,CAAC;AASjE,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AACzC,MAAM,WAAW,aACf,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC,EACrC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;;OAaG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,aAAa;;;;;;2CA2FzB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;CAkCnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OAoBvB,CAAC"}

package/dist/es6/tabs/lib/TabsItem.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { colors, space, type, borderRadius, iconColors } from '@workday/canvas-kit-react/tokens';
 import { createComponent, focusRing, hideMouseFocus, styled, useModelContext, createHook, composeHooks, ellipsisStyles, EllipsisText, useLocalRef, useMount, } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
 import { SystemIcon } from '@workday/canvas-kit-react/icon';
 import { useListRegisterItem } from './list';

package/dist/es6/tabs/lib/TabsList.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
-import { Stack } from '@workday/canvas-kit-labs-react/layout';
+import { Stack } from '@workday/canvas-kit-react/layout';
 import { TabsModel } from './useTabsModel';
 export interface TabListProps<T = unknown> extends Partial<ExtractProps<typeof Stack, never>> {
     /**

package/dist/es6/tabs/lib/TabsList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsList.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAM5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAGzC,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC3F;;;;;;;;OAQG;IACH,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IAC3D;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAClC;AAED,eAAO,MAAM,QAAQ,uEAoBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OAMvB,CAAC"}
+{"version":3,"file":"TabsList.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,kCAAkC,CAAC;AAMvD,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAGzC,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC3F;;;;;;;;OAQG;IACH,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;IAC3D;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAClC;AAED,eAAO,MAAM,QAAQ,uEAoBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OAMvB,CAAC"}

package/dist/es6/tabs/lib/TabsList.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { commonColors } from '@workday/canvas-kit-react/tokens';
 import { composeHooks, createComponent, createHook, useModelContext, } from '@workday/canvas-kit-react/common';
-import { Stack } from '@workday/canvas-kit-labs-react/layout';
+import { Stack } from '@workday/canvas-kit-react/layout';
 import { useOverflowMeasureContainer } from './overflow';
 import { useRenderItems } from './list';
 import { useResetCursorOnBlur } from './selection';
@@ -34,7 +34,7 @@ export var TabsList = createComponent('div')({
         var children = _a.children, model = _a.model, overflowButton = _a.overflowButton, elemProps = __rest(_a, ["children", "model", "overflowButton"]);
         var localModel = useModelContext(TabsModelContext, model);
         var props = useTabsList(localModel, elemProps, ref);
-        return (React.createElement(Stack, __assign({ as: Element, position: "relative", borderBottom: "1px solid " + commonColors.divider, marginX: "m", spacing: "xxxs" }, props),
+        return (React.createElement(Stack, __assign({ as: Element, position: "relative", borderBottom: "1px solid " + commonColors.divider, paddingX: "m", spacing: "xxxs" }, props),
             useRenderItems(localModel, children),
             overflowButton));
     },

package/dist/es6/tabs/lib/TabsPanel.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 import { TabsModel } from './useTabsModel';
 export interface TabPanelProps<T = unknown> extends ExtractProps<typeof Box, never> {
     /**

package/dist/es6/tabs/lib/TabsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsPanel.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAKL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAC,MAAM,uCAAuC,CAAC;AAG1D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC;IACjF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAID,eAAO,MAAM,YAAY;;;;;;;;OAwBxB,CAAC;AAEF,eAAO,MAAM,SAAS,wEAapB,CAAC"}
+{"version":3,"file":"TabsPanel.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAKL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAC,MAAM,kCAAkC,CAAC;AAGrD,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC;IACjF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAID,eAAO,MAAM,YAAY;;;;;;;;OAwBxB,CAAC;AAEF,eAAO,MAAM,SAAS,wEAapB,CAAC"}

package/dist/es6/tabs/lib/TabsPanel.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import styled from '@emotion/styled';
 import { createComponent, useModelContext, useMountLayout, createHook, hideMouseFocus, } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 import { TabsModelContext } from './Tabs';
 var StyledTabsPanel = styled(Box)(hideMouseFocus);
 export var useTabsPanel = createHook(function (_a, _, elemProps) {

package/dist/es6/tabs/lib/menu/Menu.d.ts

@@ -65,7 +65,7 @@ export declare const Menu: import("../../../common").Component<MenuProps<any>> &
      * HTML. If more complex HTML is provided, consider
      */
     Item: import("../../../common").ElementComponent<"button", import("./MenuItem").MenuItemProps<unknown>> & {
-        Icon: typeof import("../../..").SystemIcon;
+        Icon: import("../../../common").ElementComponent<"span", import("../../..").SystemIconProps>;
         Text: import("@emotion/styled").StyledComponent<{
             theme?: import("@emotion/react").Theme | undefined;
             as?: "symbol" | "object" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "clipPath" | "filter" | "mask" | "marker" | "big" | "link" | "sup" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;

package/dist/es6/tabs/lib/menu/MenuItem.d.ts

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { SystemIcon } from '@workday/canvas-kit-react/icon';
 import { MenuModel } from './useMenuModel';
 export interface MenuItemProps<T = unknown> {
     /**
@@ -38,7 +37,7 @@ export interface MenuItemProps<T = unknown> {
     hasIcon?: boolean;
 }
 export declare const MenuItem: import("../../../common").ElementComponent<"button", MenuItemProps<unknown>> & {
-    Icon: typeof SystemIcon;
+    Icon: import("../../../common").ElementComponent<"span", import("../../../icon").SystemIconProps>;
     Text: import("@emotion/styled").StyledComponent<{
         theme?: import("@emotion/react").Theme | undefined;
         as?: "symbol" | "object" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "clipPath" | "filter" | "mask" | "marker" | "big" | "link" | "sup" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;

package/dist/es6/tabs/lib/menu/MenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAM1D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO;IACxC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA2FD,eAAO,MAAM,QAAQ;;;;;;CAkCnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OASvB,CAAC"}
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO;IACxC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA2FD,eAAO,MAAM,QAAQ;;;;;;CAkCnB,CAAC;AAEH,eAAO,MAAM,WAAW;;OASvB,CAAC"}

package/dist/es6/tabs/lib/menu/MenuItem.js

@@ -25,7 +25,7 @@ import { colors, iconColors, typeColors, space, type } from '@workday/canvas-kit
 import { createComponent, styled, useModelContext, composeHooks, createHook, useLocalRef, useMount, } from '@workday/canvas-kit-react/common';
 import { SystemIcon } from '@workday/canvas-kit-react/icon';
 import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 import { useListRegisterItem } from '../list';
 import { useRovingFocus } from '../cursor';
 import { MenuModelContext } from './Menu';

package/dist/es6/tabs/lib/menu/MenuList.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
-import { Stack } from '@workday/canvas-kit-labs-react/layout';
+import { Stack } from '@workday/canvas-kit-react/layout';
 import { MenuModel } from './useMenuModel';
 export interface MenuListProps<T = unknown> extends Partial<ExtractProps<typeof Stack, never>> {
     /**

package/dist/es6/tabs/lib/menu/MenuList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAE5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAuBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}
+{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,kCAAkC,CAAC;AAEvD,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAuBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}

package/dist/es6/tabs/lib/menu/MenuList.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { commonColors } from '@workday/canvas-kit-react/tokens';
 import { createComponent, useModelContext, createHook, } from '@workday/canvas-kit-react/common';
-import { Stack } from '@workday/canvas-kit-labs-react/layout';
+import { Stack } from '@workday/canvas-kit-react/layout';
 import { MenuModelContext } from './Menu';
 import { useRenderItems } from '../list';
 export var MenuList = createComponent('div')({

package/dist/es6/text-input/lib/InputIconContainer.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { GrowthBehavior } from '@workday/canvas-kit-react/common';
 import { SystemIcon } from '@workday/canvas-kit-react/icon';
 export interface InputIconContainerProps extends GrowthBehavior {
-    icon?: React.ReactElement<SystemIcon>;
+    icon?: React.ReactElement<typeof SystemIcon>;
 }
 declare const InputIconContainer: React.FunctionComponent<InputIconContainerProps>;
 export default InputIconContainer;

package/dist/es6/text-input/lib/InputIconContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputIconContainer.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/InputIconContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAEhE,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAE1D,MAAM,WAAW,uBAAwB,SAAQ,cAAc;IAC7D,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;CACvC;AAaD,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CASxE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"InputIconContainer.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/InputIconContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAEhE,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAE1D,MAAM,WAAW,uBAAwB,SAAQ,cAAc;IAC7D,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,OAAO,UAAU,CAAC,CAAC;CAC9C;AAaD,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CASxE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/es6/toast/lib/Toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../toast/lib/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AACtD,OAAO,EAAsB,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAGlF,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAkB,YAAY,EAAqB,MAAM,kCAAkC,CAAC;AAGnG,MAAM,WAAW,UAAW,SAAQ,YAAY,CAAC,OAAO,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC;IACxE;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACjC;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAkCD,eAAO,MAAM,KAAK,4DA6ChB,CAAC"}
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../toast/lib/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AACtD,OAAO,EAAsB,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAGlF,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAkB,YAAY,EAAqB,MAAM,kCAAkC,CAAC;AAGnG,MAAM,WAAW,UAAW,SAAQ,YAAY,CAAC,OAAO,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC;IACxE;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACjC;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAkCD,eAAO,MAAM,KAAK,4DA8ChB,CAAC"}

package/dist/es6/toast/lib/Toast.js

@@ -51,7 +51,7 @@ export var Toast = createComponent('div')({
         _c = _a.iconColor, // needed for TS2742 - https://github.com/microsoft/TypeScript/issues/29808
         iconColor = _c === void 0 ? colors.greenApple400 : _c, onClose = _a.onClose, onActionClick = _a.onActionClick, actionText = _a.actionText, children = _a.children, elemProps = __rest(_a, ["icon", "iconColor", "onClose", "onActionClick", "actionText", "children"]);
         var isInteractive = onClose || onActionClick;
-        return (React.createElement(Popup.Card, __assign({ ref: ref, as: Element, width: toastWidth, padding: "s", role: isInteractive ? 'dialog' : 'status', "aria-live": isInteractive ? 'off' : 'polite', "aria-atomic": !isInteractive }, elemProps),
+        return (React.createElement(Popup.Card, __assign({ ref: ref, as: Element, width: toastWidth, padding: "s", depth: 5, role: isInteractive ? 'dialog' : 'status', "aria-live": isInteractive ? 'off' : 'polite', "aria-atomic": !isInteractive }, elemProps),
             onClose && React.createElement(Popup.CloseIcon, { "aria-label": "Close", onClick: onClose, size: "small" }),
             React.createElement(Popup.Body, null,
                 React.createElement(ToastContentContainer, { onClose: onClose },

package/dist/es6/tokens/lib/depth.d.ts

@@ -1,23 +1,23 @@
 export declare type CanvasDepth = {
     /**
-     * ### Depth Inset
-     * 	Used for inset containers
+     * ### Depth None
+     * 	Used for removing existing depth
      *
      * @example
      * ```ts
      * import { depth } from '@workday/canvas-kit-react/tokens';
      *
-     * const insetCardStyles = {
-     *   ...depth.inset,
+     * const noDepthCardStyles = {
+     *   ...depth.none,
      * };
      * ```
      */
-    inset: {
-        boxShadow: 'inset 0px 0px 8px 0 rgba(82, 97, 115, 0.09)';
+    none: {
+        boxShadow: 'none';
     };
     /**
      * ### Depth 1
-     * Used for minimal offset
+     * Used for minimal offset and Cards
      *
      * @example
      * ```ts
@@ -29,11 +29,11 @@ export declare type CanvasDepth = {
      * ```
      */
     1: {
-        boxShadow: '0px 2px 4px 0 rgba(0, 0, 0, 0.08)';
+        boxShadow: '0px 1px 4px rgba(0, 0, 0, 0.2), 0px 2px 8px rgba(0, 0, 0, 0.16)';
     };
     /**
      * ### Depth 2
-     * Used for Cards, Popups, and Menus — our most common depth
+     * Used for Top navigation, Bottom navigation
      *
      * @example
      * ```ts
@@ -45,11 +45,11 @@ export declare type CanvasDepth = {
      * ```
      */
     2: {
-        boxShadow: '0px 4px 8px 0 rgba(0, 0, 0, 0.1)';
+        boxShadow: '0px 2px 8px rgba(0, 0, 0, 0.2), 0px 4px 16px rgba(0, 0, 0, 0.16)';
     };
     /**
      * ### Depth 3
-     * Used for interactive Cards on hover
+     * Used for FABs, Menus
      *
      * @example
      * ```ts
@@ -61,11 +61,11 @@ export declare type CanvasDepth = {
      * ```
      */
     3: {
-        boxShadow: '0px 8px 16px 0 rgba(0, 0, 0, 0.12)';
+        boxShadow: '0px 3px 12px rgba(0, 0, 0, 0.2), 0px 6px 24px rgba(0, 0, 0, 0.16)';
     };
     /**
      * ### Depth 4
-     * Used for Cards on white backgrounds — adds border styles for more contrast
+     *
      *
      * @example
      * ```ts
@@ -77,8 +77,39 @@ export declare type CanvasDepth = {
      * ```
      */
     4: {
-        border: '1px solid rgba(218, 226, 230, 1)';
-        boxShadow: '0px 8px 16px 0 rgba(0, 0, 0, 0.12)';
+        boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2), 0px 8px 32px rgba(0, 0, 0, 0.16)';
+    };
+    /**
+     * ### Depth 5
+     * Used for Popups, Toast Messages, Dialogs, Side Panels without opacity overlay behavior
+     *
+     * @example
+     * ```ts
+     * import { depth } from '@workday/canvas-kit-react/tokens';
+     *
+     * const cardStyles = {
+     *   ...depth[5],
+     * };
+     * ```
+     */
+    5: {
+        boxShadow: '0px 5px 20px rgba(0, 0, 0, 0.2), 0px 10px 40px rgba(0, 0, 0, 0.16)';
+    };
+    /**
+     * ### Depth 6
+     * Used for components with opacity overlay behavior such as Modal or Side Panels
+     *
+     * @example
+     * ```ts
+     * import { depth } from '@workday/canvas-kit-react/tokens';
+     *
+     * const cardStyles = {
+     *   ...depth[6],
+     * };
+     * ```
+     */
+    6: {
+        boxShadow: '0px 6px 24px rgba(0, 0, 0, 0.2), 0px 12px 48px rgba(0, 0, 0, 0.16)';
     };
 };
 declare type ValueOf<T> = T[keyof T];
@@ -88,8 +119,8 @@ export declare type CanvasDepthValues = ValueOf<CanvasDepth>;
  *
  * Depth is the relative distance between surfaces in the z-axis.
  * It provides delineation, focus, and priority with shadows and layering.
- * There are five depth levels, `inset`, `1`, `2`, `3`, and `4`.
- * Most levels only apply box-shadow styles, but `depth[4]` also applies border styles.
+ * There are seven depth levels, `none`, `1`, `2`, `3`, `4`, `5` and `6`.
+ * `none` is a special value to remove depth styles. All other levels only apply box-shadow styles.
  *
  * @example
  * ```tsx

package/dist/es6/tokens/lib/depth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"depth.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/depth.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW,GAAG;IACxB;;;;;;;;;;;;OAYG;IACH,KAAK,EAAE;QACL,SAAS,EAAE,6CAA6C,CAAC;KAC1D,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,mCAAmC,CAAC;KAChD,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,kCAAkC,CAAC;KAC/C,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,oCAAoC,CAAC;KACjD,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,MAAM,EAAE,kCAAkC,CAAC;QAC3C,SAAS,EAAE,oCAAoC,CAAC;KACjD,CAAC;CACH,CAAC;AAEF,aAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7B,oBAAY,iBAAiB,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,KAAK,EAAE,WAiBnB,CAAC"}
+{"version":3,"file":"depth.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/depth.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW,GAAG;IACxB;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE;QACJ,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,iEAAiE,CAAC;KAC9E,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,kEAAkE,CAAC;KAC/E,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,mEAAmE,CAAC;KAChF,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,mEAAmE,CAAC;KAChF,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,oEAAoE,CAAC;KACjF,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,oEAAoE,CAAC;KACjF,CAAC;CACH,CAAC;AAEF,aAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7B,oBAAY,iBAAiB,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,KAAK,EAAE,WAsBnB,CAAC"}

package/dist/es6/tokens/lib/depth.js

@@ -3,8 +3,8 @@
  *
  * Depth is the relative distance between surfaces in the z-axis.
  * It provides delineation, focus, and priority with shadows and layering.
- * There are five depth levels, `inset`, `1`, `2`, `3`, and `4`.
- * Most levels only apply box-shadow styles, but `depth[4]` also applies border styles.
+ * There are seven depth levels, `none`, `1`, `2`, `3`, `4`, `5` and `6`.
+ * `none` is a special value to remove depth styles. All other levels only apply box-shadow styles.
  *
  * @example
  * ```tsx
@@ -21,20 +21,25 @@
  *
  */
 export var depth = {
-    inset: {
-        boxShadow: 'inset 0px 0px 8px 0 rgba(82, 97, 115, 0.09)',
+    none: {
+        boxShadow: 'none',
     },
     1: {
-        boxShadow: '0px 2px 4px 0 rgba(0, 0, 0, 0.08)',
+        boxShadow: '0px 1px 4px rgba(0, 0, 0, 0.2), 0px 2px 8px rgba(0, 0, 0, 0.16)',
     },
     2: {
-        boxShadow: '0px 4px 8px 0 rgba(0, 0, 0, 0.1)',
+        boxShadow: '0px 2px 8px rgba(0, 0, 0, 0.2), 0px 4px 16px rgba(0, 0, 0, 0.16)',
     },
     3: {
-        boxShadow: '0px 8px 16px 0 rgba(0, 0, 0, 0.12)',
+        boxShadow: '0px 3px 12px rgba(0, 0, 0, 0.2), 0px 6px 24px rgba(0, 0, 0, 0.16)',
     },
     4: {
-        border: '1px solid rgba(218, 226, 230, 1)',
-        boxShadow: '0px 8px 16px 0 rgba(0, 0, 0, 0.12)',
+        boxShadow: '0px 4px 16px rgba(0, 0, 0, 0.2), 0px 8px 32px rgba(0, 0, 0, 0.16)',
+    },
+    5: {
+        boxShadow: '0px 5px 20px rgba(0, 0, 0, 0.2), 0px 10px 40px rgba(0, 0, 0, 0.16)',
+    },
+    6: {
+        boxShadow: '0px 6px 24px rgba(0, 0, 0, 0.2), 0px 12px 48px rgba(0, 0, 0, 0.16)',
     },
 };

package/dist/es6/tooltip/lib/Tooltip.d.ts

@@ -24,7 +24,7 @@ export interface TooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
      * Determines the tooltip type for accessibility.
      *
      * - `label`: Sets the accessible name for the wrapped element. Use for icons or if tooltip
-     *   `title` prop is the same as the text content of the wrapped element. E.g. IconButtons or
+     *   `title` prop is the same as the text content of the wrapped element. E.g. TertiaryButtons that render an icon or
      *   Ellipsis tooltips.
      * - `describe`: Sets `aria-describedby` of the wrapped element. Use if the tooltip has additional
      *   information about the target.

package/dist/es6/tooltip/lib/useTooltip.d.ts

@@ -8,7 +8,7 @@ export declare function useTooltip<T extends Element = Element>({ type, titleTex
      * Determines the tooltip type for accessibility.
      *
      * - `label`: Sets the accessible name for the wrapped element. Use for icons or if tooltip
-     *   `title` prop is the same as the text content of the wrapped element. E.g. IconButtons or
+     *   `title` prop is the same as the text content of the wrapped element. E.g. TertiaryButton that renders an icon or
      *   Ellipsis tooltips.
      * - `describe`: Sets `aria-describedby` of the wrapped element. Use if the tooltip has additional
      *   information about the target.

package/icon/README.md

@@ -82,12 +82,6 @@ Default: `false`
 
 ---
 
-#### `iconRef: React.Ref<HTMLSpanElement>`
-
-> Returns the ref to the rendered icon.
-
----
-
 #### `shouldMirror: boolean`
 
 > If set to `true`, transform the SVG's x-axis to mirror the graphic
@@ -177,12 +171,6 @@ Default: `92`
 
 ---
 
-#### `iconRef: React.Ref<HTMLSpanElement>`
-
-> Returns the ref to the rendered icon.
-
----
-
 #### `shouldMirror: boolean`
 
 > If set to `true`, transform the SVG's x-axis to mirror the graphic
@@ -292,12 +280,6 @@ Default: `'transparent'`
 
 ---
 
-#### `iconRef: React.Ref<HTMLSpanElement>`
-
-> Returns the ref to the rendered icon.
-
----
-
 #### `shouldMirror: boolean`
 
 > If set to `true`, transform the SVG's x-axis to mirror the graphic
@@ -358,12 +340,6 @@ Default: `SystemIconCircleSize.l` (`40`)
 
 ---
 
-#### `iconRef: React.Ref<HTMLSpanElement>`
-
-> Returns the ref to the rendered icon.
-
----
-
 #### `shouldMirror: boolean`
 
 > If set to `true`, transform the SVG's x-axis to mirror the graphic
@@ -443,12 +419,6 @@ Default: `height of graphic`
 
 Default: `false`
 
-#### `iconRef: React.Ref<HTMLSpanElement>`
-
-> Returns the ref to the rendered icon.
-
----
-
 #### `shouldMirror: boolean`
 
 > If set to `true`, transform the SVG's x-axis to mirror the graphic

package/icon/lib/AccentIcon.tsx

@@ -3,6 +3,7 @@ import {colors} from '@workday/canvas-kit-react/tokens';
 import {CanvasAccentIcon, CanvasIconTypes} from '@workday/design-assets-types';
 import {CSSObject} from '@emotion/styled';
 import Icon, {IconProps} from './Icon';
+import {createComponent} from '../../common';
 
 export interface AccentIconStyles {
   /**
@@ -17,7 +18,9 @@ export interface AccentIconStyles {
   transparent?: boolean;
 }
 
-export interface AccentIconProps extends AccentIconStyles, Omit<IconProps, 'src' | 'type'> {
+export interface AccentIconProps
+  extends AccentIconStyles,
+    Omit<IconProps, 'src' | 'type' | 'color'> {
   /**
    *  The icon to display from `@workday/canvas-accent-icons-web`.
    */
@@ -41,28 +44,26 @@ export const accentIconStyles = ({
   },
 });
 
-export default class AccentIcon extends React.Component<AccentIconProps> {
-  render() {
-    const {
-      transparent = false,
-      size = 56,
-      icon,
-      color,
-      iconRef,
-      shouldMirror,
-      ...elemProps
-    } = this.props;
-
+const AccentIcon = createComponent('span')({
+  displayName: 'AccentIcon',
+  Component: (
+    {transparent = false, size = 56, icon, color, shouldMirror, ...elemProps}: AccentIconProps,
+    ref,
+    Element
+  ) => {
     return (
       <Icon
         src={icon}
         type={CanvasIconTypes.Accent}
         styles={accentIconStyles({color, transparent})}
         size={size}
-        iconRef={iconRef}
+        as={Element}
+        ref={ref}
         shouldMirror={shouldMirror}
         {...elemProps}
       />
     );
-  }
-}
+  },
+});
+
+export default AccentIcon;