@itcase/ui 1.8.101 → 1.8.103

package/dist/types/components/Modal/Modal.d.ts

@@ -1,5 +1,53 @@
 import React from 'react';
-import type { ModalConfig } from './Modal.interface';
+import type { ModalConfig, ModalRef } from './Modal.interface';
 declare const modalConfig: ModalConfig;
-declare const Modal: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
+declare const Modal: React.ForwardRefExoticComponent<{
+    borderColor?: import("@itcase/types").BorderColorProps;
+    borderType?: import("@itcase/types").BorderTypeProps;
+    borderWidth?: import("@itcase/types").BorderWidthProps;
+    closeIconAppearance?: import("@itcase/types").CompositeAppearanceIconKeys;
+    closeIconAppearanceSize?: import("@itcase/types").CompositeAppearanceIconKeys;
+    closeIconFillSize?: import("@itcase/types").IconFillSizeProps;
+    closeIconImage?: string;
+    closeIconShape?: import("@itcase/types").ShapeProps;
+    closeIconSize?: import("@itcase/types").IconSizeProps;
+    elevation?: import("@itcase/types").ElevationProps;
+    fill?: import("@itcase/types").FillProps;
+    itemFill?: import("@itcase/types").ItemFillProps;
+    overlayFill?: import("../Overlay/Overlay.interface").OverlayProps["fill"];
+    overlayOpacity?: import("../Overlay/Overlay.interface").OverlayProps["opacity"];
+    shape?: import("@itcase/types").ShapeProps;
+    shapeStrength?: import("@itcase/types").ShapeStrengthProps;
+    size?: import("@itcase/types").SizeProps;
+    textColor?: import("@itcase/types").TextColorProps;
+    textSize?: import("@itcase/types").TextSizeProps;
+    titleTextColor?: import("@itcase/types").TextColorProps;
+    titleTextColorHover?: import("@itcase/types").TextColorHoverProps;
+    titleTextSize?: import("@itcase/types").TitleSizeProps;
+    titleTextTruncate?: boolean;
+    titleTextWeight?: import("@itcase/types").TextWeightProps;
+    titleTextWidth?: import("@itcase/types").TextWeightProps;
+    titleTextWrap?: import("@itcase/types").TextWrapProps;
+} & import("../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    id?: string;
+    appearance?: import("@itcase/types").CompositeAppearanceKey;
+    children?: React.ReactNode;
+    className?: string;
+    contentClassName?: string;
+    dataTestId?: string;
+    dataTour?: string;
+    isCloseOnBlur?: boolean;
+    isOverlay?: boolean;
+    isScrollOnOpen?: boolean;
+    isSetFocusOnOpen?: boolean;
+    isSkeleton?: boolean;
+    modalQuerySelector?: string;
+    onClickOverlay: import("../Overlay/Overlay.interface").OverlayProps["onClick"];
+    onCloseModal?: () => void;
+    onOpenModal?: () => void;
+    scroll?: boolean;
+    stickyHeader?: boolean;
+    style?: React.CSSProperties;
+    title?: string;
+} & React.RefAttributes<ModalRef>>;
 export { Modal, modalConfig };

package/dist/types/components/Modal/Modal.interface.d.ts

