@zealicsolutions/web-ui 0.2.85 → 0.2.87

package/dist/esm/src/atoms/Buttons/{Button.stories.d.ts → Buttons.stories.d.ts}

@@ -1,15 +1,16 @@
 import type { ComponentStory } from '@storybook/react';
 import { TextButtonProps } from 'atoms/Buttons/TextButton';
 import { FC } from 'react';
-import { Button as ButtonComponent } from './Button';
 import { IconButton as IconButtonComponent } from './IconButton';
 import { TouchableOpacityProps } from './TouchableOpacity';
 declare const _default: {
     title: string;
-    component: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, ...props }: import("./Button").ButtonProps) => JSX.Element | null;
+    component: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Pick<import("../..").BaseButtonProps, "children" | "onClick" | "disabled" | "size" | "colorTheme"> & {
+        buttonLink?: string | undefined;
+        elementId?: string | undefined;
+    }, never>;
 };
 export default _default;
-export declare const Button: ComponentStory<typeof ButtonComponent>;
 export declare const TouchableOpacity: ComponentStory<FC<TouchableOpacityProps>>;
 export declare const TextButton: ComponentStory<FC<TextButtonProps>>;
 export declare const IconButton: ComponentStory<typeof IconButtonComponent>;

package/dist/esm/src/atoms/Buttons/TextButton.d.ts

@@ -1,4 +1,4 @@
-import { BaseButtonProps } from './Button';
+import { BaseButtonProps } from 'molecules';
 export declare type TextButtonProps = Pick<BaseButtonProps, 'disabled' | 'onClick' | 'children' | 'colorTheme' | 'size'> & {
     buttonLink?: string;
     elementId?: string;

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

@@ -1,7 +1,18 @@
 import type { IconNames } from 'atoms/Icon/Icon';
 import { InputFieldTypes } from 'fieldsConfiguration/types';
 import React from 'react';
-import type { Callback } from 'typescript';
+import { ThemeColors } from 'theme/types';
+import type { Callback, StylesType } from 'typescript';
+export declare type InputFieldInternalConfigProps = {
+    textColor: ThemeColors | string;
+    textFontSize: number;
+    placeholderTextColor: ThemeColors | string;
+    placeholderTextFontSize: number;
+    verticalPadding: number;
+    horizontalPadding: number;
+    styles: StylesType;
+    wrapperStyles: StylesType;
+};
 export declare type InputIconProps = {
     name: IconNames;
     onClick?: Callback;
@@ -19,5 +30,6 @@ export declare type InputProps = {
     maxLength?: number;
     onChange?: (value: string) => void;
     onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    internalConfig?: InputFieldInternalConfigProps;
 };
-export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, ...rest }: InputProps) => JSX.Element;
+export declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;

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

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import type { ComponentStory } from '@storybook/react';
-import { Input as InputComponent } from './Input';
+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, ...rest }: import("./Input").InputProps) => JSX.Element;
+    component: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled, isError, placeholder, isEditMode, type, internalConfig, ...rest }: InputProps) => JSX.Element;
 };
 export default _default;
-export declare const Input: ComponentStory<typeof InputComponent>;
+export declare const Input: StoryFn<InputProps>;

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

@@ -1,32 +1,29 @@
-import { CSSProperties } from 'styled-components';
 import type { Callback } from 'typescript';
+import { OverrideStyles } from 'typescript';
 export declare type RegularImageProps = {
     src: string;
 } & Partial<{
     alt: string;
-    style: CSSProperties;
     width: number | string;
     height: number | string;
     onClick: Callback;
     cornerRadius: number;
-}>;
+}> & OverrideStyles;
 export declare const RegularImage: import("styled-components").StyledComponent<"img", import("styled-components").DefaultTheme, {
     src: string;
 } & Partial<{
     alt: string;
-    style: CSSProperties;
     width: number | string;
     height: number | string;
     onClick: Callback;
     cornerRadius: number;
-}>, never>;
+}> & OverrideStyles, never>;
 export declare const BackgroundImage: import("styled-components").StyledComponent<"img", import("styled-components").DefaultTheme, {
     src: string;
 } & Partial<{
     alt: string;
-    style: CSSProperties;
     width: number | string;
     height: number | string;
     onClick: Callback;
     cornerRadius: number;
-}>, never>;
+}> & OverrideStyles, never>;

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

