@epilot/base-elements 2.7.13 → 2.7.16

package/dist/TextField/InlineTextField.js

@@ -1,143 +1,143 @@
-"use strict";
-exports.__esModule = true;
-exports.InlineTextField = void 0;
-var tslib_1 = require("tslib");
-var core_1 = require("@material-ui/core");
-var react_1 = tslib_1.__importStar(require("react"));
-var Button_1 = require("../Button");
-var Icon_1 = require("../Icon");
-var styles_1 = require("../styles");
-var useStyles = styles_1.makeStyles(function () {
-    return styles_1.createStyles({
-        withLabel: {
-            '& div': {
-                backgroundColor: 'transparent',
-                '& fieldset': {
-                    borderWidth: 0
-                }
-            }
-        },
-        sizes: function (_a) {
-            var size = _a.size;
-            return ({
-                '& div': getSizeStyle(size)
-            });
-        }
-    });
-});
-function getSizeStyle(size) {
-    switch (size) {
-        case 'medium':
-            return {
-                paddingRight: 14,
-                fontSize: 16,
-                height: 40,
-                '& input': {
-                    paddingLeft: 10
-                },
-                '& i': {
-                    fontSize: '12px !important'
-                }
-            };
-        case 'small':
-            return {
-                paddingRight: 10,
-                fontSize: 14,
-                height: 32,
-                '& input': {
-                    paddingLeft: 8
-                },
-                '& i': {
-                    fontSize: '12px !important'
-                }
-            };
-        case 'large':
-            return {
-                paddingRight: 14,
-                fontSize: 16,
-                height: 48,
-                '& i': {
-                    fontSize: '12px !important'
-                }
-            };
-        case 'veryLarge':
-            return {
-                paddingRight: 16,
-                fontSize: 20,
-                height: 56,
-                '& i': {
-                    fontSize: '16px !important'
-                }
-            };
-        case 'verySmall':
-            return {
-                paddingRight: 8,
-                fontSize: 12,
-                height: 24,
-                '& input': {
-                    paddingLeft: 8
-                },
-                '& i': {
-                    fontSize: '8px !important'
-                }
-            };
-        default:
-            return {};
-    }
-}
-function InlineTextField(props) {
-    var initialValue = props.value, onChange = props.onChange, containerStyle = props.containerStyle, isLabel = props.isLabel, compact = props.compact, _a = props.inputProps, inputProps = _a === void 0 ? {} : _a, labelStyle = props.labelStyle, _b = props.clickAwayAction, clickAwayAction = _b === void 0 ? 'ABORT' : _b, _c = props.size, size = _c === void 0 ? 'medium' : _c, rest = tslib_1.__rest(props, ["value", "onChange", "containerStyle", "isLabel", "compact", "inputProps", "labelStyle", "clickAwayAction", "size"]);
-    var style = inputProps.style, restinputProps = tslib_1.__rest(inputProps, ["style"]);
-    var classes = useStyles(props);
-    var _d = react_1.useState(false), showControls = _d[0], setShowControls = _d[1];
-    var _e = react_1.useState(false), showEditingIcon = _e[0], setShowEditingIcon = _e[1];
-    var _f = react_1.useState(initialValue), value = _f[0], setValue = _f[1];
-    react_1.useEffect(function () {
-        setValue(initialValue);
-    }, [initialValue]);
-    var theme = styles_1.useTheme();
-    var onClickCheck = function () {
-        onChange &&
-            onChange({ target: { value: value } });
-        setShowControls(false);
-    };
-    var onClickCancel = function () {
-        onChange &&
-            onChange({
-                target: { value: initialValue }
-            });
-        setValue(initialValue);
-        setShowControls(false);
-    };
-    var onFormSubmit = function (e) {
-        e.preventDefault();
-        setShowControls(false);
-        onChange &&
-            onChange({ target: { value: value } });
-    };
-    var handleKeyDown = function (e) {
-        if (e && e.keyCode === 27) {
-            onClickCancel();
-        }
-    };
-    return (react_1["default"].createElement("form", { onSubmit: onFormSubmit, style: tslib_1.__assign({ position: 'relative', display: 'inline-flex', flexDirection: 'column', alignItems: 'flex-end' }, containerStyle) },
-        react_1["default"].createElement(core_1.TextField, tslib_1.__assign({ InputProps: {
-                endAdornment: (react_1["default"].createElement(Icon_1.EIcon, { color: "secondary", name: "pencil2", style: {
-                        visibility: showEditingIcon && !showControls ? 'visible' : 'hidden'
-                    } }))
-            }, className: classes.sizes + " " + (isLabel ? classes.withLabel : ''), inputProps: tslib_1.__assign(tslib_1.__assign({ size: compact && typeof value === 'string' ? value.length + 1 : undefined, maxLength: compact && typeof value === 'string' ? value.length + 1 : undefined }, restinputProps), { style: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, style), labelStyle), { color: showControls || showEditingIcon
-                        ? theme.palette.text.primary
-                        : (labelStyle === null || labelStyle === void 0 ? void 0 : labelStyle.color) || (style === null || style === void 0 ? void 0 : style.color) }) }), onBlur: function () {
-                return clickAwayAction === 'ABORT' ? onClickCancel() : onClickCheck();
-            }, onChange: function (e) { return setValue(e.target.value); }, onFocus: function () { return setShowControls(true); }, onKeyDown: handleKeyDown, onMouseEnter: function () { return setShowEditingIcon(true); }, onMouseLeave: function () { return setShowEditingIcon(false); }, value: value, variant: "outlined" }, rest)),
-        showControls && renderControls(onClickCheck, onClickCancel)));
-}
-exports.InlineTextField = InlineTextField;
-function renderControls(onClickCheck, onClickCancel) {
-    return (react_1["default"].createElement("span", { style: { position: 'absolute', top: '100%', marginTop: 4, lineHeight: 1 } },
-        react_1["default"].createElement(Button_1.ElevatedIconButton, { onMouseDown: onClickCheck, variant: "rounded" },
-            react_1["default"].createElement(Icon_1.EIcon, { color: "secondary", fontSize: 16, name: "check" })),
-        react_1["default"].createElement(Button_1.ElevatedIconButton, { onMouseDown: onClickCancel, style: { marginLeft: 4 }, variant: "rounded" },
-            react_1["default"].createElement(Icon_1.EIcon, { fontSize: 16, name: "x" }))));
-}
+"use strict";
+exports.__esModule = true;
+exports.InlineTextField = void 0;
+var tslib_1 = require("tslib");
+var core_1 = require("@material-ui/core");
+var react_1 = tslib_1.__importStar(require("react"));
+var Button_1 = require("../Button");
+var Icon_1 = require("../Icon");
+var styles_1 = require("../styles");
+var useStyles = styles_1.makeStyles(function () {
+    return styles_1.createStyles({
+        withLabel: {
+            '& div': {
+                backgroundColor: 'transparent',
+                '& fieldset': {
+                    borderWidth: 0
+                }
+            }
+        },
+        sizes: function (_a) {
+            var size = _a.size;
+            return ({
+                '& div': getSizeStyle(size)
+            });
+        }
+    });
+});
+function getSizeStyle(size) {
+    switch (size) {
+        case 'medium':
+            return {
+                paddingRight: 14,
+                fontSize: 16,
+                height: 40,
+                '& input': {
+                    paddingLeft: 10
+                },
+                '& i': {
+                    fontSize: '12px !important'
+                }
+            };
+        case 'small':
+            return {
+                paddingRight: 10,
+                fontSize: 14,
+                height: 32,
+                '& input': {
+                    paddingLeft: 8
+                },
+                '& i': {
+                    fontSize: '12px !important'
+                }
+            };
+        case 'large':
+            return {
+                paddingRight: 14,
+                fontSize: 16,
+                height: 48,
+                '& i': {
+                    fontSize: '12px !important'
+                }
+            };
+        case 'veryLarge':
+            return {
+                paddingRight: 16,
+                fontSize: 20,
+                height: 56,
+                '& i': {
+                    fontSize: '16px !important'
+                }
+            };
+        case 'verySmall':
+            return {
+                paddingRight: 8,
+                fontSize: 12,
+                height: 24,
+                '& input': {
+                    paddingLeft: 8
+                },
+                '& i': {
+                    fontSize: '8px !important'
+                }
+            };
+        default:
+            return {};
+    }
+}
+function InlineTextField(props) {
+    var initialValue = props.value, onChange = props.onChange, containerStyle = props.containerStyle, isLabel = props.isLabel, compact = props.compact, _a = props.inputProps, inputProps = _a === void 0 ? {} : _a, labelStyle = props.labelStyle, _b = props.clickAwayAction, clickAwayAction = _b === void 0 ? 'ABORT' : _b, _c = props.size, size = _c === void 0 ? 'medium' : _c, rest = tslib_1.__rest(props, ["value", "onChange", "containerStyle", "isLabel", "compact", "inputProps", "labelStyle", "clickAwayAction", "size"]);
+    var style = inputProps.style, restinputProps = tslib_1.__rest(inputProps, ["style"]);
+    var classes = useStyles(props);
+    var _d = react_1.useState(false), showControls = _d[0], setShowControls = _d[1];
+    var _e = react_1.useState(false), showEditingIcon = _e[0], setShowEditingIcon = _e[1];
+    var _f = react_1.useState(initialValue), value = _f[0], setValue = _f[1];
+    react_1.useEffect(function () {
+        setValue(initialValue);
+    }, [initialValue]);
+    var theme = styles_1.useTheme();
+    var onClickCheck = function () {
+        onChange &&
+            onChange({ target: { value: value } });
+        setShowControls(false);
+    };
+    var onClickCancel = function () {
+        onChange &&
+            onChange({
+                target: { value: initialValue }
+            });
+        setValue(initialValue);
+        setShowControls(false);
+    };
+    var onFormSubmit = function (e) {
+        e.preventDefault();
+        setShowControls(false);
+        onChange &&
+            onChange({ target: { value: value } });
+    };
+    var handleKeyDown = function (e) {
+        if (e && e.keyCode === 27) {
+            onClickCancel();
+        }
+    };
+    return (react_1["default"].createElement("form", { onSubmit: onFormSubmit, style: tslib_1.__assign({ position: 'relative', display: 'inline-flex', flexDirection: 'column', alignItems: 'flex-end' }, containerStyle) },
+        react_1["default"].createElement(core_1.TextField, tslib_1.__assign({ InputProps: {
+                endAdornment: (react_1["default"].createElement(Icon_1.EIcon, { color: "secondary", name: "pencil2", style: {
+                        visibility: showEditingIcon && !showControls ? 'visible' : 'hidden'
+                    } }))
+            }, className: classes.sizes + " " + (isLabel ? classes.withLabel : ''), inputProps: tslib_1.__assign(tslib_1.__assign({ size: compact && typeof value === 'string' ? value.length + 1 : undefined, maxLength: compact && typeof value === 'string' ? value.length + 1 : undefined }, restinputProps), { style: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, style), labelStyle), { color: showControls || showEditingIcon
+                        ? theme.palette.text.primary
+                        : (labelStyle === null || labelStyle === void 0 ? void 0 : labelStyle.color) || (style === null || style === void 0 ? void 0 : style.color) }) }), onBlur: function () {
+                return clickAwayAction === 'ABORT' ? onClickCancel() : onClickCheck();
+            }, onChange: function (e) { return setValue(e.target.value); }, onFocus: function () { return setShowControls(true); }, onKeyDown: handleKeyDown, onMouseEnter: function () { return setShowEditingIcon(true); }, onMouseLeave: function () { return setShowEditingIcon(false); }, value: value, variant: "outlined" }, rest)),
+        showControls && renderControls(onClickCheck, onClickCancel)));
+}
+exports.InlineTextField = InlineTextField;
+function renderControls(onClickCheck, onClickCancel) {
+    return (react_1["default"].createElement("span", { style: { position: 'absolute', top: '100%', marginTop: 4, lineHeight: 1 } },
+        react_1["default"].createElement(Button_1.ElevatedIconButton, { onMouseDown: onClickCheck, variant: "rounded" },
+            react_1["default"].createElement(Icon_1.EIcon, { color: "secondary", fontSize: 16, name: "check" })),
+        react_1["default"].createElement(Button_1.ElevatedIconButton, { onMouseDown: onClickCancel, style: { marginLeft: 4 }, variant: "rounded" },
+            react_1["default"].createElement(Icon_1.EIcon, { fontSize: 16, name: "x" }))));
+}
 //# sourceMappingURL=InlineTextField.js.map

