@juspay/blend-design-system 0.0.37-beta.5 → 0.0.37-beta.6

package/dist/components/BreadcrumbV2/breadcrumbV2.light.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveBreadcrumbV2Tokens } from './breadcrumbV2.tokens';
+import { ResponsiveBreadcrumbV2Tokens } from './breadcrumbV2.tokens.types';
 export declare const getBreadcrumbV2LightTokens: (foundationToken: FoundationTokenType) => ResponsiveBreadcrumbV2Tokens;

package/dist/components/BreadcrumbV2/breadcrumbV2.tokens.d.ts

@@ -1,31 +1,5 @@
-import { CSSObject } from 'styled-components';
-import { BreakpointType } from '../../breakpoints/breakPoints';
 import { FoundationTokenType } from '../../tokens/theme.token';
 import { Theme } from '../../context/theme.enum';
-export type BreadcrumbV2State = 'default' | 'hover' | 'active';
-export type BreadcrumbV2TokensType = {
-    gap: CSSObject['gap'];
-    item: {
-        padding: CSSObject['padding'];
-        gap: CSSObject['gap'];
-        text: {
-            fontSize: CSSObject['fontSize'];
-            fontWeight: CSSObject['fontWeight'];
-            color: {
-                [key in BreadcrumbV2State]: CSSObject['color'];
-            };
-        };
-    };
-    ellipsis: {
-        color: CSSObject['color'];
-        borderRadius: CSSObject['borderRadius'];
-        size: number;
-    };
-    separator: {
-        color: CSSObject['color'];
-    };
-};
-export type ResponsiveBreadcrumbV2Tokens = {
-    [key in keyof BreakpointType]: BreadcrumbV2TokensType;
-};
+import { ResponsiveBreadcrumbV2Tokens } from './breadcrumbV2.tokens.types';
+export type { BreadcrumbV2State, BreadcrumbV2TokensType, ResponsiveBreadcrumbV2Tokens, } from './breadcrumbV2.tokens.types';
 export declare const getBreadcrumbV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveBreadcrumbV2Tokens;

package/dist/components/BreadcrumbV2/breadcrumbV2.tokens.types.d.ts

@@ -0,0 +1,28 @@
+import { CSSObject } from 'styled-components';
+import { BreakpointType } from '../../breakpoints/breakPoints';
+export type BreadcrumbV2State = 'default' | 'hover' | 'active';
+export type BreadcrumbV2TokensType = {
+    gap: CSSObject['gap'];
+    item: {
+        padding: CSSObject['padding'];
+        gap: CSSObject['gap'];
+        text: {
+            fontSize: CSSObject['fontSize'];
+            fontWeight: CSSObject['fontWeight'];
+            color: {
+                [key in BreadcrumbV2State]: CSSObject['color'];
+            };
+        };
+    };
+    ellipsis: {
+        color: CSSObject['color'];
+        borderRadius: CSSObject['borderRadius'];
+        size: number;
+    };
+    separator: {
+        color: CSSObject['color'];
+    };
+};
+export type ResponsiveBreadcrumbV2Tokens = {
+    [key in keyof BreakpointType]: BreadcrumbV2TokensType;
+};

package/dist/components/BreadcrumbV2/breadcrumbV2.types.d.ts

@@ -1,7 +1,3 @@
-import { default as BreadcrumbV2CompoundItem } from './BreadcrumbV2Item';
-import { default as BreadcrumbV2Icon } from './BreadcrumbV2Icon';
-import { default as BreadcrumbV2Page } from './BreadcrumbV2Page';
-import { default as BreadcrumbV2Separator } from './BreadcrumbV2Separator';
 import * as React from 'react';
 export type BreadcrumbV2ItemType = {
     /** Stable unique id for React list keys when `href` may repeat or collide (e.g. dynamic routes). */
@@ -37,10 +33,3 @@ export type BreadcrumbV2Props = {
      */
     maxItems?: number;
 };
-export type BreadcrumbV2Component = ((props: BreadcrumbV2Props) => React.ReactElement | null) & {
-    displayName?: string;
-    Item: typeof BreadcrumbV2CompoundItem;
-    Icon: typeof BreadcrumbV2Icon;
-    Separator: typeof BreadcrumbV2Separator;
-    Page: typeof BreadcrumbV2Page;
-};

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

@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-import { ButtonProps } from '../Button';
+import { ButtonProps } from '../Button/types';
 export type ButtonGroupProps = {
     stacked?: boolean;
     children: ReactElement<ButtonProps> | ReactElement<ButtonProps>[];

package/dist/components/ButtonV2/buttonV2.dark.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveButtonV2Tokens } from './buttonV2.tokens';
+import { ResponsiveButtonV2Tokens } from './buttonV2.tokens.types';
 export declare const getButtonV2DarkTokens: (foundationToken: FoundationTokenType) => ResponsiveButtonV2Tokens;

package/dist/components/ButtonV2/buttonV2.light.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveButtonV2Tokens } from './buttonV2.tokens';
+import { ResponsiveButtonV2Tokens } from './buttonV2.tokens.types';
 export declare const getButtonV2LightTokens: (foundationToken: FoundationTokenType) => ResponsiveButtonV2Tokens;

