@ssa-ui-kit/core 2.32.0 → 2.33.0-canary-03f856a-20260113

package/dist/components/Charts/BarLineComplexChart/BarLineComplexChartView.d.ts

@@ -1,8 +1,8 @@
-import { MutableRefObject } from 'react';
+import { RefObject } from 'react';
 import { BarLineComplexInternalProps } from './types';
 export declare const BarLineComplexChartView: ({ width, height, isFullscreenMode, transformedChartData, tooltipContentRef, extraModeBarButtons, systemModeBarButtons, onChange, ...props }: BarLineComplexInternalProps & {
     isFullscreenMode: boolean;
     transformedChartData: Plotly.Data[];
-    tooltipContentRef: MutableRefObject<HTMLDivElement | null>;
+    tooltipContentRef: RefObject<HTMLDivElement | null>;
     extraModeBarButtons: Array<Plotly.ModeBarButtonAny>;
 }) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Charts/BarLineComplexChart/types.d.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject } from 'react';
+import { RefObject } from 'react';
 import { PlotParams } from 'react-plotly.js';
 import { PieChartProps } from '../PieChart';
 export type BarLineChartItem = Plotly.Data & {
@@ -52,7 +52,7 @@ export interface BarLineComplexChartContextProviderProps extends Pick<BarLineCom
 export interface UseChartInfo {
     (): {
         transformedChartData: Plotly.Data[];
-        tooltipContentRef: MutableRefObject<HTMLDivElement | null>;
+        tooltipContentRef: RefObject<HTMLDivElement | null>;
         modeBarButtonsByKey: Record<string, Plotly.ModeBarButtonAny>;
     };
 }

package/dist/components/Charts/BigNumberChart/BigNumberChart.d.ts

@@ -1,15 +1,17 @@
-import { Datum } from '@nivo/line';
+import { LineSeries } from '@nivo/line';
 import { WidgetCardProps } from '../../index';
 import { TrendLineProps } from './components';
 export type BigNumberChartFeatures = 'header' | 'fullscreenMode';
+type Datum = LineSeries['data'][number];
 export interface BigNumberChartProps {
     data: Datum[];
     interactive?: boolean;
     title?: string;
     widgetCardProps?: WidgetCardProps;
-    trendLineProps?: Omit<TrendLineProps, 'data'>;
+    trendLineProps?: Omit<TrendLineProps, 'data' | 'height' | 'width'>;
     features?: BigNumberChartFeatures[];
     valueFormat?: (value: Datum) => React.ReactNode;
 }
 export declare const BigNumberChartComponent: ({ data, title, widgetCardProps, trendLineProps, interactive, features, valueFormat, }: BigNumberChartProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export declare const BigNumberChart: typeof BigNumberChartComponent;
+export {};

package/dist/components/Charts/BigNumberChart/components/TrendLine.d.ts

@@ -1,8 +1,13 @@
-import { LineProps, Datum } from '@nivo/line';
+import { LineSvgProps, LineSeries } from '@nivo/line';
 import { TrendLineTooltipProps } from './TrendLineTooltip';
-export interface TrendLineProps extends LineProps {
+type Datum = LineSeries['data'][number];
+export interface TrendLineProps extends Omit<LineSvgProps<LineSeries>, 'data' | 'height' | 'width'> {
     color?: string;
-    tooltipValueFormat?: TrendLineTooltipProps['valueFormat'];
+    tooltipValueFormat?: TrendLineTooltipProps<LineSeries>['valueFormat'];
     lastActivePoint?: Datum;
+    data: LineSvgProps<LineSeries>['data'];
+    height: number;
+    width: number;
 }
 export declare const TrendLine: ({ color, tooltipValueFormat, ...props }: TrendLineProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Charts/BigNumberChart/components/TrendLineTooltip.d.ts

@@ -1,5 +1,8 @@
-import { Point, PointTooltipProps } from '@nivo/line';
-export type TrendLineTooltipProps = PointTooltipProps & {
-    valueFormat?: (data: Point['data']) => React.ReactNode;
-};
-export declare const TrendLineTooltip: ({ point, valueFormat, }: TrendLineTooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+import { Theme } from '@emotion/react';
+import { Interpolation } from '@emotion/styled';
+import { LineSeries, Point, PointTooltipProps } from '@nivo/line';
+export interface TrendLineTooltipProps<Series extends LineSeries> extends PointTooltipProps<Series> {
+    valueFormat?: (data: Point<Series>['data']) => React.ReactNode;
+    css?: Interpolation<Theme>;
+}
+export declare const TrendLineTooltip: <Series extends LineSeries>({ point, css, valueFormat, }: TrendLineTooltipProps<Series>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Charts/GaugeChart/components/GaugeChartBase.d.ts

@@ -1,7 +1,9 @@
-import { MayHaveLabel, ResponsivePie } from '@nivo/pie';
+import { MayHaveLabel } from '@nivo/pie';
+declare const ResponsivePie: <RawDatum extends MayHaveLabel>(props: import("@nivo/core").WithChartRef<import("@nivo/core").ResponsiveProps<import("@nivo/pie").PieSvgProps<RawDatum>>, SVGSVGElement>) => import("react").ReactElement;
 export type GaugeChartData = {
     color?: string;
     value?: number;
 } & MayHaveLabel;
 export type GaugeChartBaseProps = React.ComponentProps<typeof ResponsivePie<GaugeChartData>>;
 export declare const GaugeChartBase: ({ ...props }: GaugeChartBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Charts/PieChart/types.d.ts

@@ -49,7 +49,7 @@ export type PieChartLegendProps = {
 export type PieChartTooltipViewProps = {
     isOpen: boolean;
     point?: PieTooltipProps<MayHaveLabel & {
-        percentage?: number;
+        percentage?: number | string;
         dimension?: string;
     }> | null;
     outputType: PieChartTooltipProps['outputType'];

package/dist/components/Charts/RadarChart/RadarChart.d.ts

@@ -1,6 +1,6 @@
 import { ComponentProps } from 'react';
-import { ResponsiveRadar } from '@nivo/radar';
 import { WidgetCardProps } from '../../WidgetCard';
+declare const ResponsiveRadar: <D extends Record<string, unknown>>(props: import("@nivo/core").WithChartRef<import("@nivo/core").ResponsiveProps<import("@nivo/radar").RadarSvgProps<D>>, SVGSVGElement>) => import("react").ReactElement;
 export type RadarChartFeatures = 'header' | 'fullscreenMode';
 type ResponsiveRadarProps<D extends Record<string, unknown>> = ComponentProps<typeof ResponsiveRadar<D>>;
 export interface RadarChartProps<D extends Record<string, unknown>> extends Omit<ResponsiveRadarProps<D>, 'legends'> {

package/dist/components/Charts/TreeMapChart/TreeMapChart.d.ts

@@ -1,5 +1,5 @@
-import { ResponsiveTreeMap } from '@nivo/treemap';
 import { WidgetCardProps } from '../../WidgetCard';
+declare const ResponsiveTreeMap: <Datum extends object = import("@nivo/treemap").DefaultTreeMapDatum>(props: import("@nivo/core").WithChartRef<import("@nivo/core").ResponsiveProps<import("@nivo/treemap").TreeMapSvgProps<Datum>>, SVGSVGElement>) => import("react").ReactElement;
 export type TreeNode = {
     name: string;
     value?: number;

package/dist/components/Charts/index.d.ts

@@ -8,3 +8,4 @@ export * from './GaugeChart';
 export * from './BarGaugeChart';
 export * from './BigNumberChart';
 export * from './CandlestickChart';
+export * from './utils/nivoReact19Compat';

package/dist/components/Charts/utils/nivoReact19Compat.d.ts

@@ -0,0 +1,18 @@
+import { type ComponentType } from 'react';
+/**
+ * React 19 compatibility wrapper for Nivo responsive components.
+ *
+ * @nivo components can be received as module objects instead of functions due to
+ * CommonJS/ESM interop issues. This wrapper detects and unwraps such objects,
+ * then creates a functional component wrapper.
+ *
+ * The unwrapping process checks for:
+ * - .default export (CommonJS/ESM default export)
+ * - .ResponsiveWrapper property (Nivo's internal wrapper)
+ * - Direct function component
+ *
+ * @param Component - The Nivo responsive component (e.g., ResponsiveLine, ResponsivePie)
+ * @param displayName - Display name for debugging in React DevTools
+ * @returns A React 19 compatible functional component
+ */
+export declare function wrapNivoResponsiveComponent<T extends ComponentType<any>>(Component: T, displayName?: string): T;

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

@@ -1,4 +1,4 @@
-import { MutableRefObject, ReactNode } from 'react';
+import { RefObject, ReactNode } from 'react';
 import { Control, FieldPath, FieldValues, UseFormReturn } from 'react-hook-form';
 export interface CheckboxProps extends Partial<Pick<UseFormReturn, 'register'>> {
     text?: ReactNode;
@@ -10,7 +10,7 @@ export interface CheckboxProps extends Partial<Pick<UseFormReturn, 'register'>>
     isIndeterminate?: boolean;
     name?: string;
     isRequired?: boolean;
-    ref?: MutableRefObject<HTMLInputElement>;
+    ref?: RefObject<HTMLInputElement>;
     color?: 'green' | 'blue' | 'custom';
     as?: React.ElementType;
     className?: string;

package/dist/components/CollapsibleNavBar/components/TriggerIcon.d.ts

@@ -1,9 +1,11 @@
+import { CSSObject } from '@emotion/react';
 import type { MapIconsType, SVGProps } from '../../Icon/types';
-export declare const TriggerIcon: ({ iconName, iconSize, className, CustomIcon, }: {
+export declare const TriggerIcon: ({ iconName, iconSize, className, CustomIcon, css: cssProp, }: {
     iconName: keyof MapIconsType;
     iconSize?: number;
     className?: string;
     CustomIcon?: (props: Omit<SVGProps, "fill"> & {
         showIconTooltip?: boolean;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
+    css?: CSSObject;
 }) => import("@emotion/react/jsx-runtime").JSX.Element;

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

@@ -1,13 +1,14 @@
 import { CSSProperties } from 'react';
 import { PathPattern } from 'react-router-dom';
+import { CSSObject } from '@emotion/react';
 import { NavBarExtendedGroup, NavBarExtendedItem, NavBarExtendedSubItem } from '../..';
 export interface CollapsibleNavBarItem extends NavBarExtendedItem {
     iconSize: number;
-    css?: React.CSSProperties;
+    css?: CSSObject;
 }
 export interface CollapsibleNavBarGroup<T extends NavBarExtendedSubItem = NavBarExtendedSubItem> extends NavBarExtendedGroup<T> {
     iconSize: number;
-    css?: React.CSSProperties;
+    css?: CSSObject;
     prefix: string;
 }
 export interface CollapsibleNavBarExtendedProps<T extends NavBarExtendedSubItem = NavBarExtendedSubItem> {

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -1,2 +1,2 @@
 import { DateRangePickerProps } from './types';
-export declare const DateRangePicker: ({ format, openCalendarMode, showCalendarIcon, showStatusArea, rangePickerType, ...rest }: DateRangePickerProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const DateRangePicker: ({ format, showCalendarIcon, showStatusArea, rangePickerType, ...rest }: DateRangePickerProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/DateRangePicker/components/TriggerInput.d.ts

@@ -1,7 +1,4 @@
-import { MouseEventHandler } from 'react';
-export declare const TriggerInput: ({ datepickerType, withPopover, className, onClick, }: {
+export declare const TriggerInput: ({ datepickerType, className, }: {
     datepickerType: "from" | "to";
-    withPopover?: boolean;
     className?: string;
-    onClick: MouseEventHandler<HTMLInputElement>;
 }) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/DateRangePicker/hooks/index.d.ts

@@ -1,3 +1,4 @@
 export * from './useDateRangePicker';
 export * from './useDatePickerMask';
 export * from './useRangeHighlighting';
+export * from './useRangeSelection';

package/dist/components/DateRangePicker/hooks/useDatePickerMask.d.ts

@@ -1,10 +1,4 @@
-import { DateRangePickerProps } from '../types';
-export declare const useDatePickerMask: ({ maskOptions, formatIndexes, dateMinParts, dateMaxParts, }: Pick<DateRangePickerProps, "maskOptions"> & {
-    formatIndexes: {
-        day: number;
-        month: number;
-        year: number;
-    };
-    dateMinParts: number[];
-    dateMaxParts: number[];
+import { type MaskOptions } from '@react-input/mask';
+export declare const useDatePickerMask: ({ maskOptions, }: {
+    maskOptions?: MaskOptions;
 }) => import("react").MutableRefObject<HTMLInputElement>;

package/dist/components/DateRangePicker/hooks/useDateRangePicker.d.ts

@@ -1,4 +1,6 @@
+import React from 'react';
 import { DateTime } from 'luxon';
+import { useMergeRefs } from '@floating-ui/react';
 import { CalendarType, DateRangePickerProps, DateTimeTuple } from '../types';
 export declare const useDateRangePicker: ({ dateMin, dateMax, name: _name, format: propFormat, maskOptions, isOpenState, defaultValue, rangePickerType, onOpen, onClose, onError, onChange, ...rest }: DateRangePickerProps & {
     isOpenState?: boolean;
@@ -10,31 +12,32 @@ export declare const useDateRangePicker: ({ dateMin, dateMax, name: _name, forma
     };
     dateMinParts: number[];
     dateMaxParts: number[];
-    dateMinDT: DateTime<true> | DateTime<false>;
-    dateMaxDT: DateTime<true> | DateTime<false>;
+    dateMinDT: DateTime;
+    dateMaxDT: DateTime;
     dateTime: DateTimeTuple;
-    inputValueFrom: any;
-    inputValueTo: any;
-    calendarViewDateTime: [DateTime<boolean> | undefined, DateTime<boolean> | undefined];
-    maskInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    inputValueFrom?: string;
+    inputValueTo?: string;
+    calendarViewDateTime: DateTimeTuple;
     calendarType: CalendarType;
-    lastChangedDate: [Date | undefined, Date | undefined];
+    lastChangedDate?: [Date | undefined, Date | undefined];
     luxonFormat: string;
     lastFocusedElement: "from" | "to";
     nameFrom: string;
     nameTo: string;
     currentIndex: number;
-    currentCalendarViewDT: DateTime<boolean>;
+    currentCalendarViewDT: DateTime;
     isOpen: boolean;
-    status: "error" | "success" | "basic" | undefined;
-    inputFromRef: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null;
-    inputToRef: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null;
-    setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-    handleSetIsOpen: (open: boolean) => void;
-    setLastFocusedElement: import("react").Dispatch<import("react").SetStateAction<"from" | "to">>;
+    status?: "error" | "success" | "basic";
+    inputFromRef: ReturnType<typeof useMergeRefs<HTMLInputElement | null>>;
+    inputToRef: ReturnType<typeof useMergeRefs<HTMLInputElement | null>>;
+    setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    setLastFocusedElement: React.Dispatch<React.SetStateAction<"from" | "to">>;
     safeOnChange: (newDateTime?: DateTime) => void;
-    setCalendarType: import("react").Dispatch<import("react").SetStateAction<CalendarType>>;
-    setCalendarViewDateTime: import("react").Dispatch<import("react").SetStateAction<[DateTime<boolean> | undefined, DateTime<boolean> | undefined]>>;
-    setDateTime: import("react").Dispatch<import("react").SetStateAction<DateTimeTuple>>;
-    handleBlur: import("react").FocusEventHandler<HTMLInputElement>;
+    setCalendarType: React.Dispatch<React.SetStateAction<CalendarType>>;
+    setCalendarViewDateTime: React.Dispatch<React.SetStateAction<DateTimeTuple>>;
+    setDateTime: React.Dispatch<React.SetStateAction<DateTimeTuple>>;
+    handleBlur: React.FocusEventHandler<HTMLInputElement>;
+    rangeSelectionStep: "start" | "end" | null;
+    setRangeSelectionStep: React.Dispatch<React.SetStateAction<"start" | "end" | null>>;
+    clearInputValue: (field: "from" | "to") => void;
 };

package/dist/components/DateRangePicker/hooks/useRangeSelection.d.ts

@@ -0,0 +1,20 @@
+import { DateTime } from 'luxon';
+type UseRangeSelectionOptions = {
+    /**
+     * Function to create the new DateTime from the selected value
+     */
+    createNewDate: (selectedValue: number | string) => DateTime | undefined;
+    /**
+     * Function to format the date for comparison (e.g., 'D' for days, 'yyyy-MM' for months, 'yyyy' for years)
+     */
+    getComparisonFormat: () => string;
+};
+export declare const useRangeSelection: ({ createNewDate, getComparisonFormat, }: UseRangeSelectionOptions) => {
+    handleRangeSelect: (selectedValue: number | string) => void;
+    getDateSelectionState: (currentDT: DateTime) => {
+        isCalendarFirstDateSelected: boolean;
+        isCalendarSecondDateSelected: boolean;
+        isCalendarDateSelected: boolean;
+    };
+};
+export {};

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

@@ -1,4 +1,4 @@
-import { Dispatch, MouseEventHandler, SetStateAction } from 'react';
+import { Dispatch, MouseEventHandler, SetStateAction, FocusEventHandler } from 'react';
 import { DateTime } from 'luxon';
 import { useMask } from '@react-input/mask';
 import { FieldContextValue } from '../Field/FieldProvider';
@@ -14,7 +14,6 @@ export type DateRangePickerProps = {
     value?: [string | undefined, string | undefined];
     defaultValue?: [string, string];
     maskOptions?: Parameters<typeof useMask>[0];
-    openCalendarMode?: 'icon' | 'input' | 'both';
     inputProps?: Partial<InputProps>;
     status?: FieldContextValue['status'];
     showStatusArea?: boolean;
@@ -46,7 +45,8 @@ export type DateRangePickerProps = {
     onError?: (date: unknown, error?: string | null) => void;
     onMonthChange?: (date: Date) => void;
     onYearChange?: (date: Date) => void;
-    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    onBlur?: FocusEventHandler<HTMLInputElement>;
+    allowReverseSelection?: boolean;
 };
 export type DateTimeTuple = [DateTime | undefined, DateTime | undefined];
 export type DateRangePickerContextProps = Omit<DateRangePickerProps, 'dateMin' | 'dateMax'> & {
@@ -76,10 +76,12 @@ export type DateRangePickerContextProps = Omit<DateRangePickerProps, 'dateMin' |
     safeOnChange?: (date?: DateTime) => void;
     setLastFocusedElement: Dispatch<SetStateAction<LastFocusedElement>>;
     handleToggleOpen: MouseEventHandler<HTMLButtonElement | HTMLInputElement>;
-    handleSetIsOpen: (open: boolean) => void;
     setCalendarViewDateTime: Dispatch<SetStateAction<DateTimeTuple>>;
     setDateTime: Dispatch<SetStateAction<DateTimeTuple>>;
     setIsOpen: Dispatch<SetStateAction<boolean>>;
     setCalendarType: Dispatch<SetStateAction<CalendarType>>;
+    rangeSelectionStep: 'start' | 'end' | null;
+    setRangeSelectionStep: Dispatch<SetStateAction<'start' | 'end' | null>>;
+    clearInputValue: (field: 'from' | 'to') => void;
 };
 export type CalendarType = 'days' | 'months' | 'years';

package/dist/components/DateRangePicker/useDateRangePickerContext.d.ts

@@ -1 +1,2 @@
-export declare const useDateRangePickerContext: () => import("./types").DateRangePickerContextProps;
+import { DateRangePickerContextProps } from './types';
+export declare const useDateRangePickerContext: () => DateRangePickerContextProps;

package/dist/components/Drawer/index.d.ts

@@ -1,2 +1,3 @@
 export * as Drawer from './index.parts';
-export { useDrawer, UseDrawerOptions } from './useDrawer';
+export { useDrawer } from './useDrawer';
+export type { UseDrawerOptions } from './useDrawer';

package/dist/components/Field/FieldControl.d.ts

@@ -1,7 +1,7 @@
 import React, { HTMLAttributes } from 'react';
 import { FieldContextValue } from './FieldProvider';
 export interface FieldControlProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
-    controlRef?: React.RefObject<HTMLElement>;
+    controlRef?: React.RefObject<HTMLElement | null>;
     children: React.ReactNode | ((props: FieldContextValue) => React.ReactNode);
 }
 export declare const FieldControl: React.ForwardRefExoticComponent<FieldControlProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Filters/FiltersContext.d.ts

@@ -2,8 +2,8 @@ import { UseTableDataResult } from '../TableFilters/hooks/useTableData';
 import { BaseSyntheticEvent } from 'react';
 export declare const FiltersContext: import("react").Context<{
     checkboxData: import("../TableFilters/types").TableFilterConfig;
-    wrapperRef: import("react").RefObject<HTMLElement> | undefined;
-    refsList: import("react").MutableRefObject<HTMLElement | null>[];
+    wrapperRef: import("react").RefObject<HTMLElement | null> | undefined;
+    refsList: import("react").RefObject<HTMLElement | null>[];
     setElementRef: (groupName: string, element: HTMLElement | null) => void;
     onCheckboxToggle: (groupName: string, name: string | number) => void;
     onDropdownChange: (groupName: string, name: string | number) => void;
@@ -13,8 +13,8 @@ export declare const FiltersContext: import("react").Context<{
 }>;
 export declare const useFiltersContext: () => {
     checkboxData: import("../TableFilters/types").TableFilterConfig;
-    wrapperRef: import("react").RefObject<HTMLElement> | undefined;
-    refsList: import("react").MutableRefObject<HTMLElement | null>[];
+    wrapperRef: import("react").RefObject<HTMLElement | null> | undefined;
+    refsList: import("react").RefObject<HTMLElement | null>[];
     setElementRef: (groupName: string, element: HTMLElement | null) => void;
     onCheckboxToggle: (groupName: string, name: string | number) => void;
     onDropdownChange: (groupName: string, name: string | number) => void;

package/dist/components/Filters/hooks/useVisibility.d.ts

@@ -3,8 +3,8 @@ import { ElementInfo } from '../types';
 export type RefsByKey = Record<string, ElementInfo>;
 type UseVisibilityParams = {
     checkboxData: TableFilterConfig;
-    refsList: Array<React.MutableRefObject<HTMLElement | null>>;
-    wrapperRef?: React.RefObject<HTMLElement>;
+    refsList: Array<React.RefObject<HTMLElement | null>>;
+    wrapperRef?: React.RefObject<HTMLElement | null>;
     onVisibilityProcessed?: () => void;
 };
 export declare const useVisibility: ({ checkboxData, wrapperRef, refsList, onVisibilityProcessed, }: UseVisibilityParams) => {

package/dist/components/FullscreenModeContext.d.ts

@@ -8,7 +8,4 @@ export type FullscreenModeContextType = {
 export declare const FullscreenModeContext: import("react").Context<FullscreenModeContextType>;
 export declare const FullscreenModeProvider: ({ children, }: React.PropsWithChildren) => import("@emotion/react/jsx-runtime").JSX.Element;
 export declare const useFullscreenMode: () => FullscreenModeContextType;
-export declare const WithFullscreenMode: <T extends object>(Component: React.ComponentType<T>, rest?: Parameters<typeof FullscreenModeProvider>[0]) => {
-    (props: T): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const WithFullscreenMode: <T extends object>(Component: React.ComponentType<T>, rest?: Parameters<typeof FullscreenModeProvider>[0]) => React.ComponentType<T>;

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

@@ -1,8 +1,10 @@
 export interface IndicatorProps {
     isVisible: boolean;
-    children: React.ReactElement;
+    children: React.ReactElement<{
+        ref: React.Ref<HTMLDivElement | null>;
+    }>;
     position?: 'right' | 'left';
     background?: string;
-    text?: string | number | JSX.Element;
+    text?: string | number | React.JSX.Element;
 }
 export type ChildrenDataProps = Record<string, number>;

package/dist/components/ModalDismissButton/ModalDismissButton.d.ts

@@ -1,4 +1,4 @@
-declare function ModalDismissButton({ children: child }: {
-    children: JSX.Element;
+declare function ModalDismissButton({ children: child, }: {
+    children: React.JSX.Element;
 }): import("react").FunctionComponentElement<any>;
 export default ModalDismissButton;

package/dist/components/ModalOpenButton/ModalOpenButton.d.ts

@@ -1,4 +1,4 @@
 declare function ModalOpenButton({ children: child }: {
-    children: JSX.Element;
+    children: React.JSX.Element;
 }): import("react").FunctionComponentElement<any>;
 export default ModalOpenButton;

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

@@ -8,7 +8,7 @@ export interface NavBarProps {
 export type CustomIconProps = (props: {
     className?: string;
     showIconTooltip?: boolean;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export type NavBarExtendedItem = {
     CustomIcon?: CustomIconProps;
     path: string;

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

@@ -1,10 +1,10 @@
 import { NotificationCardProps } from '../NotificationCard';
 export interface NotificationMenuProps {
-    trigger: string | JSX.Element;
+    trigger: string | React.JSX.Element;
     notifications: Array<NotificationCardProps>;
     children: React.ReactNode;
     onClick?: () => void;
     isLoading: boolean;
-    leftButton?: string | JSX.Element | null;
-    rightButton?: string | JSX.Element;
+    leftButton?: string | React.JSX.Element | null;
+    rightButton?: string | React.JSX.Element;
 }

package/dist/components/Pagination/WithPagination.d.ts

@@ -1,4 +1,2 @@
-export declare const WithPagination: <T extends object>(Component: React.ComponentType<T>) => {
-    (props: T): import("@emotion/react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+import React from 'react';
+export declare const WithPagination: <T extends object>(Component: React.ComponentType<T>) => React.ComponentType<T>;

package/dist/components/TableFilters/hooks/useTableData.d.ts

@@ -2,7 +2,7 @@ import { BaseSyntheticEvent } from 'react';
 import { TableFilterConfig } from '../types';
 export interface UseTableDataParameters {
     initialState?: TableFilterConfig;
-    wrapperRef?: React.RefObject<HTMLElement>;
+    wrapperRef?: React.RefObject<HTMLElement | null>;
     updatedCheckboxData?: TableFilterConfig;
     handleCancel?: () => void;
     handleClear?: () => void;
@@ -15,8 +15,8 @@ export interface UseTableDataParameters {
 }
 export declare const useTableData: ({ initialState, wrapperRef, updatedCheckboxData, handleCancel, handleSubmit, handleClear, handleDropdownChange, }: UseTableDataParameters) => {
     checkboxData: TableFilterConfig;
-    wrapperRef: import("react").RefObject<HTMLElement> | undefined;
-    refsList: import("react").MutableRefObject<HTMLElement | null>[];
+    wrapperRef: import("react").RefObject<HTMLElement | null> | undefined;
+    refsList: import("react").RefObject<HTMLElement | null>[];
     setElementRef: (groupName: string, element: HTMLElement | null) => void;
     onCheckboxToggle: (groupName: string, name: string | number) => void;
     onDropdownChange: (groupName: string, name: string | number) => void;

package/dist/components/Tooltip/SimpleChartTooltip.d.ts

@@ -1,2 +1,3 @@
+import { LineSeries } from '@nivo/line';
 import { SimpleChartTooltipProps } from './types';
-export declare const SimpleChartTooltip: ({ point, size, renderValue, }: SimpleChartTooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const SimpleChartTooltip: <Series extends LineSeries>({ point, size, renderValue, }: SimpleChartTooltipProps<Series>) => import("@emotion/react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,5 @@
 import { useInteractions, FloatingArrow, Placement, UseFloatingReturn, OffsetOptions } from '@floating-ui/react';
-import { PointTooltipProps, Point } from '@nivo/line';
+import { PointTooltipProps, Point, LineSeries } from '@nivo/line';
 import { MapIconsType } from '../Icon/types';
 import { ProgressBarProps } from '../ProgressBar/types';
 import { SerializedStyles } from '@emotion/react';
@@ -20,11 +20,11 @@ export interface TooltipProps extends CommonProps {
 }
 export type UseTooltipArgs = Omit<TooltipProps, 'children'>;
 type UseInteractions = ReturnType<typeof useInteractions>;
-interface MutableRefObject<T> {
+interface RefObject<T> {
     current: T;
 }
 export type UseTooltip = (props?: UseTooltipArgs) => Pick<TooltipProps, 'size' | 'hasArrow' | 'arrowProps'> & {
-    arrowRef: MutableRefObject<null>;
+    arrowRef: RefObject<null>;
     isOpen: boolean;
     setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
 } & UseFloatingReturn & UseInteractions;
@@ -48,8 +48,8 @@ export interface TooltipTriggerProps {
     children: React.ReactNode;
     className?: string;
 }
-export type SimpleChartTooltipProps = PointTooltipProps & Pick<TooltipProps, 'size'> & {
-    renderValue?: (data: Point['data']) => React.ReactNode;
+export type SimpleChartTooltipProps<Series extends LineSeries> = PointTooltipProps<Series> & Pick<TooltipProps, 'size'> & {
+    renderValue?: (data: Point<Series>['data']) => React.ReactNode;
 };
 export interface ProgressChartTooltipProps {
     caption: string;

package/dist/components/TooltipTrigger/TooltipTrigger.d.ts

@@ -1,3 +1,3 @@
 import { TooltipTriggerProps } from '../Tooltip/types';
-declare const TooltipTrigger: ({ children, className }: TooltipTriggerProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
+declare const TooltipTrigger: ({ children, className }: TooltipTriggerProps) => import("react").ReactElement<TooltipTriggerProps, string | import("react").JSXElementConstructor<any>> | null;
 export default TooltipTrigger;

package/dist/components/Typeahead/Typeahead.context.d.ts

@@ -6,11 +6,11 @@ export declare const TypeaheadContext: React.Context<{
     isDisabled: boolean | undefined;
     optionsWithKey: Record<string | number, import("./types").TypeaheadOptionProps>;
     selectedItems: import("./types").TypeaheadValue[];
-    inputRef: React.RefObject<HTMLInputElement>;
+    inputRef: React.RefObject<HTMLInputElement | null>;
     firstSuggestion: string;
     isMultiple: boolean | undefined;
     typeaheadId: string;
-    triggerRef: React.RefObject<HTMLDivElement>;
+    triggerRef: React.RefObject<HTMLDivElement | null>;
     className: string | undefined;
     startIcon: React.ReactNode;
     endIcon: React.ReactNode;
@@ -23,8 +23,8 @@ export declare const TypeaheadContext: React.Context<{
     status: "error" | "success" | "basic";
     error: import("react-hook-form").FieldError | import("react-hook-form").Merge<import("react-hook-form").FieldError, import("react-hook-form").FieldErrorsImpl<any>> | undefined;
     placeholder: string | null | undefined;
-    options: (React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null)[];
-    useFormResult: UseFormReturn<FieldValues, any, undefined>;
+    options: (React.ReactElement<any, string | React.JSXElementConstructor<any>> | null)[];
+    useFormResult: UseFormReturn<FieldValues, any, FieldValues>;
     register: import("react-hook-form").UseFormRegister<FieldValues>;
     setValue: import("react-hook-form").UseFormSetValue<FieldValues>;
     onChange: ((selectedItem: import("./types").TypeaheadValue, isSelected: boolean) => void) | undefined;

package/dist/components/Typeahead/useTypeahead.d.ts

@@ -6,11 +6,11 @@ export declare const useTypeahead: ({ name, isOpen: isInitOpen, selectedItems: p
     isDisabled: boolean | undefined;
     optionsWithKey: Record<string | number, TypeaheadOptionProps>;
     selectedItems: TypeaheadValue[];
-    inputRef: React.RefObject<HTMLInputElement>;
+    inputRef: React.RefObject<HTMLInputElement | null>;
     firstSuggestion: string;
     isMultiple: boolean | undefined;
     typeaheadId: string;
-    triggerRef: React.RefObject<HTMLDivElement>;
+    triggerRef: React.RefObject<HTMLDivElement | null>;
     className: string | undefined;
     startIcon: React.ReactNode;
     endIcon: React.ReactNode;
@@ -23,8 +23,8 @@ export declare const useTypeahead: ({ name, isOpen: isInitOpen, selectedItems: p
     status: "error" | "success" | "basic";
     error: import("react-hook-form").FieldError | import("react-hook-form").Merge<import("react-hook-form").FieldError, import("react-hook-form").FieldErrorsImpl<any>> | undefined;
     placeholder: string | null | undefined;
-    options: (React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null)[];
-    useFormResult: import("react-hook-form").UseFormReturn<import("react-hook-form").FieldValues, any, undefined>;
+    options: (React.ReactElement<any, string | React.JSXElementConstructor<any>> | null)[];
+    useFormResult: import("react-hook-form").UseFormReturn<import("react-hook-form").FieldValues, any, import("react-hook-form").FieldValues>;
     register: import("react-hook-form").UseFormRegister<import("react-hook-form").FieldValues>;
     setValue: import("react-hook-form").UseFormSetValue<import("react-hook-form").FieldValues>;
     onChange: ((selectedItem: TypeaheadValue, isSelected: boolean) => void) | undefined;

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

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 export interface UserProfileProps {
     name: string;
     email: string;
-    trigger: string | JSX.Element;
+    trigger: string | React.JSX.Element;
     onClick: () => void;
     logOutText?: string;
     className?: string;