@workday/canvas-kit-docs 13.0.0-alpha.1103-next.0 → 13.0.0-alpha.1104-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.
- package/dist/es6/mdx/style-props/examples/Background.js +2 -2
- package/dist/es6/mdx/style-props/examples/Border.js +2 -2
- package/dist/es6/mdx/style-props/examples/Color.js +2 -2
- package/dist/es6/mdx/style-props/examples/Depth.js +2 -2
- package/dist/es6/mdx/style-props/examples/Position.js +2 -2
- package/dist/es6/mdx/style-props/examples/Space.js +2 -2
- package/dist/mdx/preview-react/loading-sparkles/examples/Basic.tsx +2 -2
- package/dist/mdx/react/expandable/examples/Avatar.tsx +2 -2
- package/dist/mdx/style-props/examples/Background.tsx +2 -2
- package/dist/mdx/style-props/examples/Border.tsx +2 -2
- package/dist/mdx/style-props/examples/Color.tsx +2 -2
- package/dist/mdx/style-props/examples/Depth.tsx +2 -2
- package/dist/mdx/style-props/examples/Position.tsx +2 -2
- package/dist/mdx/style-props/examples/Space.tsx +2 -2
- package/package.json +6 -6
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
color: 'blackPepper500',
|
|
@@ -9,5 +9,5 @@ const baseStyles = {
|
|
|
9
9
|
padding: 'xs',
|
|
10
10
|
};
|
|
11
11
|
export const Background = () => {
|
|
12
|
-
return (_jsxs(
|
|
12
|
+
return (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", ...baseStyles, children: "Cinnamon 300" }), _jsx(Box, { backgroundColor: "sourLemon300", ...baseStyles, children: "Sour Lemon 300" }), _jsx(Box, { backgroundColor: "blueberry300", ...baseStyles, children: "Blueberry 300" })] }));
|
|
13
13
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
color: 'blackPepper300',
|
|
@@ -8,4 +8,4 @@ const baseStyles = {
|
|
|
8
8
|
minWidth: '8rem',
|
|
9
9
|
padding: 'xs',
|
|
10
10
|
};
|
|
11
|
-
export const Border = () => (_jsxs(
|
|
11
|
+
export const Border = () => (_jsxs("div", { children: [_jsx(Box, { borderRadius: "m", border: "solid 4px", borderColor: "cinnamon300", ...baseStyles, children: "Cinnamon 300" }), _jsx(Box, { borderRadius: "m", border: "solid 4px", borderColor: "sourLemon300", ...baseStyles, children: "Sour Lemon 300" }), _jsx(Box, { borderRadius: "m", border: "solid 4px", borderColor: "blueberry300", ...baseStyles, children: "Blueberry 300" })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
display: 'inline-block',
|
|
@@ -7,4 +7,4 @@ const baseStyles = {
|
|
|
7
7
|
minWidth: '8rem',
|
|
8
8
|
padding: 'xs',
|
|
9
9
|
};
|
|
10
|
-
export const Color = () => (_jsxs(
|
|
10
|
+
export const Color = () => (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", color: "blackPepper500", ...baseStyles, children: "Cinnamon 300" }), _jsx(Box, { backgroundColor: "sourLemon300", color: "blackPepper500", ...baseStyles, children: "Sour Lemon 300" }), _jsx(Box, { backgroundColor: "blueberry300", color: "blackPepper500", ...baseStyles, children: "Blueberry 300" })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
color: 'blackPepper500',
|
|
@@ -8,4 +8,4 @@ const baseStyles = {
|
|
|
8
8
|
minWidth: '8rem',
|
|
9
9
|
padding: 'xs',
|
|
10
10
|
};
|
|
11
|
-
export const Depth = () => (_jsxs(
|
|
11
|
+
export const Depth = () => (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", depth: 1, ...baseStyles, children: "Depth 1" }), _jsx(Box, { backgroundColor: "sourLemon300", depth: 2, ...baseStyles, children: "Depth 2" }), _jsx(Box, { backgroundColor: "blueberry300", depth: 3, ...baseStyles, children: "Depth 3" })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
color: 'blackPepper500',
|
|
@@ -8,5 +8,5 @@ const baseStyles = {
|
|
|
8
8
|
padding: 'xs',
|
|
9
9
|
};
|
|
10
10
|
export const Position = () => {
|
|
11
|
-
return (_jsxs(
|
|
11
|
+
return (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", left: 0, position: "absolute", top: "calc(50% - 20px)", zIndex: 1, textAlign: "center", ...baseStyles, children: "Left" }), _jsx(Box, { backgroundColor: "sourLemon300", left: `calc(50% - 4rem)`, position: "absolute", top: "calc(50% - 20px)", zIndex: 2, textAlign: "center", ...baseStyles, children: "Center" }), _jsx(Box, { backgroundColor: "blueberry300", position: "absolute", right: 0, top: "calc(50% - 20px)", zIndex: 3, textAlign: "center", ...baseStyles, children: "Right" })] }));
|
|
12
12
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from '@workday/canvas-kit-react/layout';
|
|
3
3
|
const baseStyles = {
|
|
4
4
|
border: 'dotted 2px',
|
|
@@ -6,4 +6,4 @@ const baseStyles = {
|
|
|
6
6
|
display: 'inline-block',
|
|
7
7
|
verticalAlign: 'bottom',
|
|
8
8
|
};
|
|
9
|
-
export const Space = () => (_jsxs(
|
|
9
|
+
export const Space = () => (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", margin: "xxs", padding: "s", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Small" }) }), _jsx(Box, { backgroundColor: "sourLemon300", margin: "xxs", padding: "m", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Medium" }) }), _jsx(Box, { backgroundColor: "blueberry300", margin: "xxs", padding: "l", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Large" }) })] }));
|
|
@@ -35,7 +35,7 @@ export default () => {
|
|
|
35
35
|
};
|
|
36
36
|
|
|
37
37
|
return (
|
|
38
|
-
|
|
38
|
+
<div>
|
|
39
39
|
<div className={containerStyles}>
|
|
40
40
|
{quote && <Text cs={{maxWidth: '60ch'}}>{quote}</Text>}
|
|
41
41
|
<AriaLiveRegion>
|
|
@@ -46,7 +46,7 @@ export default () => {
|
|
|
46
46
|
</AriaLiveRegion>
|
|
47
47
|
</div>
|
|
48
48
|
<SecondaryButton onClick={handleClick}>Generate Quote</SecondaryButton>
|
|
49
|
-
|
|
49
|
+
</div>
|
|
50
50
|
);
|
|
51
51
|
};
|
|
52
52
|
|
|
@@ -3,7 +3,7 @@ import {Expandable} from '@workday/canvas-kit-react/expandable';
|
|
|
3
3
|
import testAvatar from './test-avatar.png';
|
|
4
4
|
|
|
5
5
|
export default () => (
|
|
6
|
-
|
|
6
|
+
<div>
|
|
7
7
|
<Expandable>
|
|
8
8
|
<Expandable.Target headingLevel="h4">
|
|
9
9
|
<Expandable.Icon iconPosition="start" />
|
|
@@ -22,5 +22,5 @@ export default () => (
|
|
|
22
22
|
|
|
23
23
|
<Expandable.Content>Content</Expandable.Content>
|
|
24
24
|
</Expandable>
|
|
25
|
-
|
|
25
|
+
</div>
|
|
26
26
|
);
|
|
@@ -11,7 +11,7 @@ const baseStyles = {
|
|
|
11
11
|
|
|
12
12
|
export default () => {
|
|
13
13
|
return (
|
|
14
|
-
|
|
14
|
+
<div>
|
|
15
15
|
<Box backgroundColor="cinnamon300" {...baseStyles}>
|
|
16
16
|
Cinnamon 300
|
|
17
17
|
</Box>
|
|
@@ -21,6 +21,6 @@ export default () => {
|
|
|
21
21
|
<Box backgroundColor="blueberry300" {...baseStyles}>
|
|
22
22
|
Blueberry 300
|
|
23
23
|
</Box>
|
|
24
|
-
|
|
24
|
+
</div>
|
|
25
25
|
);
|
|
26
26
|
};
|
|
@@ -10,7 +10,7 @@ const baseStyles = {
|
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
export default () => (
|
|
13
|
-
|
|
13
|
+
<div>
|
|
14
14
|
<Box borderRadius="m" border="solid 4px" borderColor="cinnamon300" {...baseStyles}>
|
|
15
15
|
Cinnamon 300
|
|
16
16
|
</Box>
|
|
@@ -20,5 +20,5 @@ export default () => (
|
|
|
20
20
|
<Box borderRadius="m" border="solid 4px" borderColor="blueberry300" {...baseStyles}>
|
|
21
21
|
Blueberry 300
|
|
22
22
|
</Box>
|
|
23
|
-
|
|
23
|
+
</div>
|
|
24
24
|
);
|
|
@@ -9,7 +9,7 @@ const baseStyles = {
|
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
export default () => (
|
|
12
|
-
|
|
12
|
+
<div>
|
|
13
13
|
<Box backgroundColor="cinnamon300" color="blackPepper500" {...baseStyles}>
|
|
14
14
|
Cinnamon 300
|
|
15
15
|
</Box>
|
|
@@ -19,5 +19,5 @@ export default () => (
|
|
|
19
19
|
<Box backgroundColor="blueberry300" color="blackPepper500" {...baseStyles}>
|
|
20
20
|
Blueberry 300
|
|
21
21
|
</Box>
|
|
22
|
-
|
|
22
|
+
</div>
|
|
23
23
|
);
|
|
@@ -10,7 +10,7 @@ const baseStyles = {
|
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
export default () => (
|
|
13
|
-
|
|
13
|
+
<div>
|
|
14
14
|
<Box backgroundColor="cinnamon300" depth={1} {...baseStyles}>
|
|
15
15
|
Depth 1
|
|
16
16
|
</Box>
|
|
@@ -20,5 +20,5 @@ export default () => (
|
|
|
20
20
|
<Box backgroundColor="blueberry300" depth={3} {...baseStyles}>
|
|
21
21
|
Depth 3
|
|
22
22
|
</Box>
|
|
23
|
-
|
|
23
|
+
</div>
|
|
24
24
|
);
|
|
@@ -8,7 +8,7 @@ const baseStyles = {
|
|
|
8
8
|
};
|
|
9
9
|
|
|
10
10
|
export default () => (
|
|
11
|
-
|
|
11
|
+
<div>
|
|
12
12
|
<Box backgroundColor="cinnamon300" margin="xxs" padding="s" textAlign="center" {...baseStyles}>
|
|
13
13
|
<Box border="dotted 2px" borderColor="blackPepper500">
|
|
14
14
|
Small
|
|
@@ -24,5 +24,5 @@ export default () => (
|
|
|
24
24
|
Large
|
|
25
25
|
</Box>
|
|
26
26
|
</Box>
|
|
27
|
-
|
|
27
|
+
</div>
|
|
28
28
|
);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@workday/canvas-kit-docs",
|
|
3
|
-
"version": "13.0.0-alpha.
|
|
3
|
+
"version": "13.0.0-alpha.1104-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",
|
|
@@ -45,10 +45,10 @@
|
|
|
45
45
|
"@emotion/styled": "^11.6.0",
|
|
46
46
|
"@stackblitz/sdk": "^1.11.0",
|
|
47
47
|
"@storybook/csf": "0.0.1",
|
|
48
|
-
"@workday/canvas-kit-labs-react": "^13.0.0-alpha.
|
|
49
|
-
"@workday/canvas-kit-preview-react": "^13.0.0-alpha.
|
|
50
|
-
"@workday/canvas-kit-react": "^13.0.0-alpha.
|
|
51
|
-
"@workday/canvas-kit-styling": "^13.0.0-alpha.
|
|
48
|
+
"@workday/canvas-kit-labs-react": "^13.0.0-alpha.1104-next.0",
|
|
49
|
+
"@workday/canvas-kit-preview-react": "^13.0.0-alpha.1104-next.0",
|
|
50
|
+
"@workday/canvas-kit-react": "^13.0.0-alpha.1104-next.0",
|
|
51
|
+
"@workday/canvas-kit-styling": "^13.0.0-alpha.1104-next.0",
|
|
52
52
|
"@workday/canvas-system-icons-web": "^3.0.0",
|
|
53
53
|
"@workday/canvas-tokens-web": "^2.1.1",
|
|
54
54
|
"markdown-to-jsx": "^7.2.0",
|
|
@@ -61,5 +61,5 @@
|
|
|
61
61
|
"mkdirp": "^1.0.3",
|
|
62
62
|
"typescript": "5.0"
|
|
63
63
|
},
|
|
64
|
-
"gitHead": "
|
|
64
|
+
"gitHead": "82666a867a722cf5cc918d5cbc218300e7cacfb4"
|
|
65
65
|
}
|