@@ -6,12 +6,11 @@ declare const _default: {
         src: string;
     } & Partial<{
         alt: string;
-        style: import("styled-components").CSSProperties;
         width: string | number;
         height: string | number;
         onClick: import("../../typescript").Callback;
         cornerRadius: number;
-    }>, never>;
+    }> & import("../../typescript").OverrideStyles, never>;
 };
 export default _default;
 export declare const RegularImage: ComponentStory<typeof RegularImageComponent>;

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

@@ -10,7 +10,7 @@ export declare const COMMUNICATION_LINK_DATA_TEXT = "communication-link-text";
 export declare type RichTextEditorProps = Partial<{
     value: string;
     font: FontSizesTypes;
-    color: ThemeColors;
+    color: ThemeColors | string;
     textStyles: StylesType;
     numberOfLines?: number;
     extraTextProps?: TextProps;

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

@@ -1,6 +1,9 @@
 /// <reference types="react" />
 import { TooltipProps as TooltipComponentProps } from 'rc-tooltip/lib/Tooltip';
+import { OverrideStyles, StylesType } from 'typescript';
 import 'rc-tooltip/assets/bootstrap.css';
-export declare type TooltipProps = Pick<TooltipComponentProps, 'overlay' | 'placement' | 'trigger' | 'visible' | 'children'>;
-export declare const StyleWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const Tooltip: ({ trigger, placement, ...props }: TooltipProps) => JSX.Element;
+export declare type TooltipProps = Pick<TooltipComponentProps, 'overlay' | 'placement' | 'trigger' | 'visible' | 'children'> & {
+    styles?: StylesType;
+};
+export declare const StyleWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, OverrideStyles, never>;
+export declare const Tooltip: ({ trigger, placement, styles, ...props }: TooltipProps) => JSX.Element;

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

@@ -3,7 +3,7 @@ import { FC } from 'react';
 import { TooltipProps } from './Tooltip';
 declare const _default: {
     title: string;
-    component: ({ trigger, placement, ...props }: TooltipProps) => JSX.Element;
+    component: ({ trigger, placement, styles, ...props }: TooltipProps) => JSX.Element;
 };
 export default _default;
 export declare const Tooltip: ComponentStory<FC<TooltipProps>>;

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

@@ -1,4 +1,3 @@
-export * from './Buttons/Button';
 export * from './Buttons/TouchableOpacity';
 export * from './Checkbox/Checkbox';
 export * from './Select/Select';

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Molecule } from 'containers/types/moleculeTypes';
+import { Molecule } from 'containers';
 import { TabGroupProps } from 'molecules';
 export declare const getFullLink: (url: string) => string;
 export declare const navigateToPage: (url: string) => void;

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

@@ -1,9 +1,8 @@
-import type { Nullable, StrictUnion } from 'typescript';
-import { ButtonProps } from 'atoms';
 import { SelectOption } from 'atoms/Select/types';
-import { ImageProps, TabGroupProps } from 'molecules';
+import { ButtonProps, ImageProps, TabGroupProps } from 'molecules';
 import { CSSProperties } from 'styled-components';
 import { FontSizesTypes, ThemeColors } from 'theme';
+import type { Nullable, StrictUnion } from 'typescript';
 export declare type ImageAttributes = {
     attributeType: 'image';
     imageSource: string;
@@ -51,7 +50,7 @@ export interface ImageMolecule extends BaseMolecule {
         props: Omit<ImageProps, 'src' | 'link' | 'altText'>;
     };
 }
