@workday/canvas-kit-preview-react 6.8.9 → 6.9.0-next.2

package/dist/commonjs/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/commonjs/select/lib/SelectMenu.js

@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 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)
@@ -21,14 +40,8 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.menuAnimationDuration = void 0;
 var react_1 = __importStar(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");
 var popup_1 = require("@workday/canvas-kit-react/popup");

package/dist/commonjs/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/commonjs/select/lib/SelectOption.js

@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 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)
@@ -21,13 +40,6 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");

package/dist/commonjs/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/commonjs/select/lib/scrolling.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.scrollIntoViewIfNeeded = void 0;
 // Modified from https://gist.github.com/hsablonniere/2581101
-exports.scrollIntoViewIfNeeded = function (elem, centerIfNeeded) {
+var scrollIntoViewIfNeeded = function (elem, centerIfNeeded) {
     if (centerIfNeeded === void 0) { centerIfNeeded = true; }
     var parent = elem.parentElement;
     if (elem && parent) {
@@ -30,3 +31,4 @@ exports.scrollIntoViewIfNeeded = function (elem, centerIfNeeded) {
         }
     }
 };
+exports.scrollIntoViewIfNeeded = scrollIntoViewIfNeeded;

package/dist/commonjs/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/commonjs/select/lib/utils.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getIndexByValue = function (options, value) {
+exports.getCorrectedIndexByValue = exports.getIndexByValue = void 0;
+var getIndexByValue = function (options, value) {
     if (!options || value === undefined) {
         return -1;
     }
@@ -11,8 +12,10 @@ exports.getIndexByValue = function (options, value) {
     }
     return -1;
 };
+exports.getIndexByValue = getIndexByValue;
 // If the value doesn't exist in the options, return index 0
-exports.getCorrectedIndexByValue = function (options, value) {
+var getCorrectedIndexByValue = function (options, value) {
     var indexByValue = exports.getIndexByValue(options, value);
     return indexByValue === -1 ? 0 : indexByValue;
 };
+exports.getCorrectedIndexByValue = getCorrectedIndexByValue;

package/dist/commonjs/side-panel/index.js

@@ -1,13 +1,21 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+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);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.SidePanel = void 0;
 var SidePanel_1 = __importDefault(require("./lib/SidePanel"));
 exports.SidePanel = SidePanel_1.default;
 exports.default = SidePanel_1.default;
-__export(require("./lib/hooks"));
-__export(require("./lib/SidePanel"));
+__exportStar(require("./lib/hooks"), exports);
+__exportStar(require("./lib/SidePanel"), exports);

package/dist/commonjs/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, "value" | "children" | "theme" | "size" | "icon" | "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/commonjs/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/commonjs/side-panel/lib/SidePanel.js

@@ -14,6 +14,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 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)
@@ -25,30 +44,26 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.SidePanelContext = void 0;
+/** @jsxRuntime classic */
 /** @jsx jsx */
 var React = __importStar(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");
-var core_1 = require("@emotion/core");
+var react_1 = require("@emotion/react");
 var button_1 = require("@workday/canvas-kit-react/button");
 var tokens_1 = require("@workday/canvas-kit-react/tokens");
 var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+var tooltip_1 = require("@workday/canvas-kit-react/tooltip");
 var createKeyframes = function (from, to) {
     var normalized = {
         from: typeof from === 'number' ? from + 'px' : from,
         to: typeof to === 'number' ? to + 'px' : to,
     };
-    return core_1.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);
+    return react_1.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: tokens_1.colors.frenchVanilla100 }, tokens_1.depth[3]),
+    alternate: __assign({ backgroundColor: tokens_1.colors.frenchVanilla100 }, tokens_1.depth[5]),
     standard: {
         backgroundColor: tokens_1.colors.soap100,
     },
@@ -104,7 +119,7 @@ var SidePanel = function (_a) {
             onAnimationStart(event);
         }
     };