@@ -1,51 +1,69 @@
-import type { FocusEvent, MouseEvent, MouseEventHandler, ReactNode } from 'react';
-import { AppearanceKeysDefault, BorderColorProps, ElevationProps, FillGradientProps, FillProps, ShapeProps } from '@itcase/types';
-import type { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
-export interface ModalThemeColor {
-    [key: number | string | symbol]: any;
+import { CSSProperties, MouseEventHandler, ReactNode } from 'react';
+import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceIconKeys, CompositeAppearanceKey, ElevationProps, FillProps, IconFillSizeProps, IconSizeProps, ItemFillProps, ShapeProps, ShapeStrengthProps, SizeProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextWeightProps, TextWrapProps, TitleSizeProps } from '@itcase/types';
+import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { OverlayProps } from '../Overlay/Overlay.interface';
+type ModalAppearanceProps = {
     borderColor?: BorderColorProps;
+    borderType?: BorderTypeProps;
+    borderWidth?: BorderWidthProps;
+    closeIconAppearance?: CompositeAppearanceIconKeys;
+    closeIconAppearanceSize?: CompositeAppearanceIconKeys;
+    closeIconFillSize?: IconFillSizeProps;
+    closeIconImage?: string;
+    closeIconShape?: ShapeProps;
+    closeIconSize?: IconSizeProps;
     elevation?: ElevationProps;
     fill?: FillProps;
-    overlayFill?: FillProps;
-    overlayFillGradient?: FillGradientProps;
-    overlayOpacity?: string;
+    itemFill?: ItemFillProps;
+    overlayFill?: OverlayProps['fill'];
+    overlayOpacity?: OverlayProps['opacity'];
     shape?: ShapeProps;
-    isOverlay?: boolean;
-}
-type AppearanceKeys = AppearanceKeysDefault & {};
-export type ModalAppearance = {
-    [key in AppearanceKeys]?: ModalThemeColor;
+    shapeStrength?: ShapeStrengthProps;
+    size?: SizeProps;
+    textColor?: TextColorProps;
+    textSize?: TextSizeProps;
+    titleTextColor?: TextColorProps;
+    titleTextColorHover?: TextColorHoverProps;
+    titleTextSize?: TitleSizeProps;
+    titleTextTruncate?: boolean;
+    titleTextWeight?: TextWeightProps;
+    titleTextWidth?: TextWeightProps;
+    titleTextWrap?: TextWrapProps;
 };
-export interface ModalConfig {
-    [key: number | string | symbol]: any;
-    appearance: ModalAppearance | undefined;
-    setAppearance: (newComponent: ModalAppearance) => void;
-}
-interface ModalLoaderProps {
-}
-interface ModalRef {
-    closeModal: MouseEventHandler<HTMLDivElement>;
-    modalElement: Element | HTMLDivElement | null;
-    openModal: () => void;
-    isOpen: boolean;
-}
-interface ModalProps extends ModalThemeColor, StyleAttributes {
+type ModalProps = ModalAppearanceProps & StyleAttributes & {
     id?: string;
-    [key: number | string | symbol]: any;
-    appearance?: AppearanceKeys;
+    appearance?: CompositeAppearanceKey;
     children?: ReactNode;
     className?: string;
-    closeButton?: ReactNode;
     contentClassName?: string;
-    debug?: boolean;
-    modalQuerySelector?: string;
-    overlayClassName?: string;
+    dataTestId?: string;
+    dataTour?: string;
     isCloseOnBlur?: boolean;
-    isOpen: boolean;
+    isOverlay?: boolean;
     isScrollOnOpen?: boolean;
     isSetFocusOnOpen?: boolean;
-    onClickOverlay?: () => void;
-    onCloseModal?: (event?: FocusEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>) => void;
+    isSkeleton?: boolean;
+    modalQuerySelector?: string;
+    onClickOverlay: OverlayProps['onClick'];
+    onCloseModal?: () => void;
     onOpenModal?: () => void;
-}
-export type { ModalLoaderProps, ModalRef, ModalProps };
+    scroll?: boolean;
+    stickyHeader?: boolean;
+    style?: CSSProperties;
+    title?: string;
+};
+type ModalRef = {
+    closeModal: MouseEventHandler<HTMLDivElement>;
+    isOpen: boolean;
+    modalElement: Element | HTMLDivElement | null;
+    openModal: () => void;
+};
+type ModalAppearanceKey = AppearanceKeysDefault | AppearanceShapeKey | AppearanceSizeKey | AppearanceStyleKey;
+type ModalAppearance = {
+    [key in ModalAppearanceKey]?: ModalAppearanceProps;
+};
+type ModalConfig = {
+    appearance: ModalAppearance;
+    setAppearance: (appearanceConfig: ModalAppearance) => void;
+};
+export type { ModalAppearance, ModalConfig, ModalProps, ModalRef };

package/dist/types/components/Modal/appearance/modalShape.d.ts

@@ -1,25 +1,3 @@
-declare const modalAppearanceShape: {
-    circular: {
-        shape: string;
-    };
-    rounded: {
-        shape: string;
-    };
-    roundedS: {
-        shape: string;
-        shapeStrength: string;
-    };
-    roundedM: {
-        shape: string;
-        shapeStrength: string;
-    };
-    roundedL: {
-        shape: string;
-        shapeStrength: string;
-    };
-    roundedXL: {
-        shape: string;
-        shapeStrength: string;
-    };
-};
+import { ModalAppearance } from '../Modal.interface';
+declare const modalAppearanceShape: ModalAppearance;
 export { modalAppearanceShape };

package/dist/types/components/Modal/appearance/modalSize.d.ts

@@ -1,27 +1,3 @@
-declare const modalAppearanceSize: {
-    sizeXL: {
-        size: string;
-        titleTextSize: string;
-        closeIconAppearanceSize: string;
-        closeIconImage: string;
-    };
-    sizeL: {
-        size: string;
-        titleTextSize: string;
-        closeIconAppearanceSize: string;
-        closeIconImage: string;
-    };
-    sizeM: {
-        size: string;
-        titleTextSize: string;
-        closeIconAppearanceSize: string;
-        closeIconImage: string;
-    };
-    sizeS: {
-        size: string;
-        titleTextSize: string;
-        closeIconAppearanceSize: string;
-        closeIconImage: string;
-    };
-};
+import { ModalAppearance } from '../Modal.interface';
+declare const modalAppearanceSize: ModalAppearance;
 export { modalAppearanceSize };

package/dist/types/components/Modal/appearance/modalStyle.d.ts

@@ -1,14 +1,3 @@
-declare const modalAppearanceStyle: {
-    solid: {
-        borderColor: string;
-    };
-    outlined: {
-        fill: string;
-    };
-    full: {};
-    ghost: {
-        fill: string;
-        borderColor: string;
-    };
-};
+import { ModalAppearance } from '../Modal.interface';
+declare const modalAppearanceStyle: ModalAppearance;
 export { modalAppearanceStyle };

package/dist/types/components/Modal/appearance/modalSurface.d.ts

@@ -1,8 +1,3 @@
-declare const modalAppearanceSurface: {
-    surfacePrimary: {
-        fill: string;
-        borderColor: string;
-        closeIconAppearance: string;
-    };
-};
+import { ModalAppearance } from '../Modal.interface';
+declare const modalAppearanceSurface: ModalAppearance;
 export { modalAppearanceSurface };

package/dist/types/components/Overlay/Overlay.appearance.d.ts

@@ -1,2 +1,12 @@
-import { OverlayAppearanceType } from './Overlay.interface';
-export declare const overlayAppearance: OverlayAppearanceType;
+export declare const overlayAppearance: {
+    blackout?: {
+        blur?: import("@itcase/types").BlurProps;
+        fill?: import("@itcase/types").FillProps;
+        opacity?: import("@itcase/types").OpacityProps;
+    } | undefined;
+    blur?: {
+        blur?: import("@itcase/types").BlurProps;
+        fill?: import("@itcase/types").FillProps;
+        opacity?: import("@itcase/types").OpacityProps;
+    } | undefined;
+};

package/dist/types/components/Overlay/Overlay.interface.d.ts

@@ -1,25 +1,27 @@
-import { AppearanceKeysDefault, FillGradientProps, FillProps } from '@itcase/types';
-import type { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
-export interface OverlayThemeColor {
-}
-type AppearanceKeys = AppearanceKeysDefault & {};
-export type OverlayAppearanceType = {
-    [key in AppearanceKeys]?: OverlayThemeColor;
+import { CSSProperties, MouseEventHandler, ReactNode } from 'react';
+import { AppearanceOverlayKey, BlurProps, FillProps, OpacityProps } from '@itcase/types';
+import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+type OverlayAppearanceProps = {
+    blur?: BlurProps;
+    fill?: FillProps;
+    opacity?: OpacityProps;
 };
-export interface OverlayConfig {
-    [key: number | string | symbol]: any;
-    appearance: OverlayAppearanceType | undefined;
-    setAppearance: (newComponent: OverlayAppearanceType) => void;
-}
-interface OverlayProps extends OverlayThemeColor, StyleAttributes {
-    [key: number | string | symbol]: any;
-    appearance?: AppearanceKeys;
+type OverlayProps = OverlayAppearanceProps & StyleAttributes & {
+    appearance?: AppearanceOverlayKey;
+    children?: ReactNode;
     className?: string;
-    fill?: FillProps;
-    fillGradient?: FillGradientProps;
-    opacity?: string;
-    type?: string;
+    dataTestId?: string;
+    dataTour?: string;
     isOverlay?: boolean;
-    onClick?: () => void;
-}
-export type { OverlayProps };
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    style?: CSSProperties;
+};
+type OverlayAppearanceKey = AppearanceOverlayKey;
+type OverlayAppearance = {
+    [key in OverlayAppearanceKey]?: OverlayAppearanceProps;
+};
+type OverlayConfig = {
+    appearance: OverlayAppearance;
+    setAppearance: (appearanceConfig: OverlayAppearance) => void;
+};
+export type { OverlayAppearance, OverlayConfig, OverlayProps };

package/dist/types/components/Overlay/appearance/overlayDefault.d.ts

@@ -1,11 +1,3 @@
-declare const overlayAppearanceDefault: {
-    blackout: {
-        fill: string;
-        opacity: number;
-    };
-    blur: {
-        fill: string;
-        blur: number;
-    };
-};
+import { OverlayAppearance } from '../Overlay.interface';
+declare const overlayAppearanceDefault: OverlayAppearance;
 export { overlayAppearanceDefault };

package/dist/types/components/Title/Title.interface.d.ts

@@ -45,7 +45,7 @@ export interface TitleProps extends TitleThemeColor, StyleAttributes {
     tag?: ElementType;
     text?: string;
     textAlign?: TextAlignProps;
-    textTruncate?: string;
+    textTruncate?: boolean;
     type?: string;
     onClick?: () => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.101",
+  "version": "1.8.103",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -141,7 +141,7 @@
     "@commitlint/config-conventional": "^19.8.1",
     "@itcase/config": "^1.0.55",
     "@itcase/lint": "^1.1.37",
-    "@itcase/types": "^1.0.27",
+    "@itcase/types": "^1.0.33",
     "@rollup/plugin-alias": "^5.1.1",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.6",
@@ -171,7 +171,7 @@
     "lint-staged": "^16.1.5",
     "prettier": "^3.6.2",
     "react-docgen-typescript": "^2.4.0",
-    "rollup": "^4.46.4",
+    "rollup": "^4.47.0",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.2.3",
     "rollup-plugin-peer-deps-external": "^2.2.4",