react-restyle-components 0.4.12 → 0.4.14

package/lib/src/core-components/src/components/Avatar/Avatar.js

@@ -147,7 +147,7 @@ const getContrastColor = (backgroundColor) => {
     return darkColors.includes(backgroundColor) ? '#ffffff' : '#ffffff';
 };
 // Main Avatar component
-export const Avatar = ({ name = '', initials, src, alt, size = 'md', backgroundColor, textColor, iconName = 'FaUser', className, onClick, }) => {
+export const Avatar = ({ name = '', initials, src, alt, size = 'md', backgroundColor, textColor, iconName = 'FaUser', className, classNames = {}, styles = {}, onClick, }) => {
     // Determine what to display
     const displayInitials = initials || getInitials(name);
     const defaultBgColor = backgroundColor ||
@@ -155,14 +155,14 @@ export const Avatar = ({ name = '', initials, src, alt, size = 'md', backgroundC
     const defaultTextColor = textColor || getContrastColor(defaultBgColor);
     // Render image if src is provided
     if (src) {
-        return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: className, onClick: onClick, title: name || alt, children: _jsx(AvatarImage, { src: src, alt: alt || name || 'Avatar' }) }));
+        return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: `${className || ''} ${classNames.container || ''}`, style: styles.container, onClick: onClick, title: name || alt, children: _jsx(AvatarImage, { src: src, alt: alt || name || 'Avatar', className: classNames.image, style: styles.image }) }));
     }
     // Render initials if name or initials are provided
     if (displayInitials) {
-        return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: className, onClick: onClick, title: name || `${displayInitials} Avatar`, children: _jsx(InitialsText, { "$size": size, children: displayInitials }) }));
+        return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: `${className || ''} ${classNames.container || ''}`, style: styles.container, onClick: onClick, title: name || `${displayInitials} Avatar`, children: _jsx(InitialsText, { "$size": size, className: classNames.initials, style: styles.initials, children: displayInitials }) }));
     }
     // Render icon as fallback
