@juspay/blend-design-system 0.0.37-beta.1 → 0.0.37-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/components/CodeBlock/types.d.ts +6 -0
  2. package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.d.ts +27 -0
  3. package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.dark.tokens.d.ts +3 -0
  4. package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.light.tokens.d.ts +3 -0
  5. package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.tokens.d.ts +74 -0
  6. package/dist/components/InputsV2/MultiValueInputV2/MultiValueV2.types.d.ts +26 -0
  7. package/dist/components/InputsV2/MultiValueInputV2/index.d.ts +3 -0
  8. package/dist/components/InputsV2/TextInputV2/TextInputV2.d.ts +1 -4
  9. package/dist/components/InputsV2/TextInputV2/TextInputV2.types.d.ts +1 -4
  10. package/dist/components/InputsV2/inputV2.tokens.d.ts +90 -0
  11. package/dist/components/InputsV2/utils/FloatingLabelsV2/FloatingLabelsV2.d.ts +1 -20
  12. package/dist/components/InputsV2/utils/InputFooter/InputFooterV2.d.ts +2 -30
  13. package/dist/components/InputsV2/utils/InputLabels/InputLabelsV2.d.ts +2 -46
  14. package/dist/context/ThemeContext.d.ts +2 -0
  15. package/dist/context/useComponentToken.d.ts +2 -1
  16. package/dist/main.js +14255 -13439
  17. package/package.json +1 -1
package/dist/components/CodeBlock/types.d.ts CHANGED
@@ -51,4 +51,10 @@ export type CodeBlockProps = {
51
51
  * or end (GitHub-style). Defaults to 20.
52
52
  */
53
53
  diffExpandChunk?: number;
54
+ /**
55
+ * Maximum height for the code content area. When content exceeds this height,
56
+ * the code area scrolls while the header remains fixed.
57
+ * Accepts CSS values like '300px', '20rem', '50vh', etc.
58
+ */
59
+ maxHeight?: string;
54
60
  };
