@workday/canvas-kit-docs 9.0.0-alpha.368-next.6 → 9.0.0-alpha.382-next.2

package/dist/mdx/react/banner/examples/StickyAnimation.tsx

@@ -3,9 +3,9 @@
 import {jsx, keyframes} from '@emotion/react';
 import React from 'react';
 
-import {CSSProperties} from '@workday/canvas-kit-react/tokens';
+import {CSSProperties, space} from '@workday/canvas-kit-react/tokens';
+import {useTheme} from '@workday/canvas-kit-react/common';
 import {Box} from '@workday/canvas-kit-react/layout';
-import {useThemeRTL} from '@workday/canvas-kit-labs-react/common';
 import {loopIcon} from '@workday/canvas-system-icons-web';
 import {Banner} from '@workday/canvas-kit-react/banner';
 
@@ -16,7 +16,7 @@ const containerStyles: CSSProperties = {
 };
 
 export default () => {
-  const {themeRTL, theme} = useThemeRTL();
+  const theme = useTheme();
   const bannerRef = React.useRef<HTMLButtonElement>(null);
   const containerRef = React.useRef<HTMLDivElement>(null);
   const [styles, setStyles] = React.useState<CSSProperties>();
@@ -38,7 +38,9 @@ export default () => {
     });
 
     setStyles({
-      margin: '4px 0px 4px 4px', // Room for focus outline since container is overflow hidden
+      marginY: space.xxxs,
+      marginInlineStart: space.xxxs,
+      maringInlineEnd: 0,
       animation: `${slideInKeyframes} .3s ease-out forwards`,
     });
   }, [theme.canvas.direction, rerun]);
@@ -46,7 +48,7 @@ export default () => {
   return (
     <Box height={64}>
       <div css={containerStyles} ref={containerRef}>
-        <div css={themeRTL(styles)}>
+        <div css={styles}>
           <Banner
             onClick={() => setRerun(r => r + 1)}
             hasError={true}

package/dist/mdx/react/common/examples/ResponsiveViewport.tsx

@@ -2,10 +2,9 @@ import * as React from 'react';
 import {Box, Grid} from '@workday/canvas-kit-react/layout';
 import styled from '@emotion/styled';
 import {type, space, colors, borderRadius} from '@workday/canvas-kit-react/tokens';
-import {useTheme} from '@workday/canvas-kit-react/common';
+import {getTheme} from '@workday/canvas-kit-react/common';
 
-// eslint-disable-next-line react-hooks/rules-of-hooks
-const theme = useTheme();
+const theme = getTheme();
 const {up, down} = theme.canvas.breakpoints;
 const small = down('m'); // Returns '@media (max-width: 768px)'
 const medium = up('m'); // Returns '@media (min-width: 768px)'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "9.0.0-alpha.368-next.6+63a2bafb",
+  "version": "9.0.0-alpha.382-next.2+5edca312",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -44,9 +44,9 @@
   "dependencies": {
     "@emotion/styled": "^11.6.0",
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-labs-react": "^9.0.0-alpha.368-next.6+63a2bafb",
-    "@workday/canvas-kit-preview-react": "^9.0.0-alpha.368-next.6+63a2bafb",
-    "@workday/canvas-kit-react": "^9.0.0-alpha.368-next.6+63a2bafb",
+    "@workday/canvas-kit-labs-react": "^9.0.0-alpha.382-next.2+5edca312",
+    "@workday/canvas-kit-preview-react": "^9.0.0-alpha.382-next.2+5edca312",
+    "@workday/canvas-kit-react": "^9.0.0-alpha.382-next.2+5edca312",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "markdown-to-jsx": "^6.10.3",
     "ts-node": "^10.9.1"
@@ -57,5 +57,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "4.2"
   },
-  "gitHead": "63a2bafbfbf34c1f98b6db4128c4079a358af453"
+  "gitHead": "5edca312f27bb6df43083e778e7c7eb06f34e655"
 }