@workday/canvas-kit-react 12.0.0-alpha.862-next.0 → 12.0.0-alpha.898-next.0

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -25,7 +29,7 @@ const common_1 = require("@workday/canvas-kit-react/common");
 const button_1 = require("@workday/canvas-kit-react/button");
 const popup_1 = require("@workday/canvas-kit-react/popup");
 const useMenuModel_1 = require("./useMenuModel");
-const useMenuTargetBase = common_1.createElemPropsHook(useMenuModel_1.useMenuModel)(model => {
+const useMenuTargetBase = (0, common_1.createElemPropsHook)(useMenuModel_1.useMenuModel)(model => {
     return {
         id: model.state.id,
         'aria-haspopup': 'true',
@@ -40,12 +44,12 @@ const useMenuTargetBase = common_1.createElemPropsHook(useMenuModel_1.useMenuMod
         },
     };
 });
-exports.useMenuTarget = common_1.composeHooks(useMenuTargetBase, popup_1.usePopupTarget);
-exports.useMenuTargetContext = common_1.composeHooks(useMenuTargetBase, popup_1.usePopupTargetContext);
-exports.MenuTarget = common_1.createSubcomponent(button_1.SecondaryButton)({
+exports.useMenuTarget = (0, common_1.composeHooks)(useMenuTargetBase, popup_1.usePopupTarget);
+exports.useMenuTargetContext = (0, common_1.composeHooks)(useMenuTargetBase, popup_1.usePopupTargetContext);
+exports.MenuTarget = (0, common_1.createSubcomponent)(button_1.SecondaryButton)({
     displayName: 'Menu.Target',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuTarget,
 })(({ children, ...elemProps }, Element) => {
-    return React.createElement(Element, Object.assign({}, elemProps), children);
+    return React.createElement(Element, { ...elemProps }, children);
 });

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -27,16 +31,16 @@ const React = __importStar(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
 const tokens_1 = require("@workday/canvas-kit-react/tokens");
 const common_1 = require("@workday/canvas-kit-react/common");
-const Divider = styled_1.default('hr')({
+const Divider = (0, styled_1.default)('hr')({
     display: 'block',
     height: 1,
     border: 0,
     borderTop: `1px solid ${tokens_1.colors.soap400}`,
     margin: `${tokens_1.space.xxs} 0`,
 });
-exports.MenuDivider = common_1.createComponent('hr')({
+exports.MenuDivider = (0, common_1.createComponent)('hr')({
     displayName: 'Menu.Divider',
     Component(elemProps, ref, Element) {
-        return React.createElement(Divider, Object.assign({ as: Element, ref: ref }, elemProps));
+        return React.createElement(Divider, { as: Element, ref: ref, ...elemProps });
     },
 });

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

@@ -203,7 +203,7 @@ export declare const MenuItem: import("@workday/canvas-kit-react/common").Elemen
     }, {}, {}>;
     Text: import("@emotion/styled").StyledComponent<{
         theme?: import("@emotion/react").Theme | undefined;
-        as?: React.ElementType<any> | undefined;
+        as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
     }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 };
 export {};

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -28,7 +32,7 @@ const tooltip_1 = require("@workday/canvas-kit-react/tooltip");
 const layout_1 = require("@workday/canvas-kit-react/layout");
 const collection_1 = require("@workday/canvas-kit-react/collection");
 const useMenuModel_1 = require("./useMenuModel");
-exports.StyledMenuItem = common_1.styled(layout_1.Box.as('button'))(({ theme }) => {
+exports.StyledMenuItem = (0, common_1.styled)(layout_1.Box.as('button'))(({ theme }) => {
     return {
         ...tokens_1.type.levels.subtext.large,
         display: 'grid',
@@ -115,8 +119,8 @@ exports.StyledMenuItem = common_1.styled(layout_1.Box.as('button'))(({ theme })
         };
     }
 });
-exports.useMenuItem = common_1.composeHooks(common_1.createElemPropsHook(useMenuModel_1.useMenuModel)((model, ref, elemProps = { 'data-id': '' }) => {
-    const { localRef, elementRef } = common_1.useLocalRef(ref);
+exports.useMenuItem = (0, common_1.composeHooks)((0, common_1.createElemPropsHook)(useMenuModel_1.useMenuModel)((model, ref, elemProps = { 'data-id': '' }) => {
+    const { localRef, elementRef } = (0, common_1.useLocalRef)(ref);
     const id = elemProps['data-id'];
     // focus on the item with the cursor
     React.useLayoutEffect(() => {
@@ -143,15 +147,15 @@ exports.useMenuItem = common_1.composeHooks(common_1.createElemPropsHook(useMenu
             : undefined,
     };
 }), collection_1.useListItemSelect, collection_1.useListItemRovingFocus, collection_1.useListItemRegister);
-exports.MenuItem = common_1.createSubcomponent('button')({
+exports.MenuItem = (0, common_1.createSubcomponent)('button')({
     displayName: 'Menu.Item',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuItem,
     subComponents: {
-        Icon: common_1.styled(icon_1.SystemIcon)({ alignSelf: 'start' }),
-        Text: common_1.styled('span')({ flexGrow: 1, alignSelf: 'center' }),
+        Icon: (0, common_1.styled)(icon_1.SystemIcon)({ alignSelf: 'start' }),
+        Text: (0, common_1.styled)('span')({ flexGrow: 1, alignSelf: 'center' }),
     },
 })(({ children, ...elemProps }, Element) => {
     return (React.createElement(tooltip_1.OverflowTooltip, { placement: "left" },
-        React.createElement(exports.StyledMenuItem, Object.assign({ minHeight: tokens_1.space.xl, as: Element }, elemProps), children)));
+        React.createElement(exports.StyledMenuItem, { minHeight: tokens_1.space.xl, as: Element, ...elemProps }, children)));
 });

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

@@ -1 +1 @@
-{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,OAAO,EAAE,SAAS,EAAC,MAAM,sCAAsC,CAAC;AAQxE,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,GAAG,CACpC,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,OAAO,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC7D;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;oBAiB1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgBnB,CAAC"}
+{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,OAAO,EAAE,SAAS,EAAC,MAAM,sCAAsC,CAAC;AAOxE,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,GAAG,CACpC,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,OAAO,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC7D;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;oBAiB1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAenB,CAAC"}

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -27,26 +31,25 @@ const popup_1 = require("@workday/canvas-kit-react/popup");
 const useMenuModel_1 = require("./useMenuModel");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
-const layout_1 = require("@workday/canvas-kit-react/layout");
-exports.useMenuList = common_1.composeHooks(common_1.createElemPropsHook(useMenuModel_1.useMenuModel)(model => {
+exports.useMenuList = (0, common_1.composeHooks)((0, common_1.createElemPropsHook)(useMenuModel_1.useMenuModel)(model => {
     return {
         role: 'menu',
         'aria-labelledby': model.state.id,
     };
 }), popup_1.useReturnFocus, popup_1.useFocusRedirect);
-exports.menuListStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "4a3778", styles: "box-sizing:border-box;background:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-zero);padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-zero);" },
+exports.menuListStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "ksnk2o", styles: "box-sizing:border-box;background:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-zero);padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-zero);" },
     modifiers: {
         orientation: {
-            vertical: { name: "db5d98", styles: "flex-direction:column;" },
-            horizontal: { name: "3f3c28", styles: "flex-direction:row;" }
+            vertical: { name: "ksnk2p", styles: "flex-direction:column;" },
+            horizontal: { name: "ksnk2q", styles: "flex-direction:row;" }
         }
     }
-}, "menu-list-1651b0");
-exports.MenuList = common_1.createSubcomponent('div')({
+}, "menu-list-b9b420");
+exports.MenuList = (0, common_1.createSubcomponent)('div')({
     displayName: 'Menu.List',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuList,
 })(({ children, ...elemProps }, Element, model) => {
-    return (React.createElement(collection_1.ListBox, Object.assign({ as: Element, model: model, marginY: canvas_kit_styling_1.cssVar(canvas_tokens_web_1.system.space.x2), overflowY: "auto" }, layout_1.mergeStyles(elemProps, exports.menuListStencil({ orientation: model.state.orientation }))), children));
+    return (React.createElement(collection_1.ListBox, { as: Element, model: model, marginY: (0, canvas_kit_styling_1.cssVar)(canvas_tokens_web_1.system.space.x2), ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.menuListStencil)({ orientation: model.state.orientation })) }, children));
 });

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -36,10 +40,10 @@ const popperOptions = {
         },
     ],
 };
-exports.MenuPopper = common_1.createSubcomponent('div')({
+exports.MenuPopper = (0, common_1.createSubcomponent)('div')({
     displayName: 'Menu.Popper',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuPopper,
 })(({ children, ...elemProps }) => {
-    return (React.createElement(popup_1.Popper, Object.assign({ placement: "bottom-start", popperOptions: popperOptions }, elemProps), children));
+    return (React.createElement(popup_1.Popper, { placement: "bottom-start", popperOptions: popperOptions, ...elemProps }, children));
 });

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

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -25,7 +29,7 @@ const common_1 = require("@workday/canvas-kit-react/common");
 const button_1 = require("@workday/canvas-kit-react/button");
 const popup_1 = require("@workday/canvas-kit-react/popup");
 const useMenuModel_1 = require("./useMenuModel");
-exports.useMenuTargetBase = common_1.createElemPropsHook(useMenuModel_1.useMenuModel)(model => {
+exports.useMenuTargetBase = (0, common_1.createElemPropsHook)(useMenuModel_1.useMenuModel)(model => {
     return {
         id: model.state.id,
         'aria-haspopup': 'true',
@@ -40,19 +44,19 @@ exports.useMenuTargetBase = common_1.createElemPropsHook(useMenuModel_1.useMenuM
         },
     };
 });
-exports.useMenuTarget = common_1.composeHooks(exports.useMenuTargetBase, popup_1.usePopupTarget);
-exports.useMenuTargetContext = common_1.composeHooks(exports.useMenuTargetBase, popup_1.usePopupTargetContext);
-exports.MenuTarget = common_1.createSubcomponent(button_1.SecondaryButton)({
+exports.useMenuTarget = (0, common_1.composeHooks)(exports.useMenuTargetBase, popup_1.usePopupTarget);
+exports.useMenuTargetContext = (0, common_1.composeHooks)(exports.useMenuTargetBase, popup_1.usePopupTargetContext);
+exports.MenuTarget = (0, common_1.createSubcomponent)(button_1.SecondaryButton)({
     displayName: 'Menu.Target',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuTarget,
 })(({ children, ...elemProps }, Element) => {
-    return React.createElement(Element, Object.assign({}, elemProps), children);
+    return React.createElement(Element, { ...elemProps }, children);
 });
-exports.MenuTargetContext = common_1.createSubcomponent(button_1.SecondaryButton)({
+exports.MenuTargetContext = (0, common_1.createSubcomponent)(button_1.SecondaryButton)({
     displayName: 'Menu.Target',
     modelHook: useMenuModel_1.useMenuModel,
     elemPropsHook: exports.useMenuTargetContext,
 })(({ children, ...elemProps }, Element) => {
-    return React.createElement(Element, Object.assign({}, elemProps), children);
+    return React.createElement(Element, { ...elemProps }, children);
 });

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

@@ -4,7 +4,7 @@ exports.useMenuModel = void 0;
 const common_1 = require("@workday/canvas-kit-react/common");
 const popup_1 = require("@workday/canvas-kit-react/popup");
 const collection_1 = require("@workday/canvas-kit-react/collection");
-exports.useMenuModel = common_1.createModelHook({
+exports.useMenuModel = (0, common_1.createModelHook)({
     defaultConfig: {
         ...collection_1.useListModel.defaultConfig,
         ...popup_1.usePopupModel.defaultConfig,
@@ -18,17 +18,17 @@ exports.useMenuModel = common_1.createModelHook({
         ...popup_1.usePopupModel.requiredConfig,
     },
 })(config => {
-    const list = collection_1.useListModel(collection_1.useListModel.mergeConfig(config, {
+    const list = (0, collection_1.useListModel)(collection_1.useListModel.mergeConfig(config, {
         selection: config.mode === 'single' ? collection_1.singleSelectionManager : collection_1.multiSelectionManager,
     }));
-    const popup = popup_1.usePopupModel(popup_1.usePopupModel.mergeConfig(config, {
+    const popup = (0, popup_1.usePopupModel)(popup_1.usePopupModel.mergeConfig(config, {
         onHide() {
             // reset the index ref to 0 again so registration doesn't start where it left off
             list.state.indexRef.current = 0;
         },
     }));
-    popup_1.useAlwaysCloseOnOutsideClick(popup);
-    popup_1.useCloseOnEscape(popup);
+    (0, popup_1.useAlwaysCloseOnOutsideClick)(popup);
+    (0, popup_1.useCloseOnEscape)(popup);
     const state = { mode: config.mode, ...list.state, ...popup.state };
     const events = {
         ...list.events,

package/dist/commonjs/modal/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/dist/commonjs/modal/lib/Modal.d.ts

@@ -162,7 +162,7 @@ export declare const Modal: import("@workday/canvas-kit-react/common").Component
     /**
      * The `Modal.Card` is wraps a {@link PopupCard Popup.Card} which wraps a {@link Card}. It is
      * the `role="dialog"` element and is uses `useModalCard` behavior hook which sets
-     * `aria-modal="true"` and sets the `aria-labelledby` that points to the `id` of the
+     * `aria-modal="false"` and sets the `aria-labelledby` that points to the `id` of the
      * {@link ModalHeading Modal.Heading}. If you don't use a `Modal.Heading`, add an `aria-label`
      * instead. The default element is a `div` and can be changed via the `as` prop.
      */

package/dist/commonjs/modal/lib/Modal.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -36,7 +40,7 @@ const ModalBody_1 = require("./ModalBody");
  * container component will build a default one using `useModalModel`. `Modal` is a composition of a
  * {@link Popup} component and has a similar structure to `Popup`.
  */
-exports.Modal = common_1.createContainer()({
+exports.Modal = (0, common_1.createContainer)()({
     displayName: 'Modal',
     modelHook: hooks_1.useModalModel,
     subComponents: {
@@ -62,7 +66,7 @@ exports.Modal = common_1.createContainer()({
         /**
          * The `Modal.Card` is wraps a {@link PopupCard Popup.Card} which wraps a {@link Card}. It is
          * the `role="dialog"` element and is uses `useModalCard` behavior hook which sets
-         * `aria-modal="true"` and sets the `aria-labelledby` that points to the `id` of the
+         * `aria-modal="false"` and sets the `aria-labelledby` that points to the `id` of the
          * {@link ModalHeading Modal.Heading}. If you don't use a `Modal.Heading`, add an `aria-label`
          * instead. The default element is a `div` and can be changed via the `as` prop.
          */

package/dist/commonjs/modal/lib/ModalBody.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -27,12 +31,12 @@ const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const layout_1 = require("@workday/canvas-kit-react/layout");
-exports.modalBodyStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "085ad9", styles: "box-sizing:border-box;@media screen and (max-width: 768px){margin-block-end:var(--cnvs-sys-space-zero);padding:var(--cnvs-sys-space-x1) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2);}" }
+exports.modalBodyStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "ksnk50", styles: "box-sizing:border-box;@media screen and (max-width: 768px){margin-block-end:var(--cnvs-sys-space-zero);padding:var(--cnvs-sys-space-x1) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2);}" }
 }, "modal-body-d624fe");
-exports.ModalBody = common_1.createSubcomponent('div')({
+exports.ModalBody = (0, common_1.createSubcomponent)('div')({
     displayName: 'Modal.Body',
     modelHook: hooks_1.useModalModel,
 })((elemProps, Element) => {
-    return React.createElement(popup_1.Popup.Body, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, exports.modalBodyStencil())));
+    return React.createElement(popup_1.Popup.Body, { as: Element, ...(0, layout_1.mergeStyles)(elemProps, (0, exports.modalBodyStencil)()) });
 });

package/dist/commonjs/modal/lib/ModalCard.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -27,13 +31,13 @@ const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const layout_1 = require("@workday/canvas-kit-react/layout");
-exports.modalCardStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "456211", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-x10);width:calc(calc(var(--cnvs-sys-space-x20) * 5) + var(--cnvs-sys-space-x10));border-width:var(--cnvs-sys-space-zero);box-shadow:var(--cnvs-sys-depth-6);@media screen and (max-width: 768px){margin:var(--cnvs-sys-space-x4);padding:var(--cnvs-sys-space-x4);border-radius:var(--cnvs-sys-space-x6);}" }
+exports.modalCardStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "ksnk4x", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-x10);width:calc(calc(var(--cnvs-sys-space-x20) * 5) + var(--cnvs-sys-space-x10));border-width:var(--cnvs-sys-space-zero);box-shadow:var(--cnvs-sys-depth-6);@media screen and (max-width: 768px){margin:var(--cnvs-sys-space-x4);padding:var(--cnvs-sys-space-x4);border-radius:var(--cnvs-sys-space-x6);}" }
 }, "modal-card-9eebe8");
-exports.ModalCard = common_1.createSubcomponent('div')({
+exports.ModalCard = (0, common_1.createSubcomponent)('div')({
     displayName: 'Modal.Card',
     modelHook: hooks_1.useModalModel,
     elemPropsHook: hooks_1.useModalCard,
 })((elemProps, Element) => {
-    return React.createElement(popup_1.Popup.Card, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, exports.modalCardStencil())));
+    return React.createElement(popup_1.Popup.Card, { as: Element, ...(0, layout_1.mergeStyles)(elemProps, (0, exports.modalCardStencil)()) });
 });

package/dist/commonjs/modal/lib/ModalHeading.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -27,13 +31,13 @@ const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const layout_1 = require("@workday/canvas-kit-react/layout");
-exports.modalHeadingStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "72ed60", styles: "box-sizing:border-box;@media screen and (max-width: 768px){margin-block-end:var(--cnvs-sys-space-zero);padding:var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x1);}" }
+exports.modalHeadingStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "ksnk4y", styles: "box-sizing:border-box;@media screen and (max-width: 768px){margin-block-end:var(--cnvs-sys-space-zero);padding:var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x1);}" }
 }, "modal-heading-52f13d");
-exports.ModalHeading = common_1.createSubcomponent('h2')({
+exports.ModalHeading = (0, common_1.createSubcomponent)('h2')({
     displayName: 'Modal.Heading',
     modelHook: hooks_1.useModalModel,
     elemPropsHook: hooks_1.useModalHeading,
 })((elemProps, Element) => {
-    return React.createElement(popup_1.Popup.Heading, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, exports.modalHeadingStencil())));
+    return React.createElement(popup_1.Popup.Heading, { as: Element, ...(0, layout_1.mergeStyles)(elemProps, (0, exports.modalHeadingStencil)()) });
 });

package/dist/commonjs/modal/lib/ModalOverflowOverlay.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -26,12 +30,12 @@ const ModalOverlay_1 = require("./ModalOverlay");
 const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const layout_1 = require("@workday/canvas-kit-react/layout");
-exports.modalOverflowOverlayStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "528425", styles: "box-sizing:border-box;& > div{max-height:inherit;}overflow:hidden auto;" }
+exports.modalOverflowOverlayStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "ksnk4z", styles: "box-sizing:border-box;& > div{max-height:inherit;}overflow:hidden auto;" }
 }, "modal-overflow-overlay-2ac342");
-exports.ModalOverflowOverlay = common_1.createSubcomponent('div')({
+exports.ModalOverflowOverlay = (0, common_1.createSubcomponent)('div')({
     displayName: 'Modal.OverflowOverlay',
     modelHook: hooks_1.useModalModel,
 })((elemProps, Element) => {
-    return React.createElement(ModalOverlay_1.ModalOverlay, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, exports.modalOverflowOverlayStencil())));
+    return React.createElement(ModalOverlay_1.ModalOverlay, { as: Element, ...(0, layout_1.mergeStyles)(elemProps, (0, exports.modalOverflowOverlayStencil)()) });
 });

package/dist/commonjs/modal/lib/ModalOverlay.js

@@ -12,29 +12,29 @@ const layout_1 = require("@workday/canvas-kit-react/layout");
 const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
-const fadeIn = canvas_kit_styling_1.keyframes({ name: "746311", styles: "0%{background:none;}100%{background:var(--cnvs-sys-color-bg-overlay);}" });
-exports.modalOverlayContainerStencil = canvas_kit_styling_1.createStencil({
+const fadeIn = (0, canvas_kit_styling_1.keyframes)({ name: "ksnk4v", styles: "0%{background:none;}100%{background:var(--cnvs-sys-color-bg-overlay);}" });
+exports.modalOverlayContainerStencil = (0, canvas_kit_styling_1.createStencil)({
     vars: {
         containerCenter: '',
     },
-    base: { name: "09f317", styles: "box-sizing:border-box;position:fixed;top:var(--cnvs-sys-space-zero);left:var(--cnvs-sys-space-zero);width:100vw;height:100vh;background:var(--cnvs-sys-color-bg-overlay);animation-duration:0.3s;animation-name:animation-746311;.wd-no-animation &{animation:none;}& > div{max-height:100%;display:flex;position:absolute;left:var(--cnvs-sys-space-zero);top:var(--cnvs-sys-space-zero);justify-content:center;align-items:center;height:100%;width:var(--containerCenter-modal-overlay-container-8b6518);}@media screen and (max-width: 768px){height:100%;& > div{align-items:end;}}" }
+    base: { name: "ksnk4w", styles: "box-sizing:border-box;position:fixed;top:var(--cnvs-sys-space-zero);left:var(--cnvs-sys-space-zero);width:100vw;height:100vh;background:var(--cnvs-sys-color-bg-overlay);animation-duration:0.3s;animation-name:animation-ksnk4v;.wd-no-animation &{animation:none;}& > div{max-height:100%;display:flex;position:absolute;left:var(--cnvs-sys-space-zero);top:var(--cnvs-sys-space-zero);justify-content:center;align-items:center;height:100%;width:var(--containerCenter-modal-overlay-container-8b6518);}@media screen and (max-width: 768px){height:100%;& > div{align-items:end;}}" }
 }, "modal-overlay-container-8b6518");
-exports.useModalOverlay = common_1.createElemPropsHook(popup_1.usePopupModel)(({ state }, ref) => {
-    const elementRef = common_1.useForkRef(ref, state.stackRef);
-    popup_1.usePopupStack(elementRef);
+exports.useModalOverlay = (0, common_1.createElemPropsHook)(popup_1.usePopupModel)(({ state }, ref) => {
+    const elementRef = (0, common_1.useForkRef)(ref, state.stackRef);
+    (0, popup_1.usePopupStack)(elementRef);
     return {
         // The ref should not be applied to an element. The passed ref will apply to the stackRef instead
         ref: undefined,
     };
 });
-const OpenModalOverlay = common_1.createSubcomponent('div')({
+const OpenModalOverlay = (0, common_1.createSubcomponent)('div')({
     displayName: 'Modal.OpenOverlay',
     modelHook: hooks_1.useModalModel,
     elemPropsHook: exports.useModalOverlay,
 })((elemProps, Element, model) => {
-    const windowSize = common_1.useWindowSize();
+    const windowSize = (0, common_1.useWindowSize)();
     const containerCenter = windowSize.width % 2 === 1 ? 'calc(100vw - 1px)' : '100vw';
-    const content = (react_1.default.createElement(layout_1.Box, Object.assign({}, layout_1.mergeStyles(elemProps, exports.modalOverlayContainerStencil({ containerCenter }))),
+    const content = (react_1.default.createElement(layout_1.Box, { ...(0, layout_1.mergeStyles)(elemProps, (0, exports.modalOverlayContainerStencil)({ containerCenter })) },
         react_1.default.createElement(layout_1.Box
         // make sure the centering container is an even number of pixels to avoid sub-pixel
         // inaccuracies due to centering
@@ -47,9 +47,9 @@ const OpenModalOverlay = common_1.createSubcomponent('div')({
         return null;
     }
 });
-exports.ModalOverlay = common_1.createSubcomponent('div')({
+exports.ModalOverlay = (0, common_1.createSubcomponent)('div')({
     displayName: 'Modal.Overlay',
     modelHook: hooks_1.useModalModel,
 })((elemProps, Element, model) => {
-    return model.state.visibility !== 'hidden' ? (react_1.default.createElement(OpenModalOverlay, Object.assign({ as: Element, model: model }, elemProps))) : null;
+    return model.state.visibility !== 'hidden' ? (react_1.default.createElement(OpenModalOverlay, { as: Element, model: model, ...elemProps })) : null;
 });

package/dist/commonjs/modal/lib/hooks/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/dist/commonjs/modal/lib/hooks/useCloseOnOverlayClick.js

@@ -13,8 +13,8 @@ const popup_1 = require("@workday/canvas-kit-react/popup");
  * click happened outside the `[role=dialog]` of an overlay component. The difference between `useCloseOnOutsideClick`
  * and `useCloseOnOverlayClick` is the Overlay is a child of a `stackRef` element and has a different
  */
-exports.useCloseOnOverlayClick = common_1.createElemPropsHook(popup_1.usePopupModel)(model => {
-    const modality = common_1.useModalityType();
+exports.useCloseOnOverlayClick = (0, common_1.createElemPropsHook)(popup_1.usePopupModel)(model => {
+    const modality = (0, common_1.useModalityType)();
     const onClick = react_1.default.useCallback((event) => {
         if (!model.state.stackRef.current) {
             return;

package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts

@@ -19,6 +19,13 @@ export declare const useModalCard: import("@workday/canvas-kit-react/common").Be
     role: string;
     'aria-labelledby': string;
 } & {
+    /**
+     * `aria-modal` was added with the intent that screen readers would add support to properly define content within a modal,
+     * including popups like a Select. However, when aria-modal is true, it will hide other elements from screen readers,
+     * including popups owned by the modal because these popups are siblings to the modal and not ancestors. There is no defined time when Apple/VoiceOver
+     * might change this behavior and better support aria-owns, so for the time being we'll explicitly set this to false to provide a better
+     * VoiceOver experience.
+     */
     'aria-modal': boolean;
 }>;
 //# sourceMappingURL=useModalCard.d.ts.map

package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useModalCard.d.ts","sourceRoot":"","sources":["../../../../../modal/lib/hooks/useModalCard.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;EAOxB,CAAC"}
+{"version":3,"file":"useModalCard.d.ts","sourceRoot":"","sources":["../../../../../modal/lib/hooks/useModalCard.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;IAInB;;;;;;OAMG;;EAIR,CAAC"}

package/dist/commonjs/modal/lib/hooks/useModalCard.js

@@ -3,8 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useModalCard = void 0;
 const common_1 = require("@workday/canvas-kit-react/common");
 const popup_1 = require("@workday/canvas-kit-react/popup");
-exports.useModalCard = common_1.composeHooks(popup_1.usePopupCard, common_1.createElemPropsHook(popup_1.usePopupModel)(() => {
+exports.useModalCard = (0, common_1.composeHooks)(popup_1.usePopupCard, (0, common_1.createElemPropsHook)(popup_1.usePopupModel)(() => {
     return {
-        'aria-modal': true,
+        /**
+         * `aria-modal` was added with the intent that screen readers would add support to properly define content within a modal,
+         * including popups like a Select. However, when aria-modal is true, it will hide other elements from screen readers,
+         * including popups owned by the modal because these popups are siblings to the modal and not ancestors. There is no defined time when Apple/VoiceOver
+         * might change this behavior and better support aria-owns, so for the time being we'll explicitly set this to false to provide a better
+         * VoiceOver experience.
+         */
+        'aria-modal': false,
     };
 }));

package/dist/commonjs/modal/lib/hooks/useModalHeading.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useModalHeading = void 0;
 const common_1 = require("@workday/canvas-kit-react/common");
 const popup_1 = require("@workday/canvas-kit-react/popup");
-exports.useModalHeading = common_1.composeHooks(popup_1.usePopupHeading, common_1.createElemPropsHook(popup_1.usePopupModel)((_, ref) => {
-    const { elementRef, localRef } = common_1.useLocalRef(ref);
-    common_1.useMountLayout(() => {
+exports.useModalHeading = (0, common_1.composeHooks)(popup_1.usePopupHeading, (0, common_1.createElemPropsHook)(popup_1.usePopupModel)((_, ref) => {
+    const { elementRef, localRef } = (0, common_1.useLocalRef)(ref);
+    (0, common_1.useMountLayout)(() => {
         var _a, _b, _c;
         if ((_c = (_b = (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.querySelector('button')) === null || _c === void 0 ? void 0 : _c.textContent) {
             // First button is not a close icon button, set tabindex on the heading to capture initial focus