package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.d.ts ADDED
@@ -0,0 +1,27 @@
1
+ import { TagShape, TagSize, TagVariant } from '../../Tags';
2
+ import { InputSizeV2 } from '../inputV2.types';
3
+ declare const MultiValueInputV2: import('react').ForwardRefExoticComponent<{
4
+ value?: string;
5
+ label?: string;
6
+ sublabel?: string;
7
+ helpIconHintText?: string;
8
+ error?: boolean;
9
+ errorMessage?: string;
10
+ hintText?: string;
11
+ disabled?: boolean;
12
+ tags?: {
13
+ value: string[];
14
+ size: TagSize;
15
+ shape: TagShape;
16
+ variant: TagVariant;
17
+ };
18
+ onChange?: (value: string) => void;
19
+ onTagAdd?: (tag: string) => void;
20
+ onTagRemove?: (tag: string) => void;
21
+ size?: InputSizeV2;
22
+ onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
23
+ onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
24
+ leftSlot?: React.ReactNode;
25
+ rightSlot?: React.ReactNode;
26
+ } & Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "size" | "style" | "className" | "value" | "onFocus" | "onBlur" | "onChange"> & import('react').RefAttributes<HTMLInputElement>>;
27
+ export default MultiValueInputV2;
package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.dark.tokens.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { FoundationTokenType } from '../../../tokens/theme.token';
2
+ import { ResponsiveMultiValueInputV2Tokens } from './MultiValueInputV2.tokens';
3
+ export declare const getMultiValueInputV2DarkTokens: (foundationTokens: FoundationTokenType) => ResponsiveMultiValueInputV2Tokens;
package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.light.tokens.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { FoundationTokenType } from '../../../tokens/theme.token';
2
+ import { ResponsiveMultiValueInputV2Tokens } from './MultiValueInputV2.tokens';
3
+ export declare const getMultiValueInputV2LightTokens: (foundationTokens: FoundationTokenType) => ResponsiveMultiValueInputV2Tokens;
package/dist/components/InputsV2/MultiValueInputV2/MultiValueInputV2.tokens.d.ts ADDED
@@ -0,0 +1,74 @@
1
+ import { CSSObject } from 'styled-components';
2
+ import { InputSizeV2, InputStateV2 } from '../inputV2.types';
3
+ import { BreakpointType } from '../../../breakpoints/breakPoints';
4
+ import { Theme } from '../../../context/theme.enum';
5
+ import { FoundationTokenType } from '../../../tokens/theme.token';
6
+ import { InputFooterV2Tokens, InputLabelsV2Tokens } from '../inputV2.tokens';
7
+ export type MultiValueInputV2TokensType = {
8
+ gap: CSSObject['gap'];
9
+ borderRadius: CSSObject['borderRadius'];
10
+ topContainer: InputLabelsV2Tokens;
11
+ inputContainer: {
12
+ offSet: number;
13
+ fontSize: {
14
+ [key in InputSizeV2]: CSSObject['fontSize'];
15
+ };
16
+ fontWeight: {
17
+ [key in InputSizeV2]: CSSObject['fontWeight'];
18
+ };
19
+ gap: CSSObject['gap'];
20
+ borderRadius?: CSSObject['borderRadius'];
21
+ boxShadow: {
22
+ [key in InputStateV2]: CSSObject['boxShadow'];
23
+ };
24
+ paddingTop: {
25
+ [key in InputSizeV2]: CSSObject['paddingTop'];
26
+ };
27
+ paddingRight: {
28
+ [key in InputSizeV2]: CSSObject['paddingRight'];
29
+ };
30
+ paddingBottom: {
31
+ [key in InputSizeV2]: CSSObject['paddingBottom'];
32
+ };
33
+ paddingLeft: {
34
+ [key in InputSizeV2]: CSSObject['paddingLeft'];
35
+ };
36
+ border: {
37
+ [key in InputStateV2]: CSSObject['border'];
38
+ };
39
+ color: {
40
+ [key in InputStateV2]: CSSObject['color'];
41
+ };
42
+ placeholderColor: {
43
+ default: CSSObject['color'];
44
+ focus: CSSObject['color'];
45
+ hover: CSSObject['color'];
46
+ error: CSSObject['color'];
47
+ disabled: CSSObject['color'];
48
+ };
49
+ backgroundColor: {
50
+ [key in InputStateV2]: CSSObject['backgroundColor'];
51
+ };
52
+ closeButton: {
53
+ width: CSSObject['width'];
54
+ };
55
+ leftSlot: {
56
+ width: CSSObject['width'];
57
+ height: CSSObject['height'];
58
+ };
59
+ rightSlot: {
60
+ width: CSSObject['width'];
61
+ height: CSSObject['height'];
62
+ };
63
+ /** Vertical alignment for slot row vs tags (`top` / `marginTop` in layout) */
64
+ slotAlignTop: {
65
+ withTags: CSSObject['top'];
66
+ withoutTags: CSSObject['top'];
67
+ };
68
+ };
69
+ bottomContainer: InputFooterV2Tokens;
70
+ };
71
+ export type ResponsiveMultiValueInputV2Tokens = {
72
+ [key in keyof BreakpointType]: MultiValueInputV2TokensType;
73
+ };
74
+ export declare const getMultiValueInputV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveMultiValueInputV2Tokens;
package/dist/components/InputsV2/MultiValueInputV2/MultiValueV2.types.d.ts ADDED
@@ -0,0 +1,26 @@
1
+ import { TagShape, TagSize, TagVariant } from '../../Tags/types';
2
+ import { InputSizeV2 } from '../inputV2.types';
3
+ export type MultiValueInputV2Props = {
4
+ value?: string;
5
+ label?: string;
6
+ sublabel?: string;
7
+ helpIconHintText?: string;
8
+ error?: boolean;
9
+ errorMessage?: string;
10
+ hintText?: string;
11
+ disabled?: boolean;
12
+ tags?: {
13
+ value: string[];
14
+ size: TagSize;
15
+ shape: TagShape;
16
+ variant: TagVariant;
17
+ };
18
+ onChange?: (value: string) => void;
19
+ onTagAdd?: (tag: string) => void;
20
+ onTagRemove?: (tag: string) => void;
21
+ size?: InputSizeV2;
22
+ onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
23
+ onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
24
+ leftSlot?: React.ReactNode;
25
+ rightSlot?: React.ReactNode;
26
+ } & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'style' | 'className' | 'onChange' | 'value' | 'onFocus' | 'onBlur'>;
package/dist/components/InputsV2/MultiValueInputV2/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ export { default as MultiValueInputV2 } from './MultiValueInputV2';
2
+ export * from './MultiValueInputV2.tokens';
3
+ export * from './MultiValueV2.types';
package/dist/components/InputsV2/TextInputV2/TextInputV2.d.ts CHANGED
@@ -9,10 +9,7 @@ declare const TextInputV2: import('react').ForwardRefExoticComponent<{
9
9
  message?: string;
10
10
  };
