@workday/canvas-kit-docs 16.0.0-alpha.0464-next.0 → 16.0.0-alpha.0465-next.0

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.
Files changed (28) hide show
  1. package/dist/es6/lib/docs.js +812 -704
  2. package/dist/mdx/react/dialog/examples/Basic.tsx +4 -6
  3. package/dist/mdx/react/dialog/examples/DialogWithFallbackPlacements.tsx +13 -37
  4. package/dist/mdx/react/dialog/examples/Focus.tsx +4 -10
  5. package/dist/mdx/react/modal/examples/Basic.tsx +4 -5
  6. package/dist/mdx/react/modal/examples/BodyOverflow.tsx +3 -3
  7. package/dist/mdx/react/modal/examples/CustomFocus.tsx +6 -5
  8. package/dist/mdx/react/modal/examples/FormModal.tsx +5 -13
  9. package/dist/mdx/react/modal/examples/FullOverflow.tsx +3 -3
  10. package/dist/mdx/react/modal/examples/IframeTest.tsx +3 -5
  11. package/dist/mdx/react/modal/examples/ModalWithPopup.tsx +6 -8
  12. package/dist/mdx/react/modal/examples/ModalWithPopupRTL.tsx +6 -6
  13. package/dist/mdx/react/modal/examples/NoTargetRTL.tsx +3 -3
  14. package/dist/mdx/react/modal/examples/ReturnFocus.tsx +2 -7
  15. package/dist/mdx/react/modal/examples/StackedModals.tsx +6 -8
  16. package/dist/mdx/react/modal/examples/WithTooltips.tsx +22 -20
  17. package/dist/mdx/react/modal/examples/WithoutCloseIcon.tsx +3 -4
  18. package/dist/mdx/react/popup/examples/Basic.tsx +4 -10
  19. package/dist/mdx/react/popup/examples/FocusRedirect.tsx +3 -3
  20. package/dist/mdx/react/popup/examples/FocusTrap.tsx +3 -3
  21. package/dist/mdx/react/popup/examples/InitialFocus.tsx +7 -12
  22. package/dist/mdx/react/popup/examples/InlinePopup.tsx +2 -2
  23. package/dist/mdx/react/popup/examples/MultiplePopups.tsx +2 -2
  24. package/dist/mdx/react/popup/examples/NestedPopups.tsx +2 -2
  25. package/dist/mdx/react/popup/examples/PopupWithFallbackPlacements.tsx +13 -13
  26. package/dist/mdx/react/popup/examples/RTL.tsx +3 -3
  27. package/dist/mdx/react/tooltip/Tooltip.mdx +1 -1
  28. package/package.json +6 -6