-export interface TextMolecule extends BaseMolecule {
+export interface TextMoleculeType extends BaseMolecule {
     type: 'text';
     attributes: {
         text: TextAttributes;
@@ -109,4 +108,4 @@ export interface TabGroupMolecule extends BaseMolecule {
         };
     };
 }
-export declare type Molecule = StrictUnion<ImageMolecule | TextMolecule | ButtonMolecule | VideoMolecule | TabGroupMolecule>;
+export declare type Molecule = StrictUnion<ImageMolecule | TextMoleculeType | ButtonMolecule | VideoMolecule | TabGroupMolecule>;

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

@@ -1,7 +1,9 @@
 /// <reference types="react" />
+import { InputProps } from 'atoms';
 import { SelectOption } from 'atoms/Select/types';
+import { FieldLabelsProps } from 'molecules';
 import { ControllerProps } from 'react-hook-form';
-export declare type InputFieldTypes = 'number' | 'text' | 'email' | 'password';
+export declare type InputFieldTypes = 'phoneNumber' | 'text' | 'email' | 'password' | 'number' | 'any';
 export declare type FieldTypes = 'input' | 'select' | 'checkbox';
 export declare type UIField<T = string> = (UIInputField & UISelectField & UICheckboxField) & {
     name: T;
@@ -10,7 +12,6 @@ export declare type UIField<T = string> = (UIInputField & UISelectField & UIChec
     label?: string;
     placeholder?: string;
     required?: boolean;
-    optional?: boolean;
     tooltip?: string;
     rules?: ControllerProps['rules'];
     order?: number;
@@ -19,6 +20,8 @@ export declare type UIInputField = {
     inputType?: InputFieldTypes;
     maxLength?: number;
     onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    inputProps?: InputProps;
+    labelsProps?: FieldLabelsProps;
 };
 export declare type UISelectField = {
     options?: SelectOption[];

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

@@ -2,5 +2,7 @@ import { InputFieldTypes } from 'fieldsConfiguration';
 import { ValidationRule } from 'react-hook-form';
 export declare const urlPattern: RegExp;
 export declare const phoneNumberValidation: RegExp;
+export declare const numberValidation: RegExp;
 export declare const emailValidation: RegExp;
+export declare const textValidation: RegExp;
 export declare const getInputValidation: (type?: InputFieldTypes) => ValidationRule<RegExp> | undefined;

package/dist/esm/src/index.d.ts

@@ -1,10 +1,10 @@
 export * from './atoms';
-export * from './molecules';
 export * from './organisms';
 export * from './templates';
 export * from './hooks';
 export * from './theme';
 export * from './fieldsConfiguration';
 export * from './contexts';
-export * from './containers';
 export * from 'helpers/constants';
+export * from './molecules';
+export * from './containers';

package/dist/esm/src/{atoms/Buttons → molecules/Button}/Button.d.ts

@@ -22,6 +22,7 @@ export declare type BaseButtonProps = PropsWithChildren<{
     hoverStrokeColor?: ThemeColors | string;
     inactiveButtonColor?: ThemeColors | string;
     inactiveStrokeColor?: ThemeColors | string;
+    inactiveTextColor?: ThemeColors | string;
     styles?: StylesType;
     colorTheme?: 'light' | 'dark';
     href?: string;
@@ -36,4 +37,4 @@ export declare type ButtonProps = BaseButtonProps & {
     containerStyle?: CSSProperties;
     buttonStyle?: CSSProperties;
 };
-export declare const Button: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, ...props }: ButtonProps) => JSX.Element | null;
+export declare const Button: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, textColor, inactiveTextColor, ...props }: ButtonProps) => JSX.Element | null;

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

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

package/dist/esm/src/molecules/Columns/Column.d.ts

@@ -6,9 +6,8 @@ export declare const ColumnImage: import("styled-components").StyledComponent<"i
     src: string;
 } & Partial<{
     alt: string;
-    style: import("styled-components").CSSProperties;
     width: string | number;
     height: string | number;
     onClick: import("../../typescript").Callback;
     cornerRadius: number;
-}>, never>;
+}> & import("../../typescript").OverrideStyles, never>;

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