-    return (core_1.jsx(Panel, __assign({ as: as, css: [
+    return (react_1.jsx(Panel, __assign({ as: as, css: [
             {
                 width: expanded ? expandedWidth : collapsedWidth,
                 maxWidth: expanded ? expandedWidth : collapsedWidth,
@@ -116,7 +131,7 @@ var SidePanel = function (_a) {
             },
             containerVariantStyle[variant],
         ], onAnimationEnd: handleAnimationEnd, onAnimationStart: handleAnimationStart }, elemProps),
-        core_1.jsx(exports.SidePanelContext.Provider, { value: {
+        react_1.jsx(exports.SidePanelContext.Provider, { value: {
                 state: state,
                 origin: origin,
             } }, children)));
@@ -125,7 +140,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 ? canvas_system_icons_web_1.transformationImportIcon : _c, rest = __rest(_a, ["variant", "icon"]);
+    var _b = _a.variant, variant = _b === void 0 ? undefined : _b, _c = _a.icon, icon = _c === void 0 ? canvas_system_icons_web_1.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(exports.SidePanelContext);
     var useRTLOrigin = function () {
         var isRTL = common_1.useIsRTL();
@@ -138,9 +153,10 @@ var ToggleButton = function (_a) {
     };
     var rtlOrigin = useRTLOrigin();
     // Note: Depending on the collapsed width, the button could "jump" to it's final position.
-    var buttonStyle = core_1.css({
+    var buttonStyle = react_1.css({
         position: 'absolute',
         top: tokens_1.space.m,
+        width: tokens_1.space.l,
         right: context.state === 'collapsed' ? 0 : rtlOrigin === 'left' ? tokens_1.space.s : undefined,
         left: context.state === 'collapsed' ? 0 : rtlOrigin === 'right' ? tokens_1.space.s : undefined,
         margin: context.state === 'collapsed' ? 'auto' : 0,
@@ -148,8 +164,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 core_1.jsx(button_1.IconButton, __assign({ type: "button", css: buttonStyle, icon: icon, variant: variant }, rest));
+    return (react_1.jsx(tooltip_1.Tooltip, { title: context.state === 'collapsed' ? expandLabel : collapseLabel, type: "muted" },
+        react_1.jsx(button_1.TertiaryButton, __assign({ type: "button", css: buttonStyle, icon: icon, variant: variant }, rest))));
 };
 SidePanel.ToggleButton = ToggleButton;
 exports.default = SidePanel;

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;;;;;;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/commonjs/side-panel/lib/hooks.js

@@ -1,15 +1,28 @@
 "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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, 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");
-exports.useSidePanel = function (config) {
+var useSidePanel = function (config) {
     var _a = React.useState(false), touched = _a[0], setTouched = _a[1];
     var configParams = config
         ? config
@@ -58,3 +71,4 @@ exports.useSidePanel = function (config) {
         controlProps: controlProps,
     };
 };
+exports.useSidePanel = useSidePanel;

package/dist/commonjs/text-area/index.js

@@ -1,6 +1,13 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+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 });
-__export(require("./lib/TextArea"));
+__exportStar(require("./lib/TextArea"), exports);

package/dist/commonjs/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/commonjs/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/commonjs/text-area/lib/TextArea.js

@@ -25,28 +25,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextArea = void 0;
 var react_1 = __importDefault(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");
 var form_field_1 = require("@workday/canvas-kit-preview-react/form-field");
-var layout_1 = require("@workday/canvas-kit-labs-react/layout");
+var layout_1 = require("@workday/canvas-kit-react/layout");
 var hooks_1 = require("./hooks");
 var TextAreaField_1 = require("./TextAreaField");
-var TextAreaLabel_1 = require("./TextAreaLabel");
-var TextAreaHint_1 = require("./TextAreaHint");
-exports.TextAreaModelContext = form_field_1.FormFieldModelContext;
-exports.TextArea = common_1.createComponent()({
+exports.TextArea = common_1.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 = common_1.useDefaultModel(model, { hasError: hasError, id: id, isRequired: isRequired }, hooks_1.useTextAreaModel);
-        var layoutProps = form_field_1.useFormFieldOrientation(orientation);
-        return (react_1.default.createElement(exports.TextAreaModelContext.Provider, { value: value },
-            react_1.default.createElement(layout_1.Stack, __assign({ ref: ref }, layoutProps, elemProps), children)));
-    },
+    modelHook: hooks_1.useTextAreaModel,
     subComponents: {
         Field: TextAreaField_1.TextAreaField,
-        Label: TextAreaLabel_1.TextAreaLabel,
-        Hint: TextAreaHint_1.TextAreaHint,
+        Label: form_field_1.FormField.Label,
+        Hint: form_field_1.FormField.Hint,
     },
+})(function (_a, Element) {
+    var children = _a.children, orientation = _a.orientation, elemProps = __rest(_a, ["children", "orientation"]);
+    var layoutProps = form_field_1.useFormFieldOrientation(orientation);
+    return (react_1.default.createElement(layout_1.Stack, __assign({ as: Element }, layoutProps, elemProps), children));
 });

package/dist/commonjs/text-area/lib/TextAreaField.d.ts

@@ -1,8 +1,16 @@
-import { ExtractProps } from '@workday/canvas-kit-react/common';
-import { FormField } from '@workday/canvas-kit-preview-react/form-field';
-import { TextAreaModel } from './hooks';
-export interface TextAreaFieldProps extends ExtractProps<typeof FormField.Input, never> {
-    model?: TextAreaModel;
-}
-export declare const TextAreaField: import("@workday/canvas-kit-react/common").ElementComponent<"textarea", TextAreaFieldProps>;
+export declare const TextAreaField: 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: {};
+}>;
 //# sourceMappingURL=TextAreaField.d.ts.map

package/dist/commonjs/text-area/lib/TextAreaField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AAUA,OAAO,EAEL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,SAAS,EAAC,MAAM,8CAA8C,CAAC;AAGvE,OAAO,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAEtC,MAAM,WAAW,kBAAmB,SAAQ,YAAY,CAAC,OAAO,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;IACrF,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AA4BD,eAAO,MAAM,aAAa,6FAkCxB,CAAC"}
+{"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AA0CA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;EA+BxB,CAAC"}

package/dist/commonjs/text-area/lib/TextAreaField.js

@@ -22,13 +22,15 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextAreaField = void 0;
+/** @jsxRuntime classic */
 /** @jsx jsx */
-var core_1 = require("@emotion/core");
+var react_1 = require("@emotion/react");
 var tokens_1 = require("@workday/canvas-kit-react/tokens");
 var common_1 = require("@workday/canvas-kit-react/common");
 var common_2 = require("@workday/canvas-kit-labs-react/common");
 var form_field_1 = require("@workday/canvas-kit-preview-react/form-field");
-var TextArea_1 = require("./TextArea");
+var text_input_1 = require("@workday/canvas-kit-preview-react/text-input");
 var baseStyles = __assign(__assign({}, tokens_1.type.levels.subtext.large), { transition: '0.2s box-shadow, 0.2s border-color', resize: 'both', '&::webkit-resizer': {
         display: 'none',
     }, '&::placeholder': {
@@ -45,21 +47,20 @@ var baseStyles = __assign(__assign({}, tokens_1.type.levels.subtext.large), { tr
             color: tokens_1.inputColors.disabled.text,
         },
     } });
-exports.TextAreaField = common_1.createComponent('textarea')({
+exports.TextAreaField = common_1.createSubcomponent('textarea')({
     displayName: 'TextArea.Field',
-    Component: function (_a, ref) {
-        var model = _a.model, elemProps = __rest(_a, ["model"]);
-        var localModel = common_1.useModelContext(TextArea_1.TextAreaModelContext, model);
-        var theme = common_1.useTheme();
-        var errorRing = common_2.useThemedRing('error');
-        var focusStyles = localModel.state.hasError
-            ? errorRing
-            : {
-                '&:focus:not([disabled])': {
-                    borderColor: theme.canvas.palette.common.focusOutline,
-                    boxShadow: "inset 0 0 0 1px " + theme.canvas.palette.common.focusOutline,
-                },
-            };
-        return (core_1.jsx(form_field_1.FormField.Input, __assign({ as: "textarea", ref: ref, css: [baseStyles, focusStyles] }, elemProps, { border: "1px solid " + tokens_1.inputColors.border, display: "block", backgroundColor: tokens_1.inputColors.background, borderRadius: tokens_1.borderRadius.m, minHeight: 64, minWidth: 280, padding: tokens_1.spaceNumbers.xxs, margin: 0 })));
-    },
+    modelHook: text_input_1.useTextInputModel,
+})(function (_a, Element, model) {
+    var elemProps = __rest(_a, []);
+    var theme = common_1.useTheme();
+    var errorRing = common_2.useThemedRing('error');
+    var focusStyles = model.state.hasError
+        ? errorRing
+        : {
+            '&:focus:not([disabled])': {
+                borderColor: theme.canvas.palette.common.focusOutline,
+                boxShadow: "inset 0 0 0 1px " + theme.canvas.palette.common.focusOutline,
+            },
+        };
+    return (react_1.jsx(form_field_1.FormField.Input, __assign({ as: Element, css: [baseStyles, focusStyles] }, elemProps, { border: "1px solid " + tokens_1.inputColors.border, display: "block", backgroundColor: tokens_1.inputColors.background, borderRadius: tokens_1.borderRadius.m, minHeight: 64, minWidth: 280, padding: tokens_1.spaceNumbers.xxs, margin: 0 })));
 });