package/dist/TextField/MaskedTextField.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-import { MaskedTextFieldProps } from './types';
-export declare function MaskedTextField(props: MaskedTextFieldProps): JSX.Element;
+/// <reference types="react" />
+import { MaskedTextFieldProps } from './types';
+export declare function MaskedTextField(props: MaskedTextFieldProps): JSX.Element;

package/dist/TextField/MaskedTextField.js

@@ -1,14 +1,14 @@
-"use strict";
-exports.__esModule = true;
-exports.MaskedTextField = void 0;
-var tslib_1 = require("tslib");
-var react_1 = tslib_1.__importDefault(require("react"));
-var react_input_mask_1 = tslib_1.__importDefault(require("react-input-mask"));
-var TextField_1 = require("./TextField");
-function MaskedTextField(props) {
-    var textFieldProps = props.textFieldProps, required = props.required, inputRef = props.inputRef, rest = tslib_1.__rest(props, ["textFieldProps", "required", "inputRef"]);
-    var onChange = textFieldProps.onChange, onMouseDown = textFieldProps.onMouseDown, onFocus = textFieldProps.onFocus, onBlur = textFieldProps.onBlur, value = textFieldProps.value, disabled = textFieldProps.disabled, otherTextFieldProps = tslib_1.__rest(textFieldProps, ["onChange", "onMouseDown", "onFocus", "onBlur", "value", "disabled"]);
-    return (react_1["default"].createElement(react_input_mask_1["default"], tslib_1.__assign({ disabled: disabled, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onMouseDown: onMouseDown, value: value }, rest), function () { return (react_1["default"].createElement(TextField_1.TextField, tslib_1.__assign({ inputRef: inputRef, required: required }, otherTextFieldProps))); }));
-}
-exports.MaskedTextField = MaskedTextField;
+"use strict";
+exports.__esModule = true;
+exports.MaskedTextField = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var react_input_mask_1 = tslib_1.__importDefault(require("react-input-mask"));
+var TextField_1 = require("./TextField");
+function MaskedTextField(props) {
+    var textFieldProps = props.textFieldProps, required = props.required, inputRef = props.inputRef, rest = tslib_1.__rest(props, ["textFieldProps", "required", "inputRef"]);
+    var onChange = textFieldProps.onChange, onMouseDown = textFieldProps.onMouseDown, onFocus = textFieldProps.onFocus, onBlur = textFieldProps.onBlur, value = textFieldProps.value, disabled = textFieldProps.disabled, otherTextFieldProps = tslib_1.__rest(textFieldProps, ["onChange", "onMouseDown", "onFocus", "onBlur", "value", "disabled"]);
+    return (react_1["default"].createElement(react_input_mask_1["default"], tslib_1.__assign({ disabled: disabled, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onMouseDown: onMouseDown, value: value }, rest), function () { return (react_1["default"].createElement(TextField_1.TextField, tslib_1.__assign({ inputRef: inputRef, required: required }, otherTextFieldProps))); }));
+}
+exports.MaskedTextField = MaskedTextField;
 //# sourceMappingURL=MaskedTextField.js.map

