@workday/canvas-kit-docs 10.0.11 → 10.0.12

package/dist/es6/lib/specs.js

@@ -2605,7 +2605,7 @@ module.exports = {specifications: [
                   },
                   {
                     "type": "it",
-                    "name": "should transfer focus to the header element"
+                    "name": "should transfer focus to the cancel button"
                   },
                   {
                     "type": "describe",
@@ -2633,7 +2633,7 @@ module.exports = {specifications: [
                       },
                       {
                         "type": "it",
-                        "name": "should transfer focus to the header element"
+                        "name": "should transfer focus to the cancel button"
                       },
                       {
                         "type": "it",

package/dist/mdx/react/modal/examples/CustomFocus.tsx

@@ -4,8 +4,10 @@ import {PrimaryButton} from '@workday/canvas-kit-react/button';
 import {FormField} from '@workday/canvas-kit-react/form-field';
 import {TextInput} from '@workday/canvas-kit-react/text-input';
 import {Flex, Box} from '@workday/canvas-kit-react/layout';
+import {useUniqueId} from '@workday/canvas-kit-react/common';
 
 export default () => {
+  const longDescID = useUniqueId();
   const ref = React.useRef<HTMLInputElement>(null);
   const [value, setValue] = React.useState('');
   const model = useModalModel({
@@ -20,11 +22,11 @@ export default () => {
     <Modal model={model}>
       <Modal.Target as={PrimaryButton}>Acknowledge License</Modal.Target>
       <Modal.Overlay>
-        <Modal.Card>
+        <Modal.Card aria-describedby={longDescID}>
           <Modal.CloseIcon aria-label="Close" />
           <Modal.Heading>Acknowledge License</Modal.Heading>
           <Modal.Body>
-            <Box as="p" marginTop={0} marginBottom="m">
+            <Box as="p" id={longDescID} marginTop={0} marginBottom="m">
               Enter your initials to acknowledge the license.
             </Box>
             <FormField label="Initials" style={{marginBottom: 0}}>

package/dist/mdx/react/modal/examples/FullOverflow.tsx

@@ -20,7 +20,7 @@ export default () => {
         <Modal.Card maxHeight="inherit" height="inherit">
           <Modal.CloseIcon aria-label="Close" />
           <Modal.Heading>MIT License</Modal.Heading>
-          <Modal.Body>
+          <Modal.Body tabIndex={0}>
             <p style={{marginTop: 0}}>
               Permission is hereby granted, free of charge, to any person obtaining a copy of this
               software and associated documentation files (the "Software"), to deal in the Software

package/dist/mdx/react/modal/examples/WithoutCloseIcon.tsx

@@ -11,9 +11,14 @@ import {
 } from '@workday/canvas-kit-react/popup';
 import {DeleteButton} from '@workday/canvas-kit-react/button';
 import {Flex, Box} from '@workday/canvas-kit-react/layout';
+import {useUniqueId} from '@workday/canvas-kit-react/common';
 
 export default () => {
-  const model = usePopupModel();
+  const longDescId = useUniqueId();
+  const cancelBtnRef = React.useRef(null);
+  const model = usePopupModel({
+    initialFocusRef: cancelBtnRef,
+  });
 
   // disable useCloseOnEscape and useCloseOnOverlayClick
   useInitialFocus(model);
@@ -29,18 +34,18 @@ export default () => {
     <Modal model={model}>
       <Modal.Target as={DeleteButton}>Delete Item</Modal.Target>
       <Modal.Overlay>
-        <Modal.Card>
+        <Modal.Card aria-describedby={longDescId}>
           <Modal.Heading>Delete Item</Modal.Heading>
           <Modal.Body>
-            <Box as="p" marginY="zero">
+            <Box as="p" id={longDescId} marginY="zero">
               Are you sure you want to delete the item?
             </Box>
           </Modal.Body>
           <Flex gap="s" padding="xxs" marginTop="xxs">
+            <Modal.CloseButton ref={cancelBtnRef}>Cancel</Modal.CloseButton>
             <Modal.CloseButton as={DeleteButton} onClick={handleDelete}>
               Delete
             </Modal.CloseButton>
-            <Modal.CloseButton>Cancel</Modal.CloseButton>
           </Flex>
         </Modal.Card>
       </Modal.Overlay>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "10.0.11",
+  "version": "10.0.12",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -44,10 +44,10 @@
   "dependencies": {
     "@emotion/styled": "^11.6.0",
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-labs-react": "^10.0.11",
-    "@workday/canvas-kit-preview-react": "^10.0.11",
-    "@workday/canvas-kit-react": "^10.0.11",
-    "@workday/canvas-kit-styling": "^10.0.11",
+    "@workday/canvas-kit-labs-react": "^10.0.12",
+    "@workday/canvas-kit-preview-react": "^10.0.12",
+    "@workday/canvas-kit-react": "^10.0.12",
+    "@workday/canvas-kit-styling": "^10.0.12",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "^1.0.0",
     "markdown-to-jsx": "^6.10.3",
@@ -59,5 +59,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "4.2"
   },
-  "gitHead": "02876b4946ffdd35aa330f25cb12cfa3a1b7c4c8"
+  "gitHead": "fc70e44071da24dd518ae13f92120f9b393c3f2b"
 }