@workday/canvas-kit-labs-react 7.0.0-alpha.129-next.3 → 7.0.0-alpha.256-next.2

package/dist/commonjs/toast/lib/ToastLink.d.ts

@@ -0,0 +1,9 @@
+import { HyperlinkProps } from '@workday/canvas-kit-react/button';
+export interface ToastLinkProps extends HyperlinkProps {
+    /**
+     * attribute for the hyperlink URL
+     */
+    href: string;
+}
+export declare const ToastLink: import("@workday/canvas-kit-react/common").ElementComponent<"a", ToastLinkProps>;
+//# sourceMappingURL=ToastLink.d.ts.map

package/dist/commonjs/toast/lib/ToastLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastLink.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastLink.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAY,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAG3E,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;CACd;AAMD,eAAO,MAAM,SAAS,kFASpB,CAAC"}

package/dist/commonjs/toast/lib/ToastLink.js

@@ -0,0 +1,42 @@
+"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.ToastLink = void 0;
+var react_1 = __importDefault(require("react"));
+var common_1 = require("@workday/canvas-kit-react/common");
+var button_1 = require("@workday/canvas-kit-react/button");
+var tokens_1 = require("@workday/canvas-kit-react/tokens");
+var StyledHyperLink = common_1.styled(button_1.Hyperlink)({
+    marginTop: tokens_1.space.xxxs,
+});
+exports.ToastLink = common_1.createComponent('a')({
+    displayName: 'Toast.Link',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, href = _a.href, elemProps = __rest(_a, ["children", "href"]);
+        return (react_1.default.createElement(StyledHyperLink, __assign({ ref: ref, href: href, as: Element }, elemProps), children));
+    },
+});

package/dist/commonjs/toast/lib/ToastMessage.d.ts