@@ -2,7 +2,7 @@ export declare const ColumnWrapper: import("styled-components").StyledComponent<
     isMobile: boolean;
 }, never>;
 export declare const InfoWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const Link: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Pick<import("atoms").BaseButtonProps, "children" | "onClick" | "disabled" | "size" | "colorTheme"> & {
+export declare const Link: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Pick<import("..").BaseButtonProps, "children" | "onClick" | "disabled" | "size" | "colorTheme"> & {
     buttonLink?: string | undefined;
     elementId?: string | undefined;
 }, never>;
@@ -16,10 +16,9 @@ export declare const ColumnBackgroundImage: import("styled-components").StyledCo
     src: string;
 } & Partial<{
     alt: string;
-    style: import("styled-components").CSSProperties;
     width: string | number;
     height: string | number;
     onClick: import("../../typescript").Callback;
     cornerRadius: number;
-}>, never>;
+}> & import("../../typescript").OverrideStyles, never>;
 export declare const ColumnBackgroundImageOverlay: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

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

@@ -1,10 +1,42 @@
 /// <reference types="react" />
+import { StylesType } from 'typescript';
+import { ThemeColors, FontSizesTypes } from 'theme';
 export declare type FieldRuleLabelTypes = 'OPTIONAL' | 'REQUIRED';
+export declare type LabelInternalConfig = {
+    fontVariant: FontSizesTypes;
+    fontSize: number;
+    fontWeight: string | number;
+    color: ThemeColors | string;
+    padding: string;
+    styles: StylesType;
+    wrapperStyles: StylesType;
+};
+export declare type RuleLabelInternalConfig = {
+    requiredTextColor: ThemeColors | string;
+    optionalTextColor: ThemeColors | string;
+    padding: string;
+    fontSize: number;
+    styles: StylesType;
+};
+export declare type TooltipInternalConfig = {
+    fontVariant: FontSizesTypes;
+    fontSize: number;
+    fontWeight: string | number;
+    color: ThemeColors | string;
+    padding: string;
+    backgroundColor: ThemeColors | string;
+    iconColor: ThemeColors | string;
+    styles: StylesType;
+    wrapperStyles: StylesType;
+};
 export declare type FieldLabelsProps = {
     label: string;
     tooltipText?: string;
     isError?: boolean;
     isTooltipVisible?: boolean;
     ruleLabel?: FieldRuleLabelTypes;
+    labelInternalConfig?: LabelInternalConfig;
+    ruleLabelInternalConfig?: RuleLabelInternalConfig;
+    tooltipInternalConfig?: TooltipInternalConfig;
 };
-export declare const FieldLabels: ({ label, isTooltipVisible, isError, ruleLabel, tooltipText, }: FieldLabelsProps) => JSX.Element;
+export declare const FieldLabels: ({ label, isTooltipVisible, isError, ruleLabel, tooltipText, labelInternalConfig, ruleLabelInternalConfig, tooltipInternalConfig, }: FieldLabelsProps) => JSX.Element;

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

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import type { ComponentStory } from '@storybook/react';
-import { FieldLabels as FieldLabelsComponent } from './FieldLabels';
+import { StoryFn } from '@storybook/react';
+import { FieldLabelsProps } from './FieldLabels';
 declare const _default: {
     title: string;
-    component: ({ label, isTooltipVisible, isError, ruleLabel, tooltipText, }: import("./FieldLabels").FieldLabelsProps) => JSX.Element;
+    component: ({ label, isTooltipVisible, isError, ruleLabel, tooltipText, labelInternalConfig, ruleLabelInternalConfig, tooltipInternalConfig, }: FieldLabelsProps) => JSX.Element;
 };
 export default _default;
-export declare const FieldLabels: ComponentStory<typeof FieldLabelsComponent>;
+export declare const FieldLabels: StoryFn<FieldLabelsProps>;

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

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { UIField } from 'fieldsConfiguration';
 import { Control } from 'react-hook-form/dist/types';
