@workday/canvas-kit-docs 11.0.0-alpha.669-next.0 → 11.0.0-alpha.682-next.0

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

@@ -11,16 +11,18 @@ any questions.
 
 - [Codemod](#codemod)
 - [Deprecations](#deprecations)
-  - [Form Field Main](#form-field-main)
-  - [Text Input Preview](#text-input-preview)
-  - [Text Area Preview](#text-input-preview)
+  - [Form Field (Main)](#form-field-main)
   - [Label Text](#label-text)
+  - [Text Area (Preview)](#text-area-preview)
+  - [Text Input (Preview)](#text-input-preview)
 - [Component Updates](#component-updates)
   - [Component Style Updates](#component-style-updates)
   - [Card](#card)
+  - [Checkbox](#checkbox)
   - [Count Badge](#count-badge)
-  - [Text](#text)
   - [Form Field Preview](#form-field-preview)
+  - [Radio (Preview)](#radio-preview)
+  - [Text](#text)
 
 ## Codemod
 
@@ -100,13 +102,16 @@ instead.
 
 ---
 
-### Text Input Preview
+### Label Text
 
-**PR:** [#2472](https://github.com/Workday/canvas-kit/pull/2472)
+**PR:** [#2455](https://github.com/Workday/canvas-kit/pull/2455)
 
-We've deprecated `TextInput` from [Preview](#preview) in favor of our compound component `FormField`
+We've deprecated `LabelText` from [Main](#main) in favor of our compound component `FormField.Label`
 in [Preview](#preview). Please use
-[`FormField`](https://workday.github.io/canvas-kit/?path=//docs/preview-inputs-form-field--basic)
+[`FormField.Label`](https://workday.github.io/canvas-kit/?path=//docs/preview-inputs-form-field--basic)
+instead.
+
+If you still want to use a `label` element outside of the context of a form, you can use `Text`
 instead.
 
 ---
@@ -122,16 +127,13 @@ instead.
 
 ---
 
-### Label Text
+### Text Input Preview
 
-**PR:** [#2455](https://github.com/Workday/canvas-kit/pull/2455)
+**PR:** [#2472](https://github.com/Workday/canvas-kit/pull/2472)
 
-We've deprecated `LabelText` from [Main](#main) in favor of our compound component `FormField.Label`
+We've deprecated `TextInput` from [Preview](#preview) in favor of our compound component `FormField`
 in [Preview](#preview). Please use
-[`FormField.Label`](https://workday.github.io/canvas-kit/?path=//docs/preview-inputs-form-field--basic)
-instead.
-
-If you still want to use a `label` element outside of the context of a form, you can use `Text`
+[`FormField`](https://workday.github.io/canvas-kit/?path=//docs/preview-inputs-form-field--basic)
 instead.
 
 ---
@@ -344,6 +346,14 @@ See below:
 and [tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs). `Card`
 no longer extends the `Box` component, however, it still supports Emotion `styled` and style props.
 
+### Checkbox
+
+**PR:** [#2542](https://github.com/Workday/canvas-kit/pull/2542)
+
+`Checkbox` now uses [Canvas Tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs) and our [new styling utilities](https://workday.github.io/canvas-kit/?path=/docs/styling-basics--create-modifiers#createstyles-api). The component now supports the `cs`
+prop, but otherwise the API has not changed. It should behave identically as it did in previous
+versions.
+
 ### Count Badge
 
 **PR:** [#2442](https://github.com/Workday/canvas-kit/pull/2442)
@@ -355,26 +365,7 @@ our new
 The component API has not been changed, and it should behave identically as it did in previous
 versions.
 
-### Form Field in Preview
-
-**PR:** [#2541](https://github.com/Workday/canvas-kit/pull/2541)
-
-`FormField` in [Preview](#preview) and its subcomponents have been refactored to use our
-[new styling utilities](https://workday.github.io/canvas-kit/?path=/docs/styling-basics--create-modifiers#createstyles-api)
-and [tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs).
-
-### Text
-
-**PR:** [#2455](https://github.com/Workday/canvas-kit/pull/2455)
-
-`Text` has been refactored to use our
-[new styling utilities](https://workday.github.io/canvas-kit/?path=/docs/styling-basics--create-modifiers#createstyles-api)
-and [tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs). It no
-longer extends the `Box` component, however, it still supports Emotion `styled` and style props.
-Type level components: `Title`, `Heading`, `BodyText` and `Subtext`, have not been changed since
-they extend the `Text` component. These changes do not affect the components API.
-
-### Form Field Preview
+### Form Field (Preview)
 
 **PR:** [#2472](https://github.com/Workday/canvas-kit/pull/2472)
 
@@ -419,4 +410,26 @@ import {TextInput} from '@workday/canvas-kit-react/text-input';
 </FormField>;
 ```
 
-🤖 The codemod will handle the change of `hasError` to `error` for you automatically.
+🤖 The codemod will handle the change of `hasError` to `error` for you automatically.
+
+### Radio (Preview)
+
+**PR:** [#2546](https://github.com/Workday/canvas-kit/pull/2546)
+
+`Radio` and `RadioGroup` now use
+[Canvas Tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs) and
+our
+[new styling utilities](https://workday.github.io/canvas-kit/?path=/docs/styling-basics--create-modifiers#createstyles-api).
+The component now supports the `cs` prop, but otherwise the API has not changed. It should behave
+identically as it did in previous versions.
+
+### Text
+
+**PR:** [#2455](https://github.com/Workday/canvas-kit/pull/2455)
+
+`Text` has been refactored to use our
+[new styling utilities](https://workday.github.io/canvas-kit/?path=/docs/styling-basics--create-modifiers#createstyles-api)
+and [tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs). It no
+longer extends the `Box` component, however, it still supports Emotion `styled` and style props.
+Type level components: `Title`, `Heading`, `BodyText` and `Subtext`, have not been changed since
+they extend the `Text` component. These changes do not affect the components API.

package/dist/mdx/preview-react/side-panel/examples/Basic.tsx

@@ -20,26 +20,28 @@ export default () => {
     expanded ? 'expanded' : 'collapsed'
   );
 
+  const expandedContent = (
+    <Flex alignItems="center" paddingY="s" paddingX="s">
+      <Flex marginInlineEnd="s">
+        <AccentIcon icon={rocketIcon} />
+      </Flex>
+      <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
+        Tasks Panel
+      </Text>
+    </Flex>
+  );
+
   return (
     <CanvasProvider theme={{canvas: {direction}}}>
       <Flex height={320}>
         <SidePanel {...panelProps} onStateTransition={setPanelState}>
           <SidePanel.ToggleButton {...controlProps} />
-          {panelState === 'expanded' && (
-            <Flex alignItems="center" paddingY="s" paddingX="s">
-              <Flex marginInlineEnd="s">
-                <AccentIcon icon={rocketIcon} />
-              </Flex>
-              <Text
-                as="h3"
-                typeLevel="body.large"
-                color="licorice500"
-                fontWeight="bold"
-                {...labelProps}
-              >
-                Tasks Panel
-              </Text>
-            </Flex>
+          {panelState === 'expanded' ? (
+            expandedContent
+          ) : (
+            <Text hidden {...labelProps}>
+              Tasks Panel
+            </Text>
           )}
         </SidePanel>
         <Flex

package/dist/mdx/preview-react/side-panel/examples/RightOrigin.tsx

@@ -21,21 +21,23 @@ const RightPanel = () => {
     expanded ? 'expanded' : 'collapsed'
   );
 
+  const expandedContent = (
+    <Flex alignItems="center" justifyContent="flex-end" paddingY="s" paddingX="s">
+      <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
+        Tasks Panel
+      </Text>
+    </Flex>
+  );
+
   return (
     <StyledSidePanel {...panelProps} onStateTransition={setPanelState} origin="right">
       <SidePanel.ToggleButton {...controlProps} />
-      {panelState === 'expanded' && (
-        <Flex alignItems="center" justifyContent="flex-end" paddingY="s" paddingX="s">
-          <Text
-            as="h3"
-            typeLevel="body.large"
-            color="licorice500"
-            fontWeight="bold"
-            {...labelProps}
-          >
-            Tasks Panel
-          </Text>
-        </Flex>
+      {panelState === 'expanded' ? (
+        expandedContent
+      ) : (
+        <Text hidden {...labelProps}>
+          Tasks Panel
+        </Text>
       )}
     </StyledSidePanel>
   );

package/dist/mdx/preview-react/side-panel/examples/Variant.tsx

@@ -18,23 +18,25 @@ export default () => {
     expanded ? 'expanded' : 'collapsed'
   );
 
+  const expandedContent = (
+    <Flex alignItems="center" paddingY="s" paddingX="s">
+      <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
+        Alternate Panel
+      </Text>
+    </Flex>
+  );
+
   return (
     <CanvasProvider theme={{canvas: {direction}}}>
       <Flex height={320} backgroundColor="soap100">
         <SidePanel {...panelProps} onStateTransition={setPanelState} variant="alternate">
           <SidePanel.ToggleButton {...controlProps} />
-          {panelState === 'expanded' && (
-            <Flex alignItems="center" paddingY="s" paddingX="s">
-              <Text
-                as="h3"
-                typeLevel="body.large"
-                color="licorice500"
-                fontWeight="bold"
-                {...labelProps}
-              >
-                Alternate Panel
-              </Text>
-            </Flex>
+          {panelState === 'expanded' ? (
+            expandedContent
+          ) : (
+            <Text hidden {...labelProps}>
+              Tasks Panel
+            </Text>
           )}
         </SidePanel>
         <Flex

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "11.0.0-alpha.669-next.0",
+  "version": "11.0.0-alpha.682-next.0",
   "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": "^11.0.0-alpha.669-next.0",
-    "@workday/canvas-kit-preview-react": "^11.0.0-alpha.669-next.0",
-    "@workday/canvas-kit-react": "^11.0.0-alpha.669-next.0",
-    "@workday/canvas-kit-styling": "^10.3.1",
+    "@workday/canvas-kit-labs-react": "^11.0.0-alpha.682-next.0",
+    "@workday/canvas-kit-preview-react": "^11.0.0-alpha.682-next.0",
+    "@workday/canvas-kit-react": "^11.0.0-alpha.682-next.0",
+    "@workday/canvas-kit-styling": "^11.0.0-alpha.682-next.0",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "^1.0.2",
     "markdown-to-jsx": "^6.10.3",
@@ -59,5 +59,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "4.2"
   },
-  "gitHead": "61dca4fd454434a6e3d7d6d691a700c704b14c51"
+  "gitHead": "2c256dd5658519e10bfd8e30d629ceb0a8260a71"
 }