package/dist/TextField/TextField.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-import { TextFieldProps } from './types';
-export declare function TextField({ InputProps, customBackgroundColor, ...props }: TextFieldProps): JSX.Element;
+/// <reference types="react" />
+import { TextFieldProps } from './types';
+export declare function TextField({ InputProps, customBackgroundColor, ...props }: TextFieldProps): JSX.Element;

package/dist/TextField/TextField.js

@@ -1,14 +1,14 @@
-"use strict";
-exports.__esModule = true;
-exports.TextField = void 0;
-var tslib_1 = require("tslib");
-var core_1 = require("@material-ui/core");
-var react_1 = tslib_1.__importDefault(require("react"));
-var styles_1 = require("./styles");
-function TextField(_a) {
-    var InputProps = _a.InputProps, customBackgroundColor = _a.customBackgroundColor, props = tslib_1.__rest(_a, ["InputProps", "customBackgroundColor"]);
-    var classes = styles_1.useTextFieldStyles(tslib_1.__assign({ customBackgroundColor: customBackgroundColor }, props));
-    return react_1["default"].createElement(core_1.TextField, tslib_1.__assign({ InputProps: tslib_1.__assign({ classes: classes }, InputProps) }, props));
-}
-exports.TextField = TextField;
+"use strict";
+exports.__esModule = true;
+exports.TextField = void 0;
+var tslib_1 = require("tslib");
+var core_1 = require("@material-ui/core");
+var react_1 = tslib_1.__importDefault(require("react"));
+var styles_1 = require("./styles");
+function TextField(_a) {
+    var InputProps = _a.InputProps, customBackgroundColor = _a.customBackgroundColor, props = tslib_1.__rest(_a, ["InputProps", "customBackgroundColor"]);
+    var classes = styles_1.useTextFieldStyles(tslib_1.__assign({ customBackgroundColor: customBackgroundColor }, props));
+    return react_1["default"].createElement(core_1.TextField, tslib_1.__assign({ InputProps: tslib_1.__assign({ classes: classes }, InputProps) }, props));
+}
+exports.TextField = TextField;
 //# sourceMappingURL=TextField.js.map

