@uxf/ui 1.0.0-beta.47 → 1.0.0-beta.48

package/input/input-element.d.ts

@@ -1,12 +1,19 @@
 import { FormControlProps } from "@uxf/ui/types/form-control-props";
-import React from "react";
+import React, { KeyboardEventHandler } from "react";
 export interface InputElementProps extends FormControlProps<string> {
     "aria-describedby"?: string;
     "aria-invalid"?: boolean;
     form?: string;
     id?: string;
+    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
     placeholder?: string;
-    type?: "email" | "number" | "password" | "tel" | "text" | "url";
+    type?: "email" | "number" | "password" | "search" | "tel" | "text" | "url";
+    maxLength?: number | undefined;
+    minLength?: number | undefined;
+    max?: number | string;
+    min?: number | string;
+    pattern?: string;
+    step?: number | string;
 }
 declare const _default: React.ForwardRefExoticComponent<InputElementProps & React.RefAttributes<HTMLInputElement>>;
 export default _default;

package/input/input-element.js

@@ -6,6 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const forward_ref_1 = require("../utils/forward-ref");
 function InputElement(props, ref) {
-    return (react_1.default.createElement("input", { "aria-describedby": props["aria-describedby"], "aria-invalid": props.isInvalid, className: "uxf-input__element", disabled: props.isDisabled, form: props.form, id: props.id, onBlur: props.onBlur, onChange: (event) => { var _a; return (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, event.target.value, event); }, onFocus: props.onFocus, placeholder: props.placeholder, readOnly: props.isReadOnly, ref: ref, type: props.type, value: props.value }));
+    return (react_1.default.createElement("input", { "aria-describedby": props["aria-describedby"], "aria-invalid": props.isInvalid, className: "uxf-input__element", disabled: props.isDisabled, form: props.form, id: props.id, max: props.max, maxLength: props.maxLength, min: props.min, minLength: props.minLength, onBlur: props.onBlur, onChange: (event) => { var _a; return (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, event.target.value, event); }, onFocus: props.onFocus, onKeyDown: props.onKeyDown, pattern: props.pattern, placeholder: props.placeholder, readOnly: props.isReadOnly, ref: ref, step: props.step, type: props.type, value: props.value }));
 }
 exports.default = (0, forward_ref_1.forwardRef)("InputElement", InputElement);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/ui",
-  "version": "1.0.0-beta.47",
+  "version": "1.0.0-beta.48",
   "description": "",
   "publishConfig": {
     "access": "public"

package/text-input/text-input.d.ts

@@ -1,5 +1,5 @@
 import { FormControlProps } from "@uxf/ui/types";
-import React, { ReactNode } from "react";
+import React, { KeyboardEventHandler, ReactNode } from "react";
 import { InputProps } from "@uxf/ui/input/input";
 declare type EnterKeyHint = "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
 declare type InputMode = "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -14,10 +14,17 @@ export interface TextInputProps extends FormControlProps<string>, Pick<InputProp
     label?: ReactNode;
     leftAddon?: ReactNode;
     leftElement?: ReactNode;
+    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
     placeholder?: string;
     rightAddon?: ReactNode;
     rightElement?: ReactNode;
-    type?: "email" | "number" | "password" | "tel" | "text" | "url";
+    type?: "email" | "number" | "password" | "search" | "tel" | "text" | "url";
+    maxLength?: number | undefined;
+    minLength?: number | undefined;
+    max?: number | string;
+    min?: number | string;
+    pattern?: string;
+    step?: number | string;
 }
 export declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export {};

package/text-input/text-input.js

@@ -51,7 +51,7 @@ exports.TextInput = (0, forward_ref_1.forwardRef)("TextInput", (props, ref) => {
         react_1.default.createElement(input_1.Input, { size: props.size, variant: props.variant },
             props.leftAddon && react_1.default.createElement(input_1.Input.LeftAddon, null, props.leftAddon),
             props.leftElement && react_1.default.createElement(input_1.Input.LeftElement, null, props.leftElement),
-            react_1.default.createElement(input_1.Input.Element, { "aria-describedby": errorId, form: props.form, id: id, isDisabled: props.isDisabled, isInvalid: props.isInvalid, isReadOnly: props.isReadOnly, isRequired: props.isRequired, name: props.name, onBlur: onBlur, onChange: props.onChange, onFocus: onFocus, placeholder: props.placeholder, ref: ref, type: props.type, value: props.value }),
+            react_1.default.createElement(input_1.Input.Element, { "aria-describedby": errorId, form: props.form, id: id, isDisabled: props.isDisabled, isInvalid: props.isInvalid, isReadOnly: props.isReadOnly, isRequired: props.isRequired, max: props.max, maxLength: props.maxLength, min: props.min, minLength: props.minLength, name: props.name, onBlur: onBlur, onChange: props.onChange, onFocus: onFocus, onKeyDown: props.onKeyDown, pattern: props.pattern, placeholder: props.placeholder, ref: ref, step: props.step, type: props.type, value: props.value }),
             props.rightElement && react_1.default.createElement(input_1.Input.RightElement, null, props.rightElement),
             props.rightAddon && react_1.default.createElement(input_1.Input.RightAddon, null, props.rightAddon))));
 });