@@ -49,12 +49,12 @@ export default () => {
49
49
  Are you sure you'd like to delete the item titled 'My Item'?
50
50
  </Box>
51
51
  </Popup.Body>
52
- <Flex cs={{gap: system.gap.sm, paddingBlock: system.padding.xxs}}>
52
+ <Popup.ButtonGroup>
53
+ <Popup.CloseButton>Cancel</Popup.CloseButton>
53
54
  <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
54
55
  Delete
55
56
  </Popup.CloseButton>
56
- <Popup.CloseButton>Cancel</Popup.CloseButton>
57
- </Flex>
57
+ </Popup.ButtonGroup>
58
58
  </Popup.Card>
59
59
  </Popup.Popper>
60
60
  <SecondaryButton>Next Focusable Button</SecondaryButton>
@@ -26,11 +26,6 @@ const bodyStyles = createStyles({
26
26
  marginBlock: '0',
27
27
  });
28
28
 
29
- const flexStyles = createStyles({
30
- gap: system.gap.md,
31
- padding: system.padding.xs,
32
- });
33
-
34
29
  const columnStyles = createStyles({
35
30
  gap: system.gap.md,
36
31
  alignItems: 'flex-start',
@@ -60,11 +55,11 @@ const InitialFocusOnButton = () => {
60
55
  Your message has been sent!
61
56
  </Text>
62
57
  </Popup.Body>
63
- <Flex cs={flexStyles}>
58
+ <Popup.ButtonGroup>
64
59
  <Popup.CloseButton as={PrimaryButton} ref={initialFocusRef}>
65
60
  OK
66
61
  </Popup.CloseButton>
67
- </Flex>
62
+ </Popup.ButtonGroup>
68
63
  </Popup.Card>
69
64
  </Popup.Popper>
70
65
  </Popup>
@@ -96,10 +91,10 @@ const InitialFocusOnTextInput = () => {
96
91
  <FormField.Input as={TextInput} ref={initialFocusRef} />
97
92
  </FormField>
98
93
  </Popup.Body>
99
- <Flex cs={flexStyles}>
100
- <Popup.CloseButton as={PrimaryButton}>Send</Popup.CloseButton>
94
+ <Popup.ButtonGroup>
101
95
  <Popup.CloseButton>Cancel</Popup.CloseButton>
102
- </Flex>
96
+ <Popup.CloseButton as={PrimaryButton}>Send</Popup.CloseButton>
97
+ </Popup.ButtonGroup>
103
98
  </Popup.Card>
104
99
  </Popup.Popper>
105
100
  </Popup>
@@ -129,9 +124,9 @@ const InitialFocusOnHeading = () => {
129
124
  <Popup.Body>
130
125
  <Text cs={bodyStyles}>Review the summary below before continuing.</Text>
131
126
  </Popup.Body>
132
- <Flex cs={flexStyles}>
127
+ <Popup.ButtonGroup>
133
128
  <Popup.CloseButton as={PrimaryButton}>Continue</Popup.CloseButton>
134
- </Flex>
129
+ </Popup.ButtonGroup>
135
130
  </Popup.Card>
136
131
  </Popup.Popper>
137
132
  </Popup>
@@ -90,10 +90,10 @@ function SingleInlinePopup({
90
90
  <Popup.Body>
91
91
  <Box as="p">Are you sure you'd like to delete the item titled 'My Item'?</Box>
92
92
  </Popup.Body>
93
- <Flex cs={flexStyles}>
93
+ <Popup.ButtonGroup>
94
94
  <Popup.CloseButton ref={initialFocusRef}>Cancel</Popup.CloseButton>
95
95
  <Popup.CloseButton as={DeleteButton}>Delete</Popup.CloseButton>
96
- </Flex>
96
+ </Popup.ButtonGroup>
97
97
  </Popup.Card>
98
98
  </Popup.Popper>
99
99
  </Popup>
@@ -46,9 +46,9 @@ export default () => {
46
46
  Shift + Tab.
47
47
  </p>
48
48
  </Popup.Body>
49
- <Flex>
49
+ <Popup.ButtonGroup>
50
50
  <Popup.CloseButton>OK</Popup.CloseButton>
51
- </Flex>
51
+ </Popup.ButtonGroup>
52
52
  </Popup.Card>
53
53
  </Popup.Popper>
54
54
  </Popup>
@@ -46,12 +46,12 @@ export default () => {
46
46
  <Popup.Body>
47
47
  <p style={{marginBlockStart: 0, marginBlockEnd: 0}}>Contents of Popup 2</p>
48
48
  </Popup.Body>
49
- <Flex cs={{gap: system.gap.md, padding: system.padding.xs}}>
49
+ <Popup.ButtonGroup>
50
50
  <Popup.CloseButton as={Popup.CloseButton} model={popup1}>
51
51
  Close Both (as)
52
52
  </Popup.CloseButton>
53
53
  <SecondaryButton {...closeBothProps}>Close Both (props)</SecondaryButton>
54
- </Flex>
54
+ </Popup.ButtonGroup>
55
55
  </Popup.Card>
56
56
  </Popup.Popper>
57
57
  </Popup>
@@ -1,5 +1,5 @@
1
1
  import {DeleteButton} from '@workday/canvas-kit-react/button';
2
- import {Flex, Grid} from '@workday/canvas-kit-react/layout';
2
+ import {Grid} from '@workday/canvas-kit-react/layout';
3
3
  import {
4
4
  Popup,
5
5
  useCloseOnEscape,
@@ -63,12 +63,12 @@ export default () => {
63
63
  This is Popup heading
64
64
  </Popup.Heading>
65
65
  <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
66
- <Flex cs={{gap: system.gap.sm, padding: system.padding.xs}}>
66
+ <Popup.ButtonGroup>
67
+ <Popup.CloseButton>Cancel</Popup.CloseButton>
67
68
  <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
68
69
  Delete
69
70
  </Popup.CloseButton>
70
- <Popup.CloseButton>Cancel</Popup.CloseButton>
71
- </Flex>
71
+ </Popup.ButtonGroup>
72
72
  </Popup.Card>
73
73
  </Popup.Popper>
74
74
  </Popup>
@@ -83,12 +83,12 @@ export default () => {
83
83
  This is Popup heading
84
84
  </Popup.Heading>
85
85
  <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
86
- <Flex cs={{gap: system.gap.sm, padding: system.padding.xs}}>
86
+ <Popup.ButtonGroup>
87
+ <Popup.CloseButton>Cancel</Popup.CloseButton>
87
88
  <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
88
89
  Delete
89
90
  </Popup.CloseButton>
90
- <Popup.CloseButton>Cancel</Popup.CloseButton>
91
- </Flex>
91
+ </Popup.ButtonGroup>
92
92
  </Popup.Card>
93
93
  </Popup.Popper>
94
94
  </Popup>
@@ -103,12 +103,12 @@ export default () => {
103
103
  This is Popup heading
104
104
  </Popup.Heading>
105
105
  <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
106
- <Flex cs={{gap: system.gap.md, padding: system.padding.xs}}>
106
+ <Popup.ButtonGroup>
107
+ <Popup.CloseButton>Cancel</Popup.CloseButton>
107
108
  <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
108
109
  Delete
109
110
  </Popup.CloseButton>
110
- <Popup.CloseButton>Cancel</Popup.CloseButton>
111
- </Flex>
111
+ </Popup.ButtonGroup>
112
112
  </Popup.Card>
113
113
  </Popup.Popper>
114
114
  </Popup>
@@ -123,12 +123,12 @@ export default () => {
123
123
  This is Popup heading
124
124
  </Popup.Heading>
125
125
  <Popup.Body>Are you sure you'd like to delete the item titled 'My Item'?</Popup.Body>
126
- <Flex cs={{gap: system.gap.md, padding: system.padding.xs}}>
126
+ <Popup.ButtonGroup>
127
+ <Popup.CloseButton>Cancel</Popup.CloseButton>
127
128
  <Popup.CloseButton as={DeleteButton} onClick={handleDelete}>
128
129
  Delete
129
130
  </Popup.CloseButton>
130
- <Popup.CloseButton>Cancel</Popup.CloseButton>
131
- </Flex>
131
+ </Popup.ButtonGroup>
132
132
  </Popup.Card>
133
133
  </Popup.Popper>
134
134
  </Popup>
@@ -16,10 +16,10 @@ export default () => {
16
16
  האם ברצונך למחוק פריט זה
17
17
  </Box>
18
18
  </Popup.Body>
19
- <Flex cs={{gap: system.gap.sm, paddingBlock: system.padding.xxs}}>
20
- <DeleteButton>לִמְחוֹק</DeleteButton>
19
+ <Popup.ButtonGroup>
21
20
  <SecondaryButton>לְבַטֵל</SecondaryButton>
22
- </Flex>
21
+ <DeleteButton>לִמְחוֹק</DeleteButton>
22
+ </Popup.ButtonGroup>
23
23
  </Popup.Card>
24
24
  </CanvasProvider>
25
25
  );
@@ -72,7 +72,7 @@ and focus events.
72
72
  {' '}
73
73
  Caution: Describe type has been deprecated{' '}
74
74
  </InformationHighlight.Heading>
75
- <InformationHighlight.Body>
75
+ <InformationHighlight.Body cs={{'p': {display: 'inline-block'}}}>
76
76
  Assistive technology may ignore{' '}
77
77
  <StatusIndicator variant="gray">
78
78
  <StatusIndicator.Label cs={{textTransform: 'lowercase'}}>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-docs",
3
- "version": "16.0.0-alpha.0464-next.0",
3
+ "version": "16.0.0-alpha.0465-next.0",
4
4
  "description": "Documentation components of Canvas Kit components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -47,10 +47,10 @@
47
47
  "@stackblitz/sdk": "^1.11.0",
48
48
  "@storybook/csf": "0.0.1",
49
49
  "@workday/canvas-expressive-icons-web": "1.0.2",
50
- "@workday/canvas-kit-labs-react": "^16.0.0-alpha.0464-next.0",
51
- "@workday/canvas-kit-preview-react": "^16.0.0-alpha.0464-next.0",
52
- "@workday/canvas-kit-react": "^16.0.0-alpha.0464-next.0",
53
- "@workday/canvas-kit-styling": "^16.0.0-alpha.0464-next.0",
50
+ "@workday/canvas-kit-labs-react": "^16.0.0-alpha.0465-next.0",
51
+ "@workday/canvas-kit-preview-react": "^16.0.0-alpha.0465-next.0",
52
+ "@workday/canvas-kit-react": "^16.0.0-alpha.0465-next.0",
53
+ "@workday/canvas-kit-styling": "^16.0.0-alpha.0465-next.0",
54
54
  "@workday/canvas-system-icons-web": "4.0.4",
55
55
  "@workday/canvas-tokens-web": "4.4.0-beta.6",
56
56
  "markdown-to-jsx": "^7.2.0",
@@ -63,5 +63,5 @@
63
63
  "mkdirp": "^1.0.3",
64
64
  "typescript": "5.0"
65
65
  },
66
- "gitHead": "e91ae68242623c9e4d24b9fbdc3ce7ea8368c425"
66
+ "gitHead": "02dd284d77ccf92991d5526190f453d442ccebcc"
67
67
  }