@zealicsolutions/web-ui 0.2.103 → 0.2.105

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

@@ -5,4 +5,5 @@ export declare type CircleBoxProps = {
     type: CircleType;
 };
 export declare const Circle: ({ index, type }: CircleBoxProps) => JSX.Element;
+export declare const CirclesWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 export {};

package/dist/esm/src/atoms/RichTextViewer/types.d.ts

@@ -8,6 +8,7 @@ export declare type TextFormat = Partial<{
     variable: VariablePayload;
     tag: {
         id: string;
+        label: string;
     };
     'numbered-list': boolean;
     'bulleted-list': boolean;

package/dist/esm/src/containers/MoleculeItem.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { FileObjectDTO, Molecule } from 'containers';
+import { Molecule } from 'containers';
 import { TabGroupProps } from 'molecules';
 export declare const getFullLink: (url: string) => string;
 export declare const navigateToPage: (url: string) => void;
-export declare const downloadFile: (fileData: FileObjectDTO) => Promise<void>;
+export declare const downloadFile: (url?: string, name?: string) => Promise<void>;
 export declare const MoleculeItem: ({ type, config, attributes, tabsProps, form, id: moleculeId, }: Molecule & {
     tabsProps?: Pick<TabGroupProps<string, string>, "tabs" | "activeTabKey" | "onTabChange"> | undefined;
 }) => JSX.Element;

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

@@ -1,5 +1,5 @@
 import { SelectOption } from 'atoms';
-import { ButtonProps, CheckboxFieldProps, ImageProps, InputFieldProps, RadioButtonFieldProps, SelectFieldProps, TabGroupProps, TextMoleculeProps } from 'molecules';
+import { AdditionalTabContainerProps, ButtonProps, CheckboxFieldProps, ImageProps, InputFieldProps, RadioButtonFieldProps, SelectFieldProps, TabGroupProps, TextMoleculeProps } from 'molecules';
 import { UseFormReturn } from 'react-hook-form';
 import { CSSProperties } from 'styled-components';
 import type { AnyObject, Nullable, StrictUnion } from 'typescript';
@@ -147,14 +147,8 @@ export interface TabGroupMolecule extends BaseMolecule {
     type: 'header_tab_group';
     config: {
         props: TabGroupProps;
-        wide: {
-            containerStyle?: CSSProperties;
-            containerProps?: Record<string, unknown>;
-        };
-        compact: {
-            containerStyle?: CSSProperties;
-            containerProps?: Record<string, unknown>;
-        };
+        wide: AdditionalTabContainerProps;
+        compact: AdditionalTabContainerProps;
     };
 }
 export interface TextInputMolecule extends BaseMolecule {

package/dist/esm/src/contexts/MlrRichTextViewerContext/types.d.ts

@@ -2,6 +2,9 @@ export declare type AnnotationsList = {
     tags: {
         id: string;
         label: string;
+        entityIds: string[];
+        moleculeIds: string[];
+        referencedByIds: string[];
     }[];
     links: {
         referencedById: string;

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

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import type { StoryFn } from '@storybook/react';
-import { Button as ButtonComponent } from 'molecules/Button/Button';
+import { Button as ButtonComponent } from 'molecules';
 declare const _default: {
     title: string;
-    component: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, textColor, inactiveTextColor, state, href, ...props }: import("molecules/Button/Button").ButtonProps) => JSX.Element | null;
+    component: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, textColor, inactiveTextColor, state, href, ...props }: import("molecules").ButtonProps) => JSX.Element | null;
 };
 export default _default;
 export declare const Button: StoryFn<typeof ButtonComponent>;

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

@@ -1,11 +1,10 @@
 /// <reference types="react" />
 import { TabProps, TabTheme } from 'atoms';
-import { CSSProperties } from 'styled-components';
 import { FontSizesTypes, SizesTypes, ThemeColors } from 'theme/types';
 import { StylesType } from 'typescript';
 export declare type TabType<T = string, K = string> = Pick<TabProps<T, K>, 'text' | 'tabKey' | 'disabled' | 'options' | 'divider'>;
