@orfium/ictinus 5.5.0 → 5.5.1

package/dist/index.d.ts

@@ -1,3479 +0,0 @@
-/// <reference types="react" />
-export { rem } from 'polished';
-import * as react_media from 'react-media';
-import * as _emotion_react from '@emotion/react';
-import { CSSObject as CSSObject$1 } from '@emotion/react';
-import { DotKeys as DotKeys$1 } from 'theme/tokens/utils';
-export { default as ClickAwayListener } from 'components/utils/ClickAwayListener';
-import * as utils_types from 'utils/types';
-import { TestId as TestId$1, TestProps as TestProps$1 } from 'utils/types';
-import * as React$1 from 'react';
-import React__default, { ButtonHTMLAttributes, MouseEvent, InputHTMLAttributes, Key, FC, FCC, ReactNode, Dispatch } from 'react';
-import { LinkProps } from 'components/Link/Link.types';
-import * as _emotion_serialize from '@emotion/serialize';
-import { CSSObject } from '@emotion/serialize';
-import { ButtonTypes as ButtonTypes$1, PrimitiveButtonTypes } from 'components/Button/Button.types';
-import { IconButtonShape as IconButtonShape$1 } from 'components/IconButton';
-import { ButtonBaseProps as ButtonBaseProps$1 } from 'components/ButtonBase/ButtonBase';
-import { DivProps as DivProps$1, CommonButtonProps as CommonButtonProps$1 } from 'utils/common';
-import { AvatarProps as AvatarProps$1 } from 'components/Avatar';
-import * as components_Icon from 'components/Icon';
-import { AcceptedIconNames as AcceptedIconNames$1 } from 'components/Icon';
-import { Elevation as Elevation$1 } from 'index';
-import { SpacingKey as SpacingKey$1 } from 'theme/globals/spacing';
-import { RadioAria, CheckboxAria, SwitchAria, AriaListBoxProps } from 'react-aria';
-import { RadioGroupState } from 'react-stately';
-import { LabelConfig as LabelConfig$1 } from 'components/Controls/Controls.types';
-import { Dayjs } from 'utils/date';
-import { TextInputBaseProps as TextInputBaseProps$1 } from 'components/TextInputBase';
-import { FilterType as FilterType$1 } from 'components/Filter/Filter.types';
-import { Location } from 'history';
-import { Params } from 'react-router-dom';
-import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import * as prop_types from 'prop-types';
-import { ReactComponentLike } from 'prop-types';
-import { ComponentSizes as ComponentSizes$1 } from 'types';
-import { SelectOption as SelectOption$1 } from 'components/Select';
-import { SectionProps } from '@react-types/shared';
-import { ListRowSize as ListRowSize$1 } from 'components/List';
-import { TooltipPlacement as TooltipPlacement$1 } from 'components/Tooltip/Tooltip.types';
-import { FilterProps as FilterProps$1, SingleFilterProps as SingleFilterProps$1 } from 'components/Filter';
-import { TextFieldProps as TextFieldProps$1 } from 'components/TextField';
-import { ThemeConfig } from 'theme';
-import { FontSpacing } from 'theme/tokens/semantic/typography';
-
-declare const queriesKeys: readonly ["des1920", "des1440", "des1366", "des1200", "tab1024", "tab970", "tab750", "mob480", "mob320"];
-declare const queriesSizes: Record<typeof queriesKeys[number], string>;
-declare const useBreakpoints: () => react_media.QueryResults<Record<"des1920" | "des1440" | "des1366" | "des1200" | "tab1024" | "tab970" | "tab750" | "mob480" | "mob320", string>>;
-
-declare const grid: _emotion_react.SerializedStyles;
-declare const well: _emotion_react.SerializedStyles;
-declare const centerAbsoluteVertical: _emotion_react.SerializedStyles;
-declare const transition: (s: number, type?: string) => _emotion_react.SerializedStyles;
-declare const lineEllipsis: _emotion_react.SerializedStyles;
-declare const flex: _emotion_react.SerializedStyles;
-declare const flexCenter: _emotion_react.SerializedStyles;
-declare const flexCenterVertical: _emotion_react.SerializedStyles;
-declare const plainTextButton: _emotion_react.SerializedStyles;
-
-declare const functions_d_centerAbsoluteVertical: typeof centerAbsoluteVertical;
-declare const functions_d_flex: typeof flex;
-declare const functions_d_flexCenter: typeof flexCenter;
-declare const functions_d_flexCenterVertical: typeof flexCenterVertical;
-declare const functions_d_grid: typeof grid;
-declare const functions_d_lineEllipsis: typeof lineEllipsis;
-declare const functions_d_plainTextButton: typeof plainTextButton;
-declare const functions_d_transition: typeof transition;
-declare const functions_d_well: typeof well;
-declare namespace functions_d {
-  export {
-    functions_d_centerAbsoluteVertical as centerAbsoluteVertical,
-    functions_d_flex as flex,
-    functions_d_flexCenter as flexCenter,
-    functions_d_flexCenterVertical as flexCenterVertical,
-    functions_d_grid as grid,
-    functions_d_lineEllipsis as lineEllipsis,
-    functions_d_plainTextButton as plainTextButton,
-    functions_d_transition as transition,
-    functions_d_well as well,
-  };
-}
-
-type Elevation = {
-    '01': string;
-    '02': string;
-    '03': string;
-    '04': string;
-};
-declare const elevation: Elevation;
-
-type elevation_d_Elevation = Elevation;
-declare namespace elevation_d {
-  export {
-    elevation_d_Elevation as Elevation,
-    elevation as default,
-  };
-}
-
-declare const spacing$2: {
-    readonly '0': {
-        readonly value: "0px";
-        readonly type: "spacing";
-    };
-    readonly '1': {
-        readonly value: "1px";
-        readonly type: "spacing";
-    };
-    readonly '2': {
-        readonly value: "2px";
-        readonly type: "spacing";
-    };
-    readonly '3': {
-        readonly value: "4px";
-        readonly type: "spacing";
-    };
-    readonly '4': {
-        readonly value: "8px";
-        readonly type: "spacing";
-    };
-    readonly '5': {
-        readonly value: "12px";
-        readonly type: "spacing";
-    };
-    readonly '6': {
-        readonly value: "16px";
-        readonly type: "spacing";
-    };
-    readonly '7': {
-        readonly value: "20px";
-        readonly type: "spacing";
-    };
-    readonly '8': {
-        readonly value: "24px";
-        readonly type: "spacing";
-    };
-    readonly '9': {
-        readonly value: "32px";
-        readonly type: "spacing";
-    };
-    readonly '10': {
-        readonly value: "36px";
-        readonly type: "spacing";
-    };
-    readonly '11': {
-        readonly value: "40px";
-        readonly type: "spacing";
-    };
-    readonly '12': {
-        readonly value: "44px";
-        readonly type: "spacing";
-    };
-};
-
-type SpacingKey = keyof typeof spacing$2;
-type Spacing = {
-    get: (val: SpacingKey, fn?: (val: string) => unknown) => string;
-};
-declare const spacing$1: Spacing;
-
-type spacing_d_Spacing = Spacing;
-type spacing_d_SpacingKey = SpacingKey;
-declare namespace spacing_d {
-  export {
-    spacing_d_Spacing as Spacing,
-    spacing_d_SpacingKey as SpacingKey,
-    spacing$1 as default,
-  };
-}
-
-declare const fontFamily: {
-    readonly roboto: {
-        readonly value: "Roboto";
-        readonly type: "fontFamilies";
-    };
-    readonly robotoMono: {
-        readonly value: "Roboto Mono";
-        readonly type: "fontFamilies";
-        readonly description: "alternative font family used for numerical table cells";
-    };
-};
-
-declare const fontSize: {
-    readonly '1': {
-        readonly value: "10px";
-        readonly type: "fontSizes";
-        readonly description: "smallest possible body size. Used only for avatar initials";
-    };
-    readonly '2': {
-        readonly value: "12px";
-        readonly type: "fontSizes";
-    };
-    readonly '3': {
-        readonly value: "14px";
-        readonly type: "fontSizes";
-    };
-    readonly '4': {
-        readonly value: "16px";
-        readonly type: "fontSizes";
-    };
-    readonly '5': {
-        readonly value: "18px";
-        readonly type: "fontSizes";
-    };
-    readonly '6': {
-        readonly value: "20px";
-        readonly type: "fontSizes";
-    };
-    readonly '7': {
-        readonly value: "22px";
-        readonly type: "fontSizes";
-    };
-    readonly '8': {
-        readonly value: "24px";
-        readonly type: "fontSizes";
-    };
-    readonly '9': {
-        readonly value: "28px";
-        readonly type: "fontSizes";
-    };
-    readonly '10': {
-        readonly value: "32px";
-        readonly type: "fontSizes";
-    };
-};
-
-declare const fontWeight: {
-    readonly regular: {
-        readonly value: "400";
-        readonly type: "fontWeights";
-        readonly description: "fontWeight=Regular";
-    };
-    readonly medium: {
-        readonly value: "500";
-        readonly type: "fontWeights";
-        readonly description: "FontWeight=Medium";
-    };
-    readonly bold: {
-        readonly value: "700";
-        readonly type: "fontWeights";
-        readonly description: "FontWeight=Bold";
-    };
-};
-
-declare const letterSpacing: {
-    readonly '0': {
-        readonly value: "0px";
-        readonly type: "letterSpacing";
-    };
-    readonly '1': {
-        readonly value: "0.1px";
-        readonly type: "letterSpacing";
-    };
-    readonly '2': {
-        readonly value: "0.25px";
-        readonly type: "letterSpacing";
-    };
-    readonly '3': {
-        readonly value: "0.5px";
-        readonly type: "letterSpacing";
-    };
-};
-
-declare const lineHeight: {
-    readonly '1': {
-        readonly value: "14px";
-        readonly type: "lineHeights";
-        readonly description: "For form field labels only";
-    };
-    readonly '2': {
-        readonly value: "16px";
-        readonly type: "lineHeights";
-    };
-    readonly '3': {
-        readonly value: "18px";
-        readonly type: "lineHeights";
-    };
-    readonly '4': {
-        readonly value: "20px";
-        readonly type: "lineHeights";
-    };
-    readonly '5': {
-        readonly value: "22px";
-        readonly type: "lineHeights";
-    };
-    readonly '6': {
-        readonly value: "24px";
-        readonly type: "lineHeights";
-    };
-    readonly '7': {
-        readonly value: "28px";
-        readonly type: "lineHeights";
-    };
-    readonly '8': {
-        readonly value: "32px";
-        readonly type: "lineHeights";
-    };
-    readonly '9': {
-        readonly value: "36px";
-        readonly type: "lineHeights";
-    };
-    readonly '10': {
-        readonly value: "40px";
-        readonly type: "lineHeights";
-    };
-    readonly '11': {
-        readonly value: "48px";
-        readonly type: "lineHeights";
-    };
-};
-
-declare const textCase: {
-    readonly none: {
-        readonly value: "none";
-        readonly type: "textCase";
-    };
-    readonly uppercase: {
-        readonly value: "uppercase";
-        readonly type: "textCase";
-    };
-};
-
-declare const textDecoration: {
-    readonly link: {
-        readonly value: "underline";
-        readonly type: "textDecoration";
-        readonly description: "underline that appears on link while hovering";
-    };
-    readonly none: {
-        readonly value: "none";
-        readonly type: "textDecoration";
-    };
-};
-
-type FontSizeKey = keyof typeof fontSize;
-type FontWeightKey = keyof typeof fontWeight;
-type FontFamilyKey = keyof typeof fontFamily;
-type LineHeightKey = keyof typeof lineHeight;
-type LetterSpacingKey = keyof typeof letterSpacing;
-type TextCaseKey = keyof typeof textCase;
-type TextDecorationKey = keyof typeof textDecoration;
-type FontSize = {
-    get: (val: FontSizeKey, fn?: (val: string) => unknown) => string;
-    /** @TODO remove this custom font-sizes*/
-    '8': string;
-    '11': string;
-    '13': string;
-    '15': string;
-};
-type FontWeight = {
-    get: (val: FontWeightKey, fn?: (val: string) => unknown) => number;
-};
-type FontFamily = {
-    get: (val: FontFamilyKey, fn?: (val: string) => unknown) => string;
-};
-type LineHeight = {
-    get: (val: LineHeightKey, fn?: (val: string) => unknown) => string;
-};
-type LetterSpacing = {
-    get: (val: LetterSpacingKey, fn?: (val: string) => unknown) => string;
-};
-type TextCase = {
-    get: (val: TextCaseKey, fn?: (val: string) => unknown) => string;
-};
-type TextDecoration = {
-    get: (val: TextDecorationKey, fn?: (val: string) => unknown) => string;
-};
-type Typography$1 = {
-    globalFontSize: number;
-    fontSize: FontSize;
-    fontWeight: FontWeight;
-    fontFamily: FontFamily;
-    defaultFontFamily: string;
-    lineHeight: LineHeight;
-    letterSpacing: LetterSpacing;
-    textCase: TextCase;
-    textDecoration: TextDecoration;
-};
-declare const typography$1: Typography$1;
-
-type typography_d_FontFamily = FontFamily;
-type typography_d_FontFamilyKey = FontFamilyKey;
-type typography_d_FontSize = FontSize;
-type typography_d_FontSizeKey = FontSizeKey;
-type typography_d_FontWeight = FontWeight;
-type typography_d_FontWeightKey = FontWeightKey;
-type typography_d_LetterSpacing = LetterSpacing;
-type typography_d_LetterSpacingKey = LetterSpacingKey;
-type typography_d_LineHeight = LineHeight;
-type typography_d_LineHeightKey = LineHeightKey;
-type typography_d_TextCase = TextCase;
-type typography_d_TextCaseKey = TextCaseKey;
-type typography_d_TextDecoration = TextDecoration;
-type typography_d_TextDecorationKey = TextDecorationKey;
-declare namespace typography_d {
-  export {
-    typography_d_FontFamily as FontFamily,
-    typography_d_FontFamilyKey as FontFamilyKey,
-    typography_d_FontSize as FontSize,
-    typography_d_FontSizeKey as FontSizeKey,
-    typography_d_FontWeight as FontWeight,
-    typography_d_FontWeightKey as FontWeightKey,
-    typography_d_LetterSpacing as LetterSpacing,
-    typography_d_LetterSpacingKey as LetterSpacingKey,
-    typography_d_LineHeight as LineHeight,
-    typography_d_LineHeightKey as LineHeightKey,
-    typography_d_TextCase as TextCase,
-    typography_d_TextCaseKey as TextCaseKey,
-    typography_d_TextDecoration as TextDecoration,
-    typography_d_TextDecorationKey as TextDecorationKey,
-    Typography$1 as Typography,
-    typography$1 as default,
-  };
-}
-
-type Overrides = Record<string, any>;
-declare const overrides: Overrides;
-
-type overrides_d_Overrides = Overrides;
-declare namespace overrides_d {
-  export {
-    overrides_d_Overrides as Overrides,
-    overrides as default,
-  };
-}
-
-declare const borderRadius$1: {
-    readonly none: {
-        readonly value: "{borderRadius.0}";
-        readonly type: "borderRadius";
-    };
-    readonly sm: {
-        readonly value: "{borderRadius.1}";
-        readonly type: "borderRadius";
-    };
-    readonly md: {
-        readonly value: "{borderRadius.2}";
-        readonly type: "borderRadius";
-    };
-    readonly lg: {
-        readonly value: "{borderRadius.3}";
-        readonly type: "borderRadius";
-    };
-    readonly xl: {
-        readonly value: "{borderRadius.4}";
-        readonly type: "borderRadius";
-    };
-    readonly circle: {
-        readonly value: "{borderRadius.7}";
-        readonly type: "borderRadius";
-        readonly description: "Circular border radius (100%)";
-    };
-};
-
-type DimensionBorderRadiusKey = DotKeys$1<typeof borderRadius$1>;
-type DimensionBorderRadius = {
-    get: (val: DimensionBorderRadiusKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const borderWidth$1: {
-    readonly default: {
-        readonly value: "{borderWidth.1}";
-        readonly type: "borderWidth";
-        readonly description: "Sets 'default' border width for components";
-    };
-    readonly active: {
-        readonly value: "{borderWidth.2}";
-        readonly type: "borderWidth";
-        readonly description: "Sets 'active' border width for components ";
-    };
-    readonly focused: {
-        readonly value: "{borderWidth.3}";
-        readonly type: "borderWidth";
-        readonly description: "Sets focused container borderWidth for component";
-    };
-    readonly innerFocused: {
-        readonly value: "{borderWidth.2}";
-        readonly type: "borderWidth";
-        readonly description: "Alternative borderWidth for nested focused elements";
-    };
-};
-
-type DimensionBorderWidthKey = DotKeys$1<typeof borderWidth$1>;
-type DimensionBorderWidth = {
-    get: (val: DimensionBorderWidthKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const minHeight: {
-    readonly tableRow: {
-        readonly sm: {
-            readonly value: "{sizing.11}";
-            readonly type: "sizing";
-            readonly description: "Sets min.height for small table row (44px)";
-        };
-        readonly md: {
-            readonly value: "{sizing.13}";
-            readonly type: "sizing";
-            readonly description: "Sets min. height for medium table row (52px)";
-        };
-        readonly lg: {
-            readonly value: "{sizing.15}";
-            readonly type: "sizing";
-            readonly description: "Sets min. height for large table row (60px)";
-        };
-    };
-};
-
-type DimensionMinHeightKey = DotKeys$1<typeof minHeight>;
-type DimensionMinHeight = {
-    get: (val: DimensionMinHeightKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const opacity$1: {
-    readonly disabled: {
-        readonly value: "50%";
-        readonly type: "opacity";
-        readonly description: "'Disabled' state";
-    };
-    readonly enabled: {
-        readonly value: "100%";
-        readonly type: "opacity";
-        readonly description: "'enabled' state";
-    };
-    readonly hidden: {
-        readonly value: "0%";
-        readonly type: "opacity";
-        readonly description: "'hidden' state";
-    };
-};
-
-type DimensionOpacityKey = DotKeys$1<typeof opacity$1>;
-type DimensionOpacity = {
-    get: (val: DimensionOpacityKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const sizing$1: {
-    readonly icon: {
-        readonly xs: {
-            readonly value: "{sizing.3}";
-            readonly type: "sizing";
-            readonly description: "Sets extra small size for icon";
-        };
-        readonly sm: {
-            readonly value: "{sizing.4}";
-            readonly type: "sizing";
-            readonly description: "Sets small size for icon";
-        };
-        readonly md: {
-            readonly value: "{sizing.5}";
-            readonly type: "sizing";
-            readonly description: "Sets medium size for icon";
-        };
-        readonly lg: {
-            readonly value: "{sizing.6}";
-            readonly type: "sizing";
-            readonly description: "Sets large size for icon";
-        };
-        readonly xl: {
-            readonly value: "{sizing.9}";
-            readonly type: "sizing";
-            readonly description: "Sets extra large size for icon";
-        };
-    };
-};
-
-type DimensionSizingKey = DotKeys$1<typeof sizing$1>;
-type DimensionSizing = {
-    get: (val: DimensionSizingKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const spacing: {
-    readonly none: {
-        readonly value: "{spacing.0}";
-        readonly type: "spacing";
-    };
-    readonly '2xs': {
-        readonly value: "{spacing.2}";
-        readonly type: "spacing";
-    };
-    readonly xs: {
-        readonly value: "{spacing.3}";
-        readonly type: "spacing";
-    };
-    readonly sm: {
-        readonly value: "{spacing.4}";
-        readonly type: "spacing";
-    };
-    readonly md: {
-        readonly value: "{spacing.5}";
-        readonly type: "spacing";
-    };
-    readonly lg: {
-        readonly value: "{spacing.6}";
-        readonly type: "spacing";
-    };
-    readonly xl: {
-        readonly value: "{spacing.7}";
-        readonly type: "spacing";
-    };
-    readonly '2xl': {
-        readonly value: "{spacing.8}";
-        readonly type: "spacing";
-    };
-    readonly '3xl': {
-        readonly value: "{spacing.9}";
-        readonly type: "spacing";
-    };
-    readonly '4xl': {
-        readonly value: "{spacing.12}";
-        readonly type: "spacing";
-    };
-};
-
-type DimensionSpacingKey = DotKeys$1<typeof spacing>;
-type DimensionSpacing = {
-    get: (val: DimensionSpacingKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const state$1: {
-    readonly hover: {
-        readonly xs: {
-            readonly value: "{sizing.7}";
-            readonly type: "sizing";
-            readonly description: "Sets extra small hover size";
-        };
-        readonly sm: {
-            readonly value: "{sizing.8}";
-            readonly type: "sizing";
-            readonly description: "Sets small hover size";
-        };
-        readonly md: {
-            readonly value: "{sizing.9}";
-            readonly type: "sizing";
-            readonly description: "Sets medium hover size";
-        };
-        readonly lg: {
-            readonly value: "{sizing.10}";
-            readonly type: "sizing";
-            readonly description: "Sets large hover size";
-        };
-    };
-};
-
-type DimensionStateKey = DotKeys$1<typeof state$1>;
-type DimensionState = {
-    get: (val: DimensionStateKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const borderRadius: {
-    readonly '0': {
-        readonly value: "0 px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 0px";
-    };
-    readonly '1': {
-        readonly value: "2px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 2px";
-    };
-    readonly '2': {
-        readonly value: "4px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 4px";
-    };
-    readonly '3': {
-        readonly value: "8px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 8px";
-    };
-    readonly '4': {
-        readonly value: "16px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 16px";
-    };
-    readonly '5': {
-        readonly value: "36px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 36px";
-    };
-    readonly '6': {
-        readonly value: "48px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 48px";
-    };
-    readonly '7': {
-        readonly value: "9999px";
-        readonly type: "borderRadius";
-        readonly description: "Corner radius = 100px used for circles and pill shaped elements";
-    };
-};
-
-type BorderRadiusKey = keyof typeof borderRadius;
-type BorderRadius = {
-    get: (val: BorderRadiusKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const borderWidth: {
-    readonly '1': {
-        readonly value: "1px";
-        readonly type: "borderWidth";
-        readonly description: "Default 1pxs stroke";
-    };
-    readonly '2': {
-        readonly value: "2px";
-        readonly type: "borderWidth";
-        readonly description: "Default 2pxs stroke";
-    };
-    readonly '3': {
-        readonly value: "4px";
-        readonly type: "borderWidth";
-    };
-};
-
-type BorderWidthKey = keyof typeof borderWidth;
-type BorderWidth = {
-    get: (val: BorderWidthKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const colors$1: {
-    readonly gradient: {
-        readonly '1': {
-            readonly value: "linear-gradient(-90deg, #F814A1 0%, #4945EE 100%)";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "linear-gradient(90deg, #B9CDFC 0%, #B9C0FF 100%)";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "linear-gradient(-90deg, #1B214F 0%, #020D25 100%)";
-            readonly type: "color";
-        };
-    };
-    readonly blue: {
-        readonly '1': {
-            readonly value: "#E9EFFB";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#DAE4FB";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#B8CCFA";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#8EAAEC";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#5E8DF8";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#175BF5";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "#194DCC";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "#173DA0";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "#173382";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "#12204E";
-            readonly type: "color";
-        };
-    };
-    readonly neutral: {
-        readonly '1': {
-            readonly value: "#ffffff";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#F2F4FF";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#B3B5CC";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#52567a";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#262C59";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#111530";
-            readonly type: "color";
-        };
-    };
-    readonly transparent: {
-        readonly '1': {
-            readonly value: "rgba(200,206,255,0)";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "rgba(200,206,255,0.20)";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "rgba(200,206,255,0.30)";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "rgba(200,206,255,0.45)";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "rgba(200,206,255,0.70)";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "rgba(76,86,164,0)";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "rgba(76,86,164,0.20)";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "rgba(76,86,164,0.30)";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "rgba(76,86,164,0.45)";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "rgba(76,86,164,0.70)";
-            readonly type: "color";
-        };
-    };
-    readonly red: {
-        readonly '1': {
-            readonly value: "#FFEBF1";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#FFD6E5";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#FFB2CE";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#FF80AD";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#FF4D8D";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#D4165F";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "#BF1250";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "#831650";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "#601649";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "#33123A";
-            readonly type: "color";
-        };
-    };
-    readonly orange: {
-        readonly '1': {
-            readonly value: "#FFF0D1";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#FFE2A8";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#FFC95C";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#F5A300";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#D67D00";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#9E4214";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "#8B391D";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "#66301E";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "#4D2A24";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "#29201E";
-            readonly type: "color";
-        };
-    };
-    readonly purple: {
-        readonly '1': {
-            readonly value: "#F3EBFF";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#EBDBFF";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#D8BDFF";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#BD8FFF";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#A566FF";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#7531DE";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "#5F33AC";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "#492A89";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "#38246E";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "#211A47";
-            readonly type: "color";
-        };
-    };
-    readonly teal: {
-        readonly '1': {
-            readonly value: "#DCF9F2";
-            readonly type: "color";
-        };
-        readonly '2': {
-            readonly value: "#BFF4E7";
-            readonly type: "color";
-        };
-        readonly '3': {
-            readonly value: "#86EAD1";
-            readonly type: "color";
-        };
-        readonly '4': {
-            readonly value: "#3CDDB4";
-            readonly type: "color";
-        };
-        readonly '5': {
-            readonly value: "#1EBE96";
-            readonly type: "color";
-        };
-        readonly '6': {
-            readonly value: "#107962";
-            readonly type: "color";
-        };
-        readonly '7': {
-            readonly value: "#11695B";
-            readonly type: "color";
-        };
-        readonly '8': {
-            readonly value: "#0F514C";
-            readonly type: "color";
-        };
-        readonly '9': {
-            readonly value: "#104042";
-            readonly type: "color";
-        };
-        readonly '10': {
-            readonly value: "#0E2834";
-            readonly type: "color";
-        };
-    };
-};
-
-/**
- * This generic type to convert an object to a dot notation string deeply while ignoring `value` properties at the end
- * Key paths of figma tokens objects usually used are declared in the following directories:
- *
- * src/theme/globals/constants/*
- * src/theme/tokens/<theme>/variables/*
- * src/theme/tokens/components/variables/*
- *
- * This is needed for all the getToken callbacks to make sure that
- * all the requested paths return a Token (with value/type/description)
- *
- * @example
- * ```
- * const avatar = {
- *     color: {
- *         red: {
- *             backgroundColor: {
- *                 value: 'test'
- *             }
- *         }
- *     },
- *     size: {
- *         1: {
- *             value: 'test'
- *         }
- *     }
- * } as const;
- *
- * type AvatarKeys = DotKeys<typeof avatar>;
- * ```
- *
- * the above produces
- * ```
- * type AvatarKeys = "color.red.backgroundColor" | "size.1"
- * ```
- */
-type DotKeys<T> = T extends Record<string, unknown> ? {
-    [K in keyof T & string]: T[K] extends {
-        value: unknown;
-    } ? `${K}` : `${K}${DotKeys<T[K]> extends infer S ? (S extends string ? `.${S}` : '') : ''}`;
-}[keyof T & string] | (keyof T extends number ? `${keyof T}` : never) : never;
-
-type ColorsKey = DotKeys<typeof colors$1>;
-type Colors = {
-    get: (val: ColorsKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const opacity: {
-    readonly '0': {
-        readonly value: "0";
-        readonly type: "opacity";
-    };
-    readonly '1': {
-        readonly value: "7%";
-        readonly type: "opacity";
-    };
-    readonly '2': {
-        readonly value: "14%";
-        readonly type: "opacity";
-    };
-    readonly '3': {
-        readonly value: "21%";
-        readonly type: "opacity";
-    };
-    readonly '4': {
-        readonly value: "50%";
-        readonly type: "opacity";
-        readonly description: "used in disabled state";
-    };
-    readonly '5': {
-        readonly value: "75%";
-        readonly type: "opacity";
-        readonly description: "used in backdrop overlays";
-    };
-};
-
-type OpacityKey = keyof typeof opacity;
-type Opacity = {
-    get: (val: OpacityKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const sizing: {
-    readonly '0': {
-        readonly value: "0px";
-        readonly type: "sizing";
-    };
-    readonly '1': {
-        readonly value: "4px";
-        readonly type: "sizing";
-    };
-    readonly '2': {
-        readonly value: "8px";
-        readonly type: "sizing";
-    };
-    readonly '3': {
-        readonly value: "12px";
-        readonly type: "sizing";
-    };
-    readonly '4': {
-        readonly value: "16px";
-        readonly type: "sizing";
-    };
-    readonly '5': {
-        readonly value: "20px";
-        readonly type: "sizing";
-    };
-    readonly '6': {
-        readonly value: "24px";
-        readonly type: "sizing";
-    };
-    readonly '7': {
-        readonly value: "28px";
-        readonly type: "sizing";
-    };
-    readonly '8': {
-        readonly value: "32px";
-        readonly type: "sizing";
-    };
-    readonly '9': {
-        readonly value: "36px";
-        readonly type: "sizing";
-    };
-    readonly '10': {
-        readonly value: "40px";
-        readonly type: "sizing";
-    };
-    readonly '11': {
-        readonly value: "44px";
-        readonly type: "sizing";
-    };
-    readonly '12': {
-        readonly value: "48px";
-        readonly type: "sizing";
-    };
-    readonly '13': {
-        readonly value: "52px";
-        readonly type: "sizing";
-    };
-    readonly '14': {
-        readonly value: "56px";
-        readonly type: "sizing";
-    };
-    readonly '15': {
-        readonly value: "60px";
-        readonly type: "sizing";
-    };
-    readonly '16': {
-        readonly value: "72px";
-        readonly type: "sizing";
-    };
-    readonly '17': {
-        readonly value: "80px";
-        readonly type: "sizing";
-    };
-    readonly '18': {
-        readonly value: "88px";
-        readonly type: "sizing";
-    };
-    readonly '19': {
-        readonly value: "92px";
-        readonly type: "sizing";
-    };
-    readonly '20': {
-        readonly value: "100px";
-        readonly type: "sizing";
-    };
-    readonly '21': {
-        readonly value: "120px";
-        readonly type: "sizing";
-    };
-    readonly '22': {
-        readonly value: "140px";
-        readonly type: "sizing";
-    };
-};
-
-type SizingKey = keyof typeof sizing;
-type Sizing = {
-    get: (val: SizingKey, fn?: (val: string) => unknown) => string;
-};
-
-type NeutralPaletteConfig = {
-    light?: string;
-    dark?: string;
-    grey?: string;
-    transparent?: string;
-};
-type GradientPaletteConfig = {
-    primary?: string;
-    secondary?: string;
-    tertiary?: string;
-    upsell?: string;
-    inverted?: string;
-};
-
-declare const boxShadow: {
-    readonly '0': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "0";
-            readonly blur: "0";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-        readonly description: "No shadow variant";
-    };
-    readonly '1': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "2";
-            readonly blur: "4";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-    };
-    readonly '2': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "4";
-            readonly blur: "8";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-    };
-    readonly '3': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "8";
-            readonly blur: "16";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-    };
-    readonly '4': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "16";
-            readonly blur: "24";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-    };
-    readonly '5': {
-        readonly value: {
-            readonly x: "0";
-            readonly y: "-2";
-            readonly blur: "4";
-            readonly spread: "0";
-            readonly color: "rgba(200,206,255,0.45)";
-            readonly type: "dropShadow";
-        };
-        readonly type: "boxShadow";
-        readonly description: "Used for sticky/fixed components";
-    };
-};
-
-type SemanticBoxShadowKey = keyof typeof boxShadow;
-type SemanticBoxShadow = {
-    get: (val: SemanticBoxShadowKey, fn?: (val: string) => unknown) => string;
-};
-
-declare const colors: {
-    readonly backgroundColor: {
-        readonly default: {
-            readonly value: "{colors.neutral.1}";
-            readonly type: "color";
-            readonly description: "default backgroundColor variant";
-        };
-        readonly transparent: {
-            readonly value: "{colors.transparent.1}";
-            readonly type: "color";
-            readonly description: "transparent backgroundColor variant";
-        };
-        readonly alt: {
-            readonly value: "{colors.neutral.2}";
-            readonly type: "color";
-            readonly description: "alt backgroundColor variant";
-        };
-        readonly inverted: {
-            readonly value: "{colors.neutral.6}";
-            readonly type: "color";
-            readonly description: "invertedBackgroundColor default variant";
-        };
-        readonly invertedAlt: {
-            readonly value: "{colors.neutral.5}";
-            readonly type: "color";
-            readonly description: "invertedBackgroundColor, alt variant";
-        };
-    };
-    readonly backdrop: {
-        readonly default: {
-            readonly value: "{colors.transparent.5}";
-            readonly type: "color";
-            readonly description: "backdrop shade";
-        };
-    };
-    readonly palette: {
-        readonly error: {
-            readonly muted: {
-                readonly type: "color";
-                readonly value: "{colors.red.1}";
-            };
-            readonly base: {
-                readonly type: "color";
-                readonly value: "{colors.red.2}";
-            };
-            readonly contrast: {
-                readonly type: "color";
-                readonly value: "{colors.red.3}";
-            };
-        };
-        readonly warning: {
-            readonly muted: {
-                readonly type: "color";
-                readonly value: "{colors.orange.1}";
-            };
-            readonly base: {
-                readonly type: "color";
-                readonly value: "{colors.orange.2}";
-            };
-            readonly contrast: {
-                readonly type: "color";
-                readonly value: "{colors.orange.3}";
-            };
-        };
-        readonly primary: {
-            readonly muted: {
-                readonly type: "color";
-                readonly value: "{colors.blue.5}";
-            };
-            readonly base: {
-                readonly type: "color";
-                readonly value: "{colors.blue.6}";
-            };
-            readonly contrast: {
-                readonly type: "color";
-                readonly value: "{colors.blue.7}";
-            };
-        };
-        readonly secondary: {
-            readonly muted: {
-                readonly type: "color";
-                readonly value: "{colors.transparent.2}";
-            };
-            readonly base: {
-                readonly type: "color";
-                readonly value: "{colors.transparent.3}";
-            };
-            readonly contrast: {
-                readonly type: "color";
-                readonly value: "{colors.transparent.4}";
-            };
-        };
-        readonly success: {
-            readonly muted: {
-                readonly type: "color";
-                readonly value: "{colors.teal.1}";
-            };
-            readonly base: {
-                readonly type: "color";
-                readonly value: "{colors.teal.2}";
-            };
-            readonly contrast: {
-                readonly type: "color";
-                readonly value: "{colors.teal.3}";
-            };
-        };
-        readonly tertiary: {
-            readonly muted: {
-                readonly value: "{colors.transparent.2}";
-                readonly type: "color";
-            };
-            readonly base: {
-                readonly value: "{colors.transparent.1}";
-                readonly type: "color";
-            };
-            readonly contrast: {
-                readonly value: "{colors.transparent.3}";
-                readonly type: "color";
-            };
-        };
-        readonly upsell: {
-            readonly muted: {
-                readonly value: "{colors.purple.1}";
-                readonly type: "color";
-            };
-            readonly base: {
-                readonly value: "{colors.purple.2}";
-                readonly type: "color";
-            };
-            readonly contrast: {
-                readonly value: "{colors.purple.3}";
-                readonly type: "color";
-            };
-        };
-        readonly primaryAlt: {
-            readonly muted: {
-                readonly value: "{colors.blue.1}";
-                readonly type: "color";
-            };
-            readonly base: {
-                readonly value: "{colors.blue.2}";
-                readonly type: "color";
-            };
-            readonly contrast: {
-                readonly value: "{colors.blue.3}";
-                readonly type: "color";
-            };
-        };
-    };
-    readonly textColor: {
-        readonly default: {
-            readonly primary: {
-                readonly value: "{colors.neutral.6}";
-                readonly type: "color";
-                readonly description: "Sets color for primary text";
-            };
-            readonly secondary: {
-                readonly value: "{colors.neutral.4}";
-                readonly type: "color";
-                readonly description: "Sets color for secondary text";
-            };
-            readonly error: {
-                readonly value: "{colors.red.7}";
-                readonly type: "color";
-                readonly description: "Sets color for error text";
-            };
-            readonly active: {
-                readonly value: "{colors.blue.7}";
-                readonly type: "color";
-                readonly description: "Sets color for active text";
-            };
-            readonly visited: {
-                readonly value: "{colors.purple.7}";
-                readonly type: "color";
-                readonly description: "Sets color for visited text (link)";
-            };
-            readonly warning: {
-                readonly value: "{colors.orange.7}";
-                readonly type: "color";
-                readonly description: "Sets color for warning text";
-            };
-            readonly success: {
-                readonly value: "{colors.teal.7}";
-                readonly type: "color";
-                readonly description: "Sets color for success text";
-            };
-        };
-        readonly inverted: {
-            readonly visited: {
-                readonly value: "{colors.purple.4}";
-                readonly type: "color";
-                readonly description: "Sets color for visited text (link)";
-            };
-            readonly primary: {
-                readonly value: "{colors.neutral.1}";
-                readonly type: "color";
-                readonly description: "Sets color for inverted primary text";
-            };
-            readonly secondary: {
-                readonly value: "{colors.neutral.3}";
-                readonly type: "color";
-                readonly description: "Sets color for inverted secondary text";
-            };
-            readonly error: {
-                readonly value: "{colors.red.4}";
-                readonly type: "color";
-                readonly description: "Sets color for inverted error text";
-            };
-            readonly active: {
-                readonly value: "{colors.blue.4}";
-                readonly type: "color";
-                readonly description: "Sets color for inverted active text";
-            };
-            readonly warning: {
-                readonly value: "{colors.orange.4}";
-                readonly type: "color";
-            };
-            readonly success: {
-                readonly value: "{colors.teal.4}";
-                readonly type: "color";
-                readonly description: "Sets color for inverted success text";
-            };
-        };
-    };
-    readonly borderColor: {
-        readonly decorative: {
-            readonly transparent: {
-                readonly value: "{colors.transparent.1}";
-                readonly type: "color";
-                readonly description: "transparent borderColor variant";
-            };
-            readonly default: {
-                readonly value: "{colors.transparent.5}";
-                readonly type: "color";
-                readonly description: "Default decorative borderColor";
-            };
-            readonly inverted: {
-                readonly value: "{colors.transparent.10}";
-                readonly type: "color";
-                readonly description: "Inverted decorative borderColor";
-            };
-        };
-        readonly interactive: {
-            readonly default: {
-                readonly value: "{colors.blue.4}";
-                readonly type: "color";
-                readonly description: "Used in default component state";
-            };
-            readonly active: {
-                readonly value: "{colors.blue.6}";
-                readonly type: "color";
-                readonly description: "Used in active component state";
-            };
-            readonly error: {
-                readonly value: "{colors.red.5}";
-                readonly type: "color";
-                readonly description: "Sets borderColor for error";
-            };
-            readonly upsell: {
-                readonly value: "{colors.purple.5}";
-                readonly type: "color";
-                readonly description: "Sets borderColor for upsell";
-            };
-            readonly warning: {
-                readonly value: "{colors.orange.5}";
-                readonly type: "color";
-                readonly description: "Sets borderColor for warning";
-            };
-            readonly success: {
-                readonly value: "{colors.teal.5}";
-                readonly type: "color";
-                readonly description: "Sets borderColor for success";
-            };
-            readonly focused: {
-                readonly value: "{colors.purple.5}";
-                readonly type: "color";
-                readonly description: "Sets focused container borderColor for component";
-            };
-        };
-    };
-    readonly indicators: {
-        readonly brand: {
-            readonly value: "{colors.blue.5}";
-            readonly type: "color";
-        };
-        readonly success: {
-            readonly value: "{colors.teal.5}";
-            readonly type: "color";
-        };
-        readonly pending: {
-            readonly value: "{colors.purple.4}";
-            readonly type: "color";
-        };
-        readonly warning: {
-            readonly value: "{colors.orange.4}";
-            readonly type: "color";
-        };
-        readonly error: {
-            readonly value: "{colors.red.5}";
-            readonly type: "color";
-        };
-        readonly inactive: {
-            readonly value: "{colors.neutral.3}";
-            readonly type: "color";
-        };
-    };
-};
-
-type SemanticColorsKey = DotKeys<typeof colors>;
-type SemanticColors = {
-    get: (val: SemanticColorsKey) => string;
-};
-
-declare const disabledState: {
-    readonly default: {
-        readonly value: "{opacity.4}";
-        readonly type: "opacity";
-    };
-};
-
-type SemanticDisabledState = {
-    get: (val: DotKeys<typeof disabledState>) => string;
-};
-
-declare const state: {
-    readonly borderRadius: {
-        readonly hover: {
-            readonly value: "{borderRadius.7}";
-            readonly type: "borderRadius";
-            readonly description: "Sets border radius for circular hover shape";
-        };
-    };
-    readonly backgroundColor: {
-        readonly hover: {
-            readonly value: "{colors.transparent.2}";
-            readonly type: "color";
-            readonly description: "Sets transparent overlay for interactive icon on hover";
-        };
-    };
-    readonly loading: {
-        readonly gradient: {
-            readonly value: "{colors.gradient.1}";
-            readonly type: "color";
-            readonly description: "Alt loading state gradient";
-        };
-    };
-};
-
-type SemanticState = {
-    get: (val: DotKeys<typeof state>) => string;
-};
-
-declare const typography: {
-    readonly normal: {
-        readonly headline01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.10}";
-                readonly fontSize: "{fontSize.10}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Largest text on the screen, reserved for the page title. Can only appear once";
-        };
-        readonly headline02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.9}";
-                readonly fontSize: "{fontSize.9}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 2, reserved for important copy that is not a title (e.g. section titles)";
-        };
-        readonly headline03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.8}";
-                readonly fontSize: "{fontSize.8}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 3";
-        };
-        readonly headline04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.7}";
-                readonly fontSize: "{fontSize.6}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 4";
-        };
-        readonly headline05: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.6}";
-                readonly fontSize: "{fontSize.5}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 5";
-        };
-        readonly title01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Large variant";
-        };
-        readonly title02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Medium variant";
-        };
-        readonly title03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Small variant";
-        };
-        readonly label01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Large variant";
-        };
-        readonly label02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Medium variant";
-        };
-        readonly label03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Small variant";
-        };
-        readonly label04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.1}";
-                readonly fontSize: "{fontSize.1}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Resrved for short to medium, medium emphasis text (less than titles) or text within components. Extra small variant";
-        };
-        readonly body01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Large variant";
-        };
-        readonly body02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Medium variant";
-        };
-        readonly body03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Small variant";
-        };
-        readonly body04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.roboto}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.1}";
-                readonly fontSize: "{fontSize.1}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for text within components. Extra small variant";
-        };
-    };
-    readonly mono: {
-        readonly headline01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.10}";
-                readonly fontSize: "{fontSize.10}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Largest text on the screen, reserved for the page title. Can only appear once";
-        };
-        readonly body04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.1}";
-                readonly fontSize: "{fontSize.1}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for text within components. Extra small variant";
-        };
-        readonly headline02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.9}";
-                readonly fontSize: "{fontSize.9}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 2, reserved for important copy that is not a title (e.g. section titles)";
-        };
-        readonly headline03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.8}";
-                readonly fontSize: "{fontSize.8}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 3";
-        };
-        readonly headline04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.7}";
-                readonly fontSize: "{fontSize.6}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 4";
-        };
-        readonly headline05: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.6}";
-                readonly fontSize: "{fontSize.5}";
-                readonly letterSpacing: "{letterSpacing.0}";
-            };
-            readonly type: "typography";
-            readonly description: "Headline variant 5";
-        };
-        readonly title01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Large variant";
-        };
-        readonly title02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Medium variant";
-        };
-        readonly title03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.bold}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, reserved for short, medium emphasis text or text within components. Small variant";
-        };
-        readonly label01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Large variant";
-        };
-        readonly label02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Medium variant";
-        };
-        readonly label03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Smaller than headline, resrved for short to medium, medium emphasis text (less than titles) or text within components. Small variant";
-        };
-        readonly label04: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.medium}";
-                readonly lineHeight: "{lineHeight.1}";
-                readonly fontSize: "{fontSize.1}";
-                readonly letterSpacing: "{letterSpacing.1}";
-            };
-            readonly type: "typography";
-            readonly description: "Resrved for short to medium, medium emphasis text (less than titles) or text within components. Extra small variant";
-        };
-        readonly body01: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.5}";
-                readonly fontSize: "{fontSize.4}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Large variant";
-        };
-        readonly body02: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.4}";
-                readonly fontSize: "{fontSize.3}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Medium variant";
-        };
-        readonly body03: {
-            readonly value: {
-                readonly fontFamily: "{fontFamily.robotoMono}";
-                readonly fontWeight: "{fontWeight.regular}";
-                readonly lineHeight: "{lineHeight.2}";
-                readonly fontSize: "{fontSize.2}";
-                readonly letterSpacing: "{letterSpacing.2}";
-            };
-            readonly type: "typography";
-            readonly description: "Used for longer text string of regular emphasis or text within components. Small variant";
-        };
-    };
-};
-
-type TypographyKeys = 'fontSize' | 'fontWeight' | 'fontFamily' | 'lineHeight' | 'letterSpacing' | 'textCase' | 'textDecoration';
-type SemanticTypographyKey = DotKeys<typeof typography>;
-type TypographyObject = Record<TypographyKeys, string>;
-type SemanticTypography = {
-    get: (val: SemanticTypographyKey) => TypographyObject;
-};
-
-type TextColorTypes$1 = 'primary' | 'secondary' | 'light';
-type ColorScheme = 'semantic' | 'dark';
-type SemanticTheme = {
-    colors: SemanticColors;
-    disabledState: SemanticDisabledState;
-    state: SemanticState;
-    typography: SemanticTypography;
-    boxShadow: SemanticBoxShadow;
-};
-type Dimension = {
-    borderRadius: DimensionBorderRadius;
-    borderWidth: DimensionBorderWidth;
-    minHeight: DimensionMinHeight;
-    opacity: DimensionOpacity;
-    sizing: DimensionSizing;
-    spacing: DimensionSpacing;
-    state: DimensionState;
-};
-/** Will add more themes in the future (e.g.: DarkTheme) */
-type Tokens = SemanticTheme;
-type Theme = {
-    globals: {
-        colors: Colors;
-        oldColors: Palette;
-        typography: Typography$1;
-        spacing: Spacing;
-        elevation: Elevation;
-        borderRadius: BorderRadius;
-        borderWidth: BorderWidth;
-        opacity: Opacity;
-        sizing: Sizing;
-    };
-    dimension: Dimension;
-    tokens: Tokens;
-    colorScheme: ColorScheme;
-    overrides: Overrides;
-    utils: {
-        /**
-         * @deprecated deprecated since v5.0.0. Use `theme.globals.colors.get('')` instead.
-         */
-        getColor: GetColor;
-        /**
-         * @deprecated deprecated since v5.0.0. Use `theme.globals.colors.get('')` instead.
-         */
-        getAAColorFromSwatches: GetAAColorFromSwatches;
-        /**
-         * @deprecated deprecated since v5.0.0. Use `theme.globals.colors.get('')` instead.
-         */
-        getAAColor: GetAAColor;
-    };
-};
-
-declare const defaultTheme: (theming: ColorScheme) => Theme;
-
-declare const neutralColors: readonly ["neutralWhite", "neutralBlack"];
-declare const colorSchemes: readonly ["semantic", "dark"];
-/**
- * Here are listed all the colors available for our project
- * Flat colors are the actual colors of the system
- **/
-declare const flatColors: readonly ["greyScale", "darkGrey", "lightGrey", "red", "magenta", "lightPurple", "purple", "darkBlue", "blue", "lightBlue", "teal", "green", "yellow", "orange", "darkOrange", "neutralWhite", "neutralBlack"];
-/**
- * Here are listed all the colors available for our project
- * Pale colors are just colors without shades
- **/
-/** @TODO remove all these when all components are revisited for v5 */
-declare const paleColors: readonly ["greyScale", "darkGrey", "lightGrey", "red", "magenta", "lightPurple", "purple", "darkBlue", "blue", "lightBlue", "teal", "green", "yellow", "orange"];
-/**
- * Here are listed all the color shades
- * Each colors of the flat palette is generated with these variations
- * E.g red.100 = color or yellow.500 = color
- * so there is no yellow but variations of yellow
- * default variation: 500
- **/
-declare const colorShades: readonly [50, 100, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800, 850, 900, 950];
-declare const MIN_SHADE = 50;
-declare const BASE_SHADE = 500;
-declare const MAX_SHADE = 950;
-/**
- * mainTypes are not colors per se but a type of color
- * for example error is red but also defines a state that's why is listed here and not in flat colors
- * Each color has again the above variations (shades)
- **/
-declare const mainTypes: readonly ["primary", "secondary", "success", "error", "warning", "info", "light", "link"];
-type FlatPalette = Record<(typeof flatColors)[number], GeneratedColorShades>;
-type PalePalette = Record<(typeof paleColors)[number], string>;
-type GeneratedColorShades = Record<(typeof colorShades)[number], string>;
-/**
- * Palette is end output of what is produced and exported to the client projects
- **/
-type Palette = {
-    flat: FlatPalette;
-    neutral: NeutralPaletteConfig;
-    gradient: GradientPaletteConfig;
-    /** @TODO remove all these when all components are revisited for v5 */
-    text: {
-        primary: GeneratedColorShades;
-        secondary: GeneratedColorShades;
-        light: GeneratedColorShades;
-    };
-    pale: PalePalette;
-    white: string;
-    black: string;
-} & Record<(typeof mainTypes)[number], GeneratedColorShades>;
-type formFieldStyles = 'filled' | 'outlined' | 'elevated';
-type GetColor = {
-    (color: (typeof flatColors)[number], variant: (typeof colorShades)[number]): string;
-    (color: (typeof flatColors)[number], variant: (typeof colorShades)[number], scope: 'flat'): string;
-    (color: TextColorTypes$1, variant: (typeof colorShades)[number], scope: 'text'): string;
-    (color: (typeof mainTypes)[number], variant: (typeof colorShades)[number], scope: 'normal'): string;
-    (color: (typeof paleColors)[number], variant: null, scope: 'pale'): string;
-};
-declare const getColor: (palette: Palette) => GetColor;
-/**
- * this function picks either white or black color based on the background that is passed
- * swatches are calculated based on accessibility by getAAColor function and splited to those two colors
- **/
-type GetAAColorFromSwatches = {
-    (color: (typeof flatColors)[number], variant: (typeof colorShades)[number]): string;
-};
-declare const getAAColorFromSwatches: (palette: Palette) => GetAAColorFromSwatches;
-type GetAAColor = {
-    (color: string): string;
-};
-declare const getAAColor: (palette: Palette) => GetAAColor;
-
-declare const palette_d_BASE_SHADE: typeof BASE_SHADE;
-type palette_d_FlatPalette = FlatPalette;
-type palette_d_GeneratedColorShades = GeneratedColorShades;
-type palette_d_GetAAColor = GetAAColor;
-type palette_d_GetAAColorFromSwatches = GetAAColorFromSwatches;
-type palette_d_GetColor = GetColor;
-declare const palette_d_MAX_SHADE: typeof MAX_SHADE;
-declare const palette_d_MIN_SHADE: typeof MIN_SHADE;
-type palette_d_PalePalette = PalePalette;
-type palette_d_Palette = Palette;
-declare const palette_d_colorSchemes: typeof colorSchemes;
-declare const palette_d_colorShades: typeof colorShades;
-declare const palette_d_flatColors: typeof flatColors;
-type palette_d_formFieldStyles = formFieldStyles;
-declare const palette_d_getAAColor: typeof getAAColor;
-declare const palette_d_getAAColorFromSwatches: typeof getAAColorFromSwatches;
-declare const palette_d_getColor: typeof getColor;
-declare const palette_d_mainTypes: typeof mainTypes;
-declare const palette_d_neutralColors: typeof neutralColors;
-declare const palette_d_paleColors: typeof paleColors;
-declare namespace palette_d {
-  export {
-    palette_d_BASE_SHADE as BASE_SHADE,
-    palette_d_FlatPalette as FlatPalette,
-    palette_d_GeneratedColorShades as GeneratedColorShades,
-    palette_d_GetAAColor as GetAAColor,
-    palette_d_GetAAColorFromSwatches as GetAAColorFromSwatches,
-    palette_d_GetColor as GetColor,
-    palette_d_MAX_SHADE as MAX_SHADE,
-    palette_d_MIN_SHADE as MIN_SHADE,
-    palette_d_PalePalette as PalePalette,
-    palette_d_Palette as Palette,
-    palette_d_colorSchemes as colorSchemes,
-    palette_d_colorShades as colorShades,
-    palette_d_flatColors as flatColors,
-    palette_d_formFieldStyles as formFieldStyles,
-    palette_d_getAAColor as getAAColor,
-    palette_d_getAAColorFromSwatches as getAAColorFromSwatches,
-    palette_d_getColor as getColor,
-    palette_d_mainTypes as mainTypes,
-    palette_d_neutralColors as neutralColors,
-    palette_d_paleColors as paleColors,
-  };
-}
-
-/** A function that generates a unique key by making a value randomly based on time also */
-declare const generateUniqueKey: (elementType?: string) => string;
-/** A function that generates a unique id using lodash's uniqueId util */
-declare const generateUniqueID: (prefix?: string) => string;
-/** A function that takes two strings to generate a test data id by combining them if both exist */
-declare const generateTestDataId: (defaultId: TestId$1, customId?: TestId$1) => string;
-
-type AcceptedColorComponentTypes = (typeof mainTypes)[number];
-
-type DeepPartial<T> = T extends {
-    [key: string]: unknown;
-} ? {
-    [P in keyof T]?: DeepPartial<T[P]>;
-} : T;
-type ComponentSizes = 'compact' | 'normal';
-type TestId = string;
-type TestProps = {
-    dataTestId?: TestId;
-    dataTestPrefixId?: string;
-};
-
-type CommonButtonProps = Partial<Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'css' | 'onBlur' | 'onClick' | 'type' | 'disabled'>>;
-type DivProps = Partial<Omit<React$1.HTMLProps<HTMLDivElement>, 'color' | 'size' | 'css'>>;
-
-type AvatarColors = 'blue' | 'teal' | 'purple' | 'red' | 'orange';
-type AvatarSizes = 1 | 2 | 3 | 4 | 5 | 6;
-type AvatarProps = {
-    /** The size of the Avatar
-     *  @default 1
-     * */
-    size?: AvatarSizes;
-    /** The color of the Avatar
-     *  @default 'blue'
-     * */
-    color?: AvatarColors;
-    /** the src of the image to show **/
-    src?: string;
-    /** The icon name to pick from our library of icons
-     *  @default 'user'
-     * */
-    className?: string;
-    /** Data Test Id prefix **/
-    dataTestPrefixId?: string;
-} & DivProps;
-
-declare const Avatar: React__default.ForwardRefExoticComponent<Omit<AvatarProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
-
-type AvatarStackProps = {
-    /** the maximum number of avatars to be displayed **/
-    maxAvatars?: number;
-    /** The size of the extra avatar, if any **/
-    size?: AvatarSizes;
-    /** the color of the extra avatar based on our colors eg. red-500 **/
-    color?: AvatarColors;
-};
-
-declare const AvatarStack: React__default.ForwardRefExoticComponent<Omit<AvatarStackProps & TestProps$1 & Partial<Omit<React__default.HTMLProps<HTMLDivElement>, "color" | "css" | "size">>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
-
-type BreadcrumbItem = {
-    /** Defines the label used for a link breadcrumb item */
-    label: string;
-} & Pick<LinkProps, 'component' | 'href'>;
-
-declare const Breadcrumb: React$1.ForwardRefExoticComponent<{
-    items?: BreadcrumbItem[];
-    backTo?: BreadcrumbItem;
-} & TestProps & React$1.RefAttributes<HTMLOListElement>>;
-
-type ClickEvent = MouseEvent<HTMLButtonElement> | undefined;
-
-type EventButtonProps = {
-    onClick?: (event: ClickEvent) => void;
-    onBlur?: () => void;
-};
-type ButtonBaseProps = {
-    /** The type of the button */
-    type?: ButtonTypes$1;
-    /** The size of button */
-    size?: ComponentSizes;
-    /** This property will make the button fit to its parent width. Defaults to false */
-    isBlock?: boolean;
-    /** Property indicating if the component is loading */
-    isLoading?: boolean;
-    /** Define if the button is in disabled state */
-    isDisabled?: boolean;
-    /** Define if the button is an icon button */
-    isIconButton?: boolean;
-    /** Define the radius type of the icon button */
-    shape?: IconButtonShape$1;
-    /** Defines the button type */
-    htmlType?: 'submit' | 'reset' | 'button';
-    /** Sx prop to override specific properties */
-    sx?: {
-        container?: CSSObject;
-    };
-} & TestProps & EventButtonProps & CommonButtonProps;
-
-type AudioControlsIcons = 'forward' | 'pause' | 'play' | 'resume' | 'rewind' | 'next' | 'previous' | 'stop';
-type BasicActionsIcons = 'check' | 'close' | 'columnChooser' | 'convert' | 'copy' | 'delete' | 'download' | 'edit' | 'login' | 'logout' | 'mediaFile' | 'minus' | 'plus' | 'redo' | 'refresh' | 'restore' | 'review' | 'search' | 'share' | 'sort' | 'sortAscending' | 'sortDescending' | 'thumbsDown' | 'thumbsUp' | 'undo' | 'update' | 'upload';
-type DataAndFinanceIcons = 'analytics' | 'dashboard' | 'dataset' | 'earnings' | 'income' | 'insight' | 'invoice' | 'trendingDown' | 'trendingUp';
-type GenericIcons = 'calendar' | 'chat' | 'delivery' | 'externalLink' | 'file' | 'filter' | 'issue' | 'language' | 'legal' | 'location' | 'mail' | 'manual' | 'moreOptions' | 'notification' | 'policy' | 'report' | 'settings' | 'tag';
-type MusicBusinessIcons = 'album' | 'artist' | 'asset' | 'broadcast' | 'catalog' | 'channel' | 'cinema' | 'claim' | 'composition' | 'concert' | 'conflict' | 'cueSheet' | 'digital' | 'distribution' | 'license' | 'playcount' | 'publicPerformance' | 'publisher' | 'radio' | 'recording' | 'recordLabel' | 'television' | 'usage' | 'work' | 'writer' | 'youTube';
-type NavigationIcons = 'apps' | 'arrowDown' | 'arrowLeft' | 'arrowRight' | 'arrowUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUp' | 'menu' | 'pageFirst' | 'pageLast' | 'triangleDown' | 'triangleLeft' | 'triangleRight' | 'triangleUp';
-type ToggledActionsIcons = 'audio' | 'audioOff' | 'bookmark' | 'bookmarkOff' | 'eye' | 'eyeOff' | 'favorite' | 'favoriteOff' | 'flag' | 'flagOff' | 'freeze' | 'image' | 'imageOff' | 'link' | 'lock' | 'pair' | 'unfreeze' | 'unlink' | 'unlock' | 'unpair' | 'video' | 'videoOff';
-type UserAndStatusIcons = 'account' | 'entities' | 'error' | 'help' | 'informational' | 'organization' | 'pending' | 'role' | 'statusIndicator' | 'success' | 'unverified' | 'user' | 'users' | 'verified' | 'warning';
-type AcceptedIconNames = AudioControlsIcons | BasicActionsIcons | DataAndFinanceIcons | GenericIcons | MusicBusinessIcons | NavigationIcons | ToggledActionsIcons | UserAndStatusIcons;
-
-type IconProps = {
-    /** This property defines witch icon to use */
-    name: AcceptedIconNames;
-    /** Property indicating the color of the icon. Accepts all css:color values */
-    color?: string;
-    /**
-     * Property indicating the size of the icon. If number or string ending in 'px' is imported, it's converted to rem.
-     * Otherwise it's passed directly to the css:width/height. Defaults to 20px (converted to rem)
-     */
-    size?: string | number;
-    /** Whether the icon has a onHover style. Defaults to true if onClick is provided */
-    hasHover?: boolean;
-} & DivProps$1 & TestProps;
-declare const Icon: React$1.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-
-type IconButtonShape = 'circle' | 'square';
-type IconButtonProps = Omit<ButtonBaseProps$1, 'type' | 'isBlock' | 'isLoading' | 'isIconButton'> & {
-    /** This property defines the type of the IconButton */
-    type?: PrimitiveButtonTypes;
-    /** This property defines witch icon to use */
-    iconName: AcceptedIconNames;
-    /** This property defines the shape of the IconButton */
-    shape?: IconButtonShape;
-};
-declare const IconButton: React__default.ForwardRefExoticComponent<Omit<ButtonBaseProps$1, "type" | "isBlock" | "isLoading" | "isIconButton"> & {
-    /** This property defines the type of the IconButton */
-    type?: PrimitiveButtonTypes;
-    /** This property defines witch icon to use */
-    iconName: AcceptedIconNames;
-    /** This property defines the shape of the IconButton */
-    shape?: IconButtonShape;
-} & React__default.RefAttributes<HTMLButtonElement>>;
-
-/** All button types. Used by Button component */
-type ButtonTypes = 'primary' | 'secondary' | 'tertiary' | 'danger';
-
-type ButtonProps = ButtonBaseProps & TestProps$1 & CommonButtonProps$1 & {
-    /** An optional icon to put on the right of the button */
-    iconRightName?: AcceptedIconNames$1;
-    /** An optional icon to put on the left of the button */
-    iconLeftName?: AcceptedIconNames$1;
-    /** An optional avatar to put on the left of the button */
-    avatar?: Pick<AvatarProps$1, 'src' | 'color'> & {
-        label?: string;
-    };
-};
-declare const Button: React__default.ForwardRefExoticComponent<{
-    type?: ButtonTypes;
-    size?: utils_types.ComponentSizes;
-    isBlock?: boolean;
-    isLoading?: boolean;
-    isDisabled?: boolean;
-    isIconButton?: boolean;
-    shape?: IconButtonShape;
-    htmlType?: "button" | "reset" | "submit";
-    sx?: {
-        container?: _emotion_serialize.CSSObject;
-    };
-} & TestProps$1 & EventButtonProps & Partial<Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "disabled" | "onClick" | "onBlur" | "css" | "size">> & {
-    /** An optional icon to put on the right of the button */
-    iconRightName?: AcceptedIconNames$1;
-    /** An optional icon to put on the left of the button */
-    iconLeftName?: AcceptedIconNames$1;
-    /** An optional avatar to put on the left of the button */
-    avatar?: Pick<AvatarProps$1, 'src' | 'color'> & {
-        label?: string;
-    };
-} & React__default.RefAttributes<HTMLButtonElement>>;
-
-type CardProps = {
-    /** Elevation of Card */
-    elevated?: keyof Elevation$1;
-    /** Transparency of Card: if false the Card's background is white, otherwise it's transparent */
-    isTransparent?: boolean;
-    /** Border radius of Card: if not provided it defaults to 0 */
-    radius?: SpacingKey$1;
-};
-declare const Card: React__default.FC<React__default.PropsWithChildren<CardProps>>;
-
-type Data$2 = {
-    name: string;
-    [prop: string]: number | string | undefined;
-};
-
-type LineChartProps = {
-    /** This property defines the data to be shown in the Line Chart */
-    data: Data$2[];
-    /** Property indicating the label name to be displayed for X axis */
-    labelX?: string;
-    /** Property indicating the label name to be displayed for Y axis */
-    labelY?: string;
-    /**  Define if the legend will be displayed */
-    isLegendVisible?: boolean;
-    /** Function passed as property, so that the user can select colors for each line. If no function is passed or no color is picked for one or more lines, color will be selected randomly  */
-    color?: (dataLabel: string) => string;
-};
-declare const LineChart: React__default.FC<LineChartProps>;
-
-type HoverInfo = {
-    name: string;
-    value?: string | number;
-    percentage?: string;
-    [prop: string]: number | string | undefined;
-};
-type Option = {
-    color?: string;
-    coloringOption?: 'all' | 'bar';
-    hoverInfo?: HoverInfo[];
-};
-type Data$1 = {
-    name: string;
-    subcategory?: string;
-    value?: number;
-    barLabel?: string;
-    options?: Option;
-};
-type BarChartProps = {
-    /** This property defines the data to be shown in the Line Chart */
-    data: Data$1[];
-};
-declare const BarChart: React__default.FCC<BarChartProps>;
-
-type Data = {
-    name: string;
-    value: number;
-    color?: string;
-};
-type DonutChartProps = {
-    /** This property defines the data to be shown in the Donut Chart */
-    data: Data[];
-    /** This property defines the value to be shown in the Donut Chart label */
-    value?: string | number;
-    /** This property defines the units to be shown in the Donut Chart label*/
-    units?: string;
-};
-declare const DonutChart: React__default.FCC<DonutChartProps>;
-
-type LabelConfig = {
-    /** Sets the label's placement */
-    placement?: 'left' | 'right';
-    /** Sets the label's size */
-    size?: 'normal' | 'large';
-    /** Helptext rendered under the label */
-    helpText?: string;
-    /** Styles that will apply on the container that holds the control input and the label */
-    sx?: CSSObject$1;
-};
-
-type RadioProps = Partial<RadioAria> & {
-    /** Id property of the radio input */
-    id?: string;
-    /** The value of the radio input */
-    value: string;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig;
-    children?: React$1.ReactNode;
-} & TestProps$1;
-declare const Radio: React$1.ForwardRefExoticComponent<Partial<RadioAria> & {
-    /** Id property of the radio input */
-    id?: string;
-    /** The value of the radio input */
-    value: string;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig;
-    children?: React$1.ReactNode;
-} & TestProps$1 & React$1.RefAttributes<HTMLInputElement>>;
-
-declare const RadioGroup: React$1.ForwardRefExoticComponent<{
-    /** The current selected value */
-    value?: string;
-    /** Callback that is called when the value changes. */
-    onChange?: (value: string) => void;
-    /** Whether the whole RadioGroup is disabled */
-    isDisabled?: boolean;
-    /** Styles that will apply on the RadioGroup container */
-    sx?: CSSObject$1;
-    children?: React$1.ReactNode;
-} & TestProps$1 & React$1.RefAttributes<HTMLDivElement>>;
-
-declare const RadioContext: React__default.Context<RadioGroupState>;
-declare const useRadioGroupContent: () => RadioGroupState;
-
-type CheckBoxProps = Partial<CheckboxAria> & {
-    /** Id property of the checkbox input */
-    id?: string;
-    /** The value of the checkbox input */
-    value?: string;
-    /** Callback for when the element's selection state changes. */
-    onChange?: (isSelected: boolean) => void;
-    /** Whether the checkbox is indeterminately selected. */
-    isIndeterminate?: boolean;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig$1;
-    children?: React__default.ReactNode;
-} & TestProps$1;
-declare const CheckBox: React__default.ForwardRefExoticComponent<Partial<CheckboxAria> & {
-    /** Id property of the checkbox input */
-    id?: string;
-    /** The value of the checkbox input */
-    value?: string;
-    /** Callback for when the element's selection state changes. */
-    onChange?: (isSelected: boolean) => void;
-    /** Whether the checkbox is indeterminately selected. */
-    isIndeterminate?: boolean;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig$1;
-    children?: React__default.ReactNode;
-} & TestProps$1 & React__default.RefAttributes<HTMLInputElement>>;
-
-type SwitchProps = Partial<SwitchAria> & {
-    /** Id property of the switch element */
-    id?: string;
-    /** The value of the switch element */
-    value?: string;
-    /** Callback for when the element's selection state changes. */
-    onChange?: (isSelected: boolean) => void;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig$1;
-    children?: React$1.ReactNode;
-} & TestProps$1;
-declare const Switch: React$1.ForwardRefExoticComponent<Partial<SwitchAria> & {
-    /** Id property of the switch element */
-    id?: string;
-    /** The value of the switch element */
-    value?: string;
-    /** Callback for when the element's selection state changes. */
-    onChange?: (isSelected: boolean) => void;
-    /** Label configuration; includes placement, size, helpText and sx */
-    labelConfig?: LabelConfig$1;
-    children?: React$1.ReactNode;
-} & TestProps$1 & React$1.RefAttributes<HTMLInputElement>>;
-
-type InputProps$1 = Partial<Omit<InputHTMLAttributes<HTMLInputElement>, 'readOnly' | 'disabled' | 'size'>>;
-type MaskProps = {
-    mask?: never;
-} | {
-    mask?: string | (string | RegExp)[];
-    placeholder?: never;
-};
-type TextFieldProps = {
-    /** The id of the text field that will be used as for in label too */
-    id?: string;
-    /** Callback fired when the `input` is blurred. */
-    onBlur?: React__default.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    /** Callback fired when the `input` is changed. */
-    onChange?: React__default.ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;
-    /** Callback fired when the `input` is focused. */
-    onFocus?: React__default.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    /** Callback fired when the `input` has a key down event. */
-    onKeyDown?: React__default.KeyboardEventHandler<HTMLTextAreaElement | HTMLInputElement>;
-    /** Callback fired when the `input` value typed is changed */
-    onInput?: React__default.EventHandler<any>;
-    /** Boolean to make the input readonly. Default to false. */
-    isReadOnly?: boolean;
-    /** [For MultiTextField] If true, the user can add multiple tags as an input */
-    isMulti?: boolean;
-    /** [For MultiTextField] The values of the tags */
-    tags?: string[];
-    /** [For MultiTextField] A callback for when a Tag value is deleted */
-    onMultiValueDelete?: (value: string) => void;
-    /** [For MultiTextField] A callback for when all values are deleted  */
-    onMultiValueClearAll?: () => void;
-} & TextInputBaseProps$1 & MaskProps & InputProps$1 & TestProps;
-declare const _default$8: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<TextFieldProps & React__default.RefAttributes<HTMLInputElement>>>;
-
-type DisabledDates = {
-    daysOfWeek?: number[];
-    days?: Date[];
-    after?: Date;
-    before?: Date;
-};
-type DateRange = {
-    from: Date | undefined;
-    to: Date | undefined;
-};
-type DatePickerProps = {
-    /** This property is to define if this is a day picker or a day range picker */
-    isRangePicker?: boolean;
-    /** A callback to return user selection */
-    onChange?: (range: DateRange) => void;
-    /** Option to disable some dates */
-    disableDates?: DisabledDates;
-    /** Value to define if needed an initial state or to handle it externally */
-    value: DateRange;
-    /** Calendar options for DateRangePicker */
-    options?: ExtraOption[];
-    /** Props of the TextField input */
-    inputProps?: Omit<TextFieldProps, 'size'>;
-    /** The format of the date displayed in the input field */
-    dateFormatOverride?: DateFormatType;
-    /** if the datepicker can be clear with backspace */
-    isClearable?: boolean;
-    /** if the datepicker's default date is today instead of placeholder text */
-    /** @deprecated This prop is being deprecated and is not used as you can manipulate date from value, will be removed in the future **/
-    isDefaultNow?: boolean;
-    /** Style properties for the DatePicker with a filter base */
-    filterConfig?: {
-        /** The filter's label */
-        label?: string;
-        /** This property defines the Filter's type */
-        filterType?: FilterType$1;
-    };
-};
-type ExtraOption = {
-    value: string;
-    label: string;
-    dates: Dayjs[];
-};
-type DateFormatType = 'MM/DD/YYYY' | 'DD/MM/YYYY' | 'MMMM D, YYYY' | 'dddd, MMMM D, YYYY' | 'M/D/YYYY' | 'MMM D, YYYY' | 'ddd, MMM D, YYYY' | 'DD MMM YYYY';
-
-declare const _default$7: React__default.NamedExoticComponent<DatePickerProps & TestProps>;
-
-declare const CALENDAR_DEFAULT_OPTIONS: ExtraOption[];
-
-type NavigationMenuItem = {
-    name: string;
-    url: string;
-    state?: Record<string, any> | null;
-    isVisible: boolean;
-    iconName: AcceptedIconNames$1;
-    isActive?<S = Location['state']>(params: Readonly<Params<string>>, location: Location<S>): boolean;
-    options: NavigationMenuItem[];
-};
-
-type NavigationProps = {
-    /** Defines if the navigation is expanded */
-    isExpanded: boolean;
-    /** Changes if the navigation is expanded */
-    setExpanded: (v: boolean) => void;
-    /** The menu items to be displayed in the navigation */
-    menuItems: NavigationMenuItem[];
-    /** Render prop function to display something over the Navigation */
-    renderHeader?: () => React__default.ReactNode;
-};
-declare const Navigation: React__default.FC<NavigationProps>;
-
-type SharedProps = {
-    /**
-     * A function accepting a click handler and a boolean representing the current expansion state. Returns the elements containing the text and the
-     * expand/collapse button
-     * */
-    textAndControl: (x: React$1.ReactEventHandler, y: boolean) => React$1.ReactElement;
-    /**
-     * The type of the component that wraps the action and content. Must be able to hold a
-     * `data-testid` prop
-     *
-     * @default div
-     */
-    component?: ReactComponentLike;
-    /**
-     * Initial expansion state.
-     *
-     * @default false
-     */
-    isInitiallyExpanded?: boolean;
-    /**
-     * The duration for the appear transition
-     *
-     * @default 200
-     */
-    transitionDuration?: number;
-    /**
-     * A function accepting a boolean representing the current expansion state. Returns the
-     * collapsible/expandable content. Mutually exclusive with children.
-     */
-    content?: (x: boolean) => React$1.ReactNode;
-    /**
-     * A function accepting a boolean representing the current expansion state. Returns the
-     * collapsible/expandable content. Mutually exclusive with content.
-     */
-    children?: (x: boolean) => React$1.ReactNode;
-} & TestProps;
-type ExternalProps = {
-    /**
-     * Defining this prop means that the component is controlled
-     *
-     * @default false
-     */
-    isExpanded: true;
-    /**
-     * Change handler for the case when the component is controlled
-     */
-    onChange: React$1.ReactEventHandler;
-};
-type InternalProps = {
-    /**
-     * Defining this prop means that the component is controlled
-     *
-     * @default false
-     */
-    isExpanded?: never;
-    /**
-     * Change handler for the case when the component is controlled
-     */
-    onChange?: never;
-};
-type ExpandCollapseProps = SharedProps & (InternalProps | ExternalProps);
-
-declare const ExpandCollapse: (props: ExpandCollapseProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-type LinkSizes = 1 | 2 | 3;
-
-declare const Link: React__default.ForwardRefExoticComponent<React__default.AnchorHTMLAttributes<HTMLAnchorElement> & {
-    type?: "primary" | "inverted";
-    placement?: "inline" | "block";
-    size?: LinkSizes;
-    iconName?: components_Icon.AcceptedIconNames;
-    isDisabled?: boolean;
-    component?: prop_types.ReactComponentLike;
-    dataTestPrefixId?: string;
-} & React__default.RefAttributes<HTMLAnchorElement>>;
-
-type LabelProps = {
-    /** If the label has error */
-    hasError?: boolean;
-    /** The label that is going to be displayed */
-    label: string;
-    /** If the label value is required */
-    isRequired: boolean;
-    /** If the label must be moved to the top */
-    isAnimated?: boolean;
-    /** HTML <label/>'s for prop */
-    htmlFor?: string;
-    /** The size of the label */
-    size?: ComponentSizes$1;
-};
-declare const Label: React$1.FCC<LabelProps>;
-
-type ListSelection = Set<Key>;
-type ListSelected = 'all' | Iterable<Key>;
-type ListItemType = SelectOption$1;
-type ListRowSize = ComponentSizes$1;
-type SelectHandlerType = (option: ListItemType) => void;
-
-type SelectOptionValues = {
-    value: string | number;
-    label: string;
-    /** refer to Icon component for more details */
-    iconProps?: IconProps;
-};
-type SelectOptionBase = {
-    isDisabled?: boolean;
-    /** helper text that show under item text */
-    helperText?: string;
-    tooltipInfo?: string;
-    options?: SelectOption[];
-    isCreated?: boolean;
-};
-type SelectOption = SelectOptionBase & SelectOptionValues;
-type InputProps = Partial<Omit<InputHTMLAttributes<HTMLInputElement>, 'size' & 'onChange'>>;
-type MultiSelectProps = {
-    /** The function that is used to return the selected options */
-    onChange?: (selectedOption: SelectOption[]) => void;
-    /** If true the user can select multiple options */
-    isMulti: true;
-    /** The selected options in case of multiSelect */
-    /** @TODO merge selectedOption with selectedOptions in v5 */
-    selectedOption?: SelectOption[];
-};
-type SingleSelectProps = {
-    /** The function that is used to return the selected options */
-    onChange?: (selectedOption?: SelectOption) => void;
-    /** If false the user can select one option */
-    isMulti?: never;
-    /** the value of the select if select is controlled */
-    selectedOption?: SelectOption;
-};
-type SelectProps = {
-    /** Options for the select dropdown */
-    options: SelectOption[];
-    /** if the component is used asynchronously */
-    isAsync?: boolean;
-    /** the function to fetch new options */
-    asyncSearch?: (term: string) => void;
-    /** after how many characters to start searching (default = 0) */
-    minCharactersToSearch?: number;
-    /** if searched text should be highlighted in available options */
-    hasHighlightSearch?: boolean;
-    /** if the options are searchable */
-    isSearchable?: boolean;
-    /** data-testid suffix */
-    dataTestId?: string;
-    /** if component is loading */
-    isLoading?: boolean;
-    /** if options list is virtualized */
-    isVirtualized?: boolean;
-    /**
-     * If true, then in the case of a searched option that is not found in the Options list of MultiSelect,
-     * the user can create this option.
-     * */
-    isCreatable?: boolean;
-    /** Whether the MultiSelect should have a Select All option */
-    hasSelectAllOption?: boolean;
-} & (MultiSelectProps | SingleSelectProps) & Omit<TextFieldProps, 'onChange' | 'mask'> & Omit<InputProps, 'onChange' | 'size'> & TestProps;
-
-declare const emptyValue: SelectOption;
-declare const _default$6: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<SelectProps & React__default.RefAttributes<HTMLInputElement>>>;
-
-declare const _default$5: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<SelectProps & React__default.RefAttributes<HTMLInputElement>>>;
-
-type ListProps = {
-    /** The label that describes the List, useful to determine aria and accessibility of the list  */
-    label: string;
-    /** Width of the list */
-    width?: number;
-    /** Height of the list when you use it as virtualized */
-    height?: number;
-    /** Virtualized list option */
-    isVirtualized?: boolean;
-    /** Callback when an item gets a change */
-    onSelectionChange?: (keys: ListSelection) => unknown;
-    /** Is the actual `key` of the item e.g `<Item key={'item_1'} />` is the `item_1` */
-    disabledKeys?: ListSelected;
-    /** Is the actual `key` of the item e.g `<Item key={'item_1'} />` is the `item_1` */
-    selectedKeys?: ListSelected;
-} & Omit<AriaListBoxProps<SelectOption>, 'selectionMode' | 'onSelectionChange' | 'children'> & TestProps$1 & Omit<React__default.InputHTMLAttributes<HTMLUListElement>, 'onChange'>;
-/**
- * This is the List component that uses the Window underneath for every UL.
- * Because this component uses the React-Aria abstraction for the List it will also contain the Option and ListBoxSection below
- * as a masked layer to the actual subcomponents
- * */
-declare const List: React__default.ForwardRefExoticComponent<{
-    /** The label that describes the List, useful to determine aria and accessibility of the list  */
-    label: string;
-    /** Width of the list */
-    width?: number;
-    /** Height of the list when you use it as virtualized */
-    height?: number;
-    /** Virtualized list option */
-    isVirtualized?: boolean;
-    /** Callback when an item gets a change */
-    onSelectionChange?: (keys: ListSelection) => unknown;
-    /** Is the actual `key` of the item e.g `<Item key={'item_1'} />` is the `item_1` */
-    disabledKeys?: ListSelected;
-    /** Is the actual `key` of the item e.g `<Item key={'item_1'} />` is the `item_1` */
-    selectedKeys?: ListSelected;
-} & Omit<AriaListBoxProps<SelectOption>, "children" | "selectionMode" | "onSelectionChange"> & TestProps$1 & Omit<React__default.InputHTMLAttributes<HTMLUListElement>, "onChange"> & React__default.RefAttributes<HTMLUListElement>>;
-
-type ListItemTextProps = {
-    description?: string | JSX.Element;
-};
-declare const ListItemText: FC<React__default.PropsWithChildren<ListItemTextProps>>;
-
-type ListItemActionProps = NonNullable<unknown>;
-declare const ListItemAction: FCC<ListItemActionProps>;
-
-type ListItemProps = {
-    /** A string representation of the item's unique key. */
-    key?: string | number;
-    /** A string representation of the item's contents, used when contents are something more than just text to determine labels etc. */
-    textValue?: string;
-    /** @default normal */
-    rowSize?: ListRowSize;
-    /** The type of the parent component, usually changed when used on Menus @defaults List */
-    parentType?: 'List' | 'Menu';
-};
-declare const ListItem: React__default.FCC<ListItemProps>;
-
-type ListSectionProps = {
-    /** Rendered contents of the section, e.g. a header. */
-    title: ReactNode;
-    /** An accessibility label for the section. */
-    'aria-label'?: string;
-    /** @default normal */
-    rowSize?: ListRowSize;
-} & SectionProps<unknown>;
-declare const ListSection: React__default.FCC<ListSectionProps>;
-
-type MenuProps = {
-    children?: React$1.ReactElement[] | React$1.ReactElement;
-    /** A callback that is being triggered when selection change */
-    onSelectionChange?: (e: Set<string>) => any;
-    /** The keys of the items that are disabled */
-    disabledKeys?: Set<string>;
-    /** The keys of the items that are selected */
-    selectedKeys?: Set<string>;
-    /** The size of the row */
-    rowSize?: ListRowSize$1;
-    /** The ref of the trigger element */
-    triggerRef: React$1.RefObject<any>;
-    /** Define if the menu is open or not */
-    isOpen?: boolean;
-    /** A callback that is being triggered when the menu is closed */
-    onClose?: (e: any) => any;
-    /** A callback that is being triggered when the menu is acting */
-    onAction?: (item: string) => any;
-    /** The selection mode of the menu */
-    selectionMode?: 'single' | 'multiple';
-} & TestProps;
-declare const Menu: React$1.FC<MenuProps>;
-
-type ModalContentProps = {
-    /** The label of the modal. */
-    label?: string;
-    /** The heading of the modal. */
-    heading: string;
-    /** The main messager of the modal. */
-    message: string;
-    /** The primary call-to-action label of the Modal */
-    primaryCTALabel?: string;
-    /** The primary call-to-action of the Modal */
-    primaryCTA?: () => void;
-    /** The secondary call-to-action label of the Modal */
-    secondaryCTALabel?: string;
-    /** The secondary call-to-action of the Modal */
-    secondaryCTA?: () => void;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-};
-
-type ModalProps = {
-    /**  If true, the modal is open. Defaults to false. */
-    isOpen: boolean;
-    /** Callback fired when the component requests to be closed. */
-    onClose: () => void;
-    /** If contentProps are defined then ModalContent will be used instead of children. Otherwise, you can use the Modal as a wrapper  */
-    contentProps?: ModalContentProps;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-    /** If false, the content won't have any padding */
-    isContentPadded?: boolean;
-};
-declare const Modal: React__default.FCC<ModalProps>;
-
-type NotificationTypes = 'success' | 'error' | 'info' | 'warning';
-type NotificationVariants = 'inline' | 'banner';
-type NotificationStyleType = 'elevated' | 'outlined';
-type NotificationActions = {
-    /** The primary call-to-action label of the Notification */
-    primaryCTALabel?: string;
-    /** The primary call-to-action of the Notification */
-    primaryCTA?: () => void;
-    /** The secondary call-to-action label of the Notification */
-    secondaryCTALabel?: string;
-    /** The secondary call-to-action of the Notification */
-    secondaryCTA?: () => void;
-};
-
-type InlineNotificationProps = {
-    /** Show notification icon based on the type */
-    hasIcon?: boolean;
-    /** The informative message of the Notification */
-    message: string | React$1.ReactNode;
-    /** The type of the Notification */
-    type: NotificationTypes;
-    /** The style type of the Notification. Defaults to elevated */
-    styleType?: NotificationStyleType;
-    /** The closing call-to-action of the Notification */
-    closeCTA?: () => void;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-} & Pick<NotificationActions, 'primaryCTALabel' | 'primaryCTA'>;
-declare const InlineNotification: React$1.FC<InlineNotificationProps>;
-
-type NotificationsContainerPositions = 'top-right' | 'top-left' | 'bottom-left' | 'bottom-right';
-type NotificationsContainerProps = {
-    /** Notifications Container position */
-    position: NotificationsContainerPositions;
-    parent?: HTMLElement | null;
-};
-declare const NotificationsContainer: React__default.FCC<NotificationsContainerProps>;
-
-type NotificationVisualProps = {
-    /** The message heading of the Notification */
-    title: string | undefined;
-    /** The description of the Notification (only for toast) */
-    description: string | undefined;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-} & NotificationActions;
-declare const NotificationVisual: React$1.FCC<NotificationVisualProps>;
-
-type BannerProps = {
-    /** Show notification icon based on the type */
-    hasIcon?: boolean;
-    /** The title (message heading) of the Notification */
-    title: string;
-    /** The informative message of the Notification */
-    message: string | React$1.ReactNode;
-    /** The type of the Notification */
-    type: NotificationTypes;
-    /** The style type of the Notification. Defaults to elevated */
-    styleType?: NotificationStyleType;
-    /** The closing call-to-action of the Notification */
-    closeCTA?: () => void;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-} & Pick<NotificationActions, 'primaryCTALabel' | 'primaryCTA'>;
-declare const Banner: React$1.FCC<BannerProps>;
-
-type SnackbarProps = {
-    /** The informative message of the Toast */
-    message: string;
-    /** The type of the Notification */
-    type: NotificationTypes;
-    /** The style type of the Notification. Defaults to elevated */
-    styleType?: NotificationStyleType;
-    /** The description of the Notification (only for toast) */
-    description: string | undefined;
-    /** The closing call-to-action of the Toast */
-    closeCTA: (() => void) | undefined;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-} & NotificationActions;
-declare const Snackbar: React$1.FCC<SnackbarProps>;
-
-type AnchorType = 'bottom' | 'left' | 'right' | 'top';
-type DrawerProps = {
-    /**  If true, the drawer is open.*/
-    isOpen: boolean;
-    /** Callback fired when the component requests to be closed. */
-    onClose: () => void;
-    /** Side from which the overlay will appear. */
-    anchor?: AnchorType;
-    /** Drawer size are relative to the viewport (percentage) */
-    size: number;
-    /** Whether the background behind the Drawer is interactive. Defaults to false */
-    isBackgroundActive?: boolean;
-    /** If true, then the header and footer are fixed positioned */
-    hasFixedLayout?: boolean;
-    /** The parent element, in which the drawer will be rendered. Defaults to document.body */
-    parent?: HTMLElement | null;
-} & TestProps$1;
-
-declare const Drawer: React__default.ForwardRefExoticComponent<{
-    isOpen: boolean;
-    onClose: () => void;
-    anchor?: AnchorType;
-    size: number;
-    isBackgroundActive?: boolean;
-    hasFixedLayout?: boolean;
-    parent?: HTMLElement;
-} & TestProps & {
-    children?: React__default.ReactNode;
-} & React__default.RefAttributes<HTMLDivElement>>;
-
-declare const DrawerHeader: FCC<TestProps$1>;
-
-declare const DrawerContent: FCC<TestProps$1>;
-
-declare const DrawerFooter: FCC<TestProps$1>;
-
-declare const SET_HAS_FIXED_LAYOUT = "SET_HAS_FIXED_LAYOUT";
-declare const SET_ON_CLOSE = "SET_ON_CLOSE";
-declare const TOGGLE_IS_SCROLLBAR_ON_TOP = "TOGGLE_IS_SCROLLBAR_ON_TOP";
-declare const TOGGLE_IS_SCROLLBAR_ON_BOTTOM = "TOGGLE_IS_SCROLLBAR_ON_BOTTOM";
-type DrawerContextState = {
-    hasFixedLayout?: boolean;
-    onClose?: () => void;
-    isScrollbarOnTop?: boolean;
-    isScrollbarOnBottom?: boolean;
-};
-type DrawerContextAction = {
-    type: typeof SET_HAS_FIXED_LAYOUT | typeof SET_ON_CLOSE | typeof TOGGLE_IS_SCROLLBAR_ON_BOTTOM | typeof TOGGLE_IS_SCROLLBAR_ON_TOP;
-    payload: any;
-};
-declare const setHasFixedLayout: (payload: any) => DrawerContextAction;
-declare const setOnClose: (payload: any) => DrawerContextAction;
-declare const toggleIsScrollbarOnTop: (payload: any) => DrawerContextAction;
-declare const toggleIsScrollbarOnBottom: (payload: any) => DrawerContextAction;
-declare const DrawerContext: React__default.Context<[DrawerContextState, Dispatch<DrawerContextAction>]>;
-type DrawerContextReducer = (state: DrawerContextState, action: DrawerContextAction) => DrawerContextState;
-declare const DrawerContextProvider: FCC<{
-    hasFixedLayout?: boolean;
-    onClose: () => void;
-}>;
-declare const useDrawerContext: () => [DrawerContextState, Dispatch<DrawerContextAction>];
-
-type PaginationProps = {
-    /** The current page you are on if you need to control it, defaults to 1 **/
-    page: number;
-    /** The total pages **/
-    count: number;
-    /** An onChange callback that will return the page on navigation **/
-    onChange?: (page: number) => void;
-    /** Show enhanced button functionality, this way the jump to first and last page will be shown. Default to false **/
-    isEnhancedPaginationVisible?: boolean;
-    /** Manually disable next page buttons **/
-    isNextPageDisabled?: boolean;
-    /** Manually disable previous page buttons **/
-    isPrevPageDisabled?: boolean;
-};
-declare const Pagination: ({ page, count, onChange, isEnhancedPaginationVisible, isNextPageDisabled, isPrevPageDisabled, }: PaginationProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-declare const ProgressIndicator: React__default.ForwardRefExoticComponent<{
-    type?: "linear" | "circular";
-    value?: number;
-    status?: "error" | "normal";
-    isBlock?: boolean;
-} & TestProps & React__default.RefAttributes<HTMLDivElement>>;
-
-type SliderProps = {
-    /** Determines if the Slider is disabled or not */
-    isDisabled?: boolean;
-    /** Determines if the Slider will show increments along its track */
-    hasIncrements?: boolean;
-    /** Called when a thumb is moved, provides new values */
-    onChange: (values: number[]) => void;
-    /** Called when a change is finished (mouse/touch up, or keyup), provides current values.
-     * Use this event when you have to make for example ajax request with new values. */
-    onBlur?: (values: number[]) => void;
-    /** Determines the position of the rendered thumbs and the type of the Slider. 1 value means it's a Selector,
-     * while 2 values mean it's a Range. Defaults to [0, 100] */
-    values: [number] | [number, number];
-};
-declare const STEP_WITH_INCREMENTS = 20;
-declare const MIN = 0;
-declare const MAX = 100;
-declare const Slider: React__default.FC<SliderProps & TestProps>;
-
-type SortingOrder = 'asc' | 'desc';
-type ExtendedColumn = {
-    content: {
-        label: string;
-        sortingKey: string;
-    };
-    tooltip?: {
-        content: string;
-        placement?: TooltipPlacement$1;
-    };
-    isSortable?: boolean;
-};
-type Sort = {
-    column: string;
-    order: SortingOrder;
-};
-
-type ContentComponent<T> = (data: Cell<T>) => React__default.ReactNode;
-type Cell<T> = {
-    /** the content of the cell to be displayed. You can pass also custom component. `ContentComponent: (data: Cell<T>) => React.ReactNode`. The type defines that will be a function that returns cell to use cell data.  */
-    content: number | string | ContentComponent<T>;
-    /** the truncated tooltip content, you can override it or it will take the content @default content */
-    tooltipContent?: string;
-    /** show or not the truncated tooltip @default true if the text is truncated */
-    hasTruncatedTooltip?: boolean;
-    /** the colSpan of the cell to be displayed */
-    colSpan?: number;
-    /** the type of the cell to be displayed @default normal */
-    type?: 'financial' | 'normal';
-    /** the alignment of the cell to be displayed */
-    align?: 'left' | 'right';
-    /** the width of the cell to be displayed */
-    widthPercentage?: number;
-};
-type Row<T> = {
-    /** the id of the row */
-    id: string | number;
-    /** the cells of the row, see Cell type for each */
-    cells: Cell<T>[];
-    /** the expanded content of the row, if its expandable */
-    expanded?: ({ row, isSelected, isExpanded, }: {
-        row: Row<T>;
-        isSelected: boolean;
-        isExpanded: boolean;
-    }) => React__default.ReactNode;
-    rowSpan?: number;
-};
-type Selection = string | number;
-type TableType = 'normal' | 'nested-header';
-type TableProps<T> = {
-    /** The data for the table that needs to display. */
-    data: Row<T>[];
-    /** An array of titles or objects to define columns. */
-    columns: (string | ExtendedColumn)[];
-    /** Boolean defining if the header is fixed or not. */
-    hasFixedHeader?: boolean;
-    /** Boolean defining if the CTA's container is fixed or not. */
-    hasFixedCTA?: boolean;
-    /** Type of the table which determine the headers display. */
-    type?: TableType;
-    /** Boolean defining the padding all over the table cells and rows. */
-    isPadded?: boolean;
-    /** Function that once provided on each check will return the selection. */
-    onCheck?: (data: Selection[]) => void;
-    /** Function that once provided will provide the currently selected sorting configuration */
-    onSort?: (column: string, order: SortingOrder) => void;
-    /** Initial sorting column and order. Should be provided along with onSort */
-    initialSort?: Sort;
-    /** If provided sort will only work with this option (asc or desc only). By default supports bidirectional sort*/
-    sortDir?: SortingOrder;
-    /** Top left text on the table - showing a counter, text etc. */
-    topLeftText?: string | React__default.ReactElement;
-    /** Top right area to define a custom component for buttons or other usage. */
-    topRightArea?: (data: Row<T>[], selectionData?: Selection[]) => React__default.ReactNode;
-    /** Action cell width for Table with Expandable Rows (in %)*/
-    actionWidth?: number;
-    /** If true, table's expandable rows will be expanded on initial render. */
-    isInitiallyExpanded?: boolean;
-    /** Data test id prefix for all th/td elements */
-    dataTestIdPrefix?: string;
-};
-declare function Table<T>({ data, columns, type, hasFixedHeader, hasFixedCTA, onCheck, isPadded, onSort, initialSort, sortDir, topLeftText, topRightArea, actionWidth, isInitiallyExpanded, dataTestIdPrefix, }: TableProps<T>): _emotion_react_jsx_runtime.JSX.Element;
-declare const _default$4: React__default.MemoExoticComponent<typeof Table>;
-
-type TagColors = 'neutral' | 'blue' | 'red' | 'purple' | 'teal' | 'orange';
-type TagSizes = 'normal' | 'small';
-type TagProps = {
-    /** The color of the Tag
-     *  @default 'neutral'
-     * */
-    color?: TagColors;
-    /** The size of the Tag
-     *  @default 'normal'
-     * */
-    size?: TagSizes;
-    /** The name of the leading icon. Applies only to read-only Tag  */
-    iconName?: AcceptedIconNames$1;
-    /** If provided, the Tag becomes selectable. Callback for when the Tag is clicked */
-    onSelect?: () => void;
-    /** Whether the selectable Tag is selected (active state) */
-    isSelected?: boolean;
-    /** If provided, the Tag becomes clearable. Callback for when the clear icon of the Tag is clicked */
-    onClear?: () => void;
-} & TestProps$1;
-
-declare const Tag: React__default.ForwardRefExoticComponent<Omit<Partial<Omit<React__default.HTMLProps<HTMLDivElement>, "color" | "css" | "size">> & {
-    color?: TagColors;
-    size?: TagSizes;
-    iconName?: AcceptedIconNames;
-    onSelect?: () => void;
-    isSelected?: boolean;
-    onClear?: () => void;
-} & TestProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
-
-type filterConfig = Pick<FilterProps$1 & SingleFilterProps$1, 'selectedFilter' | 'onChange' | 'onClear' | 'defaultValue' | 'label' | 'items'>;
-type SearchFilterConfig = {
-    filterConfig?: filterConfig;
-};
-type SearchProps = {
-    /** A callback that's called when the user clicks the 'clear' icon */
-    onClear: () => void;
-} & Omit<TextFieldProps$1, 'label' | 'size' | 'mask' | 'isMulti' | 'tags' | 'onMultiValueDelete' | 'onMultiValueClearAll' | 'status' | 'suffix' | 'isInteractive'> & SearchFilterConfig;
-
-declare const _default$3: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<{
-    onClear: () => void;
-} & Omit<TextFieldProps, "label" | "mask" | "status" | "size" | "isInteractive" | "isMulti" | "tags" | "onMultiValueDelete" | "onMultiValueClearAll" | "suffix"> & SearchFilterConfig & React__default.RefAttributes<HTMLInputElement>>>;
-
-declare const _default$2: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<Partial<SearchProps> & React__default.RefAttributes<HTMLInputElement>>>;
-
-type TextInputBaseProps = {
-    /** The label of the text field that will be used as a placeholder and a label */
-    label: string;
-    /** The placeholder of the input that will be used. This is shown if no label exists */
-    placeholder?: string;
-    /** The size of input */
-    size?: ComponentSizes$1;
-    /** An optional suffix (element or icon-name) to show to the left */
-    suffix?: AcceptedIconNames$1 | React__default.ReactNode | null;
-    /** If the text field value is required */
-    isRequired?: boolean;
-    /** If the text field is disabled */
-    isDisabled?: boolean;
-    /** The status of the TextInput with an optional hint message */
-    status?: {
-        type: 'normal' | 'error' | 'read-only';
-        hintMessage?: string;
-        id?: string;
-    };
-    /** value of the input */
-    value?: string | number;
-    /** Sx prop to override specific properties */
-    sx?: {
-        wrapper?: CSSObject;
-        textField?: CSSObject;
-        input?: CSSObject;
-    };
-    /** Whether the Textfield should change its styles when hovered/focused etc */
-    isInteractive?: boolean;
-    children?: React__default.ReactNode;
-} & TestProps;
-
-type TextAreaProps = {
-    /** The id of the text field that will be used as for in label too */
-    id?: string;
-    /** The value of the textarea element */
-    value?: string;
-    /** The placeholder of the input that will be used. This is shown if no label exists */
-    placeholder?: string;
-    /** If the text field value is required */
-    isRequired?: boolean;
-    /** Boolean to make the input readonly. Default to false. */
-    isReadOnly?: boolean;
-    /** If the text field is disabled */
-    isDisabled?: boolean;
-    /** If the text area can be resized */
-    isResizeEnabled?: boolean;
-    /** Number of maximum characters. Will be shown on the counter on the bottom right of the component */
-    maxCharacters?: number;
-    /** Callback fired when the `input` is blurred. */
-    onBlur?: React$1.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    /** Callback fired when the `input` is changed. */
-    onChange?: React$1.ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;
-    /** Callback fired when the `input` is focused. */
-    onFocus?: React$1.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    /** Callback fired when the `input` has a key down event. */
-    onKeyDown?: React$1.KeyboardEventHandler<HTMLTextAreaElement | HTMLInputElement>;
-    /** Callback fired when the `input` value typed is changed */
-    onInput?: React$1.EventHandler<any>;
-} & Omit<React$1.HTMLProps<HTMLTextAreaElement>, 'size'> & Pick<TextInputBaseProps, 'status' | 'label'> & TestProps;
-declare const _default$1: React$1.MemoExoticComponent<React$1.ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement>>>;
-
-type ThemeProviderProps = {
-    /** Theme properties to override or pass theming down to library */
-    theme?: DeepPartial<ThemeConfig>;
-};
-declare const ThemeProvider: React$1.FCC<ThemeProviderProps>;
-
-type ToastProps = {
-    /** The informative message of the Toast */
-    message: string;
-    /** The type of the Toast, will determine the color and the icon */
-    type?: AcceptedColorComponentTypes;
-    /** The style type of the Notification. Defaults to elevated */
-    styleType?: NotificationStyleType;
-    /** The closing call-to-action of the Toast */
-    closeCTA: (() => void) | undefined;
-    /** Initialize toast as expanded */
-    isExpanded?: boolean;
-    /** If true, the Toast has a minimum-height */
-    hasMinimumHeight?: boolean;
-    /** The data test id if needed */
-    dataTestId?: TestId;
-};
-declare const isNotificationTypes: (type: string) => type is NotificationTypes;
-declare const Toast: React$1.FCC<ToastProps>;
-
-type TooltipPlacement = 'top' | 'right' | 'bottom' | 'left';
-type InteractiveTooltip = {
-    isInteractive: true;
-    content: React.ReactNode;
-};
-type TextTooltip = {
-    isInteractive?: false;
-    content: string;
-};
-type TooltipContent = InteractiveTooltip | TextTooltip;
-type TooltipProps = TooltipContent & {
-    /** Whether the tooltip's style is inverted */
-    /** @default false */
-    isInverted?: boolean;
-    /** The placement where the tooltip will show */
-    /** @default top */
-    placement?: TooltipPlacement;
-    /** The unique id in order to link content and tooltip */
-    /** @default uuid */
-    id?: string;
-    /** Show delay for tooltip */
-    /** @default 500 */
-    delayIn?: number;
-    /** Hide delay for tooltip */
-    /** @default 500 */
-    delayOut?: number;
-    children: React.ReactElement;
-};
-
-declare const Tooltip: React__default.ForwardRefExoticComponent<TooltipProps & React__default.RefAttributes<HTMLDivElement>>;
-
-type UserMenuProps = {
-    items: string[];
-    userName: string;
-    userAvatar: {
-        src: string;
-        letter: string;
-    };
-    onSelect: (selectedItem: string | number) => void;
-};
-
-interface TopAppBarProps {
-    /** The placeholder of the search component */
-    searchPlaceholder?: string;
-    /** The defaultValue of the search component */
-    searchDefaultValue?: string;
-    /** Flag indicating that the search is disabled */
-    isSearchDisabled?: boolean;
-    /** Callback to be triggered on onChange event of search component */
-    onSearchHandler?: (event: React__default.ChangeEvent<HTMLInputElement>) => void;
-    /** Callback to be triggered on onKeyPress event of search component */
-    onKeyPressHandler?: (event: React__default.KeyboardEvent<HTMLInputElement>) => void;
-    /** Custom product logo */
-    logoIcon?: JSX.Element;
-    /** Handler for opening end closing the Navigation. Burger menu only visible from breakpoint [tab-1024] */
-    onMenuIconClick: () => void;
-    /** Whatever is needed can be placed here. It will be placed on the left side of the user menu */
-    additionalTools?: JSX.Element | JSX.Element[];
-    /** User menu props */
-    userMenu: UserMenuProps;
-    /** Flag indicating the theme mode */
-    isDark?: boolean;
-}
-
-declare const TopAppBar: FC<TopAppBarProps>;
-
-type FilterOption = SelectOption$1;
-type SingleFilterProps = {
-    /** The function that is used to return the selected options */
-    onChange?: (selectedFilter?: FilterOption) => void;
-    /** If false the user can select one option */
-    isMulti?: false;
-    /** the value of the select if select is controlled */
-    selectedFilter?: FilterOption;
-};
-type MultiFilterProps = {
-    /** The function that is used to return the selected options */
-    onChange?: (selectedFilter: FilterOption[]) => void;
-    /** If true the user can select multiple options */
-    isMulti?: true;
-    /** The selected options in case of multiSelect */
-    selectedFilter?: FilterOption[];
-};
-type FilterAsyncSearchProps = {
-    /** Whether the search is async */
-    isAsync?: boolean;
-    /** Callback for async search */
-    onAsyncSearch?: (term: string) => void;
-    /** Minimum characters required to trigger async search  */
-    minCharactersToSearch?: number;
-    /** Loading state for async search */
-    isLoading?: boolean;
-};
-type FilterType = 'preset' | 'added';
-/** These props are passed to children in order for the custom child component to have access to the Filter's inner state */
-type FilterChildrenProps = {
-    /** Whether the overlay is open or not */
-    isOpen: boolean;
-    /** Callback to change the state of isOpen */
-    setIsOpen: any;
-    /** The Label of the Filter*/
-    filterLabel: string;
-    /** Callback to change the state of the Label */
-    setFilterLabel: any;
-};
-type FilterProps = {
-    /** The label of the Filter */
-    label: string;
-    /** The type of the filter */
-    filterType?: FilterType;
-    /** Whether the Filter is disabled */
-    isDisabled?: boolean;
-    /** Items that are being declared as filter options */
-    items?: FilterOption[];
-    /** The default value that is used when no filter is selected */
-    defaultValue: FilterOption;
-    /** Callback for when the clear all (X button) is clicked in single and multi filter */
-    onClear?: () => void;
-    /** Whether the filter is searchable */
-    isSearchable?: boolean;
-    /** [MultiFilter]: Callback for when the X button of an option is clicked */
-    onFilterDelete?: (selectedFilter: FilterOption) => void;
-    /** Whether the menu list is Virtualized */
-    isVirtualized?: boolean;
-    /** Whether the multi-filter should have a select-all option*/
-    hasSelectAllOption?: boolean;
-    /** In case of custom filter menu */
-    children?: React.FC<FilterChildrenProps>;
-} & FilterAsyncSearchProps & TestProps$1 & (SingleFilterProps | MultiFilterProps);
-
-declare const Filter: React__default.ForwardRefExoticComponent<FilterProps & React__default.RefAttributes<HTMLButtonElement>>;
-
-declare const _default: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<FilterProps & React__default.RefAttributes<HTMLButtonElement>>>;
-
-type TruncatedContentProps = {
-    /** The content of the tooltip */
-    tooltipContent: string | undefined;
-    /** Flag for overriding other settings to always show the tooltip */
-    isAlwaysVisible?: boolean;
-    /** The placement of the tooltip */
-    placement?: 'top' | 'bottom' | 'right' | 'left';
-};
-declare const TruncatedContent: React__default.FCC<TruncatedContentProps>;
-
-type TypographyVariant = 'headline01' | 'headline02' | 'headline03' | 'headline04' | 'headline05' | 'title01' | 'title02' | 'title03' | 'label01' | 'label02' | 'label03' | 'label04' | 'body01' | 'body02' | 'body03' | 'body04';
-type TypographyComponent = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div';
-type TextColorTypes = 'primary' | 'secondary' | 'error' | 'active' | 'visited';
-type TypographyProps = {
-    /** Type of the Typography that will affect the color of the text */
-    type?: TextColorTypes;
-    /** The variant of the Typography is the style of the text (font size, weight, line height, etc) */
-    variant?: TypographyVariant;
-    /** The Font Spacing used in the selection of the font family */
-    fontSpacing?: FontSpacing;
-    /** How you want to represent it, eg div, span or other @defaults p */
-    component?: TypographyComponent;
-    /** A boolean definition of the inverted case */
-    isInverted?: boolean;
-    /** A boolean definition to apply italic text */
-    isItalic?: boolean;
-    /** A boolean definition to apply bold text */
-    isBold?: boolean;
-    /** A boolean definition to apply underlined text */
-    isUnderline?: boolean;
-    children?: React__default.ReactNode;
-    id?: string;
-};
-declare const detectComponentBasedOnType: (variant: TypographyVariant) => TypographyComponent;
-declare const Typography: React__default.ForwardRefExoticComponent<TypographyProps & React__default.RefAttributes<HTMLHeadingElement>>;
-
-declare const useTheme: () => _emotion_react.Theme;
-
-declare const useEscape: (onEscape: () => void) => void;
-
-export { AcceptedColorComponentTypes, AcceptedIconNames, AnchorType, AudioControlsIcons, Avatar, AvatarColors, AvatarProps, AvatarSizes, AvatarStack, Banner, BannerProps, BarChart, BasicActionsIcons, Breadcrumb, Button, ButtonProps, CALENDAR_DEFAULT_OPTIONS, Card, CardProps, Cell, CheckBox, CheckBoxProps, ContentComponent, DataAndFinanceIcons, DateFormatType, _default$7 as DatePicker, DatePickerProps, DateRange, DisabledDates, DonutChart, Drawer, DrawerContent, DrawerContext, DrawerContextAction, DrawerContextProvider, DrawerContextReducer, DrawerContextState, DrawerFooter, DrawerHeader, DrawerProps, Elevation, ExpandCollapse, ExpandCollapseProps, ExtendedColumn, ExternalProps, ExtraOption, Filter, FilterAsyncSearchProps, FilterChildrenProps, FilterOption, FilterProps, FilterType, GenericIcons, Typography$1 as GlobalsTypography, Icon, IconButton, IconButtonProps, IconButtonShape, IconProps, InlineNotification, InlineNotificationProps, InputProps$1 as InputProps, InteractiveTooltip, InternalProps, Label, LabelProps, LineChart, Link, List, ListItem, ListItemAction, ListItemText, ListItemType, ListProps, ListRowSize, ListSection, ListSelected, ListSelection, MAX, MIN, Menu, MenuProps, Modal, MultiFilterProps, MultiSelectProps, MusicBusinessIcons, Navigation, NavigationIcons, NavigationMenuItem, NavigationProps, NotificationActions, NotificationStyleType, NotificationTypes, NotificationVariants, NotificationVisual, NotificationVisualProps, NotificationsContainer, NotificationsContainerPositions, NotificationsContainerProps, Overrides, Pagination, PaginationProps, Palette, ProgressIndicator, Radio, RadioContext, RadioGroup, RadioProps, Row, STEP_WITH_INCREMENTS, _default$3 as Search, SearchFilterConfig, SearchProps, _default$6 as Select, SelectHandlerType, SelectOption, SelectOptionBase, SelectOptionValues, SelectProps, Selection, SharedProps, SingleFilterProps, SingleSelectProps, Slider, SliderProps, Snackbar, SnackbarProps, Sort, SortingOrder, Spacing, _default as StatefulFilter, _default$2 as StatefulSearch, _default$5 as StatefulSelect, Switch, SwitchProps, _default$4 as Table, TableProps, TableType, Tag, TagColors, TagProps, TagSizes, TestProps, _default$1 as TextArea, TextAreaProps, TextColorTypes, _default$8 as TextField, TextFieldProps, TextTooltip, Theme, ThemeProvider, ThemeProviderProps, Toast, ToastProps, ToggledActionsIcons, Tooltip, TooltipContent, TooltipPlacement, TooltipProps, TopAppBarProps, TopAppBar as TopNavBar, TruncatedContent, TruncatedContentProps, Typography, TypographyComponent, TypographyProps, TypographyVariant, UserAndStatusIcons, centerAbsoluteVertical, detectComponentBasedOnType, elevation_d as elevation, emptyValue, filterConfig, flex, flexCenter, flexCenterVertical, generateTestDataId, generateUniqueID, generateUniqueKey, grid, isNotificationTypes, lineEllipsis, overrides_d as overrides, palette_d as palette, plainTextButton, queriesKeys, queriesSizes, setHasFixedLayout, setOnClose, spacing_d as spacing, defaultTheme as themeConfig, functions_d as themeFunctions, toggleIsScrollbarOnBottom, toggleIsScrollbarOnTop, transition, typography_d as typography, useBreakpoints, useDrawerContext, useEscape, useRadioGroupContent, useTheme, well };