@zealicsolutions/web-ui 0.2.121 → 0.2.124

package/dist/esm/src/atoms/Input/Input.d.ts

@@ -3,6 +3,7 @@ import { InputFieldTypes } from 'fieldsConfiguration/types';
 import React from 'react';
 import { ThemeColors } from 'theme/types';
 import type { Callback, StylesType } from 'typescript';
+import { MaskConfig } from './helpers';
 export declare type InputFieldInternalConfigProps = Partial<{
     textColor: ThemeColors | string;
     textFontSize: number;
@@ -31,5 +32,6 @@ export declare type InputProps = {
     onChange?: (value: string) => void;
     onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
     internalConfig?: InputFieldInternalConfigProps;
+    config?: MaskConfig;
 };
-export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;
+export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, config, ...rest }: InputProps) => JSX.Element;

package/dist/esm/src/atoms/Input/Input.stories.d.ts

@@ -3,7 +3,7 @@ import type { StoryFn } from '@storybook/react';
 import { InputProps } from './Input';
 declare const _default: {
     title: string;
-    component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;
+    component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, config, ...rest }: InputProps) => JSX.Element;
 };
 export default _default;
 export declare const Input: StoryFn<InputProps>;

package/dist/esm/src/atoms/Input/helpers.d.ts

@@ -0,0 +1,18 @@
+import { MaskedInputProps } from 'react-text-mask';
+import { HTMLInputTypeAttribute } from 'react';
+import { ThemeColors } from 'theme';
+import { InputProps } from 'atoms';
+import { InputFieldTypes } from '../../fieldsConfiguration';
+export declare type MaskConfig = Partial<{
+    maskPlaceholder: string;
+    dataModelFieldType: InputFieldTypes;
+    maskPattern: Array<string | RegExp> | false;
+}>;
+export declare const getSpecificInputProps: (type: InputFieldTypes) => {
+    type?: HTMLInputTypeAttribute | undefined;
+    inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+};
+export declare const getMaskInputProps: (type?: InputFieldTypes, config?: MaskConfig) => Pick<MaskedInputProps, 'pipe' | 'mask' | 'placeholder'>;
+export declare const getInputIconColor: ({ isEditMode, isFocused, isError, disabled, }: Pick<InputProps, "disabled" | "isError" | "isEditMode"> & {
+    isFocused: boolean;
+}) => ThemeColors;

package/dist/esm/src/containers/types/moleculeTypes.d.ts

@@ -5,31 +5,13 @@ import { CSSProperties } from 'styled-components';
 import type { AnyObject, Nullable, StrictUnion } from 'typescript';
 import { ContainerComponentProps } from './types';
 export declare type ActionTypes = 'link' | 'popup' | 'drawer' | 'download' | 'submit' | 'reset' | 'destroy';
-export declare type FileType = 'image' | 'video' | 'document' | 'audio';
-export declare type ContentStatus = 'in_use' | 'draft';
-export declare type FileMatrixMessageDTO = Readonly<Partial<{
-    id: string;
-    text: string;
-    label: string;
-    locationId: string;
-}>>;
-export declare type FileObjectDTO = Readonly<Partial<{
-    id: string;
-    name: string;
-    fileType: FileType;
-    description: string;
-    originalName: string;
+export declare type DownloadFile = {
     url: string;
-    size: number;
-    type: FileType;
-    updatedAt: string;
-    createdAt: string;
-    status: ContentStatus;
-    tags: FileMatrixMessageDTO[];
-}>> | null;
-declare type LinkAction = Omit<LinkAttributes, 'attributeType'>;
+    name: string;
+};
+declare type LinkAction = LinkAttributes;
 declare type PopupDrawerAction = ContainerComponentProps;
-declare type DownloadAction = FileObjectDTO;
+declare type DownloadAction = DownloadFile;
 declare type SubmitAction = AnyObject;
 declare type CancelAction = AnyObject;
 declare type ResetAction = AnyObject;