-import { UIField } from '../../fieldsConfiguration';
+import { StylesType } from 'typescript';
 export declare type FieldMapperProps<T extends object> = {
     field: UIField<keyof T>;
     isEditMode?: boolean;
@@ -8,6 +9,6 @@ export declare type FieldMapperProps<T extends object> = {
     spacer?: number;
     isTooltipVisible?: boolean;
     optionsPresentation?: boolean;
-    styles?: React.CSSProperties;
+    styles?: StylesType;
 };
 export declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, isTooltipVisible, optionsPresentation, styles, }: FieldMapperProps<T>) => JSX.Element | null;

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

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import { ButtonProps, RegularImageProps } from 'atoms';
+import { RegularImageProps } from 'atoms';
+import { ButtonProps } from 'molecules';
 export declare type HeroImageAlignment = 'left_aligned' | 'center_aligned';
 export declare type HeroImageTemplate = 'card' | 'full_width';
 export declare type HeroImageProps = {

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

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

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { InputProps } from 'atoms';
 import { Control, ControllerProps } from 'react-hook-form/dist/types';
-import { CSSProperties } from 'styled-components';
+import { StylesType } from 'typescript';
 import { FieldLabelsProps } from '../FieldLabels/FieldLabels';
 export declare type InputFieldProps = {
     name: string;
@@ -11,7 +11,7 @@ export declare type InputFieldProps = {
     optional?: boolean;
     defaultValue?: string;
     inputProps: InputProps;
-    styles?: CSSProperties;
+    styles?: StylesType;
     labelsProps?: FieldLabelsProps;
 };
 export declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;

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

@@ -1,10 +1,9 @@
 /// <reference types="react" />
-import type { ComponentStory } from '@storybook/react';
-import { InputField as InputFieldComponent } from './InputField';
+import { StoryFn } from '@storybook/react';
+import { InputFieldProps } from './InputField';
 declare const _default: {
     title: string;
-    component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: import("./InputField").InputFieldProps) => JSX.Element;
+    component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;
 };
 export default _default;
-export declare const InputField: ComponentStory<typeof InputFieldComponent>;
-export declare const InputPasswordField: ComponentStory<typeof InputFieldComponent>;
+export declare const InputField: StoryFn<InputFieldProps>;

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

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import { Control, ControllerProps } from 'react-hook-form/dist/types';
-import { CSSProperties } from 'styled-components';
 import { SelectProps } from '../../atoms/Select/types';
 import { FieldLabelsProps } from '../FieldLabels/FieldLabels';
+import { StylesType } from 'typescript';
 export declare type SelectFieldProps = {
     selectProps: SelectProps;
     labelsProps?: FieldLabelsProps;
@@ -12,6 +12,6 @@ export declare type SelectFieldProps = {
     required?: boolean;
     optional?: boolean;
     defaultValue?: string;
-    styles?: CSSProperties;
+    styles?: StylesType;
 };
 export declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: SelectFieldProps) => JSX.Element;

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

@@ -10,7 +10,7 @@ export declare type TextMoleculeProps = Partial<{
     textColor: ThemeColors | string;
     letterSpacing: number;
     lineHeight: number;
-    fontWeight: number;
+    fontWeight: string | number;
     isRichText: boolean;
     styles: StylesType;
     textAlign: 'center' | 'right' | 'left';

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

@@ -25,3 +25,4 @@ export * from './Video/Video';
 export * from './Image/Image';
 export * from './Caruser/Carousel';
 export * from './TextMolecule/TextMolecule';
+export * from './Button/Button';

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

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import { ButtonProps, RadioButtonsProps } from 'atoms';
+import { RadioButtonsProps } from 'atoms';
+import { ButtonProps } from 'molecules';
 export declare type ButtonCaptureProps = {
     type: 'button';
     acceptButton: ButtonProps;

package/dist/esm/src/organisms/FeedContent/types.d.ts

@@ -1,6 +1,6 @@
 import { FilteredFeedContentType } from 'organisms';
 import { CSSProperties } from 'styled-components';
-import { Callback, Nullable } from 'typescript';
+import { Callback, Nullable, StylesType } from 'typescript';
 export declare type FeedContentTemplateTypes = 'full_width_content' | 'standard_content' | 'auto_play' | '';
 export declare type FeedContentProps = {
     feedContentType: Omit<FilteredFeedContentType, 'all'>;
@@ -26,7 +26,7 @@ export declare type FeedContentProps = {
     showDefaultDocumentStyles?: boolean;
     destinationLink?: string;
     onDestinationHandler?: Callback;
-    imageStyles?: CSSProperties;
+    imageStyles?: StylesType;
     videoStyles?: CSSProperties;
     isEnabledFavoriting?: boolean;
     isFavorite?: boolean;

package/dist/esm/src/organisms/Footer/Footer.stories.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { ComponentStory } from '@storybook/react';
+import { StoryFn } from '@storybook/react';
 import { Footer as FooterComponent } from './Footer';
 declare const _default: {
     title: string;
     component: (props: import("./Footer").FooterProps) => JSX.Element;
 };
 export default _default;
-export declare const Footer: ComponentStory<typeof FooterComponent>;
+export declare const Footer: StoryFn<typeof FooterComponent>;

package/dist/esm/src/organisms/Footer/styles.d.ts

@@ -5,12 +5,11 @@ export declare const FooterImage: import("styled-components").StyledComponent<"i
     src: string;
 } & Partial<{
     alt: string;
-    style: import("styled-components").CSSProperties;
     width: string | number;
     height: string | number;
     onClick: import("../../typescript").Callback;
     cornerRadius: number;
-}>, never>;
+}> & import("../../typescript").OverrideStyles, never>;
 export declare const ContactInfoWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const FooterContentWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     isMobile?: boolean | undefined;

package/dist/esm/src/organisms/Header/Header.stories.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { ComponentStory } from '@storybook/react';
+import { StoryFn } from '@storybook/react';
 import { Header as HeaderComponent } from 'organisms/Header/Header';
 declare const _default: {
     title: string;
     component: <T extends string | number>(props: import("organisms/Header/Header").HeaderProps<T>) => JSX.Element;
 };
 export default _default;
-export declare const Header: ComponentStory<typeof HeaderComponent>;
+export declare const Header: StoryFn<typeof HeaderComponent>;

package/dist/esm/src/organisms/LoginForm/LoginForm.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
+import { UIFields } from 'fieldsConfiguration';
 import { ConsentProps } from 'organisms/Consent/Consent';
 import type { Callback } from 'typescript';
-import { UIFields } from 'fieldsConfiguration';
 import { TwoFactorAuthProps } from '../TwoFactorAuth/TwoFactorAuth';
 import { LoginFields } from './types';
 export declare type LoginFormProps = {

package/dist/esm/src/organisms/ProfileInformation/ProfileInformation.d.ts

@@ -1,5 +1,4 @@
-import { AvatarProps } from 'atoms';
-import { TabProps } from 'molecules';
+import { AvatarProps, TabProps } from 'atoms';
 import { ReactNode } from 'react';
 import type { Callback } from 'typescript';
 export declare type ProfileInformationProps<TabKeys extends string> = {

package/dist/esm/src/organisms/SetPasswordForm/SetPasswordForm.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
+import { UIFields } from 'fieldsConfiguration';
 import { MaxRuleValidation, MinRuleValidation, SetPasswordFields } from 'organisms/SetPasswordForm/types';
-import { UIFields } from '../../fieldsConfiguration';
 export declare type SetPasswordRuleValidation = {
     label: string;
     rule: MaxRuleValidation | MinRuleValidation;

package/dist/esm/src/typescript.d.ts

@@ -1,5 +1,8 @@
 import { DefaultTheme, ThemedCssFunction } from 'styled-components';
 export declare type StylesType = ReturnType<ThemedCssFunction<DefaultTheme>>;
+export declare type OverrideStyles = {
+    $styles?: StylesType;
+};
 export declare type Callback = () => void;
 export declare type Nullable<T> = T | null;
 declare type UnionKeys<T> = T extends any ? keyof T : never;