package/dist/components/ButtonV2/buttonV2.tokens.d.ts

@@ -1,67 +1,5 @@
-import { CSSObject } from 'styled-components';
-import { ButtonV2Size, ButtonV2State, ButtonV2SubType, ButtonV2Type, PaddingDirection } from './buttonV2.types';
-import { BreakpointType } from '../../breakpoints/breakPoints';
 import { FoundationTokenType } from '../../tokens/theme.token';
 import { Theme } from '../../context/theme.enum';
-export type ButtonV2TokensType = Readonly<{
-    gap: CSSObject['gap'];
-    backgroundColor: {
-        [key in ButtonV2Type]: {
-            [key in ButtonV2SubType]: {
-                [key in ButtonV2State]: CSSObject['background'];
-            };
-        };
-    };
-    borderRadius: {
-        [key in ButtonV2Size]: {
-            [key in ButtonV2Type]: {
-                [key in ButtonV2SubType]: CSSObject['borderRadius'];
-            };
-        };
-    };
-    padding: {
-        [key in PaddingDirection]: {
-            [key in ButtonV2Size]: {
-                [key in ButtonV2Type]: {
-                    [key in ButtonV2SubType]: CSSObject['padding'];
-                };
-            };
-        };
-    };
-    border: {
-        [key in ButtonV2Type]: {
-            [key in ButtonV2SubType]: {
-                [key in ButtonV2State]: CSSObject['border'];
-            };
-        };
-    };
-    shadow: {
-        [key in ButtonV2Type]: {
-            [key in ButtonV2SubType]: {
-                [key in ButtonV2State]: CSSObject['boxShadow'];
-            };
-        };
-    };
-    text: {
-        color: {
-            [key in ButtonV2Type]: {
-                [key in ButtonV2SubType]: {
-                    [key in ButtonV2State]: CSSObject['color'];
-                };
-            };
-        };
-        fontSize: {
-            [key in ButtonV2Size]: CSSObject['fontSize'];
-        };
-        fontWeight: {
-            [key in ButtonV2Size]: CSSObject['fontWeight'];
-        };
-        lineHeight: {
-            [key in ButtonV2Size]: CSSObject['lineHeight'];
-        };
-    };
-}>;
-export type ResponsiveButtonV2Tokens = {
-    [key in keyof BreakpointType]: ButtonV2TokensType;
-};
+import { ResponsiveButtonV2Tokens } from './buttonV2.tokens.types';
+export type { ButtonV2TokensType, ResponsiveButtonV2Tokens, } from './buttonV2.tokens.types';
 export declare const getButtonV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveButtonV2Tokens;

package/dist/components/ButtonV2/buttonV2.tokens.types.d.ts