package/dist/TextField/ValidatedTextField.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-import { ValidatedTextFieldProps } from './types';
-export declare function ValidatedTextField(props: ValidatedTextFieldProps): JSX.Element;
+/// <reference types="react" />
+import { ValidatedTextFieldProps } from './types';
+export declare function ValidatedTextField(props: ValidatedTextFieldProps): JSX.Element;

package/dist/TextField/ValidatedTextField.js

@@ -1,36 +1,36 @@
-"use strict";
-exports.__esModule = true;
-exports.ValidatedTextField = void 0;
-var tslib_1 = require("tslib");
-var react_1 = tslib_1.__importStar(require("react"));
-var TextField_1 = require("./TextField");
-function ValidatedTextField(props) {
-    var onError = props.onError, onChange = props.onChange, validationRegEx = props.validationRegEx, value = props.value, variant = props.variant, rest = tslib_1.__rest(props, ["onError", "onChange", "validationRegEx", "value", "variant"]);
-    var _a = react_1.useState(false), error = _a[0], setError = _a[1];
-    var handleChange = function (event) {
-        // is valid
-        var isValid = validationRegEx.test(event.target.value);
-        // show error if it does not match
-        if (isValid) {
-            setError(false);
-            // fire the callback if any
-            if (onError) {
-                onError(false);
-            }
-        }
-        else {
-            setError(true);
-            // fire the callback if any
-            if (onError) {
-                onError(true);
-            }
-        }
-        // fire the callback for change
-        if (onChange) {
-            onChange(event);
-        }
-    };
-    return (react_1["default"].createElement(TextField_1.TextField, tslib_1.__assign({}, rest, { error: error, onChange: handleChange, value: value, variant: variant })));
-}
-exports.ValidatedTextField = ValidatedTextField;
+"use strict";
+exports.__esModule = true;
+exports.ValidatedTextField = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var TextField_1 = require("./TextField");
+function ValidatedTextField(props) {
+    var onError = props.onError, onChange = props.onChange, validationRegEx = props.validationRegEx, value = props.value, variant = props.variant, rest = tslib_1.__rest(props, ["onError", "onChange", "validationRegEx", "value", "variant"]);
+    var _a = react_1.useState(false), error = _a[0], setError = _a[1];
+    var handleChange = function (event) {
+        // is valid
+        var isValid = validationRegEx.test(event.target.value);
+        // show error if it does not match
+        if (isValid) {
+            setError(false);
+            // fire the callback if any
+            if (onError) {
+                onError(false);
+            }
+        }
+        else {
+            setError(true);
+            // fire the callback if any
+            if (onError) {
+                onError(true);
+            }
+        }
+        // fire the callback for change
+        if (onChange) {
+            onChange(event);
+        }
+    };
+    return (react_1["default"].createElement(TextField_1.TextField, tslib_1.__assign({}, rest, { error: error, onChange: handleChange, value: value, variant: variant })));
+}
+exports.ValidatedTextField = ValidatedTextField;
 //# sourceMappingURL=ValidatedTextField.js.map

