@workday/canvas-kit-docs 7.0.6 → 7.0.7

package/dist/mdx/react/checkbox/Checkbox.mdx

@@ -4,6 +4,7 @@ import Checkbox from '@workday/canvas-kit-react/checkbox/lib/Checkbox.tsx';
 
 import Alert from './examples/Alert';
 import Basic from './examples/Basic';
+import Inverse from './examples/Inverse';
 import Disabled from './examples/Disabled';
 import Error from './examples/Error';
 import Indeterminate from './examples/Indeterminate';
@@ -35,6 +36,12 @@ element.
 
 <ExampleCodeBlock code={Basic} />
 
+### Inverse
+
+Checkbox with inverse variation
+
+<ExampleCodeBlock code={Inverse} />
+
 ### Disabled
 
 Set the `disabled` prop of the Checkbox to prevent users from interacting with it.

package/dist/mdx/react/checkbox/examples/Inverse.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import {Checkbox} from '@workday/canvas-kit-react/checkbox';
+import {HStack} from '@workday/canvas-kit-react/layout';
+
+export default () => {
+  const [checked, setChecked] = React.useState(false);
+
+  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setChecked(event.target.checked);
+  };
+
+  return (
+    <HStack spacing="s" backgroundColor="blueberry400" padding="s">
+      <Checkbox
+        variant="inverse"
+        checked={checked}
+        label="I agree to the terms"
+        onChange={handleChange}
+      />
+    </HStack>
+  );
+};

package/dist/mdx/react/radio/Radio.mdx

@@ -5,6 +5,7 @@ import {Radio, RadioGroup} from '@workday/canvas-kit-react/radio';
 import Alert from './examples/Alert';
 import Basic from './examples/Basic';
 import Disabled from './examples/Disabled';
+import Inverse from './examples/Inverse';
 import Error from './examples/Error';
 import LabelPosition from './examples/LabelPosition';
 import NoValue from './examples/NoValue';
@@ -41,6 +42,12 @@ Set the `disabled` prop of the Radio Button to prevent users from interacting wi
 
 <ExampleCodeBlock code={Disabled} />
 
+### Inverse
+
+Radio with inverse variant
+
+<ExampleCodeBlock code={Inverse} />
+
 ### Radio Buttons with No Values
 
 The `value` prop may be omitted from Radio Buttons, in which case the `value` prop of the Radio

package/dist/mdx/react/radio/examples/Inverse.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import {FormField} from '@workday/canvas-kit-react/form-field';
+import {Radio, RadioGroup} from '@workday/canvas-kit-react/radio';
+import {Box} from '@workday/canvas-kit-react/layout';
+
+export default () => {
+  const [value, setValue] = React.useState<string | number>('deep-dish');
+
+  const handleChange = (value: string | number) => {
+    setValue(value);
+  };
+
+  return (
+    <Box backgroundColor="blueberry400" padding="s">
+      <RadioGroup name="crust" onChange={handleChange} value={value}>
+        <Radio variant="inverse" label="Deep dish" value="deep-dish" />
+        <Radio variant="inverse" label="Thin" value="thin" />
+        <Radio variant="inverse" label="Gluten free" value="gluten-free" />
+        <Radio variant="inverse" label="Cauliflower" value="cauliflower" />
+      </RadioGroup>
+    </Box>
+  );
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "7.0.6",
+  "version": "7.0.7",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -41,7 +41,7 @@
   ],
   "dependencies": {
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-react": "^7.0.6"
+    "@workday/canvas-kit-react": "^7.0.7"
   },
   "devDependencies": {
     "fs-extra": "^10.0.0",
@@ -49,5 +49,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "4.1"
   },
-  "gitHead": "69b6de9a6ae819a969dbd197fc801d51385337b9"
+  "gitHead": "ea3eafb31497479dd35c38da2170cfab8ec7bcf9"
 }