@workday/canvas-kit-docs 14.0.0-alpha.1147-next.0 → 14.0.0-alpha.1148-next.0

package/dist/es6/lib/docs.js

@@ -9532,6 +9532,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -89803,6 +89835,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "background",
@@ -119157,6 +119221,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -172032,6 +172128,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -202715,6 +202843,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -252467,6 +252627,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -284648,6 +284840,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -315869,6 +316093,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
           ],
           "tags": {}
         },
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -335002,6 +335258,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
       "componentType": "subcomponent",
       "elemPropsHook": "useSelectCard",
       "props": [
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",
@@ -390571,6 +390859,38 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
       "componentType": "container",
       "displayName": "Toast",
       "props": [
+        {
+          "kind": "property",
+          "name": "variant",
+          "required": false,
+          "type": {
+            "kind": "union",
+            "value": [
+              {
+                "kind": "string",
+                "value": "borderless"
+              },
+              {
+                "kind": "string",
+                "value": "filled"
+              }
+            ]
+          },
+          "description": "The variant of the Card. Can be `default`, `borderless` or `filled`.",
+          "declarations": [
+            {
+              "name": "variant",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/card/lib/Card.tsx"
+            }
+          ],
+          "tags": {
+            "default": "'default'"
+          },
+          "defaultValue": {
+            "kind": "string",
+            "value": "default"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",

package/dist/mdx/14.0-UPGRADE-GUIDE.mdx

@@ -10,6 +10,7 @@ any questions.
   - [Instructions](#instructions)
 - [Component Updates](#component-updates)
   - [Styling API and CSS Tokens](#styling-api-and-css-tokens)
+  - [Card](#card)
   - [SearchForm](#search-form)
 - [Troubleshooting](#troubleshooting)
 - [Glossary](#glossary)
@@ -78,7 +79,9 @@ yarn remove @workday/canvas-kit-codemod
 > after executing the codemod, as its resulting formatting (spacing, quotes, etc.) may not match
 > your project conventions.
 
-## Styling API and Canvas Tokens 💅
+## Component Updates
+
+### Styling API and Canvas Tokens 💅
 
 Several components have been refactored to use our Canvas tokens and styling API. The React
 interface has not changed, but Canvas Tokens are now used for dynamic properties.
@@ -98,7 +101,96 @@ The following components have been updated:
 - `ToolbarDropdownButton` [#3293](https://github.com/Workday/canvas-kit/pull/3293)
 - `ToolbarIconButton` [#3293](https://github.com/Workday/canvas-kit/pull/3293)
 
-## Search Form 🚨
+### Card 🚨
+
+**PR:** [#3350](https://github.com/Workday/canvas-kit/pull/3350)
+
+We've rebranded the `Card` component to align with our new brand directions and provide better
+visual hierarchy and more flexible styling options. The following changes have been made:
+
+#### Default Card No Longer Has Shadow
+
+The default `Card` variant no longer includes a shadow, creating a cleaner, flatter appearance that
+aligns with our new brand's emphasis on simplicity and clarity. This is a **visual breaking change**
+that may affect your application's visual hierarchy. If your design requires shadow you can added
+through `cs` prop.
+
+**Before in v13**
+
+```tsx
+<Card>
+  <Card.Heading>Card Title</Card.Heading>
+  <Card.Body>Card content with shadow</Card.Body>
+</Card>
+```
+
+**After in v14**
+
+```tsx
+<Card cs={{boxShadow: system.depth[1]}}>
+  <Card.Heading>Card Title</Card.Heading>
+  <Card.Body>Card content with shadow</Card.Body>
+</Card>
+```
+
+#### New Card Variants
+
+We've added two new variants to provide more styling flexibility:
+
+- **`borderless`**: Use this variant when placing cards on colored backgrounds where you want the
+  card to blend seamlessly without borders or shadows.
+- **`filled`**: Use this variant when you need a card with a grayish background to create visual
+  separation from the page background.
+
+The `variant` prop is optional - if no variant is specified, the card will use the default styling.
+
+```tsx
+// Default card (no variant prop needed)
+<Card>
+  <Card.Heading>Default Card</Card.Heading>
+  <Card.Body>Default styling with borders, no shadow</Card.Body>
+</Card>
+
+// Borderless variant for colored backgrounds
+<Card variant="borderless">
+  <Card.Heading>Card on Colored Background</Card.Heading>
+  <Card.Body>Content blends with background</Card.Body>
+</Card>
+
+// Filled variant with grayish background
+<Card variant="filled">
+  <Card.Heading>Card with grayish Background</Card.Heading>
+  <Card.Body>Content with visual separation</Card.Body>
+</Card>
+```
+
+#### Gap Instead of Margins
+
+We've replaced the individual margins on `Card.Heading` and `Card.Body` with a `gap` prop on the
+card container. The card now uses `display: flex` with `flex-direction: column` by default, and the
+`gap` prop provides consistent spacing between all direct children. This provides more consistent
+spacing and better control over the layout. This is a **visual breaking change** that may affect the
+spacing between card elements.
+
+**Before in v13**
+
+```tsx
+<Card>
+  <Card.Heading marginBlock="zero">Title</Card.Heading>
+  <Card.Body marginBlock="zero">Card without any spacing</Card.Body>
+</Card>
+```
+
+**After in v14**
+
+```tsx
+<Card cs={{gap: system.space.zero}}>
+  <Card.Heading>Title</Card.Heading>
+  <Card.Body>Card without any spacing</Card.Body>
+</Card>
+```
+
+### Search Form 🚨
 
 **PR:** [#3303](https://github.com/Workday/canvas-kit/pull/3303)
 

package/dist/mdx/react/card/card.mdx

@@ -1,5 +1,7 @@
-import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs';
+import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs';
 import Basic from './examples/Basic';
+import Borderless from './examples/Borderless';
+import Filled from './examples/Filled';
 import WithCustomStyles from './examples/CustomStyles';
 import WithStencils from './examples/Stencils';
 
@@ -27,6 +29,23 @@ yarn add @workday/canvas-kit-react
 
 <ExampleCodeBlock code={Basic} />
 
+### Borderless Example
+
+The `borderless` variant removes the border from the Card, creating a cleaner appearance while
+maintaining the same internal spacing and structure.
+Use this variant when placing cards on colored backgrounds where you want the
+  card to blend seamlessly without borders or shadows.
+
+<ExampleCodeBlock code={Borderless} />
+
+### Filled Example
+
+The `filled` variant adds a background color to the Card, creating a more prominent appearance while
+maintaining the same internal spacing and structure. Use this variant when you need a card with a grayish background to create visual
+  separation from the page background.
+
+<ExampleCodeBlock code={Filled} />
+
 ### Custom Styles
 
 Card and its subcomponents support custom styling via the `cs` prop. For more information, check our

package/dist/mdx/react/card/examples/Borderless.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import {Card} from '@workday/canvas-kit-react/card';
+import {createStyles} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
+
+const styles = createStyles({
+  background: system.color.bg.alt.softer,
+  padding: system.space.x4,
+});
+
+export default () => {
+  return (
+    <div className={styles}>
+      <Card variant="borderless">
+        <Card.Heading>Canvas Supreme</Card.Heading>
+        <Card.Body>
+          Our house special supreme pizza includes pepperoni, sausage, bell peppers, mushrooms,
+          onions, and oregano.
+        </Card.Body>
+      </Card>
+    </div>
+  );
+};

package/dist/mdx/react/card/examples/Filled.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import {Card} from '@workday/canvas-kit-react/card';
+
+export default () => {
+  return (
+    <Card variant="filled">
+      <Card.Heading>Canvas Supreme</Card.Heading>
+      <Card.Body>
+        Our house special supreme pizza includes pepperoni, sausage, bell peppers, mushrooms,
+        onions, and oregano.
+      </Card.Body>
+    </Card>
+  );
+};

package/dist/mdx/react/card/examples/Stencils.tsx

@@ -11,6 +11,8 @@ const menuCardStencil = createStencil({
     flexDirection: 'column',
     padding: system.space.zero,
     maxWidth: px2rem(320),
+    boxShadow: system.depth[1],
+    overflow: 'hidden',
   },
 });
 
@@ -22,7 +24,6 @@ const menuCardHeroStencil = createStencil({
     aspectRatio: '1',
     maxHeight: px2rem(80),
     padding: system.space.x2,
-    borderRadius: `${system.shape.x2} ${system.shape.x2} 0 0`,
   },
 });
 

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

@@ -24,7 +24,7 @@ export default () => {
               software and associated documentation files (the "Software").
             </Box>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton as={PrimaryButton} onClick={handleAcknowledge}>
               Acknowledge
             </Modal.CloseButton>

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

@@ -81,7 +81,7 @@ export default () => {
               ut aliquam purus sit.
             </p>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton as={PrimaryButton} onClick={handleAcknowledge}>
               Acknowledge
             </Modal.CloseButton>

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

@@ -39,7 +39,7 @@ export default () => {
               />
             </FormField>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton as={PrimaryButton} onClick={handleAcknowledge}>
               Acknowledge
             </Modal.CloseButton>

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

@@ -41,7 +41,7 @@ export default () => {
               <FormField.Input as={TextInput} name="last" />
             </FormField>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton>Cancel</Modal.CloseButton>
             <PrimaryButton type="submit">Submit</PrimaryButton>
           </Flex>

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

@@ -81,7 +81,7 @@ export default () => {
               ut aliquam purus sit.
             </p>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton as={PrimaryButton} onClick={handleAcknowledge}>
               Acknowledge
             </Modal.CloseButton>

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

@@ -50,7 +50,7 @@ export default () => {
               Are you sure you want to delete the item?
             </Box>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton as={DeleteButton} onClick={handleDelete}>
               Delete
             </Modal.CloseButton>

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

@@ -41,7 +41,7 @@ export default () => {
               Are you sure you want to delete the item?
             </Box>
           </Modal.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Modal.CloseButton ref={cancelBtnRef}>Cancel</Modal.CloseButton>
             <Modal.CloseButton as={DeleteButton} onClick={handleDelete}>
               Delete

package/dist/mdx/react/popup/examples/Basic.tsx

@@ -33,7 +33,7 @@ export default () => {
               Are you sure you'd like to delete the item titled 'My Item'?
             </Box>
           </Popup.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
               Delete
             </Popup.CloseButton>

package/dist/mdx/react/popup/examples/FocusRedirect.tsx

@@ -47,7 +47,7 @@ export default () => {
                 Are you sure you'd like to delete the item titled 'My Item'?
               </Box>
             </Popup.Body>
-            <Flex gap="s" padding="xxs" marginTop="xxs">
+            <Flex gap="s" padding="xxs">
               <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                 Delete
               </Popup.CloseButton>

package/dist/mdx/react/popup/examples/FocusTrap.tsx

@@ -47,7 +47,7 @@ export default () => {
                 Are you sure you'd like to delete the item titled 'My Item'?
               </Box>
             </Popup.Body>
-            <Flex gap="s" padding="xxs" marginTop="xxs">
+            <Flex gap="s" padding="xxs">
               <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                 Delete
               </Popup.CloseButton>

package/dist/mdx/react/popup/examples/InitialFocus.tsx

@@ -33,7 +33,7 @@ export default () => {
               Your message has been sent!
             </Box>
           </Popup.Body>
-          <Flex gap="s" padding="xxs" marginTop="xxs">
+          <Flex gap="s" padding="xxs">
             <Popup.CloseButton ref={initialFocusRef} aria-describedby="popup-message">
               OK
             </Popup.CloseButton>

package/dist/mdx/react/popup/examples/NestedPopups.tsx

@@ -38,7 +38,7 @@ export default () => {
             <Popup.Body>
               <p style={{marginTop: 0, marginBottom: 0}}>Contents of Popup 1</p>
             </Popup.Body>
-            <Flex gap="s" padding="xxs" marginTop="xxs">
+            <Flex gap="s" padding="xxs">
               <Popup model={popup2}>
                 <Popup.Target>Open Popup 2</Popup.Target>
                 <Popup.Popper>
@@ -47,7 +47,7 @@ export default () => {
                     <Popup.Body>
                       <p style={{marginTop: 0, marginBottom: 0}}>Contents of Popup 2</p>
                     </Popup.Body>
-                    <Flex gap="s" padding="xxs" marginTop="xxs">
+                    <Flex gap="s" padding="xxs">
                       <Popup.CloseButton as={Popup.CloseButton} model={popup1}>
                         Close Both (as)
                       </Popup.CloseButton>

package/dist/mdx/react/popup/examples/PopupWithFallbackPlacements.tsx

@@ -61,7 +61,7 @@ export default () => {
               <Popup.CloseIcon aria-label="Close" />
               <Popup.Heading paddingTop="m">This is Popup heading</Popup.Heading>
               <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
-              <Flex gap="s" padding="xxs" marginTop="xxs">
+              <Flex gap="s" padding="xxs">
                 <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                   Delete
                 </Popup.CloseButton>
@@ -79,7 +79,7 @@ export default () => {
               <Popup.CloseIcon aria-label="Close" />
               <Popup.Heading paddingTop="m">This is Popup heading</Popup.Heading>
               <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
-              <Flex gap="s" padding="xxs" marginTop="xxs">
+              <Flex gap="s" padding="xxs">
                 <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                   Delete
                 </Popup.CloseButton>
@@ -97,7 +97,7 @@ export default () => {
               <Popup.CloseIcon aria-label="Close" />
               <Popup.Heading paddingTop="m">This is Popup heading</Popup.Heading>
               <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
-              <Flex gap="s" padding="xxs" marginTop="xxs">
+              <Flex gap="s" padding="xxs">
                 <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                   Delete
                 </Popup.CloseButton>
@@ -115,7 +115,7 @@ export default () => {
               <Popup.CloseIcon aria-label="Close" />
               <Popup.Heading paddingTop="m">This is Popup heading</Popup.Heading>
               <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
-              <Flex gap="s" padding="xxs" marginTop="xxs">
+              <Flex gap="s" padding="xxs">
                 <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
                   Delete
                 </Popup.CloseButton>

package/dist/mdx/react/popup/examples/RTL.tsx

@@ -16,7 +16,7 @@ export default () => {
             האם ברצונך למחוק פריט זה
           </Box>
         </Popup.Body>
-        <Flex gap="s" padding="xxs" marginTop="xxs">
+        <Flex gap="s" padding="xxs">
           <DeleteButton>לִמְחוֹק</DeleteButton>
           <SecondaryButton>לְבַטֵל</SecondaryButton>
         </Flex>

package/dist/mdx/react/tooltip/examples/Placements.tsx

@@ -6,6 +6,7 @@ import {createStyles} from '@workday/canvas-kit-styling';
 import {system} from '@workday/canvas-tokens-web';
 
 const placementCardStyles = createStyles({
+  boxShadow: system.depth[2],
   display: 'flex',
   width: 100,
   height: 100,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "14.0.0-alpha.1147-next.0",
+  "version": "14.0.0-alpha.1148-next.0",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -45,10 +45,10 @@
     "@emotion/styled": "^11.6.0",
     "@stackblitz/sdk": "^1.11.0",
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-labs-react": "^14.0.0-alpha.1147-next.0",
-    "@workday/canvas-kit-preview-react": "^14.0.0-alpha.1147-next.0",
-    "@workday/canvas-kit-react": "^14.0.0-alpha.1147-next.0",
-    "@workday/canvas-kit-styling": "^14.0.0-alpha.1147-next.0",
+    "@workday/canvas-kit-labs-react": "^14.0.0-alpha.1148-next.0",
+    "@workday/canvas-kit-preview-react": "^14.0.0-alpha.1148-next.0",
+    "@workday/canvas-kit-react": "^14.0.0-alpha.1148-next.0",
+    "@workday/canvas-kit-styling": "^14.0.0-alpha.1148-next.0",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "3.0.0-alpha.5",
     "markdown-to-jsx": "^7.2.0",
@@ -61,5 +61,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "5.0"
   },
-  "gitHead": "de1260613697f1f525bc62614967f81521594356"
+  "gitHead": "17badcb6f4a0ecd0faa19e2d8fd7fa6241aa9393"
 }