@workday/canvas-kit-preview-react 7.0.0-alpha.88-next.15 → 7.0.0-alpha.91-next.18

package/dist/commonjs/menu/lib/Menu.js

@@ -268,7 +268,7 @@ var Menu = /** @class */ (function (_super) {
         var _a = this.props, _b = _a.id, id = _b === void 0 ? this.id : _b, _c = _a.isOpen, isOpen = _c === void 0 ? true : _c, children = _a.children, ariaLabelledby = _a["aria-labelledby"], grow = _a.grow, width = _a.width, onSelect = _a.onSelect, onClose = _a.onClose, initialSelectedItem = _a.initialSelectedItem, elemProps = __rest(_a, ["id", "isOpen", "children", 'aria-labelledby', "grow", "width", "onSelect", "onClose", "initialSelectedItem"]);
         var selectedItemIndex = this.state.selectedItemIndex;
         var cardWidth = grow ? '100%' : width;
-        return (React.createElement(card_1.Card, { style: { display: 'inline-block' }, padding: tokens_1.space.zero, width: cardWidth, depth: 3 },
+        return (React.createElement(card_1.Card, { display: "inline-block", padding: tokens_1.space.zero, width: cardWidth, depth: 3 },
             React.createElement(card_1.Card.Body, null,
                 React.createElement(List, __assign({ role: "menu", tabIndex: 0, id: id, "aria-labelledby": ariaLabelledby, "aria-activedescendant": id + "-" + selectedItemIndex, onKeyDown: this.handleKeyboardShortcuts, ref: this.menuRef }, elemProps), React.Children.map(children, function (menuItem, index) {
                     if (!React.isValidElement(menuItem)) {

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,29 +25,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextArea = exports.TextAreaModelContext = void 0;
+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-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":"AAWA,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

@@ -30,7 +30,7 @@ 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': {
@@ -47,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 (react_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 })));
 });

package/dist/commonjs/text-area/lib/hooks/useTextAreaModel.d.ts

@@ -1,8 +1,28 @@
-import { FormFieldModel } from '@workday/canvas-kit-preview-react/form-field';
-export declare const useTextAreaModel: (config?: import("../../../form-field").FormFieldModelConfig) => import("@workday/canvas-kit-react/common").Model<{
-    hasError?: boolean | undefined;
-    id?: string | undefined;
-    isRequired?: boolean | undefined;
-}, {}>;
-export declare type TextAreaModel = FormFieldModel;
+export declare const useTextAreaModel: (<TT_Special_Generic>(config?: (Partial<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}> & {} & {}) | undefined) => {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}, {}, {
+    id: string;
+    hasError: boolean;
+    isRequired: boolean;
+}, {}, {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}>;
 //# sourceMappingURL=useTextAreaModel.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useTextAreaModel.d.ts","sourceRoot":"","sources":["../../../../../text-area/lib/hooks/useTextAreaModel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,cAAc,EAAC,MAAM,8CAA8C,CAAC;AAE/F,eAAO,MAAM,gBAAgB;;;;MAAoB,CAAC;AAElD,oBAAY,aAAa,GAAG,cAAc,CAAC"}
+{"version":3,"file":"useTextAreaModel.d.ts","sourceRoot":"","sources":["../../../../../text-area/lib/hooks/useTextAreaModel.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;EAAoB,CAAC"}

package/dist/commonjs/text-input/lib/TextInput.d.ts

@@ -1,22 +1,70 @@
 import React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { FormField } from '@workday/canvas-kit-preview-react/form-field';
-import { TextInputModel } from './hooks';
-export declare const TextInputModelContext: React.Context<import("@workday/canvas-kit-react/common").Model<{
-    hasError?: boolean | undefined;
-    id?: string | undefined;
-    isRequired?: boolean | undefined;
-}, {}>>;
 export interface TextInputProps extends ExtractProps<typeof FormField, never> {
-    model?: TextInputModel;
     /**
      * Children of the Text Input. Should contain a `<TextInput.Field>`, a `<TextInput.Label>` and an optional `<TextInput.Hint>`
      */
     children: React.ReactNode;
 }
-export declare const TextInput: import("@workday/canvas-kit-react/common").Component<TextInputProps> & {
-    Field: import("@workday/canvas-kit-react/common").ElementComponent<"input", import("./TextInputField").TextInputFieldProps>;
-    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 TextInput: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../form-field").FormFieldProps & Partial<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}> & {} & {} & import("@workday/canvas-kit-react/common").PropsWithModel<{
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}>, {
+    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<"input", 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=TextInput.d.ts.map

package/dist/commonjs/text-input/lib/TextInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInput.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,EAAoB,cAAc,EAAC,MAAM,SAAS,CAAC;AAK1D,eAAO,MAAM,qBAAqB;;;;OAAwB,CAAC;AAE3D,MAAM,WAAW,cAAe,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC;IAC3E,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,SAAS;;;;CAqBpB,CAAC"}
+{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInput.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,cAAe,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC;IAC3E;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBpB,CAAC"}

package/dist/commonjs/text-input/lib/TextInput.js

@@ -25,29 +25,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextInput = exports.TextInputModelContext = void 0;
+exports.TextInput = 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-react/layout");
 var hooks_1 = require("./hooks");
 var TextInputField_1 = require("./TextInputField");
-var TextInputLabel_1 = require("./TextInputLabel");
-var TextInputHint_1 = require("./TextInputHint");
-exports.TextInputModelContext = form_field_1.FormFieldModelContext;
-exports.TextInput = common_1.createComponent()({
+exports.TextInput = common_1.createContainer('div')({
     displayName: 'TextInput',
-    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.useTextInputModel);
-        var layoutProps = form_field_1.useFormFieldOrientation(orientation);
-        return (react_1.default.createElement(exports.TextInputModelContext.Provider, { value: value },
-            react_1.default.createElement(layout_1.Stack, __assign({ ref: ref }, layoutProps, elemProps), children)));
-    },
+    modelHook: hooks_1.useTextInputModel,
     subComponents: {
         Field: TextInputField_1.TextInputField,
-        Label: TextInputLabel_1.TextInputLabel,
-        Hint: TextInputHint_1.TextInputHint,
+        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-input/lib/TextInputField.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 { TextInputModel } from './hooks';
-export interface TextInputFieldProps extends ExtractProps<typeof FormField.Input, never> {
-    model?: TextInputModel;
-}
-export declare const TextInputField: import("@workday/canvas-kit-react/common").ElementComponent<"input", TextInputFieldProps>;
+export declare const TextInputField: import("@workday/canvas-kit-react/common").ElementComponentM<"input", 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=TextInputField.d.ts.map

package/dist/commonjs/text-input/lib/TextInputField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,SAAS,EAAC,MAAM,8CAA8C,CAAC;AAGvE,OAAO,EAAoB,cAAc,EAAC,MAAM,SAAS,CAAC;AAE1D,MAAM,WAAW,mBAAoB,SAAQ,YAAY,CAAC,OAAO,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;IACtF,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB;AA2BD,eAAO,MAAM,cAAc,2FAkCzB,CAAC"}
+{"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AA0CA,eAAO,MAAM,cAAc;;;;;;;;;;;;;;EAgCzB,CAAC"}

package/dist/commonjs/text-input/lib/TextInputField.js

@@ -10,17 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextInputField = void 0;
 /** @jsxRuntime classic */
@@ -30,7 +19,6 @@ 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 TextInput_1 = require("./TextInput");
 var hooks_1 = require("./hooks");
 var baseStyles = __assign(__assign({}, tokens_1.type.levels.subtext.large), { transition: '0.2s box-shadow, 0.2s border-color', '&::placeholder': {
         color: tokens_1.inputColors.placeholder,
@@ -48,22 +36,20 @@ var baseStyles = __assign(__assign({}, tokens_1.type.levels.subtext.large), { tr
     }, '::-ms-clear': {
         display: 'none',
     } });
-exports.TextInputField = common_1.createComponent('input')({
+exports.TextInputField = common_1.createSubcomponent('input')({
     displayName: 'TextInput.Field',
-    Component: function (_a, ref) {
-        var model = _a.model, elemProps = __rest(_a, ["model"]);
-        var localModel = common_1.useModelContext(TextInput_1.TextInputModelContext, model);
-        var props = hooks_1.useTextInputField(localModel, elemProps, ref);
-        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 (react_1.jsx(form_field_1.FormField.Input, __assign({ as: "input", css: [baseStyles, focusStyles], padding: tokens_1.space.xxs, margin: 0, display: "block", height: "40px", minWidth: "280px", border: "1px solid " + tokens_1.inputColors.border, backgroundColor: tokens_1.inputColors.background, borderRadius: tokens_1.borderRadius.m }, props)));
-    },
+    modelHook: hooks_1.useTextInputModel,
+    elemPropsHook: hooks_1.useTextInputField,
+})(function (elemProps, Element, model) {
+    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: "input", css: [baseStyles, focusStyles], padding: tokens_1.space.xxs, margin: 0, display: "block", height: "40px", minWidth: "280px", border: "1px solid " + tokens_1.inputColors.border, backgroundColor: tokens_1.inputColors.background, borderRadius: tokens_1.borderRadius.m }, elemProps)));
 });

package/dist/commonjs/text-input/lib/hooks/useTextInputField.d.ts

@@ -1,7 +1,14 @@
 /**
  * Adds the necessary props to a `Field` component. Used by the TextInput.Field subcomponent.
  */
-export declare const useTextInputField: <P extends {}, R>(model: import("@workday/canvas-kit-react/common").Model<any, any>, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | import("react").RefObject<R> | null | undefined) => {
+export declare const useTextInputField: <P extends {}, R>(model: {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | import("react").RefObject<R> | null | undefined) => {
     type: string;
 } & P & (R extends HTMLOrSVGElement ? {
     ref: import("react").Ref<R>;

package/dist/commonjs/text-input/lib/hooks/useTextInputField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTextInputField.d.ts","sourceRoot":"","sources":["../../../../../text-input/lib/hooks/useTextInputField.tsx"],"names":[],"mappings":"AAEA;;GAEG;AACH,eAAO,MAAM,iBAAiB;;;;OAI5B,CAAC"}
+{"version":3,"file":"useTextInputField.d.ts","sourceRoot":"","sources":["../../../../../text-input/lib/hooks/useTextInputField.tsx"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;OAI5B,CAAC"}

package/dist/commonjs/text-input/lib/hooks/useTextInputField.js

@@ -2,10 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useTextInputField = void 0;
 var common_1 = require("@workday/canvas-kit-react/common");
+var useTextInputModel_1 = require("./useTextInputModel");
 /**
  * Adds the necessary props to a `Field` component. Used by the TextInput.Field subcomponent.
  */
-exports.useTextInputField = common_1.createHook(function () {
+exports.useTextInputField = common_1.createElemPropsHook(useTextInputModel_1.useTextInputModel)(function () {
     return {
         type: 'text',
     };

package/dist/commonjs/text-input/lib/hooks/useTextInputModel.d.ts

@@ -1,8 +1,28 @@
-import { FormFieldModel } from '@workday/canvas-kit-preview-react/form-field';
-export declare const useTextInputModel: (config?: import("../../../form-field").FormFieldModelConfig) => import("@workday/canvas-kit-react/common").Model<{
-    hasError?: boolean | undefined;
-    id?: string | undefined;
-    isRequired?: boolean | undefined;
-}, {}>;
-export declare type TextInputModel = FormFieldModel;
+export declare const useTextInputModel: (<TT_Special_Generic>(config?: (Partial<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}> & {} & {}) | undefined) => {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    hasError: boolean;
+    id: string;
+    isRequired: boolean;
+}, {}, {
+    id: string;
+    hasError: boolean;
+    isRequired: boolean;
+}, {}, {
+    state: {
+        id: string;
+        hasError: boolean;
+        isRequired: boolean;
+    };
+    events: {};
+}>;
 //# sourceMappingURL=useTextInputModel.d.ts.map

package/dist/commonjs/text-input/lib/hooks/useTextInputModel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTextInputModel.d.ts","sourceRoot":"","sources":["../../../../../text-input/lib/hooks/useTextInputModel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,cAAc,EAAC,MAAM,8CAA8C,CAAC;AAE/F,eAAO,MAAM,iBAAiB;;;;MAAoB,CAAC;AAEnD,oBAAY,cAAc,GAAG,cAAc,CAAC"}
+{"version":3,"file":"useTextInputModel.d.ts","sourceRoot":"","sources":["../../../../../text-input/lib/hooks/useTextInputModel.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;EAAoB,CAAC"}