11
11
  hintText?: string;
12
- helpIconText?: {
13
- text: string;
14
- onClick?: () => void;
15
- };
12
+ helpIconText?: string;
16
13
  leftSlot?: {
17
14
  slot: import('react').ReactElement;
18
15
  maxHeight?: import('styled-components').CSSObject["maxHeight"];
package/dist/components/InputsV2/TextInputV2/TextInputV2.types.d.ts CHANGED
@@ -11,10 +11,7 @@ export type TextInputV2Props = {
11
11
  message?: string;
12
12
  };
13
13
  hintText?: string;
14
- helpIconText?: {
15
- text: string;
16
- onClick?: () => void;
17
- };
14
+ helpIconText?: string;
18
15
  leftSlot?: {
19
16
  slot: ReactElement;
20
17
  maxHeight?: CSSObject['maxHeight'];
package/dist/components/InputsV2/inputV2.tokens.d.ts ADDED
@@ -0,0 +1,90 @@
1
+ import { CSSObject } from 'styled-components';
2
+ import { InputSizeV2, InputStateV2 } from './inputV2.types';
3
+ export type FloatingLabelsV2Tokens = {
4
+ placeholder: {
5
+ color: {
6
+ [key in InputStateV2]: CSSObject['color'];
7
+ };
8
+ fontSize: {
9
+ [key in InputSizeV2]: CSSObject['fontSize'];
10
+ };
11
+ fontWeight: {
12
+ [key in InputSizeV2]: CSSObject['fontWeight'];
13
+ };
14
+ lineHeight: {
15
+ [key in InputSizeV2]: CSSObject['lineHeight'];
16
+ };
17
+ };
18
+ required: {
19
+ color: CSSObject['color'];
20
+ };
21
+ };
22
+ export type InputLabelsV2Tokens = {
23
+ label: {
24
+ fontSize: {
25
+ [key in InputSizeV2]: CSSObject['fontSize'];
26
+ };
27
+ fontWeight: {
28
+ [key in InputSizeV2]: CSSObject['fontWeight'];
29
+ };
30
+ lineHeight: {
31
+ [key in InputSizeV2]: CSSObject['lineHeight'];
32
+ };
33
+ color: {
34
+ [key in InputStateV2]: CSSObject['color'];
35
+ };
36
+ };
37
+ subLabel: {
38
+ fontSize: {
39
+ [key in InputSizeV2]: CSSObject['fontSize'];
40
+ };
41
+ fontWeight: {
42
+ [key in InputSizeV2]: CSSObject['fontWeight'];
43
+ };
44
+ lineHeight: {
45
+ [key in InputSizeV2]: CSSObject['lineHeight'];
46
+ };
47
+ color: {
48
+ [key in InputStateV2]: CSSObject['color'];
49
+ };
50
+ };
51
+ required: {
52
+ color: CSSObject['color'];
53
+ };
54
+ helpIcon: {
55
+ width: {
56
+ [key in InputSizeV2]: CSSObject['width'];
57
+ };
58
+ color: {
59
+ [key in InputStateV2]: CSSObject['color'];
60
+ };
61
+ };
62
+ };
63
+ export type InputFooterV2Tokens = {
64
+ hintText: {
65
+ fontSize: {
66
+ [key in InputSizeV2]: CSSObject['fontSize'];
67
+ };
68
+ fontWeight: {
69
+ [key in InputSizeV2]: CSSObject['fontWeight'];
70
+ };
71
+ lineHeight: {
72
+ [key in InputSizeV2]: CSSObject['lineHeight'];
73
+ };
74
+ color: {
75
+ [key in InputStateV2]: CSSObject['color'];
76
+ };
77
+ };
78
+ errorMessage: {
79
+ fontSize: {
80
+ [key in InputSizeV2]: CSSObject['fontSize'];
81
+ };
82
+ fontWeight: {
83
+ [key in InputSizeV2]: CSSObject['fontWeight'];
84
+ };
85
+ lineHeight: {
86
+ [key in InputSizeV2]: CSSObject['lineHeight'];
87
+ };
88
+ color: CSSObject['color'];
89
+ };
90
+ };
package/dist/components/InputsV2/utils/FloatingLabelsV2/FloatingLabelsV2.d.ts CHANGED
@@ -1,24 +1,5 @@
1
1
  import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
2
- import { CSSObject } from 'styled-components';
3
- export type FloatingLabelsV2Tokens = {
4
- placeholder: {
5
- color: {
6
- [key in InputStateV2]: CSSObject['color'];
7
- };
8
- fontSize: {
9
- [key in InputSizeV2]: CSSObject['fontSize'];
10
- };
11
- fontWeight: {
12
- [key in InputSizeV2]: CSSObject['fontWeight'];
13
- };
14
- lineHeight: {
15
- [key in InputSizeV2]: CSSObject['lineHeight'];
16
- };
17
- };
18
- required: {
19
- color: CSSObject['color'];
20
- };
21
- };
2
+ import { FloatingLabelsV2Tokens } from '../../inputV2.tokens';
22
3
  declare const FloatingLabelsV2: ({ label, required, name, inputId, isInputFocusedOrWithValue, topPadding, leftPadding, tokens, size, state, }: {
23
4
  label: string;
24
5
  required: boolean;
package/dist/components/InputsV2/utils/InputFooter/InputFooterV2.d.ts CHANGED
@@ -1,33 +1,5 @@
1
- import { CSSObject } from 'styled-components';
2
- import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
3
- type InputFooterV2Tokens = {
4
- hintText: {
5
- fontSize: {
6
- [key in InputSizeV2]: CSSObject['fontSize'];
7
- };
8
- fontWeight: {
9
- [key in InputSizeV2]: CSSObject['fontWeight'];
10
- };
11
- lineHeight: {
12
- [key in InputSizeV2]: CSSObject['lineHeight'];
13
- };
14
- color: {
15
- [key in InputStateV2]: CSSObject['color'];
16
- };
17
- };
18
- errorMessage: {
19
- fontSize: {
20
- [key in InputSizeV2]: CSSObject['fontSize'];
21
- };
22
- fontWeight: {
23
- [key in InputSizeV2]: CSSObject['fontWeight'];
24
- };
25
- lineHeight: {
26
- [key in InputSizeV2]: CSSObject['lineHeight'];
27
- };
28
- color: CSSObject['color'];
29
- };
30
- };
1
+ import { InputSizeV2 } from '../../inputV2.types';
2
+ import { InputFooterV2Tokens } from '../../inputV2.tokens';
31
3
  type InputFooterV2Props = {
32
4
  error?: boolean;
33
5
  errorMessage?: string;
package/dist/components/InputsV2/utils/InputLabels/InputLabelsV2.d.ts CHANGED
@@ -1,53 +1,9 @@
1
1
  import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
2
- import { CSSObject } from 'styled-components';
3
- export type InputLabelsV2Tokens = {
4
- label: {
5
- fontSize: {
6
- [key in InputSizeV2]: CSSObject['fontSize'];
7
- };
8
- fontWeight: {
9
- [key in InputSizeV2]: CSSObject['fontWeight'];
10
- };
11
- lineHeight: {
12
- [key in InputSizeV2]: CSSObject['lineHeight'];
13
- };
14
- color: {
15
- [key in InputStateV2]: CSSObject['color'];
16
- };
17
- };
18
- subLabel: {
19
- fontSize: {
20
- [key in InputSizeV2]: CSSObject['fontSize'];
21
- };
22
- fontWeight: {
23
- [key in InputSizeV2]: CSSObject['fontWeight'];
24
- };
25
- lineHeight: {
26
- [key in InputSizeV2]: CSSObject['lineHeight'];
27
- };
28
- color: {
29
- [key in InputStateV2]: CSSObject['color'];
30
- };
31
- };
32
- required: {
33
- color: CSSObject['color'];
34
- };
35
- helpIcon: {
36
- width: {
37
- [key in InputSizeV2]: CSSObject['width'];
38
- };
39
- color: {
40
- [key in InputStateV2]: CSSObject['color'];
41
- };
42
- };
43
- };
2
+ import { InputLabelsV2Tokens } from '../../inputV2.tokens';
44
3
  export type InputLabelsV2Props = {
45
4
  label?: string;
46
5
  sublabel?: string;
47
- helpIconText?: {
48
- text: string;
49
- onClick?: () => void;
50
- };
6
+ helpIconText?: string;
51
7
  name?: string;
52
8
  inputId?: string;
53
9
  required?: boolean;
package/dist/context/ThemeContext.d.ts CHANGED
@@ -67,6 +67,7 @@ import { ResponsiveTabsV2Tokens } from '../components/TabsV2/tabsV2.tokens';
67
67
  import { ResponsiveCodeEditorV2Tokens } from '../components/CodeEditorV2/codeEditorV2.tokens';
68
68
  import { ResponsiveProgressBarV2Tokens } from '../components/ProgressBarV2/progressBarV2.tokens';
69
69
  import { ResponsiveBreadcrumbV2Tokens } from '../components/BreadcrumbV2/breadcrumbV2.tokens';
70
+ import { ResponsiveMultiValueInputV2Tokens } from '../components/InputsV2/MultiValueInputV2/MultiValueInputV2.tokens';
70
71
  export type ComponentTokenType = {
71
72
  TAGS?: ResponsiveTagTokens;
72
73
  SEARCH_INPUT?: ResponsiveSearchInputTokens;
@@ -134,6 +135,7 @@ export type ComponentTokenType = {
134
135
  BREADCRUMBV2?: ResponsiveBreadcrumbV2Tokens;
135
136
  CODEEDITORV2?: ResponsiveCodeEditorV2Tokens;
136
137
  PROGRESS_BARV2?: ResponsiveProgressBarV2Tokens;
138
+ MULTI_VALUE_INPUT_V2?: ResponsiveMultiValueInputV2Tokens;
137
139
  };
138
140
  type ThemeContextType = {
139
141
  foundationTokens: ThemeType;
package/dist/context/useComponentToken.d.ts CHANGED
@@ -64,4 +64,5 @@ import { ResponsiveTabsV2Tokens } from '../components/TabsV2/tabsV2.tokens';
64
64
  import { ResponsiveBreadcrumbV2Tokens } from '../components/BreadcrumbV2/breadcrumbV2.tokens';
65
65
  import { ResponsiveCodeEditorV2Tokens } from '../components/CodeEditorV2/codeEditorV2.tokens';
66
66
  import { ResponsiveProgressBarV2Tokens } from '../components/ProgressBarV2/progressBarV2.tokens';
67
- export declare const useComponentToken: (component: keyof ComponentTokenType) => ResponsiveSearchInputTokens | ResponsiveTagTokens | ResponsiveTextAreaTokens | ResponsiveTextInputTokens | ResponsiveNumberInputTokens | ResponsiveAlertTokens | ResponsiveRadioTokens | ResponsiveOTPInputTokens | ResponsiveUnitInputTokens | ResponsiveMultiValueInputTokens | ResponsiveSwitchTokens | ResponsiveCheckboxTokens | ResponsiveTabsTokens | ResponsiveTooltipTokens | ResponsiveDropdownInputTokens | ResponsiveModalTokens | ResponsiveBreadcrumbTokens | ResponsivePopoverTokens | ResponsiveMenuTokensType | ResponsiveMenuV2TokensType | ResponsiveMultiSelectTokens | ResponsiveSingleSelectTokens | ResponsiveTableTokens | ResponsiveCalendarTokens | ResponsiveAccordionTokens | ResponsiveStatCardTokens | ResponsiveProgressBarTokens | ResponsiveDrawerTokens | ResponsiveChartTokens | ResponsiveSnackbarTokens | ResponsiveStepperTokens | ResponsiveKeyValuePairTokens | ResponsiveCardTokens | ResponsiveSkeletonTokens | ResponsiveTopbarTokens | ResponsiveAvatarTokens | ResponsiveAvatarGroupTokens | ResponsiveSidebarTokens | ResponsiveUploadTokens | ResponsiveCodeBlockTokens | ResponsiveMobileNavigationTokens | ResponsiveDirectoryTokens | ResponsiveChatInputTokensType | ResponsiveButtonTokens | ResponsiveButtonV2Tokens | ResponsiveChatInputTokensType | ResponsiveTagV2Tokens | ResponsiveAlertV2Tokens | ResponsiveAccordionV2Tokens | ResponsiveSnackbarV2Tokens | ResponsiveSwitchV2Tokens | ResponsiveSingleSelectV2Tokens | ResponsiveMultiSelectV2Tokens | ResponsiveChartV2Tokens | ResponsiveAvatarV2Tokens | ResponsiveTextInputV2Tokens | ResponsiveTimelineTokens | ResponsiveCheckboxV2Tokens | ResponsiveKeyValuePairV2Tokens | ResponsiveStatCardV2Tokens | ResponsiveRadioV2Tokens | ResponsivePopoverV2Tokens | ResponsiveTabsV2Tokens | ResponsiveBreadcrumbV2Tokens | ResponsiveCodeEditorV2Tokens | ResponsiveProgressBarV2Tokens;
67
+ import { ResponsiveMultiValueInputV2Tokens } from '../components/InputsV2/MultiValueInputV2/MultiValueInputV2.tokens';
68
+ export declare const useComponentToken: (component: keyof ComponentTokenType) => ResponsiveSearchInputTokens | ResponsiveTagTokens | ResponsiveTextAreaTokens | ResponsiveTextInputTokens | ResponsiveNumberInputTokens | ResponsiveAlertTokens | ResponsiveRadioTokens | ResponsiveOTPInputTokens | ResponsiveUnitInputTokens | ResponsiveMultiValueInputTokens | ResponsiveSwitchTokens | ResponsiveCheckboxTokens | ResponsiveTabsTokens | ResponsiveTooltipTokens | ResponsiveDropdownInputTokens | ResponsiveModalTokens | ResponsiveBreadcrumbTokens | ResponsivePopoverTokens | ResponsiveMenuTokensType | ResponsiveMenuV2TokensType | ResponsiveMultiSelectTokens | ResponsiveSingleSelectTokens | ResponsiveTableTokens | ResponsiveCalendarTokens | ResponsiveAccordionTokens | ResponsiveStatCardTokens | ResponsiveProgressBarTokens | ResponsiveDrawerTokens | ResponsiveChartTokens | ResponsiveSnackbarTokens | ResponsiveStepperTokens | ResponsiveKeyValuePairTokens | ResponsiveCardTokens | ResponsiveSkeletonTokens | ResponsiveTopbarTokens | ResponsiveAvatarTokens | ResponsiveAvatarGroupTokens | ResponsiveSidebarTokens | ResponsiveUploadTokens | ResponsiveCodeBlockTokens | ResponsiveMobileNavigationTokens | ResponsiveDirectoryTokens | ResponsiveChatInputTokensType | ResponsiveButtonTokens | ResponsiveButtonV2Tokens | ResponsiveChatInputTokensType | ResponsiveTagV2Tokens | ResponsiveAlertV2Tokens | ResponsiveAccordionV2Tokens | ResponsiveSnackbarV2Tokens | ResponsiveSwitchV2Tokens | ResponsiveSingleSelectV2Tokens | ResponsiveMultiSelectV2Tokens | ResponsiveChartV2Tokens | ResponsiveAvatarV2Tokens | ResponsiveTextInputV2Tokens | ResponsiveTimelineTokens | ResponsiveCheckboxV2Tokens | ResponsiveKeyValuePairV2Tokens | ResponsiveStatCardV2Tokens | ResponsiveRadioV2Tokens | ResponsivePopoverV2Tokens | ResponsiveTabsV2Tokens | ResponsiveBreadcrumbV2Tokens | ResponsiveProgressBarV2Tokens | ResponsiveMultiValueInputV2Tokens | ResponsiveCodeEditorV2Tokens;