package/dist/TextField/index.d.ts

@@ -1,6 +1,6 @@
-export * from './TextField';
-export * from './MaskedTextField';
-export * from './ValidatedTextField';
-export * from './CurrencyTextField';
-export * from './types';
-export * from './InlineTextField';
+export * from './TextField';
+export * from './MaskedTextField';
+export * from './ValidatedTextField';
+export * from './CurrencyTextField';
+export * from './types';
+export * from './InlineTextField';

package/dist/TextField/index.js

@@ -1,10 +1,10 @@
-"use strict";
-exports.__esModule = true;
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./TextField"), exports);
-tslib_1.__exportStar(require("./MaskedTextField"), exports);
-tslib_1.__exportStar(require("./ValidatedTextField"), exports);
-tslib_1.__exportStar(require("./CurrencyTextField"), exports);
-tslib_1.__exportStar(require("./types"), exports);
-tslib_1.__exportStar(require("./InlineTextField"), exports);
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./TextField"), exports);
+tslib_1.__exportStar(require("./MaskedTextField"), exports);
+tslib_1.__exportStar(require("./ValidatedTextField"), exports);
+tslib_1.__exportStar(require("./CurrencyTextField"), exports);
+tslib_1.__exportStar(require("./types"), exports);
+tslib_1.__exportStar(require("./InlineTextField"), exports);
 //# sourceMappingURL=index.js.map

