@workday/canvas-kit-docs 14.0.0-alpha.1135-next.0 → 14.0.0-alpha.1144-next.0

package/dist/mdx/react/avatar/avatar/examples/CustomStyles.tsx

@@ -1,22 +1,22 @@
 import {Avatar} from '@workday/canvas-kit-react/avatar';
 import {createStencil, createStyles} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 import {systemIconStencil} from '../../../../icon';
 
-const customBlueAvatarStencil = createStencil({
+const customOrangeAvatar = createStencil({
   base: {
-    backgroundColor: base.berrySmoothie400,
+    backgroundColor: system.color.static.amber.default,
     ['[data-part="avatar-icon"]']: {
-      [systemIconStencil.vars.color]: base.berrySmoothie100,
+      [systemIconStencil.vars.color]: system.color.static.white,
     },
   },
 });
 
 const customGreenAvatarStencil = createStencil({
   base: {
-    backgroundColor: base.watermelon400,
+    backgroundColor: system.color.static.green.default,
     ['[data-part="avatar-icon"]']: {
-      [systemIconStencil.vars.color]: base.watermelon100,
+      [systemIconStencil.vars.color]: system.color.static.white,
     },
   },
 });
@@ -28,7 +28,7 @@ const containerStyles = createStyles({
 
 export default () => (
   <div className={containerStyles}>
-    <Avatar altText="Avatar" as="div" {...customBlueAvatarStencil()} />
+    <Avatar altText="Avatar" as="div" {...customOrangeAvatar()} />
     <Avatar altText="Avatar" as="div" {...customGreenAvatarStencil()} />
   </div>
 );

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import {CountBadge} from '@workday/canvas-kit-react/badge';
 import {createStyles} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 
 const containerStyles = createStyles({
   boxSizing: 'border-box',
@@ -11,13 +11,13 @@ const containerStyles = createStyles({
 
 const defaultBackground = createStyles({
   boxSizing: 'border-box',
-  backgroundColor: base.frenchVanilla100,
+  backgroundColor: system.color.bg.alt.soft,
   padding: system.space.x4,
 });
 
 const inverseBackground = createStyles({
   boxSizing: 'border-box',
-  backgroundColor: base.blueberry400,
+  backgroundColor: system.color.bg.primary.default,
   padding: system.space.x4,
 });
 

package/dist/mdx/react/badge/examples/CustomLimit.tsx

@@ -2,8 +2,8 @@ import * as React from 'react';
 import {CountBadge} from '@workday/canvas-kit-react/badge';
 import {TertiaryButton} from '@workday/canvas-kit-react/button';
 
-import {createStyles, cssVar} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {createStyles} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
 
 const columnStyles = createStyles({
   boxSizing: 'border-box',
@@ -14,7 +14,7 @@ const columnStyles = createStyles({
 
 const controls = createStyles({
   boxSizing: 'border-box',
-  borderBottom: `solid 1px ${cssVar(base.soap400)}`,
+  borderBottom: `solid 1px ${system.color.border.divider}`,
   display: 'flex',
   gap: system.space.x1,
   padding: system.space.x1,
@@ -22,13 +22,13 @@ const controls = createStyles({
 
 const defaultBackground = createStyles({
   boxSizing: 'border-box',
-  backgroundColor: base.frenchVanilla100,
+  backgroundColor: system.color.bg.alt.soft,
   padding: system.space.x4,
 });
 
 const inverseBackground = createStyles({
   boxSizing: 'border-box',
-  backgroundColor: base.blueberry400,
+  backgroundColor: system.color.bg.primary.default,
   padding: system.space.x4,
 });
 

package/dist/mdx/react/badge/examples/NotificationBadge.tsx

@@ -4,7 +4,7 @@ import {SecondaryButton, TertiaryButton} from '@workday/canvas-kit-react/button'
 import {AriaLiveRegion, useUniqueId} from '@workday/canvas-kit-react/common';
 import {createStyles, cssVar} from '@workday/canvas-kit-styling';
 import {notificationsIcon} from '@workday/canvas-system-icons-web';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 import {Tooltip} from '@workday/canvas-kit-react/tooltip';
 import {Flex} from '@workday/canvas-kit-react/layout';
 

package/dist/mdx/react/button/button/examples/CustomStyles.tsx

@@ -76,21 +76,21 @@ const myCustomStyles = createStyles({
 
 const customColors = {
   default: {
-    background: system.color.static.orange.soft,
-    icon: system.color.static.orange.strong,
-    label: system.color.static.orange.strong,
+    background: system.color.static.amber.soft,
+    icon: system.color.static.amber.strong,
+    label: system.color.static.amber.strong,
   },
   focus: {
-    background: system.color.static.orange.strong,
-    boxShadowInner: system.color.static.orange.soft,
-    boxShadowOuter: system.color.static.orange.strong,
+    background: system.color.static.amber.strong,
+    boxShadowInner: system.color.static.amber.soft,
+    boxShadowOuter: system.color.static.amber.strong,
   },
   hover: {
-    background: system.color.static.orange.default,
+    background: system.color.static.amber.default,
     icon: system.color.icon.inverse,
   },
   active: {
-    background: system.color.static.orange.strong,
+    background: system.color.static.amber.strong,
   },
   disabled: {},
 };

package/dist/mdx/react/icon/examples/Overview.tsx

@@ -9,7 +9,7 @@ import {CanvasGraphic, CanvasIconTypes} from '@workday/design-assets-types';
 import {AccentIcon, AppletIcon, SystemIcon, SystemIconCircle, Graphic} from '../../index';
 import {activityStreamIcon} from '@workday/canvas-system-icons-web';
 import {createStyles} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 
 const graphicExample: CanvasGraphic = {
   name: 'badgeAchievement',
@@ -27,7 +27,7 @@ const styleOverrides = {
     gap: system.space.x4,
   }),
   systemIconStyles: createStyles({
-    background: base.berrySmoothie100,
+    background: system.color.static.red.softer,
   }),
 };
 

package/dist/mdx/react/table/examples/RightToLeft.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import {Table} from '@workday/canvas-kit-react/table';
 import {CanvasProvider, ContentDirection} from '@workday/canvas-kit-react/common';
 import {createStyles} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 
 const tableHeaderStyles = createStyles({
   backgroundColor: system.color.bg.alt.softer,

package/dist/mdx/react/text/examples/LabelText/Disabled.tsx

@@ -2,10 +2,10 @@ import React from 'react';
 import {LabelText} from '@workday/canvas-kit-react/text';
 
 import {createStyles} from '@workday/canvas-kit-styling';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 
 const inverseBackground = createStyles({
-  backgroundColor: base.blueberry400,
+  backgroundColor: system.color.bg.primary.default,
   padding: system.space.x4,
   marginTop: system.space.x4,
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "14.0.0-alpha.1135-next.0",
+  "version": "14.0.0-alpha.1144-next.0",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -45,12 +45,12 @@
     "@emotion/styled": "^11.6.0",
     "@stackblitz/sdk": "^1.11.0",
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-labs-react": "^14.0.0-alpha.1135-next.0",
-    "@workday/canvas-kit-preview-react": "^14.0.0-alpha.1135-next.0",
-    "@workday/canvas-kit-react": "^14.0.0-alpha.1135-next.0",
-    "@workday/canvas-kit-styling": "^14.0.0-alpha.1135-next.0",
+    "@workday/canvas-kit-labs-react": "^14.0.0-alpha.1144-next.0",
+    "@workday/canvas-kit-preview-react": "^14.0.0-alpha.1144-next.0",
+    "@workday/canvas-kit-react": "^14.0.0-alpha.1144-next.0",
+    "@workday/canvas-kit-styling": "^14.0.0-alpha.1144-next.0",
     "@workday/canvas-system-icons-web": "^3.0.0",
-    "@workday/canvas-tokens-web": "^2.1.1",
+    "@workday/canvas-tokens-web": "3.0.0-alpha.0",
     "markdown-to-jsx": "^7.2.0",
     "react-syntax-highlighter": "^15.5.0",
     "ts-node": "^10.9.1"
@@ -61,5 +61,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "5.0"
   },
-  "gitHead": "3c15a81810dfe2232ca4519ae857a0e3b2a3d484"
+  "gitHead": "8c2a2215d9a0b96f98e4b768781d3a5061a61f9c"
 }