@@ -92,9 +74,6 @@ export interface BaseMolecule {
     instance: 'molecule';
     type: MoleculeTypes;
     metadata?: AnyObject;
-    idForFrontend?: string;
-    moleculeLibraryId?: string;
-    organismLibraryMoleculeId?: string;
 }
 export interface ImageMolecule extends BaseMolecule {
     type: 'image';

package/dist/esm/src/fieldsConfiguration/types.d.ts

@@ -2,7 +2,7 @@
 import { ControllerProps } from 'react-hook-form';
 import { SelectOption } from 'atoms';
 import { InputFieldProps, SelectFieldProps } from 'molecules';
-export declare type InputFieldTypes = 'phone-number' | 'text' | 'email' | 'password' | 'numerical' | 'any';
+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';
 export declare type FieldTypes = 'input' | 'select' | 'checkbox';
 export declare type UIField<T = string> = (UIInputField & UISelectField & UICheckboxField) & {
     name: T;

package/dist/esm/src/helpers/validations.d.ts

@@ -5,4 +5,10 @@ export declare const phoneNumberValidation: RegExp;
 export declare const numberValidation: RegExp;
 export declare const emailValidation: RegExp;
 export declare const textValidation: RegExp;
+export declare const dateValidation: RegExp;
 export declare const getInputValidation: (type?: InputFieldTypes) => ValidationRule<RegExp> | undefined;
+export declare const postCodeMask: RegExp[];
+export declare const dayMonthYearDateMask: (string | RegExp)[];
+export declare const monthYearDateMask: (string | RegExp)[];
+export declare const phoneNumberMask: (string | RegExp)[];
+export declare const removeMaskFromString: (inputString: string) => string;

package/dist/esm/src/molecules/CheckboxField/CheckboxField.stories.d.ts

@@ -26,7 +26,24 @@ declare const _default: {
         }>;
         labelsProps: import("molecules").FieldLabelsProps;
         name: string;
-        rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
+        rules: Omit<Partial<{
+            required: string | import("react-hook-form").ValidationRule<boolean>;
+            min: import("react-hook-form").ValidationRule<string | number>;
+            max: import("react-hook-form").ValidationRule<string | number>;
+            maxLength: import("react-hook-form").ValidationRule<number>;
+            minLength: import("react-hook-form").ValidationRule<number>;
+            pattern: import("react-hook-form").ValidationRule<RegExp>;
+            validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
+            valueAsNumber: boolean;
+            valueAsDate: boolean;
+            value: any;
+            setValueAs: (value: any) => any;
+            shouldUnregister?: boolean | undefined;
+            onChange?: ((event: any) => void) | undefined;
+            onBlur?: ((event: any) => void) | undefined;
+            disabled: boolean;
+            deps: string | string[];
+        }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
         control: import("react-hook-form").Control<any, any>;
         required: boolean;
         optional: boolean;

package/dist/esm/src/molecules/Image/Image.d.ts

@@ -1,15 +1,16 @@
 /// <reference types="react" />
-import { StylesType } from 'typescript';
+import { Callback, StylesType } from 'typescript';
 export declare type ImageProps = {
     src: string;
 } & Partial<{
     id: string;
     altText: string;
     link: string;
+    onClick: Callback;
     width: number;
     height: number;
     cornerRadius: number;
     behaveAs: 'background' | 'regular';
     styles: StylesType;
 }>;
-export declare const Image: ({ src, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: ImageProps) => JSX.Element;
+export declare const Image: ({ src, onClick, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: ImageProps) => JSX.Element;

package/dist/esm/src/molecules/Image/Image.stories.d.ts

@@ -3,7 +3,7 @@ import type { StoryFn } from '@storybook/react';
 import { Image as ImageComponent } from './Image';
 declare const _default: {
     title: string;
-    component: ({ src, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: import("./Image").ImageProps) => JSX.Element;
+    component: ({ src, onClick, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: import("./Image").ImageProps) => JSX.Element;
 };
 export default _default;
 export declare const Image: StoryFn<typeof ImageComponent>;

package/dist/esm/src/molecules/InputField/InputField.stories.d.ts

@@ -6,7 +6,24 @@ declare const _default: {
     component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: Partial<{
         name: string;
         control: import("react-hook-form").Control<any, any>;
-        rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
+        rules: Omit<Partial<{
+            required: string | import("react-hook-form").ValidationRule<boolean>;
+            min: import("react-hook-form").ValidationRule<string | number>;
+            max: import("react-hook-form").ValidationRule<string | number>;
+            maxLength: import("react-hook-form").ValidationRule<number>;
+            minLength: import("react-hook-form").ValidationRule<number>;
+            pattern: import("react-hook-form").ValidationRule<RegExp>;
+            validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
+            valueAsNumber: boolean;
+            valueAsDate: boolean;
+            value: any;
+            setValueAs: (value: any) => any;
+            shouldUnregister?: boolean | undefined;
+            onChange?: ((event: any) => void) | undefined;
+            onBlur?: ((event: any) => void) | undefined;
+            disabled: boolean;
+            deps: string | string[];
+        }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
         required: boolean;
         optional: boolean;
         defaultValue: string;

package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts

@@ -5,7 +5,24 @@ declare const _default: {
     title: string;
     component: <T extends string>({ name, rules, styles, control, optional, required, labelsProps, defaultValue, radioButtonsProps, }: Partial<{
         name: string;
-        rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
+        rules: Omit<Partial<{
+            required: string | import("react-hook-form").ValidationRule<boolean>;
+            min: import("react-hook-form").ValidationRule<string | number>;
+            max: import("react-hook-form").ValidationRule<string | number>;
+            maxLength: import("react-hook-form").ValidationRule<number>;
+            minLength: import("react-hook-form").ValidationRule<number>;
+            pattern: import("react-hook-form").ValidationRule<RegExp>;
+            validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
+            valueAsNumber: boolean;
+            valueAsDate: boolean;
+            value: any;
+            setValueAs: (value: any) => any;
+            shouldUnregister?: boolean | undefined;
+            onChange?: ((event: any) => void) | undefined;
+            onBlur?: ((event: any) => void) | undefined;
+            disabled: boolean;
+            deps: string | string[];
+        }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
         styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
         control: import("react-hook-form").Control<any, any>;
         optional: boolean;

package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts

@@ -20,7 +20,24 @@ declare const _default: {
         }>;
         labelsProps: import("..").FieldLabelsProps;
         name: string;
-        rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
+        rules: Omit<Partial<{
+            required: string | import("react-hook-form").ValidationRule<boolean>;
+            min: import("react-hook-form").ValidationRule<string | number>;
+            max: import("react-hook-form").ValidationRule<string | number>;
+            maxLength: import("react-hook-form").ValidationRule<number>;
+            minLength: import("react-hook-form").ValidationRule<number>;
+            pattern: import("react-hook-form").ValidationRule<RegExp>;
+            validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
+            valueAsNumber: boolean;
+            valueAsDate: boolean;
+            value: any;
+            setValueAs: (value: any) => any;
+            shouldUnregister?: boolean | undefined;
+            onChange?: ((event: any) => void) | undefined;
+            onBlur?: ((event: any) => void) | undefined;
+            disabled: boolean;
+            deps: string | string[];
+        }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
         control: import("react-hook-form").Control<any, any>;
         required: boolean;
         optional: boolean;

package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.d.ts

@@ -1,7 +1,7 @@
 import { ModalProps as MUIModalProps } from '@mui/material';
 import React, { KeyboardEvent, PropsWithChildren } from 'react';
 import { CSSProperties } from 'styled-components';
-import { Callback, OverrideStyles } from '../../typescript';
+import type { Callback, OverrideStyles } from 'typescript';
 export declare type ZealUIModalProps = PropsWithChildren<Pick<MUIModalProps, 'open'>> & {
     padding?: number | string;
     wrapperStyles?: CSSProperties;
@@ -9,7 +9,7 @@ export declare type ZealUIModalProps = PropsWithChildren<Pick<MUIModalProps, 'op
     modalStyles?: CSSProperties;
     onClose?: Callback;
 };
-export declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, onClose, ...rest }: ZealUIModalProps) => JSX.Element;
+export declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, ...rest }: ZealUIModalProps) => JSX.Element;
 export declare const ModalWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, OverrideStyles, never>;
 export declare const IconWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     activeOpacity?: number | undefined;

package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.stories.d.ts

@@ -3,7 +3,7 @@ import type { StoryFn } from '@storybook/react';
 import { ZealUIModal as ZealUIModalComponent } from './ZealUIModal';
 declare const _default: {
     title: string;
-    component: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, onClose, ...rest }: import("./ZealUIModal").ZealUIModalProps) => JSX.Element;
+    component: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, ...rest }: import("./ZealUIModal").ZealUIModalProps) => JSX.Element;
 };
 export default _default;
 export declare const ZealUIModal: StoryFn<typeof ZealUIModalComponent>;

package/dist/esm/src/organisms/Consent/ConsentCapture.d.ts

@@ -14,7 +14,7 @@ export declare type CheckboxCaptureProps = {
     type: 'checkbox';
     label: string;
     value: boolean;
-    onChange: (value: string) => void;
+    onChange: (value: boolean) => void;
 };
 export declare type ConsentCaptureProps<T extends string = string> = ButtonCaptureProps | RadioButtonsCaptureProps<T> | CheckboxCaptureProps;
 export declare const ConsentCapture: <T extends string>(props: ConsentCaptureProps<T>) => JSX.Element;