@workday/canvas-kit-docs 10.3.42 → 10.3.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -57708,7 +57708,7 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
57708
57708
  "type": {
57709
57709
  "kind": "symbol",
57710
57710
  "name": "ModifierReturn",
57711
- "value": "ModifierReturn<{ size: { large: string; medium: string; small: string; extraSmall: string; }; iconPosition: { largeOnly: string; largeStart: string; largeEnd: string; mediumOnly: string; mediumStart: string; mediumEnd: string; ... 5 more ...; extraSmallEnd: string; }; }>"
57711
+ "value": "ModifierReturn<{ size: { large: string; medium: string; small: string; extraSmall: string; }; grow: { true: string; }; iconPosition: { largeOnly: string; largeStart: string; largeEnd: string; mediumOnly: string; mediumStart: string; ... 6 more ...; extraSmallEnd: string; }; }>"
57712
57712
  }
57713
57713
  },
57714
57714
  {
@@ -7,6 +7,7 @@ import SecondaryInverse from './examples/SecondaryInverse';
7
7
  import Tertiary from './examples/Tertiary';
8
8
  import TertiaryInverse from './examples/TertiaryInverse';
9
9
  import Delete from './examples/Delete';
10
+ import Grow from './examples/Grow';
10
11
  import CustomStyles from './examples/CustomStyles';
11
12
 
12
13
 
@@ -70,6 +71,12 @@ on a dark or colorful background such as `blueberry400`.
70
71
 
71
72
  <ExampleCodeBlock code={Delete} />
72
73
 
74
+ ### Grow Prop
75
+
76
+ The example below shows the use of the `grow` prop on different variants of buttons. This will set the width of the button to the width of its container.
77
+
78
+ <ExampleCodeBlock code={Grow} />
79
+
73
80
  ### Custom Styles
74
81
 
75
82
  We understand that there are instances in which consumers might need to adjust styles for specific
@@ -0,0 +1,26 @@
1
+ import React from 'react';
2
+
3
+ import {
4
+ DeleteButton,
5
+ PrimaryButton,
6
+ SecondaryButton,
7
+ TertiaryButton,
8
+ } from '@workday/canvas-kit-react/button';
9
+ import {Flex} from '@workday/canvas-kit-react/layout';
10
+
11
+ export default () => (
12
+ <Flex gap="s" padding="s" flexDirection="column" maxWidth={300}>
13
+ <PrimaryButton size="small" grow={true}>
14
+ Primary
15
+ </PrimaryButton>
16
+ <SecondaryButton size="small" grow={true}>
17
+ Secondary
18
+ </SecondaryButton>
19
+ <TertiaryButton size="small" grow={true}>
20
+ Tertiary
21
+ </TertiaryButton>
22
+ <DeleteButton size="small" grow={true}>
23
+ Delete
24
+ </DeleteButton>
25
+ </Flex>
26
+ );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-docs",
3
- "version": "10.3.42",
3
+ "version": "10.3.43",
4
4
  "description": "Documentation components of Canvas Kit components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -44,10 +44,10 @@
44
44
  "dependencies": {
45
45
  "@emotion/styled": "^11.6.0",
46
46
  "@storybook/csf": "0.0.1",
47
- "@workday/canvas-kit-labs-react": "^10.3.42",
48
- "@workday/canvas-kit-preview-react": "^10.3.42",
49
- "@workday/canvas-kit-react": "^10.3.42",
50
- "@workday/canvas-kit-styling": "^10.3.42",
47
+ "@workday/canvas-kit-labs-react": "^10.3.43",
48
+ "@workday/canvas-kit-preview-react": "^10.3.43",
49
+ "@workday/canvas-kit-react": "^10.3.43",
50
+ "@workday/canvas-kit-styling": "^10.3.43",
51
51
  "@workday/canvas-system-icons-web": "^3.0.0",
52
52
  "@workday/canvas-tokens-web": "^1.0.0",
53
53
  "markdown-to-jsx": "^6.10.3",
@@ -59,5 +59,5 @@
59
59
  "mkdirp": "^1.0.3",
60
60
  "typescript": "4.2"
61
61
  },
62
- "gitHead": "9a10699755a309bfd94348243e037c632492a7fc"
62
+ "gitHead": "61c7386af9f26e01b4830836e4bb99d2dfa1c102"
63
63
  }