@workday/canvas-kit-preview-react 6.9.0-next.0 → 6.9.0-next.4

package/dist/es6/pill/lib/PillIcon.js

@@ -0,0 +1,34 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
+import { SystemIcon } from '@workday/canvas-kit-react/icon';
+import { usePillModel } from './usePillModel';
+import { plusIcon } from '@workday/canvas-system-icons-web';
+import { space } from '@workday/canvas-kit-react/tokens';
+export var PillIcon = createSubcomponent('span')({
+    modelHook: usePillModel,
+})(function (_a, Element) {
+    var size = _a.size, icon = _a.icon, elemProps = __rest(_a, ["size", "icon"]);
+    return (React.createElement(SystemIcon, __assign({ marginInlineStart: "-" + space.xxxs, display: "flex", as: Element, size: 20, role: "img", "aria-label": "add", icon: icon || plusIcon }, elemProps)));
+});

package/dist/es6/pill/lib/PillIconButton.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { SystemIconProps } from '@workday/canvas-kit-react/icon';
+import { CanvasSystemIcon } from '@workday/design-assets-types';
+export interface PillIconButtonProps extends Omit<SystemIconProps, 'icon'> {
+    /**
+     * The system icon rendered by the button
+     * @default `xSmallIcon`
+     */
+    icon?: CanvasSystemIcon;
+    /**
+     * The aria label for the removable icon
+     * @default 'remove'
+     */
+    'aria-label'?: string;
+}
+export declare const PillIconButton: import("@workday/canvas-kit-react/common").ElementComponentM<"button", PillIconButtonProps, {
+    state: {
+        id: string;
+        maxWidth: React.ReactText;
+        disabled: boolean;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=PillIconButton.d.ts.map

package/dist/es6/pill/lib/PillIconButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PillIconButton.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAG3E,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC;IACxE;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AA6CD,eAAO,MAAM,cAAc;;;;;;;EAgC1B,CAAC"}

package/dist/es6/pill/lib/PillIconButton.js

@@ -0,0 +1,75 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { focusRing, styled, createSubcomponent } from '@workday/canvas-kit-react/common';
+import { SystemIcon } from '@workday/canvas-kit-react/icon';
+import { usePillModel } from './usePillModel';
+import { xSmallIcon } from '@workday/canvas-system-icons-web';
+import { colors, space } from '@workday/canvas-kit-react/tokens';
+import { BaseButton } from '@workday/canvas-kit-react/button';
+var getIconColors = function () {
+    return {
+        default: {
+            icon: colors.licorice200,
+        },
+        hover: {
+            icon: colors.licorice500,
+        },
+        active: {
+            icon: colors.licorice500,
+        },
+        focus: {
+            icon: colors.licorice500,
+            focusRing: focusRing({
+                innerColor: 'transparent',
+            }),
+        },
+        disabled: {
+            icon: colors.licorice100,
+            opacity: '1',
+        },
+    };
+};
+var StyledIconButton = styled(BaseButton)({
+    marginInlineEnd: '-7px',
+    marginInlineStart: "-2px",
+    overflow: 'visible',
+    '::after': {
+        content: '""',
+        height: space.l,
+        width: space.l,
+        position: 'absolute',
+        left: '-7px',
+        bottom: '-7px',
+        margin: 0,
+        pointerEvents: 'all',
+        cursor: 'pointer',
+    },
+});
+export var PillIconButton = createSubcomponent('button')({
+    modelHook: usePillModel,
+})(function (_a, Element, model) {
+    var size = _a.size, _b = _a.icon, icon = _b === void 0 ? xSmallIcon : _b, maxWidth = _a.maxWidth, children = _a.children, _c = _a["aria-label"], ariaLabel = _c === void 0 ? 'remove' : _c, elemProps = __rest(_a, ["size", "icon", "maxWidth", "children", 'aria-label']);
+    return (React.createElement(StyledIconButton, __assign({ borderRadius: "s", height: 20, width: 20, padding: "zero", disabled: model.state.disabled, colors: getIconColors(), "aria-labelledby": "removable-" + model.state.id + " label-" + model.state.id, as: Element, position: "relative" }, elemProps),
+        React.createElement(SystemIcon, { "aria-label": ariaLabel, id: "removable-" + model.state.id, icon: icon, size: space.m, "aria-hidden": true, role: "img" })));
+});

package/dist/es6/pill/lib/PillLabel.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { BoxProps } from '@workday/canvas-kit-react/layout';
+import { OverflowTooltipProps } from '@workday/canvas-kit-react/tooltip';
+export interface PillLabelProps extends BoxProps {
+    tooltipProps?: Omit<OverflowTooltipProps, 'children'>;
+}
+export declare const PillLabel: import("@workday/canvas-kit-react/common").ElementComponentM<"span", PillLabelProps, {
+    state: {
+        id: string;
+        maxWidth: React.ReactText;
+        disabled: boolean;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=PillLabel.d.ts.map

package/dist/es6/pill/lib/PillLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PillLabel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAkB,oBAAoB,EAAC,MAAM,mCAAmC,CAAC;AAKxF,MAAM,WAAW,cAAe,SAAQ,QAAQ;IAC9C,YAAY,CAAC,EAAE,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC;CACvD;AAQD,eAAO,MAAM,SAAS;;;;;;;EAgBpB,CAAC"}

package/dist/es6/pill/lib/PillLabel.js

@@ -0,0 +1,41 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { createSubcomponent, styled } from '@workday/canvas-kit-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
+import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
+import { usePillModel } from './usePillModel';
+import { colors } from '@workday/canvas-kit-react/tokens';
+var StyledLabelContainer = styled(Box.as('span'))({
+    whiteSpace: 'nowrap',
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+    display: 'block',
+});
+export var PillLabel = createSubcomponent('span')({
+    modelHook: usePillModel,
+})(function (_a, Element, model) {
+    var tooltipProps = _a.tooltipProps, elemProps = __rest(_a, ["tooltipProps"]);
+    return (React.createElement(OverflowTooltip, __assign({}, tooltipProps),
+        React.createElement(StyledLabelContainer, __assign({ color: model.state.disabled ? colors.licorice100 : 'inherit', maxWidth: model.state.maxWidth, as: Element, id: "label-" + model.state.id }, elemProps), elemProps.children)));
+});

package/dist/es6/pill/lib/usePillModel.d.ts

@@ -0,0 +1,71 @@
+export declare const usePillModel: (<TT_Special_Generic>(config?: (Partial<{
+    /**
+     * Determines the max width of the pill. If the pill text is longer than the max width,
+     * text will be truncated and a tooltip will show the rest of the content when hovered over
+     */
+    maxWidth: import("react").ReactText;
+    /**
+     * Use to disable a pill.
+     */
+    disabled: boolean;
+    /**
+     * ID used to add accessibility labels to pill elements.
+     * @default `useUniqueId()`
+     */
+    id: string;
+}> & {} & {}) | undefined) => {
+    state: {
+        id: string;
+        /**
+         * Determines the max width of the pill. If the pill text is longer than the max width,
+         * text will be truncated and a tooltip will show the rest of the content when hovered over
+         */
+        maxWidth: import("react").ReactText;
+        /**
+         * Use to disable a pill.
+         */
+        disabled: boolean;
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    /**
+     * Determines the max width of the pill. If the pill text is longer than the max width,
+     * text will be truncated and a tooltip will show the rest of the content when hovered over
+     */
+    maxWidth: import("react").ReactText;
+    /**
+     * Use to disable a pill.
+     */
+    disabled: boolean;
+    /**
+     * ID used to add accessibility labels to pill elements.
+     * @default `useUniqueId()`
+     */
+    id: string;
+}, {}, {
+    id: string;
+    /**
+     * Determines the max width of the pill. If the pill text is longer than the max width,
+     * text will be truncated and a tooltip will show the rest of the content when hovered over
+     */
+    maxWidth: import("react").ReactText;
+    /**
+     * Use to disable a pill.
+     */
+    disabled: boolean;
+}, {}, {
+    state: {
+        id: string;
+        /**
+         * Determines the max width of the pill. If the pill text is longer than the max width,
+         * text will be truncated and a tooltip will show the rest of the content when hovered over
+         */
+        maxWidth: import("react").ReactText;
+        /**
+         * Use to disable a pill.
+         */
+        disabled: boolean;
+    };
+    events: {};
+}>;
+//# sourceMappingURL=usePillModel.d.ts.map

package/dist/es6/pill/lib/usePillModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePillModel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/usePillModel.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;IAErB;;;OAGG;;IAEH;;OAEG;;IAEH;;;OAGG;;;;;QAZH;;;WAGG;;QAEH;;WAEG;;;;;IAPH;;;OAGG;;IAEH;;OAEG;;IAEH;;;OAGG;;;;IAZH;;;OAGG;;IAEH;;OAEG;;;;;QAPH;;;WAGG;;QAEH;;WAEG;;;;EAgBL,CAAC"}

package/dist/es6/pill/lib/usePillModel.js

@@ -0,0 +1,34 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { createModelHook, useUniqueId } from '@workday/canvas-kit-react/common';
+export var usePillModel = createModelHook({
+    defaultConfig: {
+        /**
+         * Determines the max width of the pill. If the pill text is longer than the max width,
+         * text will be truncated and a tooltip will show the rest of the content when hovered over
+         */
+        maxWidth: 200,
+        /**
+         * Use to disable a pill.
+         */
+        disabled: false,
+        /**
+         * ID used to add accessibility labels to pill elements.
+         * @default `useUniqueId()`
+         */
+        id: '',
+    },
+})(function (config) {
+    var id = useUniqueId(config.id);
+    var state = __assign(__assign({}, config), { id: id });
+    return { state: state, events: {} };
+});

package/dist/es6/select/index.d.ts

@@ -2,5 +2,5 @@ import Select from './lib/Select';
 export default Select;
 export { Select };
 export * from './lib/Select';
-export { Option, RenderableOption, RenderOptionFunction } from './lib/SelectBase';
+export { Option, RenderableOption, RenderOptionFunction, RenderSelectedFunction, } from './lib/SelectBase';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../select/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,cAAc,CAAC;AAElC,eAAe,MAAM,CAAC;AACtB,OAAO,EAAC,MAAM,EAAC,CAAC;AAChB,cAAc,cAAc,CAAC;AAE7B,OAAO,EAAC,MAAM,EAAE,gBAAgB,EAAE,oBAAoB,EAAC,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../select/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,cAAc,CAAC;AAElC,eAAe,MAAM,CAAC;AACtB,OAAO,EAAC,MAAM,EAAC,CAAC;AAChB,cAAc,cAAc,CAAC;AAE7B,OAAO,EACL,MAAM,EACN,gBAAgB,EAChB,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,kBAAkB,CAAC"}

package/dist/es6/select/lib/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAmB,EAAC,mBAAmB,EAAE,MAAM,EAAmB,MAAM,cAAc,CAAC;AAIvF,MAAM,WAAW,WAAY,SAAQ,mBAAmB;IACtD;;;;;;;;;;;;;;OAcG;IACH,OAAO,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;CAC9B;AAmiBD,eAAO,MAAM,MAAM;;CAUjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAmB,EAAC,mBAAmB,EAAE,MAAM,EAAmB,MAAM,cAAc,CAAC;AAIvF,MAAM,WAAW,WAAY,SAAQ,mBAAmB;IACtD;;;;;;;;;;;;;;OAcG;IACH,OAAO,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;CAC9B;AAoiBD,eAAO,MAAM,MAAM;;CAUjB,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/dist/es6/select/lib/Select.js

@@ -2,7 +2,7 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
@@ -439,6 +439,7 @@ var SelectContainer = /** @class */ (function (_super) {
         // (2) Either update the current value of buttonRef if it was a ref object,
         //     or call buttonRef with the underlying button element if it was a
         //     callback ref.
+        // eslint-disable-next-line react-hooks/rules-of-hooks
         _this.forwardedButtonRef = useForkRef(props.buttonRef, _this.localButtonRef);
         return _this;
     }

package/dist/es6/select/lib/SelectBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectBase.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectBase.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"SelectBase.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectBase.tsx"],"names":[],"mappings":"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"}

package/dist/es6/select/lib/SelectMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAgC,SAAS,EAAS,MAAM,kCAAkC,CAAC;AAYlG,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,OAAO,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,SAAS,CAAC;AAEtD,UAAU,eACR,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAwKzC,QAAA,MAAM,UAAU,0JAsEf,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAgC,SAAS,EAAS,MAAM,kCAAkC,CAAC;AAYlG,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,OAAO,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,SAAS,CAAC;AAEtD,UAAU,eACR,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAwKzC,QAAA,MAAM,UAAU,2HAWb,eAAe,gBA2DjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/es6/select/lib/SelectOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectOption.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,SAAS,EACT,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAG1C,MAAM,WAAW,iBAAkB,SAAQ,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACzF;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IACrC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAqED,QAAA,MAAM,YAAY,wGAoBjB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SelectOption.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,SAAS,EACT,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAG1C,MAAM,WAAW,iBAAkB,SAAQ,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACzF;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IACrC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAqED,QAAA,MAAM,YAAY,uEAOf,iBAAiB,gBAanB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/es6/select/lib/scrolling.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scrolling.d.ts","sourceRoot":"","sources":["../../../../select/lib/scrolling.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,sBAAsB,uDAqClC,CAAC"}
+{"version":3,"file":"scrolling.d.ts","sourceRoot":"","sources":["../../../../select/lib/scrolling.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,sBAAsB,SAAU,WAAW,+BAA0B,IAqCjF,CAAC"}

package/dist/es6/select/lib/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es6/select/lib/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../select/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAE9C,eAAO,MAAM,eAAe,oEAY3B,CAAC;AAGF,eAAO,MAAM,wBAAwB,oEAOpC,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../select/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAE9C,eAAO,MAAM,eAAe,YAAa,gBAAgB,EAAE,SAAS,MAAM,GAAG,SAAS,KAAG,MAYxF,CAAC;AAGF,eAAO,MAAM,wBAAwB,YAC1B,gBAAgB,EAAE,SACpB,MAAM,GAAG,SAAS,KACxB,MAIF,CAAC"}

package/dist/es6/side-panel/lib/SidePanel.d.ts

@@ -1,6 +1,8 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import * as React from 'react';
-import { IconButtonProps } from '@workday/canvas-kit-react/button';
+import { jsx } from '@emotion/react';
+import { TertiaryButtonProps } from '@workday/canvas-kit-react/button';
 export declare type SidePanelVariant = 'standard' | 'alternate';
 export declare type SidePanelTransitionStates = 'collapsed' | 'collapsing' | 'expanded' | 'expanding';
 export interface SidePanelProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -48,7 +50,7 @@ export interface SidePanelProps extends React.HTMLAttributes<HTMLDivElement> {
      */
     onStateTransition?: (state?: SidePanelTransitionStates) => void;
     /**
-     * The style variant of the side panel. 'standard' is with a `soap100` background, no depth. 'alternate' is a `frenchVanilla100` background with a level 3 depth.
+     * The style variant of the side panel. 'standard' is with a `soap100` background, no depth. 'alternate' is a `frenchVanilla100` background with a level 6 depth.
      *
      * @default 'standard'
      */
@@ -65,9 +67,20 @@ export declare const SidePanelContext: React.Context<{
     origin: string;
 }>;
 declare const SidePanel: {
-    ({ as, children, collapsedWidth, expanded, expandedWidth, onAnimationEnd, onAnimationStart, onExpandedChange, onStateTransition, origin, variant, touched, ...elemProps }: SidePanelProps): JSX.Element;
-    ToggleButton: ({ variant, icon, ...rest }: Pick<IconButtonProps, "size" | "icon" | "children" | "value" | "theme" | "shouldMirrorIcon" | "variant" | "onToggleChange" | "toggled"> & React.ButtonHTMLAttributes<HTMLButtonElement>) => JSX.Element;
+    ({ as, children, collapsedWidth, expanded, expandedWidth, onAnimationEnd, onAnimationStart, onExpandedChange, onStateTransition, origin, variant, touched, ...elemProps }: SidePanelProps): jsx.JSX.Element;
+    ToggleButton: ({ variant, icon, tooltipTextExpand: expandLabel, tooltipTextCollapse: collapseLabel, ...rest }: ToggleButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement>) => jsx.JSX.Element;
+};
+export declare type ToggleButtonProps = TertiaryButtonProps & {
+    /**
+     * The tooltip text to expand the side panel
+     * @default 'Expand'
+     */
+    tooltipTextExpand?: string;
+    /**
+     * The tooltip text to collapse the side panel
+     * @default 'Collapse'
+     */
+    tooltipTextCollapse?: string;
 };
-export declare type ToggleButtonProps = Omit<IconButtonProps, 'aria-label'>;
 export default SidePanel;
 //# sourceMappingURL=SidePanel.d.ts.map

package/dist/es6/side-panel/lib/SidePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,eAAe;AACf,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAa,eAAe,EAAC,MAAM,kCAAkC,CAAC;AAI7E,oBAAY,gBAAgB,GAAG,UAAU,GAAG,WAAW,CAAC;AACxD,oBAAY,yBAAyB,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9F,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;;OAIG;IACH,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAsCD,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAEH,QAAA,MAAM,SAAS;;;CAgGd,CAAC;AAEF,oBAAY,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;AA0CpE,eAAe,SAAS,CAAC"}
+{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,0BAA0B;AAC1B,eAAe;AACf,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAM,GAAG,EAAuB,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAiB,mBAAmB,EAAC,MAAM,kCAAkC,CAAC;AAKrF,oBAAY,gBAAgB,GAAG,UAAU,GAAG,WAAW,CAAC;AACxD,oBAAY,yBAAyB,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9F,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;;OAIG;IACH,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAsCD,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAEH,QAAA,MAAM,SAAS;+KAcZ,cAAc;mHA0Gd,iBAAiB,GAAG,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;CAxBnE,CAAC;AAEF,oBAAY,iBAAiB,GAAG,mBAAmB,GAAG;IACpD;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAgDF,eAAe,SAAS,CAAC"}

package/dist/es6/side-panel/lib/SidePanel.js

@@ -24,13 +24,15 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import * as React from 'react';
 import { styled, useIsRTL } from '@workday/canvas-kit-react/common';
-import { css, jsx, keyframes } from '@emotion/core';
-import { IconButton } from '@workday/canvas-kit-react/button';
+import { css, jsx, keyframes } from '@emotion/react';
+import { TertiaryButton } from '@workday/canvas-kit-react/button';
 import { space, colors, depth } from '@workday/canvas-kit-react/tokens';
 import { transformationImportIcon } from '@workday/canvas-system-icons-web';
+import { Tooltip } from '@workday/canvas-kit-react/tooltip';
 var createKeyframes = function (from, to) {
     var normalized = {
         from: typeof from === 'number' ? from + 'px' : from,
@@ -39,7 +41,7 @@ var createKeyframes = function (from, to) {
     return keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    from {\n      width: ", ";\n      min-width: ", ";\n      max-width: ", ";\n    } to {\n      width: ", ";\n      min-width: ", ";\n      max-width: ", ";\n    }\n  "], ["\n    from {\n      width: ", ";\n      min-width: ", ";\n      max-width: ", ";\n    } to {\n      width: ", ";\n      min-width: ", ";\n      max-width: ", ";\n    }\n  "])), normalized.from, normalized.from, normalized.from, normalized.to, normalized.to, normalized.to);
 };
 var containerVariantStyle = {
-    alternate: __assign({ backgroundColor: colors.frenchVanilla100 }, depth[3]),
+    alternate: __assign({ backgroundColor: colors.frenchVanilla100 }, depth[5]),
     standard: {
         backgroundColor: colors.soap100,
     },
@@ -116,7 +118,7 @@ var SidePanel = function (_a) {
  * A toggle button styled specifically for the side panel container.
  */
 var ToggleButton = function (_a) {
-    var _b = _a.variant, variant = _b === void 0 ? 'plain' : _b, _c = _a.icon, icon = _c === void 0 ? transformationImportIcon : _c, rest = __rest(_a, ["variant", "icon"]);
+    var _b = _a.variant, variant = _b === void 0 ? undefined : _b, _c = _a.icon, icon = _c === void 0 ? transformationImportIcon : _c, _d = _a.tooltipTextExpand, expandLabel = _d === void 0 ? 'Expand' : _d, _e = _a.tooltipTextCollapse, collapseLabel = _e === void 0 ? 'Collapse' : _e, rest = __rest(_a, ["variant", "icon", "tooltipTextExpand", "tooltipTextCollapse"]);
     var context = React.useContext(SidePanelContext);
     var useRTLOrigin = function () {
         var isRTL = useIsRTL();
@@ -132,6 +134,7 @@ var ToggleButton = function (_a) {
     var buttonStyle = css({
         position: 'absolute',
         top: space.m,
+        width: space.l,
         right: context.state === 'collapsed' ? 0 : rtlOrigin === 'left' ? space.s : undefined,
         left: context.state === 'collapsed' ? 0 : rtlOrigin === 'right' ? space.s : undefined,
         margin: context.state === 'collapsed' ? 'auto' : 0,
@@ -139,8 +142,8 @@ var ToggleButton = function (_a) {
             ? "scaleX(" + (rtlOrigin === 'left' ? '1' : '-1') + ")"
             : "scaleX(" + (rtlOrigin === 'left' ? '-1' : '1') + ")",
     });
-    // @ts-ignore aria-label type error here. The user will decide to use aria-label or aria-labelledby
-    return jsx(IconButton, __assign({ type: "button", css: buttonStyle, icon: icon, variant: variant }, rest));
+    return (jsx(Tooltip, { title: context.state === 'collapsed' ? expandLabel : collapseLabel, type: "muted" },
+        jsx(TertiaryButton, __assign({ type: "button", css: buttonStyle, icon: icon, variant: variant }, rest))));
 };
 SidePanel.ToggleButton = ToggleButton;
 export default SidePanel;

package/dist/es6/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;;;;;;CAyDxB,CAAC"}
+{"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"}

package/dist/es6/text-area/lib/TextArea.d.ts

@@ -1,22 +1,63 @@
 import React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { FormField } from '@workday/canvas-kit-preview-react/form-field';
-import { TextAreaModel } from './hooks';
-export declare const TextAreaModelContext: React.Context<import("@workday/canvas-kit-react/common").Model<{
-    hasError?: boolean | undefined;
-    id?: string | undefined;
-    isRequired?: boolean | undefined;
-}, {}>>;
 export interface TextAreaProps extends ExtractProps<typeof FormField, never> {
-    model?: TextAreaModel;
     /**
      * Children of the Text Input. Should contain a `<TextArea.Field>`, a `<TextArea.Label>` and an optional `<TextArea.Hint>`
      */
     children: React.ReactNode;
 }
-export declare const TextArea: import("@workday/canvas-kit-react/common").Component<TextAreaProps> & {
-    Field: import("@workday/canvas-kit-react/common").ElementComponent<"textarea", import("./TextAreaField").TextAreaFieldProps>;
-    Label: import("@workday/canvas-kit-react/common").ElementComponent<"label", import("../../form-field/lib/FormFieldLabel").FormFieldLabelProps>;
-    Hint: import("@workday/canvas-kit-react/common").ElementComponent<"p", import("../../form-field/lib/FormFieldHint").FormFieldHintProps>;
+export declare const TextArea: import("@workday/canvas-kit-react/common").ElementComponentM<"div", TextAreaProps & Partial<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}> & {} & {}, {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}> & {
+    Context: React.Context<{
+        state: {
+            id: string;
+            hasError: boolean;
+            isRequired: boolean;
+        };
+        events: {};
+    }>;
+} & {
+    Field: import("@workday/canvas-kit-react/common").ElementComponentM<"textarea", import("@workday/canvas-kit-react/layout").BorderShorthandStyleProps & import("@workday/canvas-kit-react/layout").BorderColorStyleProps & import("@workday/canvas-kit-react/layout").BorderRadiusStyleProps & import("@workday/canvas-kit-react/layout").BorderLineStyleProps & import("@workday/canvas-kit-react/layout").BorderWidthStyleProps & import("@workday/canvas-kit-react/layout").BorderLogicalStyleProps & import("@workday/canvas-kit-react/layout").ColorStyleProps & import("@workday/canvas-kit-react/layout").DepthStyleProps & import("@workday/canvas-kit-react/layout").FlexItemStyleProps & import("@workday/canvas-kit-react/layout").LayoutStyleProps & import("@workday/canvas-kit-react/layout/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-react/layout").PositionStandardProps & import("@workday/canvas-kit-react/layout").PositionLogicalProps & import("@workday/canvas-kit-react/layout/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-react/layout/lib/utils/space").SpaceLogicalProps & import("@workday/canvas-kit-react/common").PropsWithModel<{
+        state: {
+            id: string;
+            hasError: boolean;
+            isRequired: boolean;
+        };
+        events: {};
+    }>, {
+        state: {
+            id: string;
+            hasError: boolean;
+            isRequired: boolean;
+        };
+        events: {};
+    }>;
+    Label: import("@workday/canvas-kit-react/common").ElementComponentM<"label", import("../../form-field/lib/FormFieldLabel").FormFieldLabelProps, {
+        state: {
+            id: string;
+            hasError: boolean;
+            isRequired: boolean;
+        };
+        events: {};
+    }>;
+    Hint: import("@workday/canvas-kit-react/common").ElementComponentM<"p", import("@workday/canvas-kit-react/layout").BorderShorthandStyleProps & import("@workday/canvas-kit-react/layout").BorderColorStyleProps & import("@workday/canvas-kit-react/layout").BorderRadiusStyleProps & import("@workday/canvas-kit-react/layout").BorderLineStyleProps & import("@workday/canvas-kit-react/layout").BorderWidthStyleProps & import("@workday/canvas-kit-react/layout").BorderLogicalStyleProps & import("@workday/canvas-kit-react/layout").ColorStyleProps & import("@workday/canvas-kit-react/layout").DepthStyleProps & import("@workday/canvas-kit-react/layout").FlexItemStyleProps & import("@workday/canvas-kit-react/layout").LayoutStyleProps & import("@workday/canvas-kit-react/layout/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-react/layout").PositionStandardProps & import("@workday/canvas-kit-react/layout").PositionLogicalProps & import("@workday/canvas-kit-react/layout/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-react/layout/lib/utils/space").SpaceLogicalProps, {
+        state: {
+            id: string;
+            hasError: boolean;
+            isRequired: boolean;
+        };
+        events: {};
+    }>;
 };
 //# sourceMappingURL=TextArea.d.ts.map

package/dist/es6/text-area/lib/TextArea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAChG,OAAO,EACL,SAAS,EAGV,MAAM,8CAA8C,CAAC;AAGtD,OAAO,EAAC,aAAa,EAAmB,MAAM,SAAS,CAAC;AAKxD,eAAO,MAAM,oBAAoB;;;;OAAwB,CAAC;AAE1D,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC;IAC1E,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;CAqBnB,CAAC"}
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAC,SAAS,EAA0B,MAAM,8CAA8C,CAAC;AAMhG,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC;IAC1E;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}

package/dist/es6/text-area/lib/TextArea.js

@@ -21,27 +21,21 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React from 'react';
-import { createComponent, useDefaultModel } from '@workday/canvas-kit-react/common';
-import { FormFieldModelContext, useFormFieldOrientation, } from '@workday/canvas-kit-preview-react/form-field';
-import { Stack } from '@workday/canvas-kit-labs-react/layout';
+import { createContainer } from '@workday/canvas-kit-react/common';
+import { FormField, useFormFieldOrientation } from '@workday/canvas-kit-preview-react/form-field';
+import { Stack } from '@workday/canvas-kit-react/layout';
 import { useTextAreaModel } from './hooks';
 import { TextAreaField } from './TextAreaField';
-import { TextAreaLabel } from './TextAreaLabel';
-import { TextAreaHint } from './TextAreaHint';
-export var TextAreaModelContext = FormFieldModelContext;
-export var TextArea = createComponent()({
+export var TextArea = createContainer('div')({
     displayName: 'TextArea',
-    Component: function (_a, ref) {
-        var children = _a.children, model = _a.model, orientation = _a.orientation, props = __rest(_a, ["children", "model", "orientation"]);
-        var hasError = props.hasError, id = props.id, isRequired = props.isRequired, elemProps = __rest(props, ["hasError", "id", "isRequired"]);
-        var value = useDefaultModel(model, { hasError: hasError, id: id, isRequired: isRequired }, useTextAreaModel);
-        var layoutProps = useFormFieldOrientation(orientation);
-        return (React.createElement(TextAreaModelContext.Provider, { value: value },
-            React.createElement(Stack, __assign({ ref: ref }, layoutProps, elemProps), children)));
-    },
+    modelHook: useTextAreaModel,
     subComponents: {
         Field: TextAreaField,
-        Label: TextAreaLabel,
-        Hint: TextAreaHint,
+        Label: FormField.Label,
+        Hint: FormField.Hint,
     },
+})(function (_a, Element) {
+    var children = _a.children, orientation = _a.orientation, elemProps = __rest(_a, ["children", "orientation"]);
+    var layoutProps = useFormFieldOrientation(orientation);
+    return (React.createElement(Stack, __assign({ as: Element }, layoutProps, elemProps), children));
 });