@@ -0,0 +1,11 @@
+import { FlexProps } from '@workday/canvas-kit-react/layout';
+export interface ToastMessageProps extends FlexProps {
+}
+export declare const ToastMessage: import("@workday/canvas-kit-react/common").ElementComponentM<"div", ToastMessageProps, {
+    state: {
+        id: string;
+        mode: import("./hooks/useToastModel").AriaRoleMode;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=ToastMessage.d.ts.map

package/dist/commonjs/toast/lib/ToastMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastMessage.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastMessage.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAO,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAGjE,MAAM,WAAW,iBAAkB,SAAQ,SAAS;CAAG;AAMvD,eAAO,MAAM,YAAY;;;;;;EAQvB,CAAC"}

package/dist/commonjs/toast/lib/ToastMessage.js

@@ -0,0 +1,41 @@
+"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.ToastMessage = void 0;
+var react_1 = __importDefault(require("react"));
+var common_1 = require("@workday/canvas-kit-react/common");
+var layout_1 = require("@workday/canvas-kit-react/layout");
+var useToastModel_1 = require("./hooks/useToastModel");
+var StyledMessage = common_1.styled(layout_1.Flex)({
+    wordBreak: 'break-word',
+});
+exports.ToastMessage = common_1.createSubcomponent('div')({
+    modelHook: useToastModel_1.useToastModel,
+})(function (_a, Element, model) {
+    var children = _a.children, elemProps = __rest(_a, ["children"]);
+    return (react_1.default.createElement(StyledMessage, __assign({ flexDirection: "column", id: model.state.id, as: Element }, elemProps), children));
+});

package/dist/commonjs/toast/lib/hooks/useToastModel.d.ts

@@ -0,0 +1,65 @@
+export declare type AriaRoleMode = 'dialog' | 'status' | 'alert';
+export declare const useToastModel: (<TT_Special_Generic>(config?: (Partial<{
+    /**
+     * Sets the correct aria attributes for the Toast.
+     * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+     * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+     * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+     * @default 'status'
+     */
+    mode: AriaRoleMode;
+    /**
+     * When the Toast has a `mode="dialog"` this adds a unique id to type the `Toast.Message` to the dialog.
+     */
+    id: string;
+}> & {} & {}) | undefined) => {
+    state: {
+        id: string;
+        /**
+         * Sets the correct aria attributes for the Toast.
+         * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+         * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+         * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+         * @default 'status'
+         */
+        mode: AriaRoleMode;
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    /**
+     * Sets the correct aria attributes for the Toast.
+     * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+     * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+     * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+     * @default 'status'
+     */
+    mode: AriaRoleMode;
+    /**
+     * When the Toast has a `mode="dialog"` this adds a unique id to type the `Toast.Message` to the dialog.
+     */
+    id: string;
+}, {}, {
+    id: string;
+    /**
+     * Sets the correct aria attributes for the Toast.
+     * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+     * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+     * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+     * @default 'status'
+     */
+    mode: AriaRoleMode;
+}, {}, {
+    state: {
+        id: string;
+        /**
+         * Sets the correct aria attributes for the Toast.
+         * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+         * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+         * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+         * @default 'status'
+         */
+        mode: AriaRoleMode;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=useToastModel.d.ts.map

package/dist/commonjs/toast/lib/hooks/useToastModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToastModel.d.ts","sourceRoot":"","sources":["../../../../../toast/lib/hooks/useToastModel.tsx"],"names":[],"mappings":"AACA,oBAAY,YAAY,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD,eAAO,MAAM,aAAa;IAEtB;;;;;;OAMG;;IAEH;;OAEG;;;;;QAVH;;;;;;WAMG;;;;;IANH;;;;;;OAMG;;IAEH;;OAEG;;;;IAVH;;;;;;OAMG;;;;;QANH;;;;;;WAMG;;;;EAeL,CAAC"}

package/dist/commonjs/toast/lib/hooks/useToastModel.js

@@ -0,0 +1,35 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useToastModel = void 0;
+var common_1 = require("@workday/canvas-kit-react/common");
+exports.useToastModel = common_1.createModelHook({
+    defaultConfig: {
+        /**
+         * Sets the correct aria attributes for the Toast.
+         * Alert toasts are used to convey urgency and important information. The `role` is set to `alert`
+         * Status toasts are used to convey a message or a successful action. The `role` is set to `status`
+         * Dialog toasts are used when there's an action to be taken. The `role` is set to `dialog`
+         * @default 'status'
+         */
+        mode: 'status',
+        /**
+         * When the Toast has a `mode="dialog"` this adds a unique id to type the `Toast.Message` to the dialog.
+         */
+        id: '',
+    },
+})(function (config) {
+    var id = common_1.useUniqueId(config.id);
+    var state = __assign(__assign({}, config), { id: id });
+    return { state: state, events: {} };
+});

package/dist/es6/combobox/lib/AutocompleteList.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
-import { MenuItemProps } from '@workday/canvas-kit-preview-react/menu';
 import { ComboBoxMenuItemGroup } from './Combobox';
 interface AutocompleteListProps {
     /**
      * The autocomplete items of the Combobox. This array of menu items is shown under the text input.
      */
-    autocompleteItems: React.ReactElement<MenuItemProps>[] | ComboBoxMenuItemGroup[];
+    autocompleteItems: React.ReactElement<any>[] | ComboBoxMenuItemGroup[];
     /**
      * Index of the active autocomplete item
      */
@@ -13,7 +12,7 @@ interface AutocompleteListProps {
     /**
      * The function called when an autocomplete item is selected
      */
-    handleAutocompleteClick: (event: React.SyntheticEvent<Element, Event>, menuItemProps: MenuItemProps) => void;
+    handleAutocompleteClick: (event: React.SyntheticEvent<Element, Event>, menuItemProps: any) => void;
     /**
      * The id of the form field.
      */

package/dist/es6/combobox/lib/AutocompleteList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/AutocompleteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AACrE,OAAO,EAAC,qBAAqB,EAAiD,MAAM,YAAY,CAAC;AAYjG,UAAU,qBAAqB;IAC7B;;OAEG;IACH,iBAAiB,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACjF;;OAEG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,uBAAuB,EAAE,CACvB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,EAC3C,aAAa,EAAE,aAAa,KACzB,IAAI,CAAC;IACV;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,gBAAgB,uGAO1B,qBAAqB,uBAiFvB,CAAC"}
+{"version":3,"file":"AutocompleteList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/AutocompleteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAC,qBAAqB,EAAiD,MAAM,YAAY,CAAC;AAYjG,UAAU,qBAAqB;IAC7B;;OAEG;IACH,iBAAiB,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACvE;;OAEG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,uBAAuB,EAAE,CACvB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,EAC3C,aAAa,EAAE,GAAG,KACf,IAAI,CAAC;IACV;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,gBAAgB,uGAO1B,qBAAqB,uBAiFvB,CAAC"}

package/dist/es6/combobox/lib/Combobox.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
 import { GrowthBehavior } from '@workday/canvas-kit-react/common';
-import { MenuItemProps } from '@workday/canvas-kit-preview-react/menu';
 import { TertiaryButtonProps } from '@workday/canvas-kit-react/button';
 import { TextInputProps } from '@workday/canvas-kit-react/text-input';
 export interface ComboBoxMenuItemGroup {
-    header: React.ReactElement<MenuItemProps>;
-    items: React.ReactElement<MenuItemProps>[];
+    header: React.ReactElement<any>;
+    items: React.ReactElement<any>[];
 }
 export interface ComboboxProps extends GrowthBehavior, React.HTMLAttributes<HTMLElement> {
     /**
@@ -33,7 +32,7 @@ export interface ComboboxProps extends GrowthBehavior, React.HTMLAttributes<HTML
     /**
      * The autocomplete items of the Combobox. This array of menu items is shown under the text input.
      */
-    autocompleteItems?: React.ReactElement<MenuItemProps>[] | ComboBoxMenuItemGroup[];
+    autocompleteItems?: React.ReactElement<any>[] | ComboBoxMenuItemGroup[];
     /**
      * The function called when the Combobox text input changes.
      */

package/dist/es6/combobox/lib/Combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EACL,cAAc,EAKf,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AAErE,OAAO,EAAiB,mBAAmB,EAAC,MAAM,kCAAkC,CAAC;AAErF,OAAO,EAAC,cAAc,EAAC,MAAM,sCAAsC,CAAC;AAKpE,MAAM,WAAW,qBAAqB;IAEpC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAE1C,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;CAC5C;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACtF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;IAC7C;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACpD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAClF;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AA2DD,eAAO,MAAM,aAAa,YAAY,CAAC;AAEvC,eAAO,MAAM,WAAW,qEACc,CAAC;AAEvC,eAAO,MAAM,kBAAkB,cAAe,MAAM,SAAS,WAc5D,CAAC;AAYF,eAAO,MAAM,QAAQ,wLAelB,aAAa,gBA0Tf,CAAC"}
+{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EACL,cAAc,EAKf,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAiB,mBAAmB,EAAC,MAAM,kCAAkC,CAAC;AAErF,OAAO,EAAC,cAAc,EAAC,MAAM,sCAAsC,CAAC;AAKpE,MAAM,WAAW,qBAAqB;IAEpC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC;IAEhC,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;CAClC;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACtF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;IAC7C;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACpD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACxE;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AA2DD,eAAO,MAAM,aAAa,YAAY,CAAC;AAEvC,eAAO,MAAM,WAAW,qEACc,CAAC;AAEvC,eAAO,MAAM,kBAAkB,cAAe,MAAM,SAAS,WAc5D,CAAC;AAYF,eAAO,MAAM,QAAQ,wLAelB,aAAa,gBAuTf,CAAC"}

package/dist/es6/combobox/lib/Combobox.js

@@ -217,10 +217,6 @@ export var Combobox = function (_a) {
     var handleBlur = function (event) {
         if (comboboxRef.current) {
             var target = event.relatedTarget;
-            if (target === null) {
-                // IE11 swaps related and active target before it fires the blur event
-                target = document.activeElement;
-            }
             if (target && comboboxRef.current.contains(target)) {
                 return;
             }
@@ -303,7 +299,7 @@ export var Combobox = function (_a) {
     };
     var renderChildren = function (inputElement) {
         var _a;
-        var cssOverride = { zIndex: 2 };
+        var cssOverride = { ':focus': { zIndex: 2 } };
         if (showClearButton) {
             var paddingDirection = isRTL ? 'paddingLeft' : 'paddingRight';
             cssOverride = __assign(__assign({}, cssOverride), (_a = {}, _a[paddingDirection] = space.xl, _a));

package/dist/es6/common/index.d.ts

@@ -1,4 +1,2 @@
 export * from './lib/theming';
-export { ComponentStatesTable } from './lib/storybook-utils/ComponentStatesTable';
-export { permutateProps } from './lib/storybook-utils/permutateProps';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/common/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../common/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAC,oBAAoB,EAAC,MAAM,4CAA4C,CAAC;AAChF,OAAO,EAAC,cAAc,EAAC,MAAM,sCAAsC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../common/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/dist/es6/common/index.js

@@ -1,3 +1 @@
 export * from './lib/theming';
-export { ComponentStatesTable } from './lib/storybook-utils/ComponentStatesTable';
-export { permutateProps } from './lib/storybook-utils/permutateProps';

package/dist/es6/common/lib/theming/useThemeRTL.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useThemeRTL.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemeRTL.ts"],"names":[],"mappings":"AAMA,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAI/D,oBAAY,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAW5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,WAAW;6BAMD,aAAa,EAAE;;EAYxC"}
+{"version":3,"file":"useThemeRTL.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemeRTL.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAI/D,oBAAY,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAc5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,WAAW;6BAMD,aAAa,EAAE;;EAYxC"}

package/dist/es6/common/lib/theming/useThemeRTL.js

@@ -16,7 +16,7 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
             r[k] = a[j];
     return r;
 };
-import { convertToStaticStates, useIsRTL, useTheme, } from '@workday/canvas-kit-react/common';
+import { useIsRTL, useTheme } from '@workday/canvas-kit-react/common';
 import { useMemo } from 'react';
 import rtlCSSJS from 'rtl-css-js';
 var getDirectionalStyles = function (isRTL) {
@@ -26,9 +26,8 @@ var getDirectionalStyles = function (isRTL) {
     }
     return isRTL ? rtlCSSJS(styles) : styles;
 };
-var getConvertedStyles = function (shouldConvert, styles) {
-    var _a;
-    return shouldConvert ? (_a = convertToStaticStates(styles)) !== null && _a !== void 0 ? _a : styles : styles;
+var getConvertedStyles = function (styles, convertFunc) {
+    return convertFunc ? convertFunc(styles) : styles;
 };
 /**
  * A helpful hook for supporting bidirectional styles.
@@ -60,10 +59,9 @@ var getConvertedStyles = function (shouldConvert, styles) {
  * }
  */
 export function useThemeRTL() {
-    var _a;
     var theme = useTheme();
     var direction = useIsRTL(theme);
-    var shouldConvert = (_a = theme.canvas._staticStates) !== null && _a !== void 0 ? _a : false;
+    var convertFunc = theme.canvas._styleRewriteFn;
     var themeRTL = useMemo(function () {
         return function () {
             var cssObject = [];
@@ -72,11 +70,11 @@ export function useThemeRTL() {
             }
             var styles = getDirectionalStyles.apply(void 0, __spreadArrays([direction], cssObject));
             return styles.reduce(function (first, second) {
-                var convertedFirst = shouldConvert ? getConvertedStyles(shouldConvert, first) : first;
-                var convertedSecond = shouldConvert ? getConvertedStyles(shouldConvert, second) : second;
+                var convertedFirst = getConvertedStyles(first, convertFunc);
+                var convertedSecond = getConvertedStyles(second, convertFunc);
                 return __assign(__assign({}, convertedFirst), convertedSecond);
             }, {});
         };
-    }, [direction, shouldConvert]);
+    }, [direction, convertFunc]);
     return { themeRTL: themeRTL, theme: theme };
 }

package/dist/es6/drawer/index.d.ts

@@ -1,3 +1,3 @@
-export { DrawerHeader } from './lib/DrawerHeader';
+export { DeprecatedDrawerHeader } from './lib/DrawerHeader';
 export * from './lib/Drawer';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/drawer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAC,MAAM,oBAAoB,CAAC;AAChD,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,sBAAsB,EAAC,MAAM,oBAAoB,CAAC;AAC1D,cAAc,cAAc,CAAC"}

package/dist/es6/drawer/index.js

@@ -1,2 +1,2 @@
-export { DrawerHeader } from './lib/DrawerHeader';
+export { DeprecatedDrawerHeader } from './lib/DrawerHeader';
 export * from './lib/Drawer';

package/dist/es6/drawer/lib/Drawer.d.ts

@@ -1,49 +1,74 @@
 import * as React from 'react';
 import { CanvasSpaceValues } from '@workday/canvas-kit-react/tokens';
-export interface DrawerProps extends React.HTMLAttributes<HTMLDivElement> {
+/**
+ * ### Deprecated Drawer Props
+ *
+ * As of Canvas Kit v8, Drawer is being soft-deprecated.
+ * It will be hard-deprecated (completely removed) in v9. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export interface DeprecatedDrawerProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
-     * The padding of the Drawer contents.
+     * The padding of the DeprecatedDrawer contents.
      * @default space.s
      */
     padding?: CanvasSpaceValues;
     /**
-     * The direction from which the Drawer opens. Accepts `Left` or `Right`.
-     * @default DrawerDirection.Right
+     * The direction from which the DeprecatedDrawer opens. Accepts `Left` or `Right`.
+     * @default DeprecatedDrawerDirection.Right
      */
-    openDirection?: DrawerDirection;
+    openDirection?: DeprecatedDrawerDirection;
     /**
-     * The width of the Drawer in `px`.
+     * The width of the DeprecatedDrawer in `px`.
      * @default 360
      */
     width?: number;
     /**
-     * If true, render the Drawer with a drop shadow.
+     * If true, render the DeprecatedDrawer with a drop shadow.
      * @default false
      */
     showDropShadow?: boolean;
     /**
-     * The optional DrawerHeader component of the Drawer. Shows an optional string and close button.
+     * The optional DeprecatedDrawerHeader component of the DeprecatedDrawer. Shows an optional string and close button.
      */
     header?: React.ReactElement;
     /**
-     * The `aria-labelledby` of the Drawer. Set this when there is a `header` for accessibility. The `role` attribute should also be used when this attribute is present. This value should be the same as the `id` attribute of the `header` element.
+     * The `aria-labelledby` of the DeprecatedDrawer. Set this when there is a `header` for accessibility. The `role` attribute should also be used when this attribute is present. This value should be the same as the `id` attribute of the `header` element.
      */
     'aria-labelledby'?: string;
     /**
-     * The `aria-label` for the Drawer. Set this when there is NO `header` for accessibility.
+     * The `aria-label` for the DeprecatedDrawer. Set this when there is NO `header` for accessibility.
      */
     'aria-label'?: string;
     /**
-     * The role of the Drawer. If `role` is provided, you must also set `aria-labelledby` to link `header` to the `role`.
+     * The role of the DeprecatedDrawer. If `role` is provided, you must also set `aria-labelledby` to link `header` to the `role`.
      */
     role?: string;
 }
-export declare enum DrawerDirection {
+/**
+ * ### Deprecated Drawer Direction
+ *
+ * As of Canvas Kit v8, Drawer is being soft-deprecated.
+ * It will be hard-deprecated (completely removed) in v9. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export declare enum DeprecatedDrawerDirection {
     Left = 0,
     Right = 1
 }
-export declare class Drawer extends React.Component<DrawerProps, {}> {
-    static OpenDirection: typeof DrawerDirection;
+/**
+ * ### Deprecated Drawer
+ *
+ * As of Canvas Kit v8, this component is being soft-deprecated.
+ * It will be hard-deprecated (completely removed) in v9. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export declare class DeprecatedDrawer extends React.Component<DeprecatedDrawerProps, {}> {
+    static OpenDirection: typeof DeprecatedDrawerDirection;
+    componentDidMount(): void;
     render(): JSX.Element;
 }
 //# sourceMappingURL=Drawer.d.ts.map

package/dist/es6/drawer/lib/Drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../drawer/lib/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAgB,iBAAiB,EAAC,MAAM,kCAAkC,CAAC;AAElF,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC5B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,oBAAY,eAAe;IACzB,IAAI,IAAA;IACJ,KAAK,IAAA;CACN;AA4CD,qBAAa,MAAO,SAAQ,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,EAAE,CAAC;IAC1D,MAAM,CAAC,aAAa,yBAAmB;IAEhC,MAAM;CAyBd"}
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../drawer/lib/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAgB,iBAAiB,EAAC,MAAM,kCAAkC,CAAC;AAElF;;;;;;;GAOG;AAEH,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACjF;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,yBAAyB,CAAC;IAC1C;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC5B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;;;;;;GAOG;AAEH,oBAAY,yBAAyB;IACnC,IAAI,IAAA;IACJ,KAAK,IAAA;CACN;AA6CD;;;;;;;GAOG;AAEH,qBAAa,gBAAiB,SAAQ,KAAK,CAAC,SAAS,CAAC,qBAAqB,EAAE,EAAE,CAAC;IAC9E,MAAM,CAAC,aAAa,mCAA6B;IAEjD,iBAAiB;IASV,MAAM;CAyBd"}

package/dist/es6/drawer/lib/Drawer.js

@@ -36,11 +36,19 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import styled from '@emotion/styled';
 import { colors, space } from '@workday/canvas-kit-react/tokens';
-export var DrawerDirection;
-(function (DrawerDirection) {
-    DrawerDirection[DrawerDirection["Left"] = 0] = "Left";
-    DrawerDirection[DrawerDirection["Right"] = 1] = "Right";
-})(DrawerDirection || (DrawerDirection = {}));
+/**
+ * ### Deprecated Drawer Direction
+ *
+ * As of Canvas Kit v8, Drawer is being soft-deprecated.
+ * It will be hard-deprecated (completely removed) in v9. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+export var DeprecatedDrawerDirection;
+(function (DeprecatedDrawerDirection) {
+    DeprecatedDrawerDirection[DeprecatedDrawerDirection["Left"] = 0] = "Left";
+    DeprecatedDrawerDirection[DeprecatedDrawerDirection["Right"] = 1] = "Right";
+})(DeprecatedDrawerDirection || (DeprecatedDrawerDirection = {}));
 var DrawerContainer = styled('div')({
     height: '100%',
     backgroundColor: 'white',
@@ -55,26 +63,25 @@ var DrawerContainer = styled('div')({
 }, function (_a) {
     var showDropShadow = _a.showDropShadow, openDirection = _a.openDirection;
     return ({
-        boxShadow: openDirection === DrawerDirection.Right && showDropShadow
+        boxShadow: openDirection === DeprecatedDrawerDirection.Right && showDropShadow
             ? '-8px 0px 16px 0 rgba(0,0,0,0.12)'
-            : openDirection === DrawerDirection.Left && showDropShadow
+            : openDirection === DeprecatedDrawerDirection.Left && showDropShadow
                 ? '8px 0px 16px 0 rgba(0,0,0,0.12)'
                 : undefined,
     });
 }, function (_a) {
     var openDirection = _a.openDirection;
     return ({
-        borderLeft: openDirection === DrawerDirection.Right ? "1px solid " + colors.soap400 : undefined,
-        borderRight: openDirection === DrawerDirection.Left ? "1px solid " + colors.soap400 : undefined,
-        right: openDirection === DrawerDirection.Right ? space.zero : undefined,
-        left: openDirection === DrawerDirection.Left ? space.zero : undefined,
+        borderLeft: openDirection === DeprecatedDrawerDirection.Right ? "1px solid " + colors.soap400 : undefined,
+        borderRight: openDirection === DeprecatedDrawerDirection.Left ? "1px solid " + colors.soap400 : undefined,
+        right: openDirection === DeprecatedDrawerDirection.Right ? space.zero : undefined,
+        left: openDirection === DeprecatedDrawerDirection.Left ? space.zero : undefined,
     });
 });
 var ChildrenContainer = styled('div')({
     height: '100%',
     overflowY: 'auto',
     wordBreak: 'break-word',
-    wordWrap: 'break-word',
     position: 'relative',
 }, function (_a) {
     var padding = _a.padding;
@@ -82,18 +89,29 @@ var ChildrenContainer = styled('div')({
         padding: padding,
     });
 });
-var Drawer = /** @class */ (function (_super) {
-    __extends(Drawer, _super);
-    function Drawer() {
+/**
+ * ### Deprecated Drawer
+ *
+ * As of Canvas Kit v8, this component is being soft-deprecated.
+ * It will be hard-deprecated (completely removed) in v9. Please see the
+ * [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
+ * for more information.
+ */
+var DeprecatedDrawer = /** @class */ (function (_super) {
+    __extends(DeprecatedDrawer, _super);
+    function DeprecatedDrawer() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    Drawer.prototype.render = function () {
-        var _a = this.props, _b = _a.padding, padding = _b === void 0 ? space.s : _b, _c = _a.width, width = _c === void 0 ? 360 : _c, _d = _a.openDirection, openDirection = _d === void 0 ? DrawerDirection.Right : _d, _e = _a.showDropShadow, showDropShadow = _e === void 0 ? false : _e, children = _a.children, header = _a.header, role = _a.role, elemProps = __rest(_a, ["padding", "width", "openDirection", "showDropShadow", "children", "header", "role"]);
+    DeprecatedDrawer.prototype.componentDidMount = function () {
+        console.warn("This component is being deprecated and will be removed in Canvas Kit V9.\n\n      For more information, please see the V8 upgrade guide:\n\n      https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page\n      ");
+    };
+    DeprecatedDrawer.prototype.render = function () {
+        var _a = this.props, _b = _a.padding, padding = _b === void 0 ? space.s : _b, _c = _a.width, width = _c === void 0 ? 360 : _c, _d = _a.openDirection, openDirection = _d === void 0 ? DeprecatedDrawerDirection.Right : _d, _e = _a.showDropShadow, showDropShadow = _e === void 0 ? false : _e, children = _a.children, header = _a.header, role = _a.role, elemProps = __rest(_a, ["padding", "width", "openDirection", "showDropShadow", "children", "header", "role"]);
         return (React.createElement(DrawerContainer, __assign({ role: role }, elemProps, { showDropShadow: showDropShadow, width: width, openDirection: openDirection }),
             header,
             React.createElement(ChildrenContainer, { padding: padding }, children)));
     };
-    Drawer.OpenDirection = DrawerDirection;
-    return Drawer;
+    DeprecatedDrawer.OpenDirection = DeprecatedDrawerDirection;
+    return DeprecatedDrawer;
 }(React.Component));
-export { Drawer };
+export { DeprecatedDrawer };