@zealicsolutions/web-ui 0.3.14 → 0.3.15

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.
@@ -3,6 +3,7 @@ import { InputFieldTypes } from 'fieldsConfiguration/types';
3
3
  import React from 'react';
4
4
  import { ThemeColors } from 'theme/types';
5
5
  import type { Callback, StylesType } from 'typescript';
6
+ import { MaskConfig } from './helpers';
6
7
  export declare type InputFieldInternalConfigProps = Partial<{
7
8
  textColor: ThemeColors | string;
8
9
  textFontSize: number;
@@ -31,5 +32,6 @@ export declare type InputProps = {
31
32
  onChange?: (value: string) => void;
32
33
  onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
33
34
  internalConfig?: InputFieldInternalConfigProps;
35
+ config?: MaskConfig;
34
36
  };
35
- export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;
37
+ export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, config, ...rest }: InputProps) => JSX.Element;
@@ -3,7 +3,7 @@ import type { StoryFn } from '@storybook/react';
3
3
  import { InputProps } from './Input';
4
4
  declare const _default: {
5
5
  title: string;
6
- component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;
6
+ component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, config, ...rest }: InputProps) => JSX.Element;
7
7
  };
8
8
  export default _default;
9
9
  export declare const Input: StoryFn<InputProps>;
@@ -0,0 +1,18 @@
1
+ import { MaskedInputProps } from 'react-text-mask';
2
+ import { HTMLInputTypeAttribute } from 'react';
3
+ import { ThemeColors } from 'theme';
4
+ import { InputProps } from 'atoms';
5
+ import { InputFieldTypes } from '../../fieldsConfiguration';
6
+ export declare type MaskConfig = Partial<{
7
+ maskPlaceholder: string;
8
+ dataModelFieldType: InputFieldTypes;
9
+ maskPattern: Array<string | RegExp>;
10
+ }>;
11
+ export declare const getSpecificInputProps: (type: InputFieldTypes) => {
12
+ type?: HTMLInputTypeAttribute | undefined;
13
+ inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
14
+ };
15
+ export declare const getMaskInputProps: (type?: InputFieldTypes, config?: MaskConfig) => Pick<MaskedInputProps, 'pipe' | 'mask' | 'placeholder' | 'keepCharPositions'>;
16
+ export declare const getInputIconColor: ({ isEditMode, isFocused, isError, disabled, }: Pick<InputProps, "disabled" | "isError" | "isEditMode"> & {
17
+ isFocused: boolean;
18
+ }) => ThemeColors;
@@ -1,10 +1,12 @@
1
1
  /// <reference types="react" />
2
2
  import { ThemeColors } from 'theme';
3
- import type { Callback, StylesType } from 'typescript';
3
+ import type { AnyObject, Callback, StylesType } from 'typescript';
4
4
  import { RefCallBack } from 'react-hook-form/dist/types';
5
5
  export declare type SelectOption = {
6
6
  id: string;
7
7
  label: string;
8
+ value?: string;
9
+ config?: AnyObject;
8
10
  };
9
11
  export declare type SelectInternalConfigurationOptions = {
10
12
  placeholderTextColor: ThemeColors | string;
@@ -2,7 +2,7 @@
2
2
  import { ControllerProps } from 'react-hook-form';
3
3
  import { SelectOption } from 'atoms';
4
4
  import { InputFieldProps, SelectFieldProps } from 'molecules';
5
- export declare type InputFieldTypes = 'phone-number' | 'text' | 'email' | 'password' | 'numerical' | 'any';
5
+ export declare type InputFieldTypes = 'phone-number' | 'text' | 'email' | 'password' | 'numerical' | 'month_year_date' | 'day_month_year_date' | 'month_day_year_date' | 'us_zip_code' | 'any';
6
6
  export declare type FieldTypes = 'input' | 'select' | 'checkbox';
7
7
  export declare type UIField<T = string> = (UIInputField & UISelectField & UICheckboxField) & {
8
8
  name: T;
@@ -5,4 +5,11 @@ export declare const phoneNumberValidation: RegExp;
5
5
  export declare const numberValidation: RegExp;
6
6
  export declare const emailValidation: RegExp;
7
7
  export declare const textValidation: RegExp;
8
+ export declare const dateValidation: RegExp;
9
+ export declare const usZipCode: RegExp;
8
10
  export declare const getInputValidation: (type?: InputFieldTypes) => ValidationRule<RegExp> | undefined;
11
+ export declare const postCodeMask: RegExp[];
12
+ export declare const dayMonthYearDateMask: (string | RegExp)[];
13
+ export declare const monthYearDateMask: (string | RegExp)[];
14
+ export declare const phoneNumberMask: (string | RegExp)[];
15
+ export declare const removeMaskFromString: (inputString: string) => string;