@workday/canvas-kit-docs 14.0.0-alpha.1165-next.0 → 14.0.0-alpha.1168-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/index.d.ts +1 -1
- package/dist/es6/index.d.ts.map +1 -1
- package/dist/es6/index.js +1 -1
- package/dist/es6/lib/StorybookStatusIndicator.d.ts +4 -0
- package/dist/es6/lib/StorybookStatusIndicator.d.ts.map +1 -0
- package/dist/es6/lib/StorybookStatusIndicator.js +39 -0
- package/dist/es6/lib/docs.js +607 -5
- package/dist/es6/lib/stackblitzFiles/packageJSONFile.js +5 -5
- package/dist/es6/lib/stackblitzFiles/packageJSONFile.ts +5 -5
- package/dist/mdx/preview-react/select/Select.mdx +20 -2
- package/dist/mdx/preview-react/text-area/TextArea.mdx +18 -9
- package/dist/mdx/preview-react/text-input/TextInput.mdx +19 -10
- package/dist/mdx/react/status-indicator/StatusIndicator.mdx +13 -12
- package/dist/mdx/react/text/LabelText.mdx +14 -11
- package/dist/mdx/react/tokens/Tokens.mdx +4 -3
- package/dist/mdx/styling/mdx/Overview.mdx +202 -55
- package/dist/mdx/tokens/TokenMigrationOverview.mdx +3 -4
- package/index.ts +1 -1
- package/lib/StorybookStatusIndicator.tsx +49 -0
- package/package.json +6 -6
- package/dist/es6/lib/AIIndicator.d.ts +0 -2
- package/dist/es6/lib/AIIndicator.d.ts.map +0 -1
- package/dist/es6/lib/AIIndicator.js +0 -12
- package/lib/AIIndicator.tsx +0 -22
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import {StatusIndicator} from '@workday/canvas-kit-preview-react/status-indicator';
|
|
2
|
+
import {system} from '@workday/canvas-tokens-web';
|
|
3
|
+
import {sparkleSingleSmallIcon} from '@workday/canvas-system-icons-web';
|
|
4
|
+
import {createStencil} from '@workday/canvas-kit-styling';
|
|
5
|
+
import {systemIconStencil} from '@workday/canvas-kit-react/icon';
|
|
6
|
+
|
|
7
|
+
const storybookStatusIndicatorStencil = createStencil({
|
|
8
|
+
base: {
|
|
9
|
+
borderRadius: system.shape.round,
|
|
10
|
+
padding: `${system.space.zero} ${system.space.x2}`,
|
|
11
|
+
[systemIconStencil.vars.color]: 'currentColor',
|
|
12
|
+
},
|
|
13
|
+
modifiers: {
|
|
14
|
+
type: {
|
|
15
|
+
ai: {
|
|
16
|
+
background: system.color.bg.ai.default,
|
|
17
|
+
color: system.color.fg.ai,
|
|
18
|
+
},
|
|
19
|
+
deprecated: {
|
|
20
|
+
background: system.color.static.amber.soft,
|
|
21
|
+
color: system.color.static.amber.stronger,
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
},
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
const content = {
|
|
28
|
+
ai: {
|
|
29
|
+
icon: sparkleSingleSmallIcon,
|
|
30
|
+
label: 'AI Content',
|
|
31
|
+
},
|
|
32
|
+
deprecated: {
|
|
33
|
+
icon: undefined,
|
|
34
|
+
label: 'Deprecated',
|
|
35
|
+
},
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
export const StorybookStatusIndicator = ({type}: {type: 'ai' | 'deprecated'}) => {
|
|
39
|
+
const {icon, label} = content[type];
|
|
40
|
+
return (
|
|
41
|
+
<StatusIndicator
|
|
42
|
+
className="sb-unstyled cnvs-title-status-indicator"
|
|
43
|
+
cs={storybookStatusIndicatorStencil({type})}
|
|
44
|
+
>
|
|
45
|
+
{icon && <StatusIndicator.Icon icon={icon} />}
|
|
46
|
+
<StatusIndicator.Label>{label}</StatusIndicator.Label>
|
|
47
|
+
</StatusIndicator>
|
|
48
|
+
);
|
|
49
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@workday/canvas-kit-docs",
|
|
3
|
-
"version": "14.0.0-alpha.
|
|
3
|
+
"version": "14.0.0-alpha.1168-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": "^14.0.0-alpha.
|
|
49
|
-
"@workday/canvas-kit-preview-react": "^14.0.0-alpha.
|
|
50
|
-
"@workday/canvas-kit-react": "^14.0.0-alpha.
|
|
51
|
-
"@workday/canvas-kit-styling": "^14.0.0-alpha.
|
|
48
|
+
"@workday/canvas-kit-labs-react": "^14.0.0-alpha.1168-next.0",
|
|
49
|
+
"@workday/canvas-kit-preview-react": "^14.0.0-alpha.1168-next.0",
|
|
50
|
+
"@workday/canvas-kit-react": "^14.0.0-alpha.1168-next.0",
|
|
51
|
+
"@workday/canvas-kit-styling": "^14.0.0-alpha.1168-next.0",
|
|
52
52
|
"@workday/canvas-system-icons-web": "^3.0.35",
|
|
53
53
|
"@workday/canvas-tokens-web": "3.0.0-alpha.5",
|
|
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": "c7f43dc689c7377f48786bc8d99b0bace1431c86"
|
|
65
65
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AIIndicator.d.ts","sourceRoot":"","sources":["../../../lib/AIIndicator.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,WAAW,+CAgBvB,CAAC"}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { StatusIndicator } from '@workday/canvas-kit-preview-react/status-indicator';
|
|
3
|
-
import { system } from '@workday/canvas-tokens-web';
|
|
4
|
-
import { sparkleSingleSmallIcon } from '@workday/canvas-system-icons-web';
|
|
5
|
-
import { systemIconStencil } from '@workday/canvas-kit-react/icon';
|
|
6
|
-
export const AIIndicator = () => {
|
|
7
|
-
return (_jsx(_Fragment, { children: _jsxs(StatusIndicator, { className: "sb-unstyled indicator", cs: {
|
|
8
|
-
background: system.color.bg.ai.default,
|
|
9
|
-
color: system.color.fg.ai,
|
|
10
|
-
[systemIconStencil.vars.color]: system.color.fg.ai,
|
|
11
|
-
}, children: [_jsx(StatusIndicator.Icon, { icon: sparkleSingleSmallIcon }), _jsx(StatusIndicator.Label, { children: "AI Content" })] }) }));
|
|
12
|
-
};
|
package/lib/AIIndicator.tsx
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import {StatusIndicator} from '@workday/canvas-kit-preview-react/status-indicator';
|
|
2
|
-
import {system} from '@workday/canvas-tokens-web';
|
|
3
|
-
import {sparkleSingleSmallIcon} from '@workday/canvas-system-icons-web';
|
|
4
|
-
import {systemIconStencil} from '@workday/canvas-kit-react/icon';
|
|
5
|
-
|
|
6
|
-
export const AIIndicator = () => {
|
|
7
|
-
return (
|
|
8
|
-
<>
|
|
9
|
-
<StatusIndicator
|
|
10
|
-
className="sb-unstyled indicator"
|
|
11
|
-
cs={{
|
|
12
|
-
background: system.color.bg.ai.default,
|
|
13
|
-
color: system.color.fg.ai,
|
|
14
|
-
[systemIconStencil.vars.color]: system.color.fg.ai,
|
|
15
|
-
}}
|
|
16
|
-
>
|
|
17
|
-
<StatusIndicator.Icon icon={sparkleSingleSmallIcon} />
|
|
18
|
-
<StatusIndicator.Label>AI Content</StatusIndicator.Label>
|
|
19
|
-
</StatusIndicator>
|
|
20
|
-
</>
|
|
21
|
-
);
|
|
22
|
-
};
|