-    return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: className, onClick: onClick, title: "User Avatar", children: _jsx(IconWrapper, { "$size": size, children: _jsx(Icon, { nameIcon: iconName, propsIcon: {
+    return (_jsx(AvatarContainer, { "$size": size, "$backgroundColor": defaultBgColor, "$textColor": defaultTextColor, "$clickable": !!onClick, className: `${className || ''} ${classNames.container || ''}`, style: styles.container, onClick: onClick, title: "User Avatar", children: _jsx(IconWrapper, { "$size": size, className: classNames.iconWrapper, style: styles.iconWrapper, children: _jsx(Icon, { nameIcon: iconName, propsIcon: {
                     color: defaultTextColor,
                     size: '100%',
                 } }) }) }));

package/lib/src/core-components/src/components/Badge/Badge.d.ts

@@ -1,9 +1,23 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import { BadgeProps } from './types';
-export declare const Badge: React.NamedExoticComponent<Omit<BadgeProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+export interface BadgeClassNames {
+    /** Custom className for the badge container */
+    container?: string;
+}
+export interface BadgeStyles {
+    /** Custom style for the badge container */
+    container?: CSSProperties;
+}
+export declare const Badge: React.NamedExoticComponent<Omit<BadgeProps & {
+    classNames?: BadgeClassNames | undefined;
+    styles?: BadgeStyles | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }> & {
-    readonly type: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLDivElement>>;
+    readonly type: React.ForwardRefExoticComponent<BadgeProps & {
+        classNames?: BadgeClassNames | undefined;
+        styles?: BadgeStyles | undefined;
+    } & React.RefAttributes<HTMLDivElement>>;
 } & {
     Inline: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
         children?: React.ReactNode;

package/lib/src/core-components/src/components/Badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AAqDnC,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEhB,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAgB,aAAa,EAAC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AAKnC,MAAM,WAAW,eAAe;IAC9B,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,WAAW;IAC1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,aAAa,CAAC;CAC3B;AAoDD,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEhB,CAAC"}

package/lib/src/core-components/src/components/Badge/Badge.js

@@ -9,7 +9,7 @@ const BadgeContainer = styled.div `
   width: min-content;
   display: inline-block;
 `;
-const BadgeComponent = React.forwardRef(({ size = 'hint', overlap = 'circular', children, position = 'bottom-right', variant = 'notification', iconSrc, count, 'aria-label': ariaLabel, ...props }, ref) => {
+const BadgeComponent = React.forwardRef(({ size = 'hint', overlap = 'circular', children, position = 'bottom-right', variant = 'notification', iconSrc, count, 'aria-label': ariaLabel, classNames = {}, styles = {}, ...props }, ref) => {
     // Generate accessible label for the badge
     const badgeAriaLabel = useMemo(() => {
         if (ariaLabel)
@@ -20,7 +20,7 @@ const BadgeComponent = React.forwardRef(({ size = 'hint', overlap = 'circular',
             return `${count} notifications`;
         return undefined;
     }, [ariaLabel, count]);
-    return (_jsxs(BadgeContainer, { ref: ref, "data-aui": "badge", ...props, children: [_jsx(InnerBadge, { position: position, size: size, overlap: overlap, variant: variant, iconSrc: iconSrc, count: count, "aria-label": badgeAriaLabel }), children] }));
+    return (_jsxs(BadgeContainer, { ref: ref, "data-aui": "badge", className: classNames.container, style: styles.container, ...props, children: [_jsx(InnerBadge, { position: position, size: size, overlap: overlap, variant: variant, iconSrc: iconSrc, count: count, "aria-label": badgeAriaLabel }), children] }));
 });
 BadgeComponent.displayName = 'Badge';
 export const Badge = attachSubComponents('Badge', memo(BadgeComponent), {

package/lib/src/core-components/src/components/Button1/button.component.d.ts

@@ -1,4 +1,15 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import { ButtonProps } from './types';
-export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
+export interface ButtonClassNames {
+    /** Custom className for the button element */
+    button?: string;
+}
+export interface ButtonStyles {
+    /** Custom style for the button element */
+    button?: CSSProperties;
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    classNames?: ButtonClassNames | undefined;
+    styles?: ButtonStyles | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=button.component.d.ts.map

package/lib/src/core-components/src/components/Button1/button.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Button1/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAKpC,eAAO,MAAM,MAAM,uIA0DlB,CAAC"}
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Button1/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAKpC,MAAM,WAAW,gBAAgB;IAC/B,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,YAAY;IAC3B,0CAA0C;IAC1C,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB;AAED,eAAO,MAAM,MAAM;;;2CAiElB,CAAC"}

package/lib/src/core-components/src/components/Button1/button.component.js

@@ -3,11 +3,11 @@ import { forwardRef } from 'react';
 import { Tooltip } from '../Tooltip/tooltip.component';
 import s from '../../tc.module.css';
 import { cn } from '../../utils';
-export const Button = forwardRef(({ variant = 'solid', tooltip, disabled = false, type = 'button', className, children, ...args }, ref) => {
+export const Button = forwardRef(({ variant = 'solid', tooltip, disabled = false, type = 'button', className, classNames = {}, styles = {}, children, ...args }, ref) => {
     const buttonColorClass = variant === 'solid'
         ? cn(s['text-white'], s['bg-[#007BFF]'], s['hover:bg-[#007BFF]'], s['hover:shadow-lg'], s['text-white'])
         : cn(s['dark:text-white'], s['text-black'], s['border'], s['border-gray-400'], s['hover:shadow-lg']);
-    const button = (_jsx("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], buttonColorClass, className), type: type, disabled: disabled, children: children }));
+    const button = (_jsx("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], buttonColorClass, className, classNames.button), style: styles.button, type: type, disabled: disabled, children: children }));
     if (tooltip) {
         return _jsx(Tooltip, { content: tooltip, children: button });
     }

package/lib/src/core-components/src/components/Button1/buttonGroup/buttonGroup.component.d.ts

@@ -1,7 +1,21 @@
+import { CSSProperties } from 'react';
 import { ReactNode } from 'react';
-export declare const ButtonGroup: ({ children, orientation, className, }: {
+export interface ButtonGroupClassNames {
+    /** Custom className for the container */
+    container?: string;
+}
+export interface ButtonGroupStyles {
+    /** Custom style for the container */
+    container?: CSSProperties;
+}
+export interface ButtonGroupProps {
     children: ReactNode;
-    orientation?: "horizontal" | "vertical" | undefined;
-    className?: string | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
+    orientation?: 'horizontal' | 'vertical';
+    className?: string;
+    /** Custom classNames for component parts */
+    classNames?: ButtonGroupClassNames;
+    /** Custom inline styles for component parts */
+    styles?: ButtonGroupStyles;
+}
+export declare const ButtonGroup: ({ children, orientation, className, classNames, styles, }: ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=buttonGroup.component.d.ts.map

package/lib/src/core-components/src/components/Button1/buttonGroup/buttonGroup.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Button1/buttonGroup/buttonGroup.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIhC,eAAO,MAAM,WAAW;cAKZ,SAAS;;;6CAepB,CAAC"}
+{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Button1/buttonGroup/buttonGroup.component.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIhC,MAAM,WAAW,qBAAqB;IACpC,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,iBAAiB;IAChC,qCAAqC;IACrC,SAAS,CAAC,EAAE,aAAa,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,+CAA+C;IAC/C,MAAM,CAAC,EAAE,iBAAiB,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW,8DAMrB,gBAAgB,4CAclB,CAAC"}

package/lib/src/core-components/src/components/Button1/buttonGroup/buttonGroup.component.js

@@ -1,4 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import s from '../../../tc.module.css';
 import { cn } from '../../../utils';
-export const ButtonGroup = ({ children, orientation = 'horizontal', className, }) => (_jsx("div", { className: cn(s.flex, orientation == 'horizontal' ? s['flex-row'] : s['flex-col'], s['w-fit'], s['gap-2'], className), children: children }));
+export const ButtonGroup = ({ children, orientation = 'horizontal', className, classNames = {}, styles = {}, }) => (_jsx("div", { className: cn(s.flex, orientation == 'horizontal' ? s['flex-row'] : s['flex-col'], s['w-fit'], s['gap-2'], className, classNames.container), style: styles.container, children: children }));

package/lib/src/core-components/src/components/Icon/Icon.d.ts

@@ -1,29 +1,44 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import { IconBaseProps } from 'react-icons/lib';
+export interface IconClassNames {
+    /** Custom className for the container wrapper */
+    container?: string;
+    /** Custom className for the icon element */
+    icon?: string;
+}
+export interface IconStyles {
+    /** Custom style for the container wrapper */
+    container?: CSSProperties;
+    /** Custom style for the icon element */
+    icon?: CSSProperties;
+}
 export interface IconProps {
+    /** Name of the icon from react-icons library (e.g., 'FaHeart', 'MdSettings') */
     nameIcon: string;
+    /** Props to pass to the underlying react-icon component */
     propsIcon?: IconBaseProps;
+    /** Additional className for the container */
     className?: string;
+    /** Tooltip text to display on hover */
     tooltip?: string;
+    /** Whether the icon is disabled */
     isDisable?: boolean;
+    /** Click handler */
     onClick?: () => void;
+    /** Custom classNames for internal elements */
+    classNames?: IconClassNames;
+    /** Custom styles for internal elements */
+    styles?: IconStyles;
 }
 export interface CompatIconProps {
     src: string | React.ReactNode;
     className?: string;
+    style?: CSSProperties;
     [key: string]: any;
 }
-export interface IconProps {
-    nameIcon: string;
-    propsIcon?: IconBaseProps;
-    className?: string;
-    tooltip?: string;
-    isDisable?: boolean;
-    onClick?: () => void;
-}
 export declare const Icon: {
-    ({ nameIcon, propsIcon, className, tooltip, isDisable, onClick, }: IconProps): JSX.Element;
-    SSR: ({ nameIcon, ...props }: IconProps) => JSX.Element;
-    Compat: ({ src, className, ...props }: CompatIconProps) => JSX.Element;
+    ({ nameIcon, propsIcon, className, tooltip, isDisable, classNames, styles, onClick, }: IconProps): JSX.Element;
+    SSR: ({ nameIcon, classNames, styles, ...props }: IconProps) => JSX.Element;
+    Compat: ({ src, className, style, ...props }: CompatIconProps) => JSX.Element;
 };
 //# sourceMappingURL=Icon.d.ts.map

package/lib/src/core-components/src/components/Icon/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAI9C,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AA4BD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,IAAI;uEAOd,SAAS,GAAG,WAAW;kCAxBa,SAAS,KAAG,WAAW;2CAd3D,eAAe,KAAG,WAAW;CAgH/B,CAAC"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAK3C,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAI9C,MAAM,WAAW,cAAc;IAC7B,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,wCAAwC;IACxC,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB;AAED,MAAM,WAAW,SAAS;IACxB,gFAAgF;IAChF,QAAQ,EAAE,MAAM,CAAC;IACjB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,0CAA0C;IAC1C,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AA4CD,eAAO,MAAM,IAAI;2FASd,SAAS,GAAG,WAAW;sDArBvB,SAAS,KAAG,WAAW;kDAzBvB,eAAe,KAAG,WAAW;CAiI/B,CAAC"}

package/lib/src/core-components/src/components/Icon/Icon.js

@@ -5,16 +5,16 @@ import { Tooltip } from '../Tooltip/tooltip.component';
 import loadable from '@loadable/component';
 import s from '../../tc.module.css';
 import { cn } from '../../utils';
-const CompatIcon = ({ src, className, ...props }) => {
+const CompatIcon = ({ src, className, style, ...props }) => {
     if (typeof src === 'string') {
-        return (_jsx("img", { src: src, className: cn(s.icon, className), ...props, alt: "" }));
+        return (_jsx("img", { src: src, className: cn(s.icon, className), style: style, ...props, alt: "" }));
     }
-    return (_jsx("div", { className: cn(s.icon, className), ...props, children: src }));
+    return (_jsx("div", { className: cn(s.icon, className), style: style, ...props, children: src }));
 };
-const SSRIcon = ({ nameIcon, ...props }) => {
-    return (_jsx("span", { className: cn(s.icon, props.className), "aria-hidden": "true", children: "\u26AB" }));
+const SSRIcon = ({ nameIcon, classNames = {}, styles = {}, ...props }) => {
+    return (_jsx("span", { className: cn(s.icon, props.className, classNames.icon), style: styles.icon, "aria-hidden": "true", children: "\u26AB" }));
 };
-export const Icon = ({ nameIcon, propsIcon, className, tooltip = '', isDisable = false, onClick, }) => {
+export const Icon = ({ nameIcon, propsIcon, className, tooltip = '', isDisable = false, classNames = {}, styles = {}, onClick, }) => {
     try {
         const iconProps = {
             ...propsIcon,
@@ -65,10 +65,10 @@ export const Icon = ({ nameIcon, propsIcon, className, tooltip = '', isDisable =
         const ElementIcon = loadable(loadLibrary, {
             resolveComponent: (el) => el[nameIcon] != null ? el[nameIcon] : el[Object.keys(el.default)[0]],
         });
-        return (_jsx("div", { className: cn(s.iconContainer, className), onClick: () => {
+        return (_jsx("div", { className: cn(s.iconContainer, className, classNames.container), style: styles.container, onClick: () => {
                 if (!isDisable)
                     onClick && onClick();
-            }, children: !_.isEmpty(tooltip) ? (_jsx(Tooltip, { content: tooltip, children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon) }) })) : (_jsx(Suspense, { fallback: _jsx("div", { children: "Loading..." }), children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon) }) })) }));
+            }, children: !_.isEmpty(tooltip) ? (_jsx(Tooltip, { content: tooltip, children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon }) })) : (_jsx(Suspense, { fallback: _jsx("div", { children: "Loading..." }), children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon }) })) }));
     }
     catch (error) {
         return _jsx(_Fragment, {});

package/lib/src/core-components/src/components/Loader/loader.component.d.ts

@@ -1,5 +1,38 @@
+import { CSSProperties } from 'react';
 export type LoaderVariant = 'spinner' | 'dots' | 'bars' | 'pulse';
 export type LoaderSize = 'sm' | 'md' | 'lg';
+export interface LoaderClassNames {
+    /** Custom className for the outer wrapper */
+    wrapper?: string;
+    /** Custom className for the loader container */
+    container?: string;
+    /** Custom className for the spinner element */
+    spinner?: string;
+    /** Custom className for the dot elements */
+    dot?: string;
+    /** Custom className for the bar elements */
+    bar?: string;
+    /** Custom className for the pulse element */
+    pulse?: string;
+    /** Custom className for the loading text */
+    text?: string;
+}
+export interface LoaderStyles {
+    /** Custom style for the outer wrapper */
+    wrapper?: CSSProperties;
+    /** Custom style for the loader container */
+    container?: CSSProperties;
+    /** Custom style for the spinner element */
+    spinner?: CSSProperties;
+    /** Custom style for the dot elements */
+    dot?: CSSProperties;
+    /** Custom style for the bar elements */
+    bar?: CSSProperties;
+    /** Custom style for the pulse element */
+    pulse?: CSSProperties;
+    /** Custom style for the loading text */
+    text?: CSSProperties;
+}
 export interface LoadingAnimateSpinProps {
     /** Wrapper className for positioning */
     classWarper?: string;
@@ -21,8 +54,12 @@ export interface LoadingAnimateSpinProps {
     textFontSize?: string;
     /** Loading text to display below the spinner. If not provided, no text is shown. */
     loadingText?: string;
+    /** Custom classNames for component parts */
+    classNames?: LoaderClassNames;
+    /** Custom inline styles for component parts */
+    styles?: LoaderStyles;
     /** Accessibility label */
     'aria-label'?: string;
 }
-export declare const LoadingAnimateSpin: ({ classWarper, className, variant, size, color, borderWidth, width, height, textFontSize, loadingText, "aria-label": ariaLabel, }: LoadingAnimateSpinProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LoadingAnimateSpin: ({ classWarper, className, variant, size, color, borderWidth, width, height, textFontSize, loadingText, classNames, styles, "aria-label": ariaLabel, }: LoadingAnimateSpinProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=loader.component.d.ts.map

package/lib/src/core-components/src/components/Loader/loader.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loader.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Loader/loader.component.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAClE,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,wCAAwC;IACxC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,yGAAyG;IACzG,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IAC3E,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iHAAiH;IACjH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kHAAkH;IAClH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oFAAoF;IACpF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0BAA0B;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAuJD,eAAO,MAAM,kBAAkB,sIAY5B,uBAAuB,4CAqMzB,CAAC"}
+{"version":3,"file":"loader.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/Loader/loader.component.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAI3C,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAClE,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,WAAW,gBAAgB;IAC/B,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,yCAAyC;IACzC,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,4CAA4C;IAC5C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,2CAA2C;IAC3C,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,wCAAwC;IACxC,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB,wCAAwC;IACxC,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB,yCAAyC;IACzC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,wCAAwC;IACxC,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB;AAED,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,wCAAwC;IACxC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,yGAAyG;IACzG,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IAC3E,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iHAAiH;IACjH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kHAAkH;IAClH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oFAAoF;IACpF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,+CAA+C;IAC/C,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,0BAA0B;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAuJD,eAAO,MAAM,kBAAkB,0JAc5B,uBAAuB,4CAkNzB,CAAC"}

package/lib/src/core-components/src/components/Loader/loader.component.js

@@ -135,7 +135,7 @@ const calculateBorderWidth = (sizeValue, explicitBorderWidth) => {
     const borderPx = Math.max(2, Math.min(16, Math.round(sizeInPx * 0.156)));
     return `${borderPx}px`;
 };
-export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant = 'spinner', size = 'md', color = 'blue', borderWidth, width, height, textFontSize = '1.125rem', loadingText, 'aria-label': ariaLabel = 'Loading', }) => {
+export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant = 'spinner', size = 'md', color = 'blue', borderWidth, width, height, textFontSize = '1.125rem', loadingText, classNames = {}, styles = {}, 'aria-label': ariaLabel = 'Loading', }) => {
     const sizeConfig = sizeClasses[size];
     const renderSpinner = () => {
         const colorValue = getColorValue(color);
@@ -147,7 +147,7 @@ export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant =
         const spinnerHeight = height || '4rem';
         // Calculate proportional border width based on spinner size
         const calculatedBorderWidth = calculateBorderWidth(spinnerWidth, borderWidth);
-        return (_jsxs("div", { className: cn(s['flex'], s['flex-col'], s['items-center'], s['justify-center'], className), "aria-label": ariaLabel, role: "status", children: [_jsx("div", { className: cn(sizeConfig.spinner, s['rounded-full'], s['animate-spin']), style: {
+        return (_jsxs("div", { className: cn(s['flex'], s['flex-col'], s['items-center'], s['justify-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [_jsx("div", { className: cn(sizeConfig.spinner, s['rounded-full'], s['animate-spin'], classNames.spinner), style: {
                         width: spinnerWidth,
                         height: spinnerHeight,
                         borderWidth: calculatedBorderWidth,
@@ -157,39 +157,44 @@ export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant =
                         borderBottomColor: baseBorderColor,
                         borderLeftColor: baseBorderColor,
                         animation: 'spin 1s linear infinite',
-                    } }), loadingText && (_jsx("p", { className: cn(s['mt-4'], s['text-white'], s['text-lg'], s['font-semibold'], s['animate-pulse']), style: {
+                        ...styles.spinner,
+                    } }), loadingText && (_jsx("p", { className: cn(s['mt-4'], s['text-white'], s['text-lg'], s['font-semibold'], s['animate-pulse'], classNames.text), style: {
                         marginTop: '1rem',
                         color: colorValue,
                         fontSize: textFontSize,
                         fontWeight: 600,
                         animation: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+                        ...styles.text,
                     }, children: loadingText }))] }));
     };
     const renderDots = () => {
         const colorValue = getColorValue(color);
-        return (_jsx("div", { className: cn(s['flex'], s['gap-2'], s['items-center'], className), "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.dots, s['rounded-full']), style: {
+        return (_jsx("div", { className: cn(s['flex'], s['gap-2'], s['items-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.dots, s['rounded-full'], classNames.dot), style: {
                     backgroundColor: colorValue,
                     animation: `bounce 1.4s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite`,
                     animationDelay: `${i * 0.16}s`,
                     animationFillMode: 'both',
+                    ...styles.dot,
                 } }, i))) }));
     };
     const renderBars = () => {
         const colorValue = getColorValue(color);
-        return (_jsx("div", { className: cn(s['flex'], s['gap-1'], s['items-center'], className), "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.bars, s.rounded), style: {
+        return (_jsx("div", { className: cn(s['flex'], s['gap-1'], s['items-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.bars, s.rounded, classNames.bar), style: {
                     backgroundColor: colorValue,
                     borderRadius: '0.125rem',
                     animation: `pulse 1.2s ease-in-out infinite`,
                     animationDelay: `${i * 0.15}s`,
                     animationFillMode: 'both',
+                    ...styles.bar,
                 } }, i))) }));
     };
     const renderPulse = () => {
         const colorValue = getColorValue(color);
-        return (_jsx("div", { className: cn(sizeConfig.pulse, s['rounded-full'], className), style: {
+        return (_jsx("div", { className: cn(sizeConfig.pulse, s['rounded-full'], className, classNames.pulse), style: {
                 backgroundColor: colorValue,
                 animation: `pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite`,
                 animationFillMode: 'both',
+                ...styles.pulse,
             }, "aria-label": ariaLabel, role: "status" }));
     };
     const renderLoader = () => {
@@ -205,7 +210,7 @@ export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant =
                 return renderSpinner();
         }
     };
-    return (_jsxs("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], classWarper), children: [_jsx("style", { children: `
+    return (_jsxs("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], classWarper, classNames.wrapper), style: styles.wrapper, children: [_jsx("style", { children: `
         @keyframes spin {
           from {
             transform: rotate(0deg);

package/lib/src/core-components/src/components/Modal/BasicModal/modal.component.d.ts

@@ -1,6 +1,42 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 export type ModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
 export type ModalPosition = 'center' | 'top' | 'bottom';
+export interface ModalClassNames {
+    /** Custom className for the overlay */
+    overlay?: string;
+    /** Custom className for the modal container */
+    container?: string;
+    /** Custom className for the modal wrapper */
+    wrapper?: string;
+    /** Custom className for the modal content */
+    content?: string;
+    /** Custom className for the header */
+    header?: string;
+    /** Custom className for the title */
+    title?: string;
+    /** Custom className for the close button */
+    closeButton?: string;
+    /** Custom className for the body/children container */
+    body?: string;
+}
+export interface ModalStyles {
+    /** Custom style for the overlay */
+    overlay?: CSSProperties;
+    /** Custom style for the modal container */
+    container?: CSSProperties;
+    /** Custom style for the modal wrapper */
+    wrapper?: CSSProperties;
+    /** Custom style for the modal content */
+    content?: CSSProperties;
+    /** Custom style for the header */
+    header?: CSSProperties;
+    /** Custom style for the title */
+    title?: CSSProperties;
+    /** Custom style for the close button */
+    closeButton?: CSSProperties;
+    /** Custom style for the body/children container */
+    body?: CSSProperties;
+}
 export interface ModalProps {
     /** Controls modal visibility */
     visible: boolean;
@@ -54,8 +90,12 @@ export interface ModalProps {
     headerPadding?: string;
     /** Animation duration (in ms) */
     animationDuration?: number;
+    /** Custom classNames for component parts */
+    classNames?: ModalClassNames;
+    /** Custom inline styles for component parts */
+    styles?: ModalStyles;
     /** Modal content */
     children: React.ReactNode;
 }
-export declare const Modal: ({ visible, title, className, contentClassName, headerClassName, style, contentStyle, onClose, isAutoClose, autoCloseDelay, size, position, showCloseButton, closeButton, overlayOpacity, overlayColor, closeOnOverlayClick, closeOnEscape, showHeader, headerBgColor, headerTextColor, borderRadius, maxWidth, contentPadding, headerPadding, animationDuration, children, }: ModalProps) => JSX.Element | null;
+export declare const Modal: ({ visible, title, className, contentClassName, headerClassName, style, contentStyle, onClose, isAutoClose, autoCloseDelay, size, position, showCloseButton, closeButton, overlayOpacity, overlayColor, closeOnOverlayClick, closeOnEscape, showHeader, headerBgColor, headerTextColor, borderRadius, maxWidth, contentPadding, headerPadding, animationDuration, classNames, styles, children, }: ModalProps) => JSX.Element | null;
 //# sourceMappingURL=modal.component.d.ts.map

package/lib/src/core-components/src/components/Modal/BasicModal/modal.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Modal/BasicModal/modal.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAC3D,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,CAAC;AAExD,MAAM,WAAW,UAAU;IACzB,gCAAgC;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0CAA0C;IAC1C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACnC,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qDAAqD;IACrD,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,uDAAuD;IACvD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,uCAAuC;IACvC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,6BAA6B;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kCAAkC;IAClC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,uCAAuC;IACvC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,+BAA+B;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,0BAA0B;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,0BAA0B;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8BAA8B;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wBAAwB;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oBAAoB;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+BAA+B;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qBAAqB;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iCAAiC;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oBAAoB;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,KAAK,iXA4Bf,UAAU,KAAG,WAAW,GAAG,IAmP7B,CAAC"}
+{"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Modal/BasicModal/modal.component.tsx"],"names":[],"mappings":"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"}

package/lib/src/core-components/src/components/Modal/BasicModal/modal.component.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useEffect, useState } from 'react';
 import s from '../../../tc.module.css';
 import { cn } from '../../../utils';
-export const Modal = ({ visible, title = '', className = '', contentClassName = '', headerClassName = '', style = {}, contentStyle = {}, onClose, isAutoClose = false, autoCloseDelay = 1000, size = 'md', position = 'center', showCloseButton = true, closeButton, overlayOpacity = 0.5, overlayColor, closeOnOverlayClick = true, closeOnEscape = true, showHeader = true, headerBgColor, headerTextColor, borderRadius = '0.5rem', maxWidth, contentPadding = '1rem', headerPadding = '1rem', animationDuration = 300, children, }) => {
+export const Modal = ({ visible, title = '', className = '', contentClassName = '', headerClassName = '', style = {}, contentStyle = {}, onClose, isAutoClose = false, autoCloseDelay = 1000, size = 'md', position = 'center', showCloseButton = true, closeButton, overlayOpacity = 0.5, overlayColor, closeOnOverlayClick = true, closeOnEscape = true, showHeader = true, headerBgColor, headerTextColor, borderRadius = '0.5rem', maxWidth, contentPadding = '1rem', headerPadding = '1rem', animationDuration = 300, classNames = {}, styles = {}, children, }) => {
     const [showModal, setShowModal] = useState(visible);
     const [isAnimating, setIsAnimating] = useState(false);
     useEffect(() => {
@@ -58,15 +58,17 @@ export const Modal = ({ visible, title = '', className = '', contentClassName =
     const modalMaxWidth = maxWidth || (size !== 'full' ? sizeMaxWidths[size] : '95%');
     if (!showModal)
         return null;
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['fixed'], s['inset-0'], s['z-40'], s['bg-black']), style: {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['fixed'], s['inset-0'], s['z-40'], s['bg-black'], classNames.overlay), style: {
                     opacity: isAnimating ? overlayOpacity : 0,
                     transition: `opacity ${animationDuration}ms ease-in-out`,
                     backgroundColor: overlayColor || undefined,
-                }, onClick: handleOverlayClick }), _jsx("div", { className: cn(s['flex'], s['justify-center'], positionClasses[position], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none'], className), style: {
+                    ...styles.overlay,
+                }, onClick: handleOverlayClick }), _jsx("div", { className: cn(s['flex'], s['justify-center'], positionClasses[position], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none'], className, classNames.container), style: {
                     ...style,
                     transition: `opacity ${animationDuration}ms ease-in-out`,
                     opacity: isAnimating ? 1 : 0,
-                }, onClick: handleOverlayClick, children: _jsx("div", { className: cn(s['relative'], s['w-full'], s['my-5'], s['mx-auto']), style: {
+                    ...styles.container,
+                }, onClick: handleOverlayClick, children: _jsx("div", { className: cn(s['relative'], s['w-full'], s['my-5'], s['mx-auto'], classNames.wrapper), style: {
                         maxWidth: modalMaxWidth,
                         marginLeft: size === 'full' ? '1rem' : undefined,
                         marginRight: size === 'full' ? '1rem' : undefined,
@@ -83,18 +85,22 @@ export const Modal = ({ visible, title = '', className = '', contentClassName =
                                     : 'translateY(20px)',
                         transition: `transform ${animationDuration}ms ease-out, opacity ${animationDuration}ms ease-out`,
                         opacity: isAnimating ? 1 : 0,
-                    }, onClick: (e) => e.stopPropagation(), children: _jsxs("div", { className: cn(s['border-0'], s['shadow-xl'], s['relative'], s['flex'], s['flex-col'], s['bg-white'], s['outline-none'], s['focus:outline-none'], contentClassName), style: {
+                        ...styles.wrapper,
+                    }, onClick: (e) => e.stopPropagation(), children: _jsxs("div", { className: cn(s['border-0'], s['shadow-xl'], s['relative'], s['flex'], s['flex-col'], s['bg-white'], s['outline-none'], s['focus:outline-none'], contentClassName, classNames.content), style: {
                             borderRadius,
                             ...contentStyle,
-                        }, children: [showHeader && (_jsxs("div", { className: cn(s['flex'], s['items-center'], s['justify-between'], s['border-b'], s['border-solid'], s['border-gray-200'], headerClassName), style: {
+                            ...styles.content,
+                        }, children: [showHeader && (_jsxs("div", { className: cn(s['flex'], s['items-center'], s['justify-between'], s['border-b'], s['border-solid'], s['border-gray-200'], headerClassName, classNames.header), style: {
                                     padding: headerPadding,
                                     backgroundColor: headerBgColor,
                                     borderTopLeftRadius: borderRadius,
                                     borderTopRightRadius: borderRadius,
                                     borderBottom: title || showCloseButton ? undefined : 'none',
-                                }, children: [title && (_jsx("h3", { className: cn(s['text-xl'], s['font-semibold'], s['m-0'], s['flex-1']), style: { color: headerTextColor }, children: title })), showCloseButton && (_jsx("button", { type: "button", className: cn(s['p-1'], s['ml-4'], s['border-0'], s['bg-transparent'], s['cursor-pointer'], s['outline-none'], s['focus:outline-none'], s['transition-colors'], s['hover:bg-gray-100'], s['rounded']), onClick: handleClose, "aria-label": "Close modal", style: {
+                                    ...styles.header,
+                                }, children: [title && (_jsx("h3", { className: cn(s['text-xl'], s['font-semibold'], s['m-0'], s['flex-1'], classNames.title), style: { color: headerTextColor, ...styles.title }, children: title })), showCloseButton && (_jsx("button", { type: "button", className: cn(s['p-1'], s['ml-4'], s['border-0'], s['bg-transparent'], s['cursor-pointer'], s['outline-none'], s['focus:outline-none'], s['transition-colors'], s['hover:bg-gray-100'], s['rounded'], classNames.closeButton), onClick: handleClose, "aria-label": "Close modal", style: {
                                             marginLeft: title ? '1rem' : 0,
                                             marginRight: title ? 0 : 'auto',
+                                            ...styles.closeButton,
                                         }, children: closeButton || (_jsx("span", { className: cn(s['block'], s['text-2xl'], s['leading-none'], s['font-light']), style: {
                                                 color: headerTextColor || '#1f2937',
                                                 height: '1.5rem',
@@ -103,7 +109,8 @@ export const Modal = ({ visible, title = '', className = '', contentClassName =
                                                 alignItems: 'center',
                                                 justifyContent: 'center',
                                                 lineHeight: 1,
-                                            }, children: "\u00D7" })) }))] })), _jsx("div", { className: cn(s['flex'], s['flex-col'], s['w-full'], s['h-auto'], s['overflow-y-auto']), style: {
+                                            }, children: "\u00D7" })) }))] })), _jsx("div", { className: cn(s['flex'], s['flex-col'], s['w-full'], s['h-auto'], s['overflow-y-auto'], classNames.body), style: {
                                     padding: contentPadding,
+                                    ...styles.body,
                                 }, children: children })] }) }) })] }));
 };

package/lib/src/core-components/src/components/Modal/ModalDocxContent/gemini.service.d.ts

@@ -0,0 +1,4 @@
+export declare const geminiSendMessageService: (prompt: string, gemini_key: string) => Promise<{
+    text: string;
+} | null>;
+//# sourceMappingURL=gemini.service.d.ts.map

package/lib/src/core-components/src/components/Modal/ModalDocxContent/gemini.service.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gemini.service.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Modal/ModalDocxContent/gemini.service.ts"],"names":[],"mappings":"AA0DA,eAAO,MAAM,wBAAwB,WAC3B,MAAM,cACF,MAAM,KACjB,QAAQ;IAAC,IAAI,EAAE,MAAM,CAAA;CAAC,GAAG,IAAI,CA6B/B,CAAC"}