@@ -0,0 +1,64 @@
+import { CSSObject } from 'styled-components';
+import { ButtonV2Size, ButtonV2State, ButtonV2SubType, ButtonV2Type, PaddingDirection } from './buttonV2.types';
+import { BreakpointType } from '../../breakpoints/breakPoints';
+export type ButtonV2TokensType = Readonly<{
+    gap: CSSObject['gap'];
+    backgroundColor: {
+        [key in ButtonV2Type]: {
+            [key in ButtonV2SubType]: {
+                [key in ButtonV2State]: CSSObject['background'];
+            };
+        };
+    };
+    borderRadius: {
+        [key in ButtonV2Size]: {
+            [key in ButtonV2Type]: {
+                [key in ButtonV2SubType]: CSSObject['borderRadius'];
+            };
+        };
+    };
+    padding: {
+        [key in PaddingDirection]: {
+            [key in ButtonV2Size]: {
+                [key in ButtonV2Type]: {
+                    [key in ButtonV2SubType]: CSSObject['padding'];
+                };
+            };
+        };
+    };
+    border: {
+        [key in ButtonV2Type]: {
+            [key in ButtonV2SubType]: {
+                [key in ButtonV2State]: CSSObject['border'];
+            };
+        };
+    };
+    shadow: {
+        [key in ButtonV2Type]: {
+            [key in ButtonV2SubType]: {
+                [key in ButtonV2State]: CSSObject['boxShadow'];
+            };
+        };
+    };
+    text: {
+        color: {
+            [key in ButtonV2Type]: {
+                [key in ButtonV2SubType]: {
+                    [key in ButtonV2State]: CSSObject['color'];
+                };
+            };
+        };
+        fontSize: {
+            [key in ButtonV2Size]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in ButtonV2Size]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in ButtonV2Size]: CSSObject['lineHeight'];
+        };
+    };
+}>;
+export type ResponsiveButtonV2Tokens = {
+    [key in keyof BreakpointType]: ButtonV2TokensType;
+};

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

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { ButtonProps } from '../Button/types';
-import { SkeletonVariant } from '../Skeleton';
+import { SkeletonVariant } from '../Skeleton/types';
 export declare enum CardVariant {
     DEFAULT = "default",
     ALIGNED = "aligned",

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

@@ -1,8 +1,8 @@
 import { ReactNode } from 'react';
 import { TooltipProps } from 'recharts';
 import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
-import { ButtonProps } from '../Button';
-import { SkeletonVariant } from '../Skeleton';
+import { ButtonProps } from '../Button/types';
+import { SkeletonVariant } from '../Skeleton/types';
 export type DataPoint = {
     primary: {
         label: string;

package/dist/components/ChartsV2/chartV2.dark.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveChartV2Tokens } from './chartV2.tokens';
+import { ResponsiveChartV2Tokens } from './chartV2.tokens.types';
 export declare const getChartV2DarkTokens: (foundationToken: FoundationTokenType) => ResponsiveChartV2Tokens;

package/dist/components/ChartsV2/chartV2.light.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveChartV2Tokens } from './chartV2.tokens';
+import { ResponsiveChartV2Tokens } from './chartV2.tokens.types';
 export declare const getChartV2LightTokens: (foundationToken: FoundationTokenType) => ResponsiveChartV2Tokens;

package/dist/components/ChartsV2/chartV2.tokens.d.ts

@@ -1,102 +1,5 @@
-import { CSSObject } from 'styled-components';
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { BreakpointType } from '../../breakpoints/breakPoints';
 import { Theme } from '../../context/theme.enum';
-export type ChartV2TokensType = {
-    border: CSSObject['border'];
-    borderRadius: CSSObject['borderRadius'];
-    boxShadow: CSSObject['boxShadow'];
-    backgroundColor: CSSObject['backgroundColor'];
-    header: {
-        padding: {
-            top: CSSObject['padding'];
-            right: CSSObject['padding'];
-            bottom: CSSObject['padding'];
-            left: CSSObject['padding'];
-        };
-        backgroundColor: CSSObject['backgroundColor'];
-        borderBottom: CSSObject['borderBottom'];
-    };
-    legends: {
-        gap: CSSObject['gap'];
-        legendItem: {
-            gap: CSSObject['gap'];
-            shape: {
-                width: CSSObject['width'];
-                height: CSSObject['height'];
-                borderRadius: CSSObject['borderRadius'];
-            };
-            text: {
-                gap: CSSObject['gap'];
-                name: {
-                    fontSize: CSSObject['fontSize'];
-                    fontWeight: CSSObject['fontWeight'];
-                    lineHeight: CSSObject['lineHeight'];
-                    color: CSSObject['color'];
-                };
-                value: {
-                    fontSize: CSSObject['fontSize'];
-                    fontWeight: CSSObject['fontWeight'];
-                    lineHeight: CSSObject['lineHeight'];
-                    color: CSSObject['color'];
-                };
-                separator: {
-                    color: CSSObject['color'];
-                    width: CSSObject['width'];
-                    height: CSSObject['height'];
-                };
-            };
-        };
-    };
-    chart: {
-        backgroundColor: CSSObject['backgroundColor'];
-        xAxis: {
-            title: {
-                fontSize: CSSObject['fontSize'];
-                color: CSSObject['color'];
-                fontWeight: CSSObject['fontWeight'];
-                lineHeight: CSSObject['lineHeight'];
-            };
-            labels: {
-                fontSize: CSSObject['fontSize'];
-                color: CSSObject['color'];
-                fontWeight: CSSObject['fontWeight'];
-                lineHeight: CSSObject['lineHeight'];
-            };
-            line: {
-                width: CSSObject['width'];
-                color: CSSObject['color'];
-            };
-            gridLine: {
-                width: CSSObject['width'];
-                color: CSSObject['color'];
-            };
-        };
-        yAxis: {
-            title: {
-                fontSize: CSSObject['fontSize'];
-                color: CSSObject['color'];
-                fontWeight: CSSObject['fontWeight'];
-                lineHeight: CSSObject['lineHeight'];
-            };
-            labels: {
-                fontSize: CSSObject['fontSize'];
-                color: CSSObject['color'];
-                fontWeight: CSSObject['fontWeight'];
-                lineHeight: CSSObject['lineHeight'];
-            };
-            line: {
-                width: CSSObject['width'];
-                color: CSSObject['color'];
-            };
-            gridLine: {
-                width: CSSObject['width'];
-                color: CSSObject['color'];
-            };
-        };
-    };
-};
-export type ResponsiveChartV2Tokens = {
-    [key in keyof BreakpointType]: ChartV2TokensType;
-};
+import { ResponsiveChartV2Tokens } from './chartV2.tokens.types';
+export type { ChartV2TokensType, ResponsiveChartV2Tokens, } from './chartV2.tokens.types';
 export declare const getChartV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveChartV2Tokens;

package/dist/components/ChartsV2/chartV2.tokens.types.d.ts

@@ -0,0 +1,99 @@
+import { CSSObject } from 'styled-components';
+import { BreakpointType } from '../../breakpoints/breakPoints';
+export type ChartV2TokensType = {
+    border: CSSObject['border'];
+    borderRadius: CSSObject['borderRadius'];
+    boxShadow: CSSObject['boxShadow'];
+    backgroundColor: CSSObject['backgroundColor'];
+    header: {
+        padding: {
+            top: CSSObject['padding'];
+            right: CSSObject['padding'];
+            bottom: CSSObject['padding'];
+            left: CSSObject['padding'];
+        };
+        backgroundColor: CSSObject['backgroundColor'];
+        borderBottom: CSSObject['borderBottom'];
+    };
+    legends: {
+        gap: CSSObject['gap'];
+        legendItem: {
+            gap: CSSObject['gap'];
+            shape: {
+                width: CSSObject['width'];
+                height: CSSObject['height'];
+                borderRadius: CSSObject['borderRadius'];
+            };
+            text: {
+                gap: CSSObject['gap'];
+                name: {
+                    fontSize: CSSObject['fontSize'];
+                    fontWeight: CSSObject['fontWeight'];
+                    lineHeight: CSSObject['lineHeight'];
+                    color: CSSObject['color'];
+                };
+                value: {
+                    fontSize: CSSObject['fontSize'];
+                    fontWeight: CSSObject['fontWeight'];
+                    lineHeight: CSSObject['lineHeight'];
+                    color: CSSObject['color'];
+                };
+                separator: {
+                    color: CSSObject['color'];
+                    width: CSSObject['width'];
+                    height: CSSObject['height'];
+                };
+            };
+        };
+    };
+    chart: {
+        backgroundColor: CSSObject['backgroundColor'];
+        xAxis: {
+            title: {
+                fontSize: CSSObject['fontSize'];
+                color: CSSObject['color'];
+                fontWeight: CSSObject['fontWeight'];
+                lineHeight: CSSObject['lineHeight'];
+            };
+            labels: {
+                fontSize: CSSObject['fontSize'];
+                color: CSSObject['color'];
+                fontWeight: CSSObject['fontWeight'];
+                lineHeight: CSSObject['lineHeight'];
+            };
+            line: {
+                width: CSSObject['width'];
+                color: CSSObject['color'];
+            };
+            gridLine: {
+                width: CSSObject['width'];
+                color: CSSObject['color'];
+            };
+        };
+        yAxis: {
+            title: {
+                fontSize: CSSObject['fontSize'];
+                color: CSSObject['color'];
+                fontWeight: CSSObject['fontWeight'];
+                lineHeight: CSSObject['lineHeight'];
+            };
+            labels: {
+                fontSize: CSSObject['fontSize'];
+                color: CSSObject['color'];
+                fontWeight: CSSObject['fontWeight'];
+                lineHeight: CSSObject['lineHeight'];
+            };
+            line: {
+                width: CSSObject['width'];
+                color: CSSObject['color'];
+            };
+            gridLine: {
+                width: CSSObject['width'];
+                color: CSSObject['color'];
+            };
+        };
+    };
+};
+export type ResponsiveChartV2Tokens = {
+    [key in keyof BreakpointType]: ChartV2TokensType;
+};

package/dist/components/ChartsV2/chartV2.types.d.ts

@@ -1,8 +1,8 @@
 import { RefObject, ReactNode, HTMLAttributes } from 'react';
 import { HighchartsReactProps, HighchartsReactRefObject } from 'highcharts-react-official';
 import { default as Highcharts } from 'highcharts';
-import { ButtonProps } from '../Button';
-import { SkeletonVariant } from '../Skeleton';
+import { ButtonProps } from '../Button/types';
+import { SkeletonVariant } from '../Skeleton/types';
 export declare const ChartV2BaseInstance: typeof Highcharts;
 export type ChartV2Type = typeof Highcharts;
 export type ChartV2ReactProps = HighchartsReactProps;

package/dist/components/ChatInput/AttachmentFile.d.ts

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
-import { AttachedFile, MenuProps } from '../../main';
+import { AttachedFile } from './types';
+import { MenuProps } from '../Menu';
 type AttachmentFileProps = {
     attachedFiles: AttachedFile[];
     onFileRemove?: (fileId: string) => void;

package/dist/components/ChatInput/ChatInput.d.ts

@@ -1,21 +1,21 @@
 import { default as React } from 'react';
-import { AttachedFile, TopQuery } from './types';
-export declare const getDocIcon: (fileType: AttachedFile["type"]) => React.ReactNode;
+import { TopQuery } from './types';
+export { getDocIcon } from './getDocIcon';
 declare const ChatInput: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "value"> & {
     value?: string;
     slot1?: React.ReactNode;
     slot2?: React.ReactNode;
     onChange?: (value: string) => void;
-    onSend?: (message: string, files: AttachedFile[]) => void;
+    onSend?: (message: string, files: import('./types').AttachedFile[]) => void;
     onAttachFiles?: (files: File[]) => void;
     onVoiceRecord?: () => void;
     onFileRemove?: (fileId: string) => void;
-    onFileClick?: (file: AttachedFile) => void;
+    onFileClick?: (file: import('./types').AttachedFile) => void;
     placeholder?: string;
     disabled?: boolean;
     maxLength?: number;
     autoResize?: boolean;
-    attachedFiles?: AttachedFile[];
+    attachedFiles?: import('./types').AttachedFile[];
     topQueries?: TopQuery[];
     onTopQuerySelect?: (query: TopQuery) => void;
     topQueriesMaxHeight?: number;

package/dist/components/ChatInput/MobileChatInput.d.ts

@@ -1,4 +1,5 @@
-import { AttachedFile, MenuProps } from '../../main';
+import { AttachedFile } from './types';
+import { MenuProps } from '../Menu/types';
 type MobileChatInputProps = {
     value: string;
     onChange?: (value: string) => void;

package/dist/components/ChatInput/getDocIcon.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { AttachedFile } from './types';
+export declare const getDocIcon: (fileType: AttachedFile["type"]) => React.ReactNode;

package/dist/components/CodeEditorV2/codeEditorV2.dark.tokens.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveCodeEditorV2Tokens } from './codeEditorV2.tokens';
+import { ResponsiveCodeEditorV2Tokens } from './codeEditorV2.tokens.types';
 export declare const darkCodeEditorV2Tokens: (foundationToken: FoundationTokenType) => ResponsiveCodeEditorV2Tokens;

package/dist/components/CodeEditorV2/codeEditorV2.light.token.d.ts

@@ -1,3 +1,3 @@
 import { FoundationTokenType } from '../../tokens/theme.token';
-import { ResponsiveCodeEditorV2Tokens } from './codeEditorV2.tokens';
+import { ResponsiveCodeEditorV2Tokens } from './codeEditorV2.tokens.types';
 export declare const lightCodeEditorV2Tokens: (foundationToken: FoundationTokenType) => ResponsiveCodeEditorV2Tokens;

package/dist/components/CodeEditorV2/codeEditorV2.tokens.d.ts

@@ -1,94 +1,5 @@
-import { CSSObject } from 'styled-components';
-import { BreakpointType } from '../../breakpoints/breakPoints';
 import { FoundationTokenType } from '../../tokens/theme.token';
 import { Theme } from '../../context/theme.enum';
-import { CodeEditorV2DiffLineType } from './codeEditorV2.types';
-export type CodeEditorV2Tokens = {
-    backgroundColor: CSSObject['backgroundColor'];
-    border: CSSObject['border'];
-    borderRadius: CSSObject['borderRadius'];
-    boxShadow: CSSObject['boxShadow'];
-    theme: 'light' | 'dark';
-    header: {
-        backgroundColor: CSSObject['backgroundColor'];
-        borderBottom: CSSObject['borderBottom'];
-        paddingTop: CSSObject['paddingTop'];
-        paddingBottom: CSSObject['paddingBottom'];
-        paddingLeft: CSSObject['paddingLeft'];
-        paddingRight: CSSObject['paddingRight'];
-        gap: CSSObject['gap'];
-        icon: {
-            width: CSSObject['width'];
-        };
-        text: {
-            fontSize: CSSObject['fontSize'];
-            fontWeight: CSSObject['fontWeight'];
-            lineHeight: CSSObject['lineHeight'];
-            color: CSSObject['color'];
-        };
-    };
-    body: {
-        paddingTop: CSSObject['paddingTop'];
-        paddingBottom: CSSObject['paddingBottom'];
-        paddingLeft: CSSObject['paddingLeft'];
-        paddingRight: CSSObject['paddingRight'];
-        backgroundColor: CSSObject['backgroundColor'];
-        gutter: {
-            width: CSSObject['width'];
-            color: CSSObject['color'];
-            backgroundColor: {
-                [key in CodeEditorV2DiffLineType]: CSSObject['backgroundColor'];
-            };
-            borderLeft: {
-                [key in CodeEditorV2DiffLineType]: CSSObject['borderLeft'];
-            };
-            borderColor: {
-                [key in CodeEditorV2DiffLineType]: CSSObject['color'];
-            };
-        };
-        code: {
-            fontFamily: CSSObject['fontFamily'];
-            fontSize: CSSObject['fontSize'];
-            lineHeight: CSSObject['lineHeight'];
-            paddingTop: CSSObject['paddingTop'];
-            paddingBottom: CSSObject['paddingBottom'];
-            paddingLeft: CSSObject['paddingLeft'];
-            paddingRight: CSSObject['paddingRight'];
-        };
-        highlightedLine: {
-            backgroundColor: {
-                [key in CodeEditorV2DiffLineType]: CSSObject['backgroundColor'];
-            };
-        };
-        syntax: {
-            keyword: {
-                color: CSSObject['color'];
-            };
-            function: {
-                color: CSSObject['color'];
-            };
-            string: {
-                color: CSSObject['color'];
-            };
-            number: {
-                color: CSSObject['color'];
-            };
-            operator: {
-                color: CSSObject['color'];
-            };
-            variable: {
-                color: CSSObject['color'];
-            };
-            comment: {
-                color: CSSObject['color'];
-            };
-            text: {
-                color: CSSObject['color'];
-            };
-        };
-    };
-};
-export type ResponsiveCodeEditorV2Tokens = {
-    [key in keyof BreakpointType]: CodeEditorV2Tokens;
-};
+import { ResponsiveCodeEditorV2Tokens } from './codeEditorV2.tokens.types';
+export type { CodeEditorV2Tokens, ResponsiveCodeEditorV2Tokens, } from './codeEditorV2.tokens.types';
 export declare const getCodeEditorV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveCodeEditorV2Tokens;