@workday/canvas-kit-docs 10.3.1 → 10.3.2

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.
@@ -20,26 +20,28 @@ export default () => {
20
20
  expanded ? 'expanded' : 'collapsed'
21
21
  );
22
22
 
23
+ const expandedContent = (
24
+ <Flex alignItems="center" paddingY="s" paddingX="s">
25
+ <Flex marginInlineEnd="s">
26
+ <AccentIcon icon={rocketIcon} />
27
+ </Flex>
28
+ <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
29
+ Tasks Panel
30
+ </Text>
31
+ </Flex>
32
+ );
33
+
23
34
  return (
24
35
  <CanvasProvider theme={{canvas: {direction}}}>
25
36
  <Flex height={320}>
26
37
  <SidePanel {...panelProps} onStateTransition={setPanelState}>
27
38
  <SidePanel.ToggleButton {...controlProps} />
28
- {panelState === 'expanded' && (
29
- <Flex alignItems="center" paddingY="s" paddingX="s">
30
- <Flex marginInlineEnd="s">
31
- <AccentIcon icon={rocketIcon} />
32
- </Flex>
33
- <Text
34
- as="h3"
35
- typeLevel="body.large"
36
- color="licorice500"
37
- fontWeight="bold"
38
- {...labelProps}
39
- >
40
- Tasks Panel
41
- </Text>
42
- </Flex>
39
+ {panelState === 'expanded' ? (
40
+ expandedContent
41
+ ) : (
42
+ <Text hidden {...labelProps}>
43
+ Tasks Panel
44
+ </Text>
43
45
  )}
44
46
  </SidePanel>
45
47
  <Flex
@@ -21,21 +21,23 @@ const RightPanel = () => {
21
21
  expanded ? 'expanded' : 'collapsed'
22
22
  );
23
23
 
24
+ const expandedContent = (
25
+ <Flex alignItems="center" justifyContent="flex-end" paddingY="s" paddingX="s">
26
+ <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
27
+ Tasks Panel
28
+ </Text>
29
+ </Flex>
30
+ );
31
+
24
32
  return (
25
33
  <StyledSidePanel {...panelProps} onStateTransition={setPanelState} origin="right">
26
34
  <SidePanel.ToggleButton {...controlProps} />
27
- {panelState === 'expanded' && (
28
- <Flex alignItems="center" justifyContent="flex-end" paddingY="s" paddingX="s">
29
- <Text
30
- as="h3"
31
- typeLevel="body.large"
32
- color="licorice500"
33
- fontWeight="bold"
34
- {...labelProps}
35
- >
36
- Tasks Panel
37
- </Text>
38
- </Flex>
35
+ {panelState === 'expanded' ? (
36
+ expandedContent
37
+ ) : (
38
+ <Text hidden {...labelProps}>
39
+ Tasks Panel
40
+ </Text>
39
41
  )}
40
42
  </StyledSidePanel>
41
43
  );
@@ -18,23 +18,25 @@ export default () => {
18
18
  expanded ? 'expanded' : 'collapsed'
19
19
  );
20
20
 
21
+ const expandedContent = (
22
+ <Flex alignItems="center" paddingY="s" paddingX="s">
23
+ <Text as="h3" typeLevel="body.large" color="licorice500" fontWeight="bold" {...labelProps}>
24
+ Alternate Panel
25
+ </Text>
26
+ </Flex>
27
+ );
28
+
21
29
  return (
22
30
  <CanvasProvider theme={{canvas: {direction}}}>
23
31
  <Flex height={320} backgroundColor="soap100">
24
32
  <SidePanel {...panelProps} onStateTransition={setPanelState} variant="alternate">
25
33
  <SidePanel.ToggleButton {...controlProps} />
26
- {panelState === 'expanded' && (
27
- <Flex alignItems="center" paddingY="s" paddingX="s">
28
- <Text
29
- as="h3"
30
- typeLevel="body.large"
31
- color="licorice500"
32
- fontWeight="bold"
33
- {...labelProps}
34
- >
35
- Alternate Panel
36
- </Text>
37
- </Flex>
34
+ {panelState === 'expanded' ? (
35
+ expandedContent
36
+ ) : (
37
+ <Text hidden {...labelProps}>
38
+ Tasks Panel
39
+ </Text>
38
40
  )}
39
41
  </SidePanel>
40
42
  <Flex
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-docs",
3
- "version": "10.3.1",
3
+ "version": "10.3.2",
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.1",
48
- "@workday/canvas-kit-preview-react": "^10.3.1",
49
- "@workday/canvas-kit-react": "^10.3.1",
50
- "@workday/canvas-kit-styling": "^10.3.1",
47
+ "@workday/canvas-kit-labs-react": "^10.3.2",
48
+ "@workday/canvas-kit-preview-react": "^10.3.2",
49
+ "@workday/canvas-kit-react": "^10.3.2",
50
+ "@workday/canvas-kit-styling": "^10.3.2",
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": "c076f1d53bef6c692eb704f732d7a1edb6f95730"
62
+ "gitHead": "07021e74cb126d51459bb4046b3760bf2573a007"
63
63
  }