@zealicsolutions/web-ui 0.4.22 → 0.4.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/src/atoms/Input/Input.stories.d.ts +3 -6
- package/dist/cjs/src/atoms/Input/helpers.d.ts +8 -11
- package/dist/cjs/src/containers/hooks/useSetFormData.d.ts +4 -7
- package/dist/cjs/src/containers/types/moleculeTypes.d.ts +19 -8
- package/dist/cjs/src/fieldsConfiguration/types.d.ts +1 -1
- package/dist/cjs/src/helpers/validations.d.ts +5 -0
- package/dist/cjs/src/molecules/InputField/InputField.stories.d.ts +1 -5
- package/dist/esm/index.js +18 -18
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/src/atoms/Input/Input.stories.d.ts +3 -6
- package/dist/esm/src/atoms/Input/helpers.d.ts +8 -11
- package/dist/esm/src/containers/hooks/useSetFormData.d.ts +4 -7
- package/dist/esm/src/containers/types/moleculeTypes.d.ts +19 -8
- package/dist/esm/src/fieldsConfiguration/types.d.ts +1 -1
- package/dist/esm/src/helpers/validations.d.ts +5 -0
- package/dist/esm/src/molecules/InputField/InputField.stories.d.ts +1 -5
- package/dist/index.d.ts +1014 -1004
- package/package.json +2 -1
@@ -1,6 +1,7 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import type { StoryFn } from '@storybook/react';
|
3
3
|
import { InputProps } from './Input';
|
4
|
+
import { InputFieldTypes } from '../../fieldsConfiguration';
|
4
5
|
declare const _default: {
|
5
6
|
title: string;
|
6
7
|
component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, config, ...rest }: Partial<{
|
@@ -8,7 +9,7 @@ declare const _default: {
|
|
8
9
|
leftIcon: import("./Input").InputIconProps;
|
9
10
|
rightIcon: import("./Input").InputIconProps;
|
10
11
|
onBlur: import("../../typescript").Callback;
|
11
|
-
type:
|
12
|
+
type: InputFieldTypes;
|
12
13
|
placeholder: string;
|
13
14
|
disabled: boolean;
|
14
15
|
isEditMode: boolean;
|
@@ -26,11 +27,7 @@ declare const _default: {
|
|
26
27
|
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
27
28
|
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
28
29
|
}>;
|
29
|
-
config?:
|
30
|
-
maskPlaceholder: string;
|
31
|
-
dataModelFieldType: import("../..").InputFieldTypes;
|
32
|
-
maskPattern: (string | RegExp)[];
|
33
|
-
}> | undefined;
|
30
|
+
config?: import("./helpers").MaskConfig | undefined;
|
34
31
|
state: import("../..").FormStateType;
|
35
32
|
}>) => JSX.Element;
|
36
33
|
};
|
@@ -3,11 +3,12 @@ import { HTMLInputTypeAttribute } from 'react';
|
|
3
3
|
import { ThemeColors } from 'theme';
|
4
4
|
import { InputProps } from 'atoms';
|
5
5
|
import { InputFieldTypes } from '../../fieldsConfiguration';
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
maskPattern
|
10
|
-
|
6
|
+
import { DataModelFieldFormatCodeTypes } from '../../containers';
|
7
|
+
export declare type MaskConfig = {
|
8
|
+
maskPlaceholder?: string;
|
9
|
+
maskPattern?: Array<string | RegExp>;
|
10
|
+
dataModelFieldType: DataModelFieldFormatCodeTypes;
|
11
|
+
};
|
11
12
|
export declare const getSpecificInputProps: (type: InputFieldTypes) => {
|
12
13
|
type?: HTMLInputTypeAttribute | undefined;
|
13
14
|
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
|
@@ -36,12 +37,8 @@ export declare const getInputIconColor: ({ isEditMode, isFocused, isError, disab
|
|
36
37
|
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
37
38
|
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
38
39
|
}>;
|
39
|
-
config?:
|
40
|
-
|
41
|
-
dataModelFieldType: InputFieldTypes;
|
42
|
-
maskPattern: Array<string | RegExp>;
|
43
|
-
}> | undefined;
|
44
|
-
state: import("../..").FormStateType;
|
40
|
+
config?: MaskConfig | undefined;
|
41
|
+
state: import("../../containers").FormStateType;
|
45
42
|
}>, "disabled" | "isError" | "isEditMode"> & {
|
46
43
|
isFocused: boolean;
|
47
44
|
}) => ThemeColors;
|
@@ -1,17 +1,14 @@
|
|
1
|
-
import {
|
2
|
-
import { InputFieldTypes } from 'fieldsConfiguration';
|
1
|
+
import { DataConnectionValues } from 'containers/types/moleculeTypes';
|
3
2
|
import { Dispatch, SetStateAction } from 'react';
|
4
3
|
import { AnyObject } from 'typescript';
|
5
4
|
declare type UseSetFormDataProps<DefaultValueType> = Partial<{
|
6
5
|
defaultValue: DefaultValueType;
|
7
|
-
dataModelField:
|
6
|
+
dataModelField: DataConnectionValues;
|
8
7
|
setFormData: Dispatch<SetStateAction<AnyObject>>;
|
9
|
-
inputType: InputFieldTypes;
|
10
8
|
}>;
|
11
|
-
export declare const useSetFormData: <DefaultValueType>({ setFormData, defaultValue, dataModelField,
|
9
|
+
export declare const useSetFormData: <DefaultValueType>({ setFormData, defaultValue, dataModelField, }: Partial<{
|
12
10
|
defaultValue: DefaultValueType;
|
13
|
-
dataModelField:
|
11
|
+
dataModelField: DataConnectionValues;
|
14
12
|
setFormData: Dispatch<SetStateAction<AnyObject>>;
|
15
|
-
inputType: InputFieldTypes;
|
16
13
|
}>) => void;
|
17
14
|
export {};
|
@@ -4,7 +4,10 @@ import { Dispatch, SetStateAction } from 'react';
|
|
4
4
|
import { UseFormReturn } from 'react-hook-form';
|
5
5
|
import type { AnyObject, Nullable, StrictUnion, StylesType } from 'typescript';
|
6
6
|
import { ConditionConfig, ContainerComponentProps, MetadataType } from './types';
|
7
|
+
import { MaskConfig } from '../../atoms/Input/helpers';
|
7
8
|
export declare type ActionTypes = 'link' | 'popup' | 'drawer' | 'download' | 'submit' | 'reset' | 'destroy';
|
9
|
+
export declare type DataModelFieldFormatCodeTypes = 'date' | 'email' | 'string' | 'integer' | 'boolean' | 'numeric' | 'zip_code' | 'phone_number';
|
10
|
+
export declare type DataModelFieldFormatValueTypes = 'any' | 'text' | 'email' | 'integer' | 'numerical' | 'us_zip_code' | 'phone_number' | 'month_year_date' | 'day_month_year_date' | 'month_day_year_date' | 'year_month_day_date';
|
8
11
|
export declare type DownloadFile = {
|
9
12
|
url: string;
|
10
13
|
name: string;
|
@@ -69,16 +72,25 @@ export interface IterableAttributes {
|
|
69
72
|
attributeType: 'iterable';
|
70
73
|
options: SelectOption[];
|
71
74
|
}
|
75
|
+
export declare type DataModelFieldFormat = {
|
76
|
+
id: string;
|
77
|
+
label: string;
|
78
|
+
value: DataModelFieldFormatValueTypes;
|
79
|
+
code: DataModelFieldFormatCodeTypes;
|
80
|
+
config: MaskConfig;
|
81
|
+
};
|
82
|
+
export declare type DataConnectionValues = {
|
83
|
+
dataFieldName: string;
|
84
|
+
dataModelFieldId: string;
|
85
|
+
defaultValue?: string;
|
86
|
+
entitySubtypeId?: string;
|
87
|
+
entitySubtypeName?: string;
|
88
|
+
format: DataModelFieldFormat;
|
89
|
+
};
|
72
90
|
export interface DataConnectionAttributes {
|
73
91
|
id: string;
|
74
92
|
attributeType: 'data_model_field';
|
75
|
-
dataModelField:
|
76
|
-
dataFieldName: string;
|
77
|
-
dataModelFieldId: string;
|
78
|
-
defaultValue?: string;
|
79
|
-
entitySubtypeId?: string;
|
80
|
-
entitySubtypeName?: string;
|
81
|
-
};
|
93
|
+
dataModelField: DataConnectionValues;
|
82
94
|
}
|
83
95
|
export interface ConditionConfigAttributes {
|
84
96
|
id: string;
|
@@ -158,7 +170,6 @@ export interface TextInputMolecule extends BaseMolecule {
|
|
158
170
|
attributes: Partial<{
|
159
171
|
label: TextAttributes;
|
160
172
|
required: BooleanAttributes;
|
161
|
-
inputType: SelectAttributes;
|
162
173
|
dataModelField: DataConnectionAttributes;
|
163
174
|
conditionConfig: ConditionConfigAttributes;
|
164
175
|
}>;
|
@@ -2,7 +2,7 @@
|
|
2
2
|
import { SelectOption } from 'atoms';
|
3
3
|
import { InputFieldProps, SelectFieldProps } from 'molecules';
|
4
4
|
import { ControllerProps } from 'react-hook-form';
|
5
|
-
export declare type InputFieldTypes = '
|
5
|
+
export declare type InputFieldTypes = 'any' | 'text' | 'email' | 'integer' | 'password' | 'username' | 'numerical' | 'us_zip_code' | 'phone_number' | 'month_year_date' | 'day_month_year_date' | 'month_day_year_date' | 'year_month_day_date';
|
6
6
|
export declare type FieldTypes = 'input' | 'select' | 'checkbox';
|
7
7
|
export declare type UIField<T = string> = (UIInputField & UISelectField & UICheckboxField) & {
|
8
8
|
name: T;
|
@@ -8,11 +8,16 @@ export declare const textValidation: RegExp;
|
|
8
8
|
export declare const monthDayYearDateValidation: RegExp;
|
9
9
|
export declare const dayMonthYearDateValidation: RegExp;
|
10
10
|
export declare const monthYearDateValidation: RegExp;
|
11
|
+
export declare const yearMonthDayDateValidation: RegExp;
|
11
12
|
export declare const usZipCode: RegExp;
|
12
13
|
export declare const usernameValidation: RegExp;
|
13
14
|
export declare const getInputValidation: (type?: InputFieldTypes) => ValidationRule<RegExp> | undefined;
|
14
15
|
export declare const postCodeMask: RegExp[];
|
16
|
+
export declare const yearMonthDayDateMask: (string | RegExp)[];
|
17
|
+
export declare const monthDayYearDateMask: (string | RegExp)[];
|
15
18
|
export declare const dayMonthYearDateMask: (string | RegExp)[];
|
16
19
|
export declare const monthYearDateMask: (string | RegExp)[];
|
17
20
|
export declare const phoneNumberMask: (string | RegExp)[];
|
21
|
+
export declare const integerMask: any;
|
22
|
+
export declare const numericalMask: any;
|
18
23
|
export declare const removeMaskFromString: (inputString: string) => string;
|
@@ -51,11 +51,7 @@ declare const _default: {
|
|
51
51
|
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
52
52
|
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
53
53
|
}>;
|
54
|
-
config?:
|
55
|
-
maskPlaceholder: string;
|
56
|
-
dataModelFieldType: import("fieldsConfiguration").InputFieldTypes;
|
57
|
-
maskPattern: (string | RegExp)[];
|
58
|
-
}> | undefined;
|
54
|
+
config?: import("../../atoms/Input/helpers").MaskConfig | undefined;
|
59
55
|
state: import("../..").FormStateType;
|
60
56
|
}>;
|
61
57
|
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|