@workday/canvas-kit-docs
Version:
Documentation components of Canvas Kit components
42 lines (41 loc) • 1.47 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { StatusIndicator, } from '@workday/canvas-kit-preview-react/status-indicator';
import { systemIconStencil } from '@workday/canvas-kit-react/icon';
import { createStencil } from '@workday/canvas-kit-styling';
import { sparkleIcon } from '@workday/canvas-system-icons-web';
import { system } from '@workday/canvas-tokens-web';
const storybookStatusIndicatorStencil = createStencil({
base: {
borderRadius: system.shape.full,
padding: `0 ${system.padding.xs}`,
[systemIconStencil.vars.color]: 'currentColor',
},
});
const content = {
ai: {
icon: sparkleIcon,
label: 'AI Content',
},
deprecated: {
icon: undefined,
label: 'Deprecated',
},
new: {
icon: undefined,
label: 'New',
},
promoted: {
icon: undefined,
label: 'Promoted',
},
};
export const StorybookStatusIndicator = ({ type, }) => {
const { icon, label } = content[type];
const variantMapping = {
ai: 'info',
deprecated: 'caution',
new: 'positive',
promoted: 'info',
};
return (_jsxs(StatusIndicator, { className: "sb-unstyled cnvs-title-status-indicator", cs: storybookStatusIndicatorStencil({ type }), variant: variantMapping[type], emphasis: "low", children: [icon && _jsx(StatusIndicator.Icon, { icon: icon }), _jsx(StatusIndicator.Label, { children: label })] }));
};