@workday/canvas-kit-preview-react 7.1.5 → 7.2.0-427-next.2

package/dist/commonjs/side-panel/lib/hooks.d.ts

@@ -1,3 +1,8 @@
+import * as React from 'react';
+export declare const SidePanelContext: React.Context<{
+    state: string;
+    origin: string;
+}>;
 /**
  * The optional config options for the `useSidePanel` hook
  */
@@ -70,6 +75,21 @@ export interface ControlProps {
      */
     onClick: () => void;
 }
+/**
+ *
+ * This hook manages the state and `aria-` attributes for the SidePanel. It takes an optional
+ * configuration object:
+ *
+ * ```tsx
+ * import {useSidePanel} from '@workday/canvas-kit-preview-react/side-panel';
+ *
+ * const {expanded, setExpanded, panelProps, labelProps, controlProps} = useSidePanel({
+ *   initialExpanded: false,
+ *   panelId: 'custom-panel-id',
+ *   labelId: 'custom-label-id',
+ * });
+ * ```
+ */
 export declare const useSidePanel: (config?: UseSidePanelProps | undefined) => {
     expanded: boolean;
     setExpanded: (newExpandedState: boolean) => void;

package/dist/commonjs/side-panel/lib/hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/hooks.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;OAGG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,UAAU;IACzB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,eAAe,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY;;oCA2BsB,OAAO;;;;CA8BrD,CAAC"}
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/hooks.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAGH;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;OAGG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,UAAU;IACzB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,eAAe,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY;;oCA2BsB,OAAO;;;;CA8BrD,CAAC"}

package/dist/commonjs/side-panel/lib/hooks.js

@@ -19,56 +19,75 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSidePanel = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var useSidePanel = function (config) {
-    var _a = React.useState(false), touched = _a[0], setTouched = _a[1];
-    var configParams = config
+exports.useSidePanel = exports.SidePanelContext = void 0;
+const React = __importStar(require("react"));
+exports.SidePanelContext = React.createContext({
+    state: 'expanded',
+    origin: 'left',
+});
+const common_1 = require("@workday/canvas-kit-react/common");
+/**
+ *
+ * This hook manages the state and `aria-` attributes for the SidePanel. It takes an optional
+ * configuration object:
+ *
+ * ```tsx
+ * import {useSidePanel} from '@workday/canvas-kit-preview-react/side-panel';
+ *
+ * const {expanded, setExpanded, panelProps, labelProps, controlProps} = useSidePanel({
+ *   initialExpanded: false,
+ *   panelId: 'custom-panel-id',
+ *   labelId: 'custom-label-id',
+ * });
+ * ```
+ */
+const useSidePanel = (config) => {
+    const [touched, setTouched] = React.useState(false);
+    const configParams = config
         ? config
         : {
             initialExpanded: true,
             panelId: undefined,
             labelId: undefined,
         };
-    var _b = configParams.initialExpanded, initialExpanded = _b === void 0 ? true : _b, panelIdParam = configParams.panelId, labelIdParam = configParams.labelId;
-    var _c = React.useState(initialExpanded), expanded = _c[0], setExpanded = _c[1];
-    var panelId = common_1.useUniqueId(panelIdParam);
-    var labelId = common_1.useUniqueId(labelIdParam);
+    const { initialExpanded = true, panelId: panelIdParam, labelId: labelIdParam } = configParams;
+    const [expanded, setExpanded] = React.useState(initialExpanded);
+    const panelId = common_1.useUniqueId(panelIdParam);
+    const labelId = common_1.useUniqueId(labelIdParam);
     // This prevents keyframes animations from rendering prematurely
-    var handleSetTouched = function () {
+    const handleSetTouched = () => {
         if (touched === false) {
             setTouched(true);
         }
     };
-    var handleClick = function () {
+    const handleClick = () => {
         handleSetExpanded(!expanded);
     };
-    var handleSetExpanded = function (newExpandedState) {
+    const handleSetExpanded = (newExpandedState) => {
         handleSetTouched();
         setExpanded(newExpandedState);
     };
-    var panelProps = {
+    const panelProps = {
         expanded: expanded,
         id: panelId,
         'aria-labelledby': labelId,
-        touched: touched,
+        touched,
     };
-    var labelProps = {
+    const labelProps = {
         id: labelId,
     };
-    var controlProps = {
+    const controlProps = {
         'aria-controls': panelId,
         'aria-expanded': expanded,
         'aria-labelledby': labelId,
         onClick: handleClick,
     };
     return {
-        expanded: expanded,
+        expanded,
         setExpanded: handleSetExpanded,
-        panelProps: panelProps,
-        labelProps: labelProps,
-        controlProps: controlProps,
+        panelProps,
+        labelProps,
+        controlProps,
     };
 };
 exports.useSidePanel = useSidePanel;

package/dist/commonjs/status-indicator/index.d.ts

@@ -0,0 +1,4 @@
+export * from './lib/StatusIndicator';
+export * from './lib/hooks/useStatusIndicatorModel';
+export { useStatusIndicatorIcon } from './lib/StatusIndicatorIcon';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/status-indicator/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../status-indicator/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,qCAAqC,CAAC;AACpD,OAAO,EAAC,sBAAsB,EAAC,MAAM,2BAA2B,CAAC"}

package/dist/commonjs/status-indicator/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStatusIndicatorIcon = void 0;
+__exportStar(require("./lib/StatusIndicator"), exports);
+__exportStar(require("./lib/hooks/useStatusIndicatorModel"), exports);
+var StatusIndicatorIcon_1 = require("./lib/StatusIndicatorIcon");
+Object.defineProperty(exports, "useStatusIndicatorIcon", { enumerable: true, get: function () { return StatusIndicatorIcon_1.useStatusIndicatorIcon; } });

package/dist/commonjs/status-indicator/lib/StatusIndicator.d.ts

@@ -0,0 +1,66 @@
+import React from 'react';
+import { ExtractProps } from '@workday/canvas-kit-react/common';
+import { Flex } from '@workday/canvas-kit-react/layout';
+export interface StatusIndicatorProps extends ExtractProps<typeof Flex, never> {
+    /**
+     * Children of the `StatusIndicator`. Can contain a `StatusIndicator.Label` and optionally a `StatusIndicator.Icon`.
+     */
+    children: React.ReactNode;
+}
+export declare const useStatusIndicator: import("@workday/canvas-kit-react/common").BehaviorHook<{
+    state: {
+        emphasis: import("./hooks").StatusIndicatorEmphasis;
+        variant: import("./hooks").StatusIndicatorVariant;
+    };
+    events: {};
+}, {
+    opacity: string | undefined;
+    color: string;
+    background: string;
+}>;
+/**
+ * `StatusIndicator` is a container component which renders an {@link Flex} under the hood to
+ * apply spacing evenly between its children. It has a default maximum width of `200px`.
+ *
+ * ```tsx
+ * <StatusIndicator emphasis="low" variant="blue">
+ *   {Child components}
+ * </StatusIndicator>
+ * ```
+ */
+export declare const StatusIndicator: import("@workday/canvas-kit-react/common").ElementComponentM<"div", StatusIndicatorProps & Partial<{
+    emphasis: import("./hooks").StatusIndicatorEmphasis;
+    variant: import("./hooks").StatusIndicatorVariant;
+}> & {} & {}, {
+    state: {
+        emphasis: import("./hooks").StatusIndicatorEmphasis;
+        variant: import("./hooks").StatusIndicatorVariant;
+    };
+    events: {};
+}> & {
+    /**
+     * `StatusIndicator.Label` renders {@link Text} under the hood. It will apply an ellipsis if its
+     * contents exceed the component's maximum width.
+     *
+     * ```tsx
+     * <StatusIndicator.Label>{The text to be rendered}</StatusIndicator.Label>
+     * ```
+     */
+    Label: import("@workday/canvas-kit-react/common").ElementComponent<"span", import("./StatusIndicatorLabel").StatusIndicatorLabelProps>;
+    /**
+     * `StatusIndicator.Icon` renders {@link SystemIcon} under the hood. It's used as a decorative
+     * element to visually support the {@link StatusIndicatorLabel StatusIndicator.Label} text.
+     *
+     * ```tsx
+     * <StatusIndicator.Icon icon={uploadCloudIcon} />
+     * ```
+     */
+    Icon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", import("./StatusIndicatorIcon").StatusIndicatorIconProps, {
+        state: {
+            emphasis: import("./hooks").StatusIndicatorEmphasis;
+            variant: import("./hooks").StatusIndicatorVariant;
+        };
+        events: {};
+    }>;
+};
+//# sourceMappingURL=StatusIndicator.d.ts.map

package/dist/commonjs/status-indicator/lib/StatusIndicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicator.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,YAAY,EAAuC,MAAM,kCAAkC,CAAC;AACpG,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAKtD,MAAM,WAAW,oBAAqB,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IAC5E;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;EAO7B,CAAC;AAEH;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;IAKxB;;;;;;;OAOG;;IAEH;;;;;;;OAOG;;;;;;;;CAmBL,CAAC"}

package/dist/commonjs/status-indicator/lib/StatusIndicator.js

@@ -0,0 +1,57 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusIndicator = exports.useStatusIndicator = void 0;
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const StatusIndicatorIcon_1 = require("./StatusIndicatorIcon");
+const StatusIndicatorLabel_1 = require("./StatusIndicatorLabel");
+const hooks_1 = require("./hooks");
+exports.useStatusIndicator = common_1.createElemPropsHook(hooks_1.useStatusIndicatorModel)(({ state }) => {
+    const colors = StatusIndicatorIcon_1.statusIndicatorColors[state.variant][state.emphasis];
+    return {
+        opacity: state.variant === 'transparent' ? '0.85' : undefined,
+        color: colors.text,
+        background: colors.background,
+    };
+});
+/**
+ * `StatusIndicator` is a container component which renders an {@link Flex} under the hood to
+ * apply spacing evenly between its children. It has a default maximum width of `200px`.
+ *
+ * ```tsx
+ * <StatusIndicator emphasis="low" variant="blue">
+ *   {Child components}
+ * </StatusIndicator>
+ * ```
+ */
+exports.StatusIndicator = common_1.createContainer('div')({
+    displayName: 'StatusIndicator',
+    modelHook: hooks_1.useStatusIndicatorModel,
+    elemPropsHook: exports.useStatusIndicator,
+    subComponents: {
+        /**
+         * `StatusIndicator.Label` renders {@link Text} under the hood. It will apply an ellipsis if its
+         * contents exceed the component's maximum width.
+         *
+         * ```tsx
+         * <StatusIndicator.Label>{The text to be rendered}</StatusIndicator.Label>
+         * ```
+         */
+        Label: StatusIndicatorLabel_1.StatusIndicatorLabel,
+        /**
+         * `StatusIndicator.Icon` renders {@link SystemIcon} under the hood. It's used as a decorative
+         * element to visually support the {@link StatusIndicatorLabel StatusIndicator.Label} text.
+         *
+         * ```tsx
+         * <StatusIndicator.Icon icon={uploadCloudIcon} />
+         * ```
+         */
+        Icon: StatusIndicatorIcon_1.StatusIndicatorIcon,
+    },
+})(({ children, ...elemProps }, Element, model) => {
+    return (react_1.default.createElement(layout_1.Flex, Object.assign({ gap: "xxxs", as: Element, maxWidth: 200, paddingX: "xxxs", display: "inline-flex", alignItems: "center", height: 20, borderRadius: "s" }, elemProps), children));
+});

package/dist/commonjs/status-indicator/lib/StatusIndicatorIcon.d.ts

@@ -0,0 +1,83 @@
+import { SystemIconProps } from '@workday/canvas-kit-react/icon';
+export interface StatusIndicatorIconProps extends SystemIconProps {
+}
+export declare const statusIndicatorColors: {
+    gray: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+    orange: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+    blue: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+    green: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+    red: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+    transparent: {
+        high: {
+            text: string;
+            background: string;
+        };
+        low: {
+            text: string;
+            background: string;
+        };
+    };
+};
+export declare const useStatusIndicatorIcon: import("@workday/canvas-kit-react/common").BehaviorHook<{
+    state: {
+        emphasis: import("./hooks").StatusIndicatorEmphasis;
+        variant: import("./hooks").StatusIndicatorVariant;
+    };
+    events: {};
+}, {
+    color: string;
+    colorHover: string;
+}>;
+export declare const StatusIndicatorIcon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", StatusIndicatorIconProps, {
+    state: {
+        emphasis: import("./hooks").StatusIndicatorEmphasis;
+        variant: import("./hooks").StatusIndicatorVariant;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=StatusIndicatorIcon.d.ts.map

package/dist/commonjs/status-indicator/lib/StatusIndicatorIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicatorIcon.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorIcon.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAG3E,MAAM,WAAW,wBAAyB,SAAQ,eAAe;CAAG;AAIpE,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DjC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;;;;;EAMjC,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;;;EAK9B,CAAC"}

package/dist/commonjs/status-indicator/lib/StatusIndicatorIcon.js

@@ -0,0 +1,86 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusIndicatorIcon = exports.useStatusIndicatorIcon = exports.statusIndicatorColors = void 0;
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+const hooks_1 = require("./hooks");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+exports.statusIndicatorColors = {
+    gray: {
+        high: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.licorice300,
+        },
+        low: {
+            text: tokens_1.colors.licorice400,
+            background: tokens_1.colors.soap300,
+        },
+    },
+    orange: {
+        high: {
+            text: tokens_1.colors.licorice500,
+            background: tokens_1.colors.cantaloupe400,
+        },
+        low: {
+            text: tokens_1.colors.toastedMarshmallow600,
+            background: tokens_1.colors.cantaloupe100,
+        },
+    },
+    blue: {
+        high: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.blueberry400,
+        },
+        low: {
+            text: tokens_1.colors.blueberry500,
+            background: tokens_1.colors.blueberry100,
+        },
+    },
+    green: {
+        high: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.greenApple600,
+        },
+        low: {
+            text: tokens_1.colors.greenApple600,
+            background: tokens_1.colors.greenApple100,
+        },
+    },
+    red: {
+        high: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.cinnamon500,
+        },
+        low: {
+            text: tokens_1.colors.cinnamon600,
+            background: tokens_1.colors.cinnamon100,
+        },
+    },
+    transparent: {
+        high: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.blackPepper600,
+        },
+        low: {
+            text: tokens_1.colors.frenchVanilla100,
+            background: tokens_1.colors.blackPepper600,
+        },
+    },
+};
+exports.useStatusIndicatorIcon = common_1.createElemPropsHook(hooks_1.useStatusIndicatorModel)(({ state }) => {
+    const colors = exports.statusIndicatorColors[state.variant][state.emphasis];
+    return {
+        color: colors.text,
+        colorHover: colors.background,
+    };
+});
+exports.StatusIndicatorIcon = common_1.createSubcomponent('span')({
+    modelHook: hooks_1.useStatusIndicatorModel,
+    elemPropsHook: exports.useStatusIndicatorIcon,
+})((elemProps, Element, model) => {
+    return react_1.default.createElement(icon_1.SystemIcon, Object.assign({ as: Element, size: 20, role: "img" }, elemProps));
+});

package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.d.ts

@@ -0,0 +1,5 @@
+import { TextProps } from '@workday/canvas-kit-react/text';
+export interface StatusIndicatorLabelProps extends TextProps {
+}
+export declare const StatusIndicatorLabel: import("@workday/canvas-kit-react/common").ElementComponent<"span", StatusIndicatorLabelProps>;
+//# sourceMappingURL=StatusIndicatorLabel.d.ts.map

package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicatorLabel.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAO,SAAS,EAAC,MAAM,gCAAgC,CAAC;AAE/D,MAAM,WAAW,yBAA0B,SAAQ,SAAS;CAAG;AAE/D,eAAO,MAAM,oBAAoB,gGAoB/B,CAAC"}

package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusIndicatorLabel = void 0;
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const text_1 = require("@workday/canvas-kit-react/text");
+exports.StatusIndicatorLabel = common_1.createComponent('span')({
+    displayName: 'StatusIndicator.Label',
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (react_1.default.createElement(text_1.Text, Object.assign({ whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", typeLevel: "subtext.large", fontWeight: "bold", textTransform: "capitalize", ref: ref, color: "inherit", as: Element }, elemProps), children));
+    },
+});

package/dist/commonjs/status-indicator/lib/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useStatusIndicatorModel';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/status-indicator/lib/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../status-indicator/lib/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC"}

package/dist/commonjs/{breadcrumbs → status-indicator/lib/hooks}/index.js

@@ -10,8 +10,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Breadcrumbs = void 0;
-var Breadcrumbs_1 = require("./lib/Breadcrumbs");
-Object.defineProperty(exports, "Breadcrumbs", { enumerable: true, get: function () { return Breadcrumbs_1.Breadcrumbs; } });
-exports.default = Breadcrumbs_1.Breadcrumbs;
-__exportStar(require("./lib/Breadcrumbs"), exports);
+__exportStar(require("./useStatusIndicatorModel"), exports);

package/dist/commonjs/status-indicator/lib/hooks/useStatusIndicatorModel.d.ts

@@ -0,0 +1,75 @@
+export declare type StatusIndicatorVariant = 'gray' | 'orange' | 'blue' | 'green' | 'red' | 'transparent';
+export declare type StatusIndicatorEmphasis = 'high' | 'low';
+export declare const useStatusIndicatorModel: (<TT_Special_Generic>(config?: (Partial<{
+    /**
+     * Defines the emphasis of the `StatusIndicator`.
+     * `high` emphasis will create more contrast between the background and text colors.
+     * `low` emphasis will create less contrast between the background and text colors.
+     * @default 'low'
+     */
+    emphasis: StatusIndicatorEmphasis;
+    /**
+     * Defines the color of the `StatusIndicator`.
+     * @default 'gray'
+     */
+    variant: StatusIndicatorVariant;
+}> & {} & {}) | undefined) => {
+    state: {
+        /**
+         * Defines the emphasis of the `StatusIndicator`.
+         * `high` emphasis will create more contrast between the background and text colors.
+         * `low` emphasis will create less contrast between the background and text colors.
+         * @default 'low'
+         */
+        emphasis: StatusIndicatorEmphasis;
+        /**
+         * Defines the color of the `StatusIndicator`.
+         * @default 'gray'
+         */
+        variant: StatusIndicatorVariant;
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    /**
+     * Defines the emphasis of the `StatusIndicator`.
+     * `high` emphasis will create more contrast between the background and text colors.
+     * `low` emphasis will create less contrast between the background and text colors.
+     * @default 'low'
+     */
+    emphasis: StatusIndicatorEmphasis;
+    /**
+     * Defines the color of the `StatusIndicator`.
+     * @default 'gray'
+     */
+    variant: StatusIndicatorVariant;
+}, {}, {
+    /**
+     * Defines the emphasis of the `StatusIndicator`.
+     * `high` emphasis will create more contrast between the background and text colors.
+     * `low` emphasis will create less contrast between the background and text colors.
+     * @default 'low'
+     */
+    emphasis: StatusIndicatorEmphasis;
+    /**
+     * Defines the color of the `StatusIndicator`.
+     * @default 'gray'
+     */
+    variant: StatusIndicatorVariant;
+}, {}, {
+    state: {
+        /**
+         * Defines the emphasis of the `StatusIndicator`.
+         * `high` emphasis will create more contrast between the background and text colors.
+         * `low` emphasis will create less contrast between the background and text colors.
+         * @default 'low'
+         */
+        emphasis: StatusIndicatorEmphasis;
+        /**
+         * Defines the color of the `StatusIndicator`.
+         * @default 'gray'
+         */
+        variant: StatusIndicatorVariant;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=useStatusIndicatorModel.d.ts.map

package/dist/commonjs/status-indicator/lib/hooks/useStatusIndicatorModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStatusIndicatorModel.d.ts","sourceRoot":"","sources":["../../../../../status-indicator/lib/hooks/useStatusIndicatorModel.tsx"],"names":[],"mappings":"AAEA,oBAAY,sBAAsB,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,aAAa,CAAC;AAElG,oBAAY,uBAAuB,GAAG,MAAM,GAAG,KAAK,CAAC;AAErD,eAAO,MAAM,uBAAuB;IAEhC;;;;;OAKG;;IAGH;;;OAGG;;;;QAXH;;;;;WAKG;;QAGH;;;WAGG;;;;;IAXH;;;;;OAKG;;IAGH;;;OAGG;;;IAXH;;;;;OAKG;;IAGH;;;OAGG;;;;QAXH;;;;;WAKG;;QAGH;;;WAGG;;;;EASL,CAAC"}

package/dist/commonjs/status-indicator/lib/hooks/useStatusIndicatorModel.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStatusIndicatorModel = void 0;
+const common_1 = require("@workday/canvas-kit-react/common");
+exports.useStatusIndicatorModel = common_1.createModelHook({
+    defaultConfig: {
+        /**
+         * Defines the emphasis of the `StatusIndicator`.
+         * `high` emphasis will create more contrast between the background and text colors.
+         * `low` emphasis will create less contrast between the background and text colors.
+         * @default 'low'
+         */
+        emphasis: 'low',
+        /**
+         * Defines the color of the `StatusIndicator`.
+         * @default 'gray'
+         */
+        variant: 'gray',
+    },
+})(config => {
+    const state = {
+        ...config,
+    };
+    return { state, events: {} };
+});

package/dist/commonjs/table/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lib/Table';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../table/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/commonjs/{text-area/lib/hooks → table}/index.js

@@ -10,4 +10,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./useTextAreaModel"), exports);
+__exportStar(require("./lib/Table"), exports);