@workday/canvas-kit-docs 13.0.0-alpha.1084-next.0 → 13.0.0-alpha.1087-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/lib/docs.js +24 -6
- package/dist/es6/lib/stackblitzFiles/packageJSONFile.js +5 -5
- package/dist/es6/lib/stackblitzFiles/packageJSONFile.ts +5 -5
- package/dist/mdx/preview-react/information-highlight/examples/Critical.tsx +4 -10
- package/dist/mdx/preview-react/information-highlight/examples/Informational.tsx +33 -4
- package/package.json +6 -6
package/dist/es6/lib/docs.js
CHANGED
|
@@ -5396,8 +5396,8 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
|
|
|
5396
5396
|
},
|
|
5397
5397
|
"defaultValue": {
|
|
5398
5398
|
"kind": "external",
|
|
5399
|
-
"name": "
|
|
5400
|
-
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/
|
|
5399
|
+
"name": "div",
|
|
5400
|
+
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
|
|
5401
5401
|
}
|
|
5402
5402
|
},
|
|
5403
5403
|
{
|
|
@@ -5417,8 +5417,8 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
|
|
|
5417
5417
|
"required": true,
|
|
5418
5418
|
"defaultValue": {
|
|
5419
5419
|
"kind": "external",
|
|
5420
|
-
"name": "
|
|
5421
|
-
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/
|
|
5420
|
+
"name": "div",
|
|
5421
|
+
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
|
|
5422
5422
|
}
|
|
5423
5423
|
}
|
|
5424
5424
|
]
|
|
@@ -5427,8 +5427,8 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
|
|
|
5427
5427
|
],
|
|
5428
5428
|
"baseElement": {
|
|
5429
5429
|
"kind": "external",
|
|
5430
|
-
"name": "
|
|
5431
|
-
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/
|
|
5430
|
+
"name": "div",
|
|
5431
|
+
"url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
|
|
5432
5432
|
},
|
|
5433
5433
|
"styleComponent": {
|
|
5434
5434
|
"kind": "symbol",
|
|
@@ -183535,6 +183535,24 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
|
|
|
183535
183535
|
"value": "SystemIconCircleSize.l"
|
|
183536
183536
|
}
|
|
183537
183537
|
},
|
|
183538
|
+
{
|
|
183539
|
+
"kind": "property",
|
|
183540
|
+
"name": "cs",
|
|
183541
|
+
"required": false,
|
|
183542
|
+
"type": {
|
|
183543
|
+
"kind": "symbol",
|
|
183544
|
+
"name": "CSToPropsInput",
|
|
183545
|
+
"value": "CSToPropsInput"
|
|
183546
|
+
},
|
|
183547
|
+
"description": "The `cs` prop takes in a single value or an array of values. You can pass the CSS class name\nreturned by {@link createStyles}, or the result of {@link createVars} and\n{@link createModifiers}. If you're extending a component already using `cs`, you can merge that\nprop in as well. Any style that is passed to the `cs` prop will override style props. If you\nwish to have styles that are overridden by the `css` prop, or styles added via the `styled`\nAPI, use {@link handleCsProp} wherever `elemProps` is used. If your component needs to also\nhandle style props, use {@link mergeStyles } instead.\n\n\n```tsx\nimport {handleCsProp} from '@workday/canvas-kit-styling';\nimport {mergeStyles} from '@workday/canvas-kit-react/layout';\n\n// ...\n\n// `handleCsProp` handles compat mode with Emotion's runtime APIs. `mergeStyles` has the same\n// function signature, but adds support for style props.\n\nreturn (\n <Element\n {...handleCsProp(elemProps, [\n myStyles,\n myModifiers({ size: 'medium' }),\n myVars({ backgroundColor: 'red' })\n ])}\n >\n {children}\n </Element>\n)\n```",
|
|
183548
|
+
"declarations": [
|
|
183549
|
+
{
|
|
183550
|
+
"name": "cs",
|
|
183551
|
+
"filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
|
|
183552
|
+
}
|
|
183553
|
+
],
|
|
183554
|
+
"tags": {}
|
|
183555
|
+
},
|
|
183538
183556
|
{
|
|
183539
183557
|
"kind": "property",
|
|
183540
183558
|
"name": "shouldMirror",
|
|
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
|
|
|
18
18
|
"@emotion/react": "11.11.4",
|
|
19
19
|
"@types/react": "18.2.60",
|
|
20
20
|
"@types/react-dom": "18.2.19",
|
|
21
|
-
"@workday/canvas-kit-labs-react": "12.5.
|
|
22
|
-
"@workday/canvas-kit-preview-react": "12.5.
|
|
23
|
-
"@workday/canvas-kit-react": "12.5.
|
|
24
|
-
"@workday/canvas-kit-react-fonts": "^12.5.
|
|
25
|
-
"@workday/canvas-kit-styling": "12.5.
|
|
21
|
+
"@workday/canvas-kit-labs-react": "12.5.8",
|
|
22
|
+
"@workday/canvas-kit-preview-react": "12.5.8",
|
|
23
|
+
"@workday/canvas-kit-react": "12.5.8",
|
|
24
|
+
"@workday/canvas-kit-react-fonts": "^12.5.8",
|
|
25
|
+
"@workday/canvas-kit-styling": "12.5.8",
|
|
26
26
|
"@workday/canvas-system-icons-web": "3.0.22",
|
|
27
27
|
"@workday/canvas-tokens-web": "2.0.0"
|
|
28
28
|
},
|
|
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
|
|
|
18
18
|
"@emotion/react": "11.11.4",
|
|
19
19
|
"@types/react": "18.2.60",
|
|
20
20
|
"@types/react-dom": "18.2.19",
|
|
21
|
-
"@workday/canvas-kit-labs-react": "12.5.
|
|
22
|
-
"@workday/canvas-kit-preview-react": "12.5.
|
|
23
|
-
"@workday/canvas-kit-react": "12.5.
|
|
24
|
-
"@workday/canvas-kit-react-fonts": "^12.5.
|
|
25
|
-
"@workday/canvas-kit-styling": "12.5.
|
|
21
|
+
"@workday/canvas-kit-labs-react": "12.5.8",
|
|
22
|
+
"@workday/canvas-kit-preview-react": "12.5.8",
|
|
23
|
+
"@workday/canvas-kit-react": "12.5.8",
|
|
24
|
+
"@workday/canvas-kit-react-fonts": "^12.5.8",
|
|
25
|
+
"@workday/canvas-kit-styling": "12.5.8",
|
|
26
26
|
"@workday/canvas-system-icons-web": "3.0.22",
|
|
27
27
|
"@workday/canvas-tokens-web": "2.0.0"
|
|
28
28
|
},
|
|
@@ -7,23 +7,17 @@ export default () => {
|
|
|
7
7
|
<Flex flexDirection={'column'} gap={system.space.x2}>
|
|
8
8
|
<InformationHighlight variant={'critical'}>
|
|
9
9
|
<InformationHighlight.Icon />
|
|
10
|
-
<InformationHighlight.Heading>
|
|
11
|
-
{' '}
|
|
12
|
-
Attention! Highlight Something{' '}
|
|
13
|
-
</InformationHighlight.Heading>
|
|
10
|
+
<InformationHighlight.Heading>Attention! Highlight Something</InformationHighlight.Heading>
|
|
14
11
|
<InformationHighlight.Body>
|
|
15
|
-
If you select the link below it will
|
|
12
|
+
If you select the link below it will reroute you back to this page.
|
|
16
13
|
</InformationHighlight.Body>
|
|
17
14
|
<InformationHighlight.Link href="#hyperlink">View the Docs</InformationHighlight.Link>
|
|
18
15
|
</InformationHighlight>
|
|
19
16
|
<InformationHighlight variant={'critical'} emphasis={'high'}>
|
|
20
17
|
<InformationHighlight.Icon />
|
|
21
|
-
<InformationHighlight.Heading>
|
|
22
|
-
{' '}
|
|
23
|
-
Attention! Highlight Something{' '}
|
|
24
|
-
</InformationHighlight.Heading>
|
|
18
|
+
<InformationHighlight.Heading>Attention! Highlight Something</InformationHighlight.Heading>
|
|
25
19
|
<InformationHighlight.Body>
|
|
26
|
-
If you select the link below it will
|
|
20
|
+
If you select the link below it will reroute you back to this page.
|
|
27
21
|
</InformationHighlight.Body>
|
|
28
22
|
<InformationHighlight.Link href="#hyperlink">View the Docs</InformationHighlight.Link>
|
|
29
23
|
</InformationHighlight>
|
|
@@ -1,6 +1,19 @@
|
|
|
1
1
|
import {Flex} from '@workday/canvas-kit-react/layout';
|
|
2
2
|
import {InformationHighlight} from '@workday/canvas-kit-preview-react/information-highlight';
|
|
3
3
|
import {system} from '@workday/canvas-tokens-web';
|
|
4
|
+
import {createStyles} from '@workday/canvas-kit-styling';
|
|
5
|
+
|
|
6
|
+
const contentTextStyles = createStyles({
|
|
7
|
+
margin: 0,
|
|
8
|
+
});
|
|
9
|
+
|
|
10
|
+
const contentListStyles = createStyles({
|
|
11
|
+
listStyle: 'inside',
|
|
12
|
+
marginInlineStart: 0,
|
|
13
|
+
marginBlockStart: system.space.x2,
|
|
14
|
+
marginBlockEnd: 0,
|
|
15
|
+
padding: 0,
|
|
16
|
+
});
|
|
4
17
|
|
|
5
18
|
export default () => {
|
|
6
19
|
return (
|
|
@@ -9,17 +22,33 @@ export default () => {
|
|
|
9
22
|
<InformationHighlight.Icon />
|
|
10
23
|
<InformationHighlight.Heading> Informational Highlight </InformationHighlight.Heading>
|
|
11
24
|
<InformationHighlight.Body>
|
|
12
|
-
|
|
25
|
+
<p className={contentTextStyles}>
|
|
26
|
+
This is a low-emphasis, informational callout. You should use this for nice-to-have
|
|
27
|
+
information, such as:
|
|
28
|
+
</p>
|
|
29
|
+
<ul className={contentListStyles}>
|
|
30
|
+
<li>tangential information or context</li>
|
|
31
|
+
<li>related features</li>
|
|
32
|
+
<li>additional opportunities</li>
|
|
33
|
+
</ul>
|
|
13
34
|
</InformationHighlight.Body>
|
|
14
|
-
<InformationHighlight.Link href="#hyperlink">
|
|
35
|
+
<InformationHighlight.Link href="#hyperlink">Learn More</InformationHighlight.Link>
|
|
15
36
|
</InformationHighlight>
|
|
16
37
|
<InformationHighlight variant={'informational'} emphasis={'high'}>
|
|
17
38
|
<InformationHighlight.Icon />
|
|
18
39
|
<InformationHighlight.Heading> Informational Highlight </InformationHighlight.Heading>
|
|
19
40
|
<InformationHighlight.Body>
|
|
20
|
-
|
|
41
|
+
<p className={contentTextStyles}>
|
|
42
|
+
This is a high-emphasis, informational callout. You should use this for nice-to-have
|
|
43
|
+
information, such as:
|
|
44
|
+
</p>
|
|
45
|
+
<ul className={contentListStyles}>
|
|
46
|
+
<li>tangential information or context</li>
|
|
47
|
+
<li>related features</li>
|
|
48
|
+
<li>additional opportunities</li>
|
|
49
|
+
</ul>
|
|
21
50
|
</InformationHighlight.Body>
|
|
22
|
-
<InformationHighlight.Link href="#hyperlink">
|
|
51
|
+
<InformationHighlight.Link href="#hyperlink">Learn More</InformationHighlight.Link>
|
|
23
52
|
</InformationHighlight>
|
|
24
53
|
</Flex>
|
|
25
54
|
);
|
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.1087-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.1087-next.0",
|
|
49
|
+
"@workday/canvas-kit-preview-react": "^13.0.0-alpha.1087-next.0",
|
|
50
|
+
"@workday/canvas-kit-react": "^13.0.0-alpha.1087-next.0",
|
|
51
|
+
"@workday/canvas-kit-styling": "^13.0.0-alpha.1087-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": "570489246ddb897b7200e7ead723673091f1060c"
|
|
65
65
|
}
|