package/dist/TextField/styles.d.ts

@@ -1,2 +1,2 @@
-import { TextFieldProps } from './types';
-export declare const useTextFieldStyles: (props: TextFieldProps) => Record<"root", string>;
+import { TextFieldProps } from './types';
+export declare const useTextFieldStyles: (props: TextFieldProps) => Record<"root", string>;

package/dist/TextField/styles.js

@@ -1,14 +1,14 @@
-"use strict";
-exports.__esModule = true;
-exports.useTextFieldStyles = void 0;
-var core_1 = require("@material-ui/core");
-exports.useTextFieldStyles = core_1.makeStyles(function () {
-    return core_1.createStyles({
-        root: {
-            backgroundColor: function (props) {
-                return "" + props.customBackgroundColor;
-            }
-        }
-    });
-});
+"use strict";
+exports.__esModule = true;
+exports.useTextFieldStyles = void 0;
+var core_1 = require("@material-ui/core");
+exports.useTextFieldStyles = core_1.makeStyles(function () {
+    return core_1.createStyles({
+        root: {
+            backgroundColor: function (props) {
+                return "" + props.customBackgroundColor;
+            }
+        }
+    });
+});
 //# sourceMappingURL=styles.js.map

package/dist/TextField/types.d.ts

@@ -1,63 +1,63 @@
-import { TextFieldProps as MuiTextFieldProps } from '@material-ui/core';
-import { ChangeEvent, CSSProperties } from 'react';
-import { Props as InputMaskProps } from 'react-input-mask';
-export declare type TextFieldProps = MuiTextFieldProps & {
-    /**
-     * non MUI prop to allow overwriting the default background color
-     */
-    customBackgroundColor?: string;
-};
-export declare type ValidatedTextFieldProps = Omit<TextFieldProps, 'type' | 'onError'> & {
-    /**
-     * regular expression that will be used to validate the input
-     */
-    validationRegEx: RegExp;
-    /**
-     * a callback that will be fired when the email is not valid
-     * could be used to update the helper text
-     */
-    onError?: (isValid: boolean) => void;
-};
-export declare type MaskedTextFieldProps = InputMaskProps & {
-    textFieldProps: TextFieldProps;
-};
-export declare type CurrencyTextFieldProps = TextFieldProps & {
-    currency: string;
-    value?: string;
-    onCurrencyChange?: (value: string) => void;
-};
-export declare type InlineTextFieldProps = Omit<TextFieldProps, 'onChange' | 'size'> & {
-    /**
-     * a callnack that will be triggered when the user clicks save or cancel
-     * on cancel will NOT pass an event
-     */
-    onChange?: (event?: ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * a style passed to the form container
-     */
-    containerStyle?: CSSProperties;
-    /**
-     * is the textfield a label aka. it will not show input styling before hover
-     * @default false
-     */
-    isLabel?: boolean;
-    /**
-     * when set to true, the textfield will have the size of the value +1, so it will expand with the value, otherwise it will have the deffault width
-     * @default false
-     */
-    compact?: boolean;
-    /**
-     * what action should be triggered when the user click away
-     * @default ABORT
-     */
-    clickAwayAction?: 'SAVE' | 'ABORT';
-    /**
-     * the style of the label and the text inside the textfield
-     */
-    labelStyle?: CSSProperties;
-    /**
-     * field size
-     * @default 'meduim'
-     */
-    size?: 'medium' | 'verySmall' | 'small' | 'large' | 'veryLarge' | 'adaptive';
-};
+import { TextFieldProps as MuiTextFieldProps } from '@material-ui/core';
+import { ChangeEvent, CSSProperties } from 'react';
+import { Props as InputMaskProps } from 'react-input-mask';
+export declare type TextFieldProps = MuiTextFieldProps & {
+    /**
+     * non MUI prop to allow overwriting the default background color
+     */
+    customBackgroundColor?: string;
+};
+export declare type ValidatedTextFieldProps = Omit<TextFieldProps, 'type' | 'onError'> & {
+    /**
+     * regular expression that will be used to validate the input
+     */
+    validationRegEx: RegExp;
+    /**
+     * a callback that will be fired when the email is not valid
+     * could be used to update the helper text
+     */
+    onError?: (isValid: boolean) => void;
+};
+export declare type MaskedTextFieldProps = InputMaskProps & {
+    textFieldProps: TextFieldProps;
+};
+export declare type CurrencyTextFieldProps = TextFieldProps & {
+    currency: string;
+    value?: string;
+    onCurrencyChange?: (value: string) => void;
+};
+export declare type InlineTextFieldProps = Omit<TextFieldProps, 'onChange' | 'size'> & {
+    /**
+     * a callnack that will be triggered when the user clicks save or cancel
+     * on cancel will NOT pass an event
+     */
+    onChange?: (event?: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * a style passed to the form container
+     */
+    containerStyle?: CSSProperties;
+    /**
+     * is the textfield a label aka. it will not show input styling before hover
+     * @default false
+     */
+    isLabel?: boolean;
+    /**
+     * when set to true, the textfield will have the size of the value +1, so it will expand with the value, otherwise it will have the deffault width
+     * @default false
+     */
+    compact?: boolean;
+    /**
+     * what action should be triggered when the user click away
+     * @default ABORT
+     */
+    clickAwayAction?: 'SAVE' | 'ABORT';
+    /**
+     * the style of the label and the text inside the textfield
+     */
+    labelStyle?: CSSProperties;
+    /**
+     * field size
+     * @default 'meduim'
+     */
+    size?: 'medium' | 'verySmall' | 'small' | 'large' | 'veryLarge' | 'adaptive';
+};