-declare type AdditionalTabContainerProps = {
-    containerStyle?: CSSProperties;
+export declare type AdditionalTabContainerProps = {
+    containerStyle?: StylesType;
     containerProps?: Record<string, unknown>;
 };
 export declare type TabGroupProps<T = string, K = string> = {
@@ -27,4 +26,3 @@ export declare type TabGroupProps<T = string, K = string> = {
     compact?: AdditionalTabContainerProps;
 };
 export declare const TabGroup: <T extends string, K extends string>({ tabs, vertical, activeTabKey, onTabChange, tabTheme, wide, compact, tabSpacing, ...props }: TabGroupProps<T, K>) => JSX.Element;
-export {};

package/dist/esm/src/molecules/TabGroup/styles.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="react" />
 import { TabTheme } from 'atoms/Tab/Tab';
 import { SizesTypes, ThemeColors } from 'theme/types';
-export declare const TabsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+import { OverrideStyles, StyledTransientProps } from 'typescript';
+export declare const TabsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledTransientProps<{
     spacing: SizesTypes;
     vertical: boolean;
-}, never>;
-export declare const TabGroupContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+}> & OverrideStyles, never>;
 declare type TabSliderProps = {
     width: number;
     left: number;

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

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

package/dist/index.d.ts

@@ -2,15 +2,15 @@
 import * as React$1 from 'react';
 import React__default, { PropsWithChildren, ReactNode, Dispatch, SetStateAction, CSSProperties as CSSProperties$1, ComponentType, KeyboardEvent } from 'react';
 import * as styled_components from 'styled-components';
-import { CSSProperties, DefaultTheme } from 'styled-components';
+import { CSSProperties, DefaultTheme, ThemedCssFunction } from 'styled-components';
 import { ThemeColors as ThemeColors$1, SizesTypes as SizesTypes$1, FontSizesTypes as FontSizesTypes$2 } from 'theme';
 import * as typescript from 'typescript';
-import { StylesType, Callback as Callback$1, OverrideStyles, StyledTransientProps, Nullable, AnyObject, StrictUnion } from 'typescript';
+import { StylesType as StylesType$1, Callback as Callback$1, OverrideStyles as OverrideStyles$1, StyledTransientProps, Nullable, AnyObject, StrictUnion } from 'typescript';
 import { RefCallBack, Control as Control$1, ControllerProps as ControllerProps$1 } from 'react-hook-form/dist/types';
 import { IconNames as IconNames$1 } from 'atoms/Icon/Icon';
 import { InputFieldTypes as InputFieldTypes$1, FieldTypes as FieldTypes$1, UIFields as UIFields$2 } from 'fieldsConfiguration/types';
 import { ThemeColors as ThemeColors$2, FontSizesTypes as FontSizesTypes$1, SizesTypes as SizesTypes$2, BreakpointSizesTypes as BreakpointSizesTypes$1 } from 'theme/types';
-import { BaseButtonProps as BaseButtonProps$1, MenuItem as MenuItem$1, HeroImageProps as HeroImageProps$1, ColumnsProps as ColumnsProps$1, EmphasizedTextProps as EmphasizedTextProps$1, TabGroupProps as TabGroupProps$1, AvatarDropdownProps as AvatarDropdownProps$1, ButtonProps as ButtonProps$1, FeedContentHeaderProps as FeedContentHeaderProps$1, AlertProps as AlertProps$1, BottomNaVBarItemProps as BottomNaVBarItemProps$1, InputFieldProps as InputFieldProps$1, SelectFieldProps as SelectFieldProps$1, FieldSectionProps as FieldSectionProps$1, MenuItemsProps as MenuItemsProps$1, ImageProps as ImageProps$1, TextMoleculeProps as TextMoleculeProps$1, RadioButtonFieldProps as RadioButtonFieldProps$1, CheckboxFieldProps as CheckboxFieldProps$1 } from 'molecules';
+import { BaseButtonProps as BaseButtonProps$1, MenuItem as MenuItem$1, HeroImageProps as HeroImageProps$1, ColumnsProps as ColumnsProps$1, EmphasizedTextProps as EmphasizedTextProps$1, TabGroupProps as TabGroupProps$1, AvatarDropdownProps as AvatarDropdownProps$1, ButtonProps as ButtonProps$1, FeedContentHeaderProps as FeedContentHeaderProps$1, AlertProps as AlertProps$1, BottomNaVBarItemProps as BottomNaVBarItemProps$1, InputFieldProps as InputFieldProps$1, SelectFieldProps as SelectFieldProps$1, FieldSectionProps as FieldSectionProps$1, MenuItemsProps as MenuItemsProps$1, ImageProps as ImageProps$1, TextMoleculeProps as TextMoleculeProps$1, AdditionalTabContainerProps as AdditionalTabContainerProps$1, RadioButtonFieldProps as RadioButtonFieldProps$1, CheckboxFieldProps as CheckboxFieldProps$1 } from 'molecules';
 import { TooltipProps as TooltipProps$1 } from 'rc-tooltip/lib/Tooltip';
 import { WithGoogleMapProps } from 'react-google-maps/lib/withGoogleMap';
 import { WithScriptjsProps } from 'react-google-maps/lib/withScriptjs';
@@ -61,8 +61,8 @@ declare type CheckboxInternalConfigProps = Partial<{
     selectedCheckboxIconColor: ThemeColors$1 | string;
     buttonPadding: number;
     textPadding: number;
-    styles: StylesType;
-    wrapperStyles: StylesType;
+    styles: StylesType$1;
+    wrapperStyles: StylesType$1;
     buttonOptionSpacing?: SizesTypes$1;
 }>;
 
@@ -91,8 +91,8 @@ declare type SelectInternalConfigurationOptions = {
     selectedTextFontSize: number;
     verticalPadding: number;
     horizontalPadding: number;
-    wrapperStyles: StylesType;
-    styles: StylesType;
+    wrapperStyles: StylesType$1;
+    styles: StylesType$1;
 };
 declare type SelectProps = Partial<{
     ref: RefCallBack;
@@ -117,8 +117,8 @@ declare type InputFieldInternalConfigProps = Partial<{
     placeholderTextFontSize: number;
     verticalPadding: number;
     horizontalPadding: number;
-    styles: StylesType;
-    wrapperStyles: StylesType;
+    styles: StylesType$1;
+    wrapperStyles: StylesType$1;
 }>;
 declare type InputIconProps = {
     name: IconNames$1;
@@ -148,7 +148,7 @@ declare type TextProps = {
     variant: FontSizesTypes$1;
     layout?: 'div' | 'span';
     type?: TextTypes;
-    styles?: StylesType;
+    styles?: StylesType$1;
     color?: ThemeColors$2 | string;
     numberOfLines?: number;
     textAlign?: TextAlign;
@@ -217,7 +217,7 @@ declare type RegularImageProps = {
     height: number | string;
     onClick: Callback$1;
     cornerRadius: number;
-}> & OverrideStyles;
+}> & OverrideStyles$1;
 declare const RegularImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, {
     src: string;
 } & Partial<{
@@ -226,7 +226,7 @@ declare const RegularImage: styled_components.StyledComponent<"img", styled_comp
     height: number | string;
     onClick: Callback$1;
     cornerRadius: number;
-}> & OverrideStyles, never>;
+}> & OverrideStyles$1, never>;
 declare const BackgroundImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, {
     src: string;
 } & Partial<{
@@ -235,7 +235,7 @@ declare const BackgroundImage: styled_components.StyledComponent<"img", styled_c
     height: number | string;
     onClick: Callback$1;
     cornerRadius: number;
-}> & OverrideStyles, never>;
+}> & OverrideStyles$1, never>;
 
 declare type TextButtonProps = Pick<BaseButtonProps$1, 'disabled' | 'onClick' | 'children' | 'colorTheme' | 'size'> & {
     buttonLink?: string;
@@ -254,9 +254,9 @@ declare type ValidationTagProps = {
 declare const ValidationTag: ({ text, status }: ValidationTagProps) => JSX.Element;
 
 declare type TooltipProps = Pick<TooltipProps$1, 'overlay' | 'placement' | 'trigger' | 'visible' | 'children'> & {
-    styles?: StylesType;
+    styles?: StylesType$1;
 };
-declare const StyleWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles, never>;
+declare const StyleWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles$1, never>;
 declare const Tooltip: ({ trigger, placement, styles, ...props }: TooltipProps) => JSX.Element;
 
 declare type ToastType = 'success' | 'infoTierOne' | 'infoTierTwo' | 'warning' | 'error';
@@ -333,7 +333,7 @@ declare type RichTextEditorProps = Partial<{
     value: string;
     font: FontSizesTypes$2;
     color: ThemeColors$1 | string;
-    textStyles: StylesType;
+    textStyles: StylesType$1;
     numberOfLines?: number;
     extraTextProps?: TextProps$1;
 }>;
@@ -344,10 +344,10 @@ declare type RadioButtonInternalConfigProps = Partial<{
     selectedRadioOptionIndicatorColor: ThemeColors$1 | string;
     buttonPadding: number;
     textPadding: number;
-    styles: StylesType;
-    wrapperStyles: StylesType;
+    styles: StylesType$1;
+    wrapperStyles: StylesType$1;
     buttonOptionSpacing: SizesTypes$1;
-    radioGroupWrapperStyles: StylesType;
+    radioGroupWrapperStyles: StylesType$1;
 }>;
 declare type RadioButtonsProps<T extends string> = Partial<{
     ref: RefCallBack;
@@ -388,7 +388,7 @@ declare const RadioButtons: <T extends string>({ ref, name, value, options, onBl
 }>) => JSX.Element;
 declare const RadioGroupWrapper: styled_components.StyledComponent<typeof RadioGroup, styled_components.DefaultTheme, StyledTransientProps<{
     isRow: boolean;
-}> & OverrideStyles, never>;
+}> & OverrideStyles$1, never>;
 
 declare type CircleType = 'link' | 'message';
 declare type CircleBoxProps = {
@@ -396,6 +396,7 @@ declare type CircleBoxProps = {
     type: CircleType;
 };
 declare const Circle: ({ index, type }: CircleBoxProps) => JSX.Element;
+declare const CirclesWrapper: styled_components.StyledComponent<"span", styled_components.DefaultTheme, {}, never>;
 
 declare type CircularIndicatorProps = {
     active: boolean;
@@ -441,7 +442,7 @@ declare type TabProps<T = string, K = string> = {
     defaultTabTextColor: ThemeColors$1 | string;
     selectedTabTextColor: ThemeColors$1 | string;
     selectedTabIndicatorColor: ThemeColors$1 | string;
-    styles: StylesType;
+    styles: StylesType$1;
 }>;
 declare const ZealTab: <T extends string, K extends string>({ options, onClick, text, tabKey, vertical, onOptionClick, tabTheme, tabFont, tabPadding, selectedTabIndicatorColor, textSize, defaultTabTextColor, ...tabProps }: TabProps<T, K>, ref: React__default.ForwardedRef<TabElement>) => JSX.Element;
 declare const Tab: <T, K>(props: {
@@ -563,7 +564,7 @@ declare type FeedContentProps = {
     showDefaultDocumentStyles?: boolean;
     destinationLink?: string;
     onDestinationHandler?: Callback$1;
-    imageStyles?: StylesType;
+    imageStyles?: StylesType$1;
     videoStyles?: CSSProperties;
     isEnabledFavoriting?: boolean;
     isFavorite?: boolean;
@@ -874,6 +875,9 @@ declare type AnnotationsList = {
     tags: {
         id: string;
         label: string;
+        entityIds: string[];
+        moleculeIds: string[];
+        referencedByIds: string[];
     }[];
     links: {
         referencedById: string;
@@ -914,15 +918,15 @@ declare type LabelInternalConfig = {
     fontWeight: string | number;
     color: ThemeColors$1 | string;
     padding: string;
-    styles: StylesType;
-    wrapperStyles: StylesType;
+    styles: StylesType$1;
+    wrapperStyles: StylesType$1;
 };
 declare type RuleLabelInternalConfig = {
     requiredTextColor: ThemeColors$1 | string;
     optionalTextColor: ThemeColors$1 | string;
     padding: string;
     fontSize: number;
-    styles: StylesType;
+    styles: StylesType$1;
 };
 declare type TooltipInternalConfig = {
     fontVariant: FontSizesTypes$2;
@@ -932,8 +936,8 @@ declare type TooltipInternalConfig = {
     padding: string;
     backgroundColor: ThemeColors$1 | string;
     iconColor: ThemeColors$1 | string;
-    styles: StylesType;
-    wrapperStyles: StylesType;
+    styles: StylesType$1;
+    wrapperStyles: StylesType$1;
 };
 declare type FieldLabelsProps = {
     label?: string;
@@ -956,7 +960,7 @@ declare type InputFieldProps = Partial<{
     optional: boolean;
     defaultValue: string;
     inputProps: InputProps$1;
-    styles: StylesType;
+    styles: StylesType$1;
     labelsProps: FieldLabelsProps;
 }>;
 declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;
@@ -968,13 +972,13 @@ declare type FieldMapperProps<T extends object> = {
     spacer?: number;
     isTooltipVisible?: boolean;
     optionsPresentation?: boolean;
-    styles?: StylesType;
+    styles?: StylesType$1;
 };
 declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, isTooltipVisible, optionsPresentation, styles, }: FieldMapperProps<T>) => JSX.Element | null;
 
 declare type CheckboxesProps = Partial<{
-    checkboxGroupWrapperStyles: StylesType;
-    checkboxFieldWrapperStyles: StylesType;
+    checkboxGroupWrapperStyles: StylesType$1;
+    checkboxFieldWrapperStyles: StylesType$1;
     onChange: (id: string) => void;
     disabled: boolean;
     options?: SelectOption$1[];
@@ -992,7 +996,7 @@ declare type CheckboxFieldProps = Partial<{
     control: Control$1<any>;
     required: boolean;
     optional: boolean;
-    wrapperStyles: StylesType;
+    wrapperStyles: StylesType$1;
 }>;
 declare const CheckboxField: ({ checkboxesProps, name, rules, control, optional, required, labelsProps, wrapperStyles, }: CheckboxFieldProps) => JSX.Element;
 
@@ -1013,7 +1017,7 @@ declare type SelectFieldProps = Partial<{
     required: boolean;
     optional: boolean;
     defaultValue: string;
-    styles: StylesType;
+    styles: StylesType$1;
 }>;
 declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: SelectFieldProps) => JSX.Element;
 
@@ -1108,7 +1112,7 @@ declare const AvatarDropdown: <T extends string | number>({ avatarProps, menuCon
 
 declare type TabType<T = string, K = string> = Pick<TabProps$1<T, K>, 'text' | 'tabKey' | 'disabled' | 'options' | 'divider'>;
 declare type AdditionalTabContainerProps = {
-    containerStyle?: CSSProperties;
+    containerStyle?: StylesType$1;
     containerProps?: Record<string, unknown>;
 };
 declare type TabGroupProps<T = string, K = string> = {
@@ -1116,7 +1120,7 @@ declare type TabGroupProps<T = string, K = string> = {
     activeTabKey: T;
     onTabChange?: (tabKey: T) => void;
     onOptionClick?: (optionKey: K) => void;
-    styles?: StylesType;
+    styles?: StylesType$1;
     vertical?: boolean;
     tabTheme?: TabTheme$1;
     tabFont?: FontSizesTypes$1;
@@ -1157,7 +1161,7 @@ declare const EmphasizedText: ({ textContent, invertColors }: EmphasizedTextProp
 declare type RadioButtonFieldProps<T extends string> = Partial<{
     name: string;
     rules: ControllerProps$1['rules'];
-    styles: StylesType;
+    styles: StylesType$1;
     control: Control$1<any>;
     optional: boolean;
     required: boolean;
@@ -1274,6 +1278,10 @@ declare type ToggleFieldProps = {
 };
 declare const HorizontalButtonsField: ({ name, title, control, description, horizontalButtonsProps, }: ToggleFieldProps) => JSX.Element;
 
+declare type StylesType = ReturnType<ThemedCssFunction<DefaultTheme>>;
+declare type OverrideStyles = {
+    $styles?: StylesType;
+};
 declare type Callback = () => void;
 
 declare type BottomNaVBarItemProps = {
@@ -1307,7 +1315,7 @@ declare type ImageProps = {
     height: number;
     cornerRadius: number;
     behaveAs: 'background' | 'regular';
-    styles: StylesType;
+    styles: StylesType$1;
 }>;
 declare const Image: ({ src, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: ImageProps) => JSX.Element;
 
@@ -1336,7 +1344,7 @@ declare type TextMoleculeProps = Partial<{
     lineHeight: number;
     fontWeight: string | number;
     isRichText: boolean;
-    styles: StylesType;
+    styles: StylesType$1;
     textAlign: 'center' | 'right' | 'left';
 }> & Pick<TextProps$1, 'seoTag' | 'numberOfLines'>;
 declare const TextMolecule: ({ isRichText, variant, text, seoTag, fontVariant, textColor, textSize, fontWeight, lineHeight, letterSpacing, styles, textAlign, ...restOfTextProps }: TextMoleculeProps) => JSX.Element;
@@ -1363,7 +1371,7 @@ declare type BaseButtonProps = PropsWithChildren<{
     inactiveButtonColor?: ThemeColors$1 | string;
     inactiveStrokeColor?: ThemeColors$1 | string;
     inactiveTextColor?: ThemeColors$1 | string;
-    styles?: StylesType;
+    styles?: StylesType$1;
     colorTheme?: 'light' | 'dark';
     href?: string;
     type?: ButtonType;
@@ -1375,18 +1383,20 @@ declare type ButtonProps = BaseButtonProps & {
     elementId?: string;
     loading?: boolean;
     isRichText?: boolean;
-    containerStyle?: StylesType;
-    buttonStyle?: StylesType;
+    containerStyle?: StylesType$1;
+    buttonStyle?: StylesType$1;
 };
 declare const Button: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, textColor, inactiveTextColor, state, href, ...props }: ButtonProps) => JSX.Element | null;
 
-declare type ZealUIModalProps = PropsWithChildren<Pick<ModalProps, 'open' | 'onClose'>> & {
+declare type ZealUIModalProps = PropsWithChildren<Pick<ModalProps, 'open'>> & {
     padding?: number | string;
     wrapperStyles?: CSSProperties;
     onKeyDown?: <T extends HTMLElement>(event: KeyboardEvent<T>) => void;
     modalStyles?: CSSProperties;
+    onClose?: Callback;
 };
-declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, ...rest }: ZealUIModalProps) => JSX.Element;
+declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, onClose, ...rest }: ZealUIModalProps) => JSX.Element;
+declare const ModalWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles, never>;
 
 declare const Container: ({ children, wide, compact, type, props }: ContainerProps$1) => JSX.Element;
 declare const ContainerComponent: ({ type, items, config, tabsProps }: ContainerComponentProps$1) => JSX.Element | null;
@@ -1534,14 +1544,8 @@ interface TabGroupMolecule extends BaseMolecule {
     type: 'header_tab_group';
     config: {
         props: TabGroupProps$1;
-        wide: {
-            containerStyle?: CSSProperties;
-            containerProps?: Record<string, unknown>;
-        };
-        compact: {
-            containerStyle?: CSSProperties;
-            containerProps?: Record<string, unknown>;
-        };
+        wide: AdditionalTabContainerProps$1;
+        compact: AdditionalTabContainerProps$1;
     };
 }
 interface TextInputMolecule extends BaseMolecule {
@@ -1607,7 +1611,7 @@ declare type ContainerPropsType = Partial<{
     position: ContainerPositionType;
     scrollBehaviour: ContainerScrollBehaviourType;
     cornerRadius: number;
-    styles: StylesType;
+    styles: StylesType$1;
     formProps: {
         mode: keyof ValidationMode;
     };
@@ -1655,4 +1659,4 @@ declare const OrganismItem: ({ item, tabsProps, }: {
     tabsProps?: Pick<TabGroupProps$1<string, string>, "tabs" | "activeTabKey" | "onTabChange"> | undefined;
 }) => JSX.Element | null;
 
-export { AcquisitionForm, AcquisitionFormProps, ActionAttributes, ActionTypes, AdditionalContainerProps, Alert, AlertProps, AnnotationsList, ArrowIconWrapper, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, BaseMolecule, Body, BodyProps, BooleanAttributes, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonActionsContext, ButtonActionsContextType, ButtonActionsProvider, ButtonActionsProviderProps, ButtonMolecule, ButtonProps, ButtonType, ButtonVariant, ButtonsWrapper, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, Carousel, CarouselProps, Checkbox, CheckboxField, CheckboxFieldMolecule, CheckboxFieldProps, CheckboxGroup, CheckboxGroupProps, CheckboxProps, CheckboxesProps, Circle, CircleBoxProps, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, Container, ContainerComponent, ContainerComponentProps, ContainerPositionType, ContainerProps, ContainerPropsType, ContainerScrollBehaviourType, ContainerType, ContainerWrapper, ContentStatus, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, ErrorText, FeedContent, FeedContentContainer, FeedContentContainerProps, FeedContentHeader, FeedContentHeaderProps, FeedTemplateKeys, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FileMatrixMessageDTO, FileObjectDTO, FileType, FilteredFeedContentType, FontSizesTypes, FontWeight, Footer, FooterContactInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HeroImageTemplate, HeroSlider, HeroSliderProps, HeroSliderWrapper, HorizontalButtons, HorizontalButtonsField, HorizontalButtonsProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconButton, IconButtonProps, IconNames, IconProps, Image, ImageAttributes, ImageMolecule, ImageProps, Input, InputField, InputFieldInternalConfigProps, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, IterableAttributes, LabelInternalConfig, LinkAttributes, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, Molecule, MoleculeTypes, NavigationDotsWrapper, OrganismItem, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldMolecule, RadioButtonFieldProps, RadioButtonInternalConfigProps, RadioButtons, RadioButtonsProps, RadioGroupWrapper, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, RuleLabelInternalConfig, Select, SelectAttributes, SelectField, SelectFieldMolecule, SelectFieldProps, SelectInternalConfigurationOptions, SelectOption, SelectProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Slide, SlidesWrapper, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupMolecule, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextAttributes, TextButton, TextButtonProps, TextInputMolecule, TextMolecule, TextMoleculeProps, TextMoleculeType, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipInternalConfig, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoAttributes, VideoMolecule, VideoProps, Wrapper, ZealTheme, ZealThemeProvider, ZealUIModal, ZealUIModalProps, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useButtonActionsContext, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };
+export { AcquisitionForm, AcquisitionFormProps, ActionAttributes, ActionTypes, AdditionalContainerProps, AdditionalTabContainerProps, Alert, AlertProps, AnnotationsList, ArrowIconWrapper, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, BaseMolecule, Body, BodyProps, BooleanAttributes, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonActionsContext, ButtonActionsContextType, ButtonActionsProvider, ButtonActionsProviderProps, ButtonMolecule, ButtonProps, ButtonType, ButtonVariant, ButtonsWrapper, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, Carousel, CarouselProps, Checkbox, CheckboxField, CheckboxFieldMolecule, CheckboxFieldProps, CheckboxGroup, CheckboxGroupProps, CheckboxProps, CheckboxesProps, Circle, CircleBoxProps, CirclesWrapper, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, Container, ContainerComponent, ContainerComponentProps, ContainerPositionType, ContainerProps, ContainerPropsType, ContainerScrollBehaviourType, ContainerType, ContainerWrapper, ContentStatus, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, ErrorText, FeedContent, FeedContentContainer, FeedContentContainerProps, FeedContentHeader, FeedContentHeaderProps, FeedTemplateKeys, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FileMatrixMessageDTO, FileObjectDTO, FileType, FilteredFeedContentType, FontSizesTypes, FontWeight, Footer, FooterContactInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HeroImageTemplate, HeroSlider, HeroSliderProps, HeroSliderWrapper, HorizontalButtons, HorizontalButtonsField, HorizontalButtonsProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconButton, IconButtonProps, IconNames, IconProps, Image, ImageAttributes, ImageMolecule, ImageProps, Input, InputField, InputFieldInternalConfigProps, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, IterableAttributes, LabelInternalConfig, LinkAttributes, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, ModalWrapper, Molecule, MoleculeTypes, NavigationDotsWrapper, OrganismItem, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldMolecule, RadioButtonFieldProps, RadioButtonInternalConfigProps, RadioButtons, RadioButtonsProps, RadioGroupWrapper, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, RuleLabelInternalConfig, Select, SelectAttributes, SelectField, SelectFieldMolecule, SelectFieldProps, SelectInternalConfigurationOptions, SelectOption, SelectProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Slide, SlidesWrapper, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupMolecule, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextAttributes, TextButton, TextButtonProps, TextInputMolecule, TextMolecule, TextMoleculeProps, TextMoleculeType, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipInternalConfig, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoAttributes, VideoMolecule, VideoProps, Wrapper, ZealTheme, ZealThemeProvider, ZealUIModal, ZealUIModalProps, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useButtonActionsContext, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zealicsolutions/web-ui",
-  "version": "0.2.103",
+  "version": "0.2.105",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"

package/dist/cjs/src/molecules/ZealUIModal/styles.d.ts

@@ -1,2 +0,0 @@
-import { SxProps, Theme } from '@mui/material';
-export declare const boxStyles: SxProps<Theme>;

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

@@ -1,2 +0,0 @@
-import { SxProps, Theme } from '@mui/material';
-export declare const boxStyles: SxProps<Theme>;