@seeqdev/qomponents 0.0.95 → 0.0.97

package/dist/TextArea/TextArea.types.d.ts

@@ -17,6 +17,8 @@ export interface TextAreaProps {
     placeholder?: string;
     /** set readonly to true if TextArea can not be edited */
     readonly?: boolean;
+    /** set disabled to true if TextArea is disabled */
+    disabled?: boolean;
     /** specifies the visible number of lines in the TextArea */
     rows?: number;
     /** specifies the visible width of the TextArea */

package/dist/TextField/TextField.types.d.ts

@@ -1,6 +1,7 @@
 import { FormControlElement, InputGroupPlacement } from '../types';
 export interface TextFieldProps {
     readonly?: boolean;
+    disabled?: boolean;
     onChange?: React.ChangeEventHandler<FormControlElement>;
     onKeyUp?: React.KeyboardEventHandler<FormControlElement>;
     onKeyDown?: React.KeyboardEventHandler<FormControlElement>;
@@ -24,6 +25,8 @@ export interface TextFieldProps {
     autoFocus?: boolean;
     inputWidth?: number;
     inputHeight?: number;
+    min?: number;
+    max?: number;
 }
 export interface DimensionStyle {
     width?: string;

package/dist/index.esm.js

@@ -4688,7 +4688,7 @@ const sizeClasses = {
  * Textfield.
  */
 const TextField = React__default.forwardRef((props, ref) => {
-    const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, maxLength, minLength, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, autoFocus = false, } = props;
+    const { readonly = false, disabled = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, min, max, maxLength, minLength, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, autoFocus = false, } = props;
     const internalRef = useRef(null);
     const [cursor, setCursor] = useState(null);
     const setAllRefs = (receivedRef) => {
@@ -4723,7 +4723,11 @@ const TextField = React__default.forwardRef((props, ref) => {
     else if (inputGroup === 'right') {
         borderRadius = 'tw-rounded-r-sm tw-border-l-0 focus:tw-border-l active:tw-border-l';
     }
-    const appliedClasses = `${baseClasses$3} ${sizeClasses[size]} ${extraClassNames} ${lightTheme$1} ${darkTheme$1} ${borderRadius} ${showError ? errorClasses$2 : borderColorClasses$2} `;
+    let hasError = showError;
+    if ((min && Number(value) < min) || (max && Number(value) > max)) {
+        hasError = true;
+    }
+    const appliedClasses = `${baseClasses$3} ${sizeClasses[size]} ${extraClassNames} ${lightTheme$1} ${darkTheme$1} ${borderRadius} ${hasError ? errorClasses$2 : borderColorClasses$2} `;
     const inputProp = setValidInputDimension(inputWidth, inputHeight)
         ? {
             style: setValidInputDimension(inputWidth, inputHeight),
@@ -4735,7 +4739,7 @@ const TextField = React__default.forwardRef((props, ref) => {
     if (minLength)
         inputLenghtProp.minLength = minLength;
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, autoFocus: autoFocus, ...inputLenghtProp, ...inputProp }),
+        React__default.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: disabled, readOnly: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, autoFocus: autoFocus, min: min, max: max, ...inputLenghtProp, ...inputProp }),
         errorText && showError && React__default.createElement("div", { className: "tw-text-sq-danger-color tw-text-xs tw-mt-1" }, errorText)));
 });
 
@@ -4780,9 +4784,9 @@ const borderColorClasses$1 = [
 /**
  * TextArea.
  */
-const TextArea = ({ readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, rows = 3, cols = undefined, value, placeholder, showError, extraClassNames, testId, autoFocus = false, }) => {
+const TextArea = ({ readonly = false, disabled = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, rows = 3, cols = undefined, value, placeholder, showError, extraClassNames, testId, autoFocus = false, }) => {
     const appliedClasses = `${baseClasses$1} ${extraClassNames} ${lightTheme} ${darkTheme} ${showError ? errorClasses$1 : borderColorClasses$1}`;
-    return (React__default.createElement("textarea", { "data-testid": testId, name: name, id: id, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, rows: rows, cols: cols, autoFocus: autoFocus }));
+    return (React__default.createElement("textarea", { "data-testid": testId, name: name, id: id, value: value, className: appliedClasses, placeholder: placeholder, disabled: disabled, readOnly: readonly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, rows: rows, cols: cols, autoFocus: autoFocus }));
 };
 
 /**