@czi-sds/components 20.7.0 → 21.0.0
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.
- package/dist/index.cjs.d.ts +128 -280
- package/dist/index.cjs.js +1414 -1057
- package/dist/index.esm.d.ts +128 -280
- package/dist/index.esm.js +1410 -1056
- package/dist/tailwind.json +318 -128
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/variables.css +567 -251
- package/dist/variables.scss +452 -142
- package/package.json +2 -2
package/dist/index.cjs.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { AccordionDetailsProps, PopperProps, AutocompleteInputChangeReason, AutocompleteRenderInputParams, PaperProps, SliderProps, SwitchProps, TabsProps, ToggleButtonGroupProps } from "@mui/material";
|
|
2
|
+
import { AccordionDetailsProps, PaletteMode, PopperProps, AutocompleteInputChangeReason, AutocompleteRenderInputParams, PaperProps, SliderProps, SwitchProps, TabsProps, ToggleButtonGroupProps } from "@mui/material";
|
|
3
3
|
import { AccordionProps as RawAccordionProps } from "@mui/material";
|
|
4
4
|
import { AccordionSummaryProps as RawAccordionSummaryProps } from "@mui/material";
|
|
5
5
|
import { AutocompleteChangeDetails as AutocompleteChangeDetails$0 } from "@mui/material";
|
|
@@ -45,149 +45,96 @@ interface SdsAccordionHeaderProps {
|
|
|
45
45
|
}
|
|
46
46
|
type AccordionHeaderProps = RawAccordionSummaryProps & SdsAccordionHeaderProps;
|
|
47
47
|
declare const AccordionHeader: (props: AccordionHeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
fillHover: string;
|
|
113
|
-
fillPressed: string;
|
|
114
|
-
fillOnFill: string;
|
|
115
|
-
surface: string;
|
|
116
|
-
border: string;
|
|
117
|
-
icon: string;
|
|
118
|
-
};
|
|
119
|
-
neutral: {
|
|
120
|
-
fill: string;
|
|
121
|
-
fillHover: string;
|
|
122
|
-
fillPressed: string;
|
|
123
|
-
fillOnFill: string;
|
|
124
|
-
surface: string;
|
|
125
|
-
border: string;
|
|
126
|
-
icon: string;
|
|
127
|
-
};
|
|
128
|
-
notice: {
|
|
129
|
-
fill: string;
|
|
130
|
-
fillHover: string;
|
|
131
|
-
fillPressed: string;
|
|
132
|
-
fillOnFill: string;
|
|
133
|
-
surface: string;
|
|
134
|
-
border: string;
|
|
135
|
-
icon: string;
|
|
136
|
-
};
|
|
137
|
-
positive: {
|
|
138
|
-
fill: string;
|
|
139
|
-
fillHover: string;
|
|
140
|
-
fillPressed: string;
|
|
141
|
-
fillOnFill: string;
|
|
142
|
-
surface: string;
|
|
143
|
-
border: string;
|
|
144
|
-
icon: string;
|
|
145
|
-
};
|
|
48
|
+
interface AccentColor {
|
|
49
|
+
surfacePrimary: string;
|
|
50
|
+
surfaceSecondary: string;
|
|
51
|
+
textAction: string;
|
|
52
|
+
textActionHover: string;
|
|
53
|
+
textActionPressed: string;
|
|
54
|
+
fillHover: string;
|
|
55
|
+
fillPressed: string;
|
|
56
|
+
fillPrimary: string;
|
|
57
|
+
border: string;
|
|
58
|
+
borderHover: string;
|
|
59
|
+
borderPressed: string;
|
|
60
|
+
borderOpen: string;
|
|
61
|
+
borderFocus: string;
|
|
62
|
+
borderSelected: string;
|
|
63
|
+
icon: string;
|
|
64
|
+
iconHover: string;
|
|
65
|
+
iconPressed: string;
|
|
66
|
+
iconOpen: string;
|
|
67
|
+
iconFocus: string;
|
|
68
|
+
iconSelected: string;
|
|
69
|
+
}
|
|
70
|
+
interface BaseColor {
|
|
71
|
+
surfaceBackground: string;
|
|
72
|
+
surfacePrimary: string;
|
|
73
|
+
surfaceSecondary: string;
|
|
74
|
+
surfaceTertiary: string;
|
|
75
|
+
surfacePrimaryInverse: string;
|
|
76
|
+
textPrimary: string;
|
|
77
|
+
textPrimaryInverse: string;
|
|
78
|
+
textSecondary: string;
|
|
79
|
+
textSecondaryInverse: string;
|
|
80
|
+
textDisabled: string;
|
|
81
|
+
fillHover: string;
|
|
82
|
+
fillPressed: string;
|
|
83
|
+
fillPrimary: string;
|
|
84
|
+
fillOpen: string;
|
|
85
|
+
fillSelected: string;
|
|
86
|
+
fillDisabled: string;
|
|
87
|
+
divider: string;
|
|
88
|
+
border: string;
|
|
89
|
+
borderHover: string;
|
|
90
|
+
borderPressed: string;
|
|
91
|
+
borderDisabled: string;
|
|
92
|
+
borderTable: string;
|
|
93
|
+
iconPrimary: string;
|
|
94
|
+
iconPrimaryHover: string;
|
|
95
|
+
iconPrimaryPressed: string;
|
|
96
|
+
iconSecondary: string;
|
|
97
|
+
iconPrimaryInverse: string;
|
|
98
|
+
iconPrimaryInverseHover: string;
|
|
99
|
+
iconPrimaryInversePressed: string;
|
|
100
|
+
iconDisabled: string;
|
|
101
|
+
}
|
|
102
|
+
interface IntentColor {
|
|
103
|
+
surfacePrimary: string;
|
|
104
|
+
surfaceSecondary: string;
|
|
105
|
+
text: string;
|
|
106
|
+
fillPrimary: string;
|
|
107
|
+
fillSecondary: string;
|
|
108
|
+
fillHover: string;
|
|
109
|
+
fillPressed: string;
|
|
110
|
+
border: string;
|
|
111
|
+
ornament: string;
|
|
146
112
|
}
|
|
147
113
|
/**
|
|
148
|
-
* (masoudmanson): The
|
|
149
|
-
* semantic design tokens for the SDS
|
|
114
|
+
* (masoudmanson): The SDSPalette is a custom palette based on
|
|
115
|
+
* the semantic design tokens for the SDS components.
|
|
150
116
|
*/
|
|
151
|
-
interface
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
action: {
|
|
161
|
-
default: string;
|
|
162
|
-
hover: string;
|
|
163
|
-
pressed: string;
|
|
164
|
-
};
|
|
165
|
-
beta: string;
|
|
166
|
-
info: string;
|
|
167
|
-
negative: string;
|
|
168
|
-
neutral: string;
|
|
169
|
-
notice: string;
|
|
170
|
-
positive: string;
|
|
117
|
+
interface SDSPalette {
|
|
118
|
+
accent: AccentColor;
|
|
119
|
+
base: BaseColor;
|
|
120
|
+
beta: IntentColor;
|
|
121
|
+
info: IntentColor;
|
|
122
|
+
negative: IntentColor;
|
|
123
|
+
notice: IntentColor;
|
|
124
|
+
neutral: IntentColor;
|
|
125
|
+
positive: IntentColor;
|
|
171
126
|
}
|
|
172
127
|
/**
|
|
173
128
|
* (masoudmanson): Using module augmentation to extend the MUI Palette
|
|
174
129
|
* https://mui.com/material-ui/customization/palette/#typescript
|
|
175
130
|
*/
|
|
176
131
|
declare module "@mui/material/styles" {
|
|
177
|
-
// (masoudmanson): Extends the MUI
|
|
178
|
-
// export interface TypeText extends SDSTextPalette {}
|
|
179
|
-
// (masoudmanson): Extends the MUI Palette to include the SDSComponentPalette and the SDSTextPalette
|
|
132
|
+
// (masoudmanson): Extends the MUI Palette to include the SDSPalette and the SDSTextPalette
|
|
180
133
|
interface Palette {
|
|
181
|
-
sds:
|
|
182
|
-
component: SDSComponentPalette;
|
|
183
|
-
text: SDSTextPalette;
|
|
184
|
-
};
|
|
134
|
+
sds: SDSPalette;
|
|
185
135
|
}
|
|
186
136
|
interface PaletteOptions {
|
|
187
|
-
sds?:
|
|
188
|
-
component?: SDSComponentPalette;
|
|
189
|
-
text?: SDSTextPalette;
|
|
190
|
-
};
|
|
137
|
+
sds?: SDSPalette;
|
|
191
138
|
}
|
|
192
139
|
}
|
|
193
140
|
interface SDSTheme extends Theme {
|
|
@@ -314,18 +261,19 @@ interface Spaces {
|
|
|
314
261
|
*/
|
|
315
262
|
type Spacings = Spaces;
|
|
316
263
|
interface Color {
|
|
264
|
+
900?: string;
|
|
265
|
+
800: string;
|
|
266
|
+
700: string;
|
|
317
267
|
600: string;
|
|
318
268
|
500: string;
|
|
319
269
|
400: string;
|
|
320
270
|
300: string;
|
|
321
271
|
200: string;
|
|
322
272
|
100: string;
|
|
273
|
+
75?: string;
|
|
274
|
+
50?: string;
|
|
323
275
|
}
|
|
324
276
|
interface Colors {
|
|
325
|
-
common: {
|
|
326
|
-
white: string;
|
|
327
|
-
black: string;
|
|
328
|
-
};
|
|
329
277
|
blue: Color;
|
|
330
278
|
gray: Color;
|
|
331
279
|
green: Color;
|
|
@@ -333,129 +281,6 @@ interface Colors {
|
|
|
333
281
|
red: Color;
|
|
334
282
|
yellow: Color;
|
|
335
283
|
}
|
|
336
|
-
interface AccentColor {
|
|
337
|
-
border: string;
|
|
338
|
-
borderDisabled: string;
|
|
339
|
-
borderFocus: string;
|
|
340
|
-
borderHover: string;
|
|
341
|
-
borderOpen: string;
|
|
342
|
-
borderSelected: string;
|
|
343
|
-
borderPressed: string;
|
|
344
|
-
fill: string;
|
|
345
|
-
fillDisabled: string;
|
|
346
|
-
fillHover: string;
|
|
347
|
-
fillOnFill: string;
|
|
348
|
-
fillPressed: string;
|
|
349
|
-
icon: string;
|
|
350
|
-
surface: string;
|
|
351
|
-
}
|
|
352
|
-
interface BaseColor {
|
|
353
|
-
border: string;
|
|
354
|
-
borderDisabled: string;
|
|
355
|
-
borderHover: string;
|
|
356
|
-
borderPressed: string;
|
|
357
|
-
borderTable: string;
|
|
358
|
-
divider: string;
|
|
359
|
-
fill: string;
|
|
360
|
-
fillDisabled: string;
|
|
361
|
-
fillHover: string;
|
|
362
|
-
fillOpen: string;
|
|
363
|
-
fillPressed: string;
|
|
364
|
-
fillSelected: string;
|
|
365
|
-
icon: string;
|
|
366
|
-
iconDisabled: string;
|
|
367
|
-
iconHover: string;
|
|
368
|
-
iconPressed: string;
|
|
369
|
-
onFillDisabled: string;
|
|
370
|
-
surface: string;
|
|
371
|
-
surfacePrimary: string;
|
|
372
|
-
surfaceSecondary: string;
|
|
373
|
-
surfaceTertiary: string;
|
|
374
|
-
}
|
|
375
|
-
interface BetaColor {
|
|
376
|
-
border: string;
|
|
377
|
-
fill: string;
|
|
378
|
-
fillHover: string;
|
|
379
|
-
fillOnFill: string;
|
|
380
|
-
fillPressed: string;
|
|
381
|
-
icon: string;
|
|
382
|
-
surface: string;
|
|
383
|
-
}
|
|
384
|
-
interface InfoColor {
|
|
385
|
-
border: string;
|
|
386
|
-
fill: string;
|
|
387
|
-
fillHover: string;
|
|
388
|
-
fillOnFill: string;
|
|
389
|
-
fillPressed: string;
|
|
390
|
-
icon: string;
|
|
391
|
-
surface: string;
|
|
392
|
-
}
|
|
393
|
-
interface NegativeColor {
|
|
394
|
-
border: string;
|
|
395
|
-
fill: string;
|
|
396
|
-
fillHover: string;
|
|
397
|
-
fillOnFill: string;
|
|
398
|
-
fillPressed: string;
|
|
399
|
-
icon: string;
|
|
400
|
-
surface: string;
|
|
401
|
-
}
|
|
402
|
-
interface NeutralColor {
|
|
403
|
-
border: string;
|
|
404
|
-
fill: string;
|
|
405
|
-
fillHover: string;
|
|
406
|
-
fillOnFill: string;
|
|
407
|
-
fillPressed: string;
|
|
408
|
-
icon: string;
|
|
409
|
-
surface: string;
|
|
410
|
-
}
|
|
411
|
-
interface NoticeColor {
|
|
412
|
-
border: string;
|
|
413
|
-
fill: string;
|
|
414
|
-
fillHover: string;
|
|
415
|
-
fillOnFill: string;
|
|
416
|
-
fillPressed: string;
|
|
417
|
-
icon: string;
|
|
418
|
-
surface: string;
|
|
419
|
-
}
|
|
420
|
-
interface PositiveColor {
|
|
421
|
-
border: string;
|
|
422
|
-
fill: string;
|
|
423
|
-
fillHover: string;
|
|
424
|
-
fillOnFill: string;
|
|
425
|
-
fillPressed: string;
|
|
426
|
-
icon: string;
|
|
427
|
-
surface: string;
|
|
428
|
-
}
|
|
429
|
-
interface SemanticComponentColors {
|
|
430
|
-
accent: AccentColor;
|
|
431
|
-
base: BaseColor;
|
|
432
|
-
beta: BetaColor;
|
|
433
|
-
info: InfoColor;
|
|
434
|
-
negative: NegativeColor;
|
|
435
|
-
notice: NoticeColor;
|
|
436
|
-
neutral: NeutralColor;
|
|
437
|
-
positive: PositiveColor;
|
|
438
|
-
}
|
|
439
|
-
interface SemanticTextColors {
|
|
440
|
-
action: {
|
|
441
|
-
default?: string;
|
|
442
|
-
hover?: string;
|
|
443
|
-
pressed?: string;
|
|
444
|
-
};
|
|
445
|
-
base: {
|
|
446
|
-
accent?: string;
|
|
447
|
-
disabled?: string;
|
|
448
|
-
onFill?: string;
|
|
449
|
-
onFillDisabled?: string;
|
|
450
|
-
primary?: string;
|
|
451
|
-
secondary?: string;
|
|
452
|
-
};
|
|
453
|
-
beta: string;
|
|
454
|
-
info: string;
|
|
455
|
-
negative: string;
|
|
456
|
-
notice: string;
|
|
457
|
-
positive: string;
|
|
458
|
-
}
|
|
459
284
|
interface IconSize {
|
|
460
285
|
height: number;
|
|
461
286
|
width: number;
|
|
@@ -476,6 +301,10 @@ interface Border {
|
|
|
476
301
|
hover?: string;
|
|
477
302
|
disabled?: string;
|
|
478
303
|
table?: string;
|
|
304
|
+
pressed?: string;
|
|
305
|
+
open?: string;
|
|
306
|
+
focused?: string;
|
|
307
|
+
selected?: string;
|
|
479
308
|
}
|
|
480
309
|
interface Borders {
|
|
481
310
|
accent: Border;
|
|
@@ -489,8 +318,28 @@ interface Borders {
|
|
|
489
318
|
notice: Border;
|
|
490
319
|
positive: Border;
|
|
491
320
|
}
|
|
492
|
-
|
|
493
|
-
|
|
321
|
+
/**
|
|
322
|
+
* Theme adaptor with light/dark mode support.
|
|
323
|
+
*
|
|
324
|
+
* @param t The theme to use. Currently supports a light and dark variant.
|
|
325
|
+
* @returns The selected theme object to be used in the ThemeProvider
|
|
326
|
+
*/
|
|
327
|
+
declare const Theme$0: (t: PaletteMode) => import("@mui/material").Theme;
|
|
328
|
+
/**
|
|
329
|
+
* Default theme, uses light mode with no option to change it.
|
|
330
|
+
*
|
|
331
|
+
* Use the `theme` export to get a flexible light/dark mode theme function
|
|
332
|
+
*/
|
|
333
|
+
declare const defaultTheme: import("@mui/material").Theme;
|
|
334
|
+
declare const SDSLightAppTheme: AppTheme;
|
|
335
|
+
declare const SDSDarkAppTheme: AppTheme;
|
|
336
|
+
/**
|
|
337
|
+
* Helper function to select the appropriate theme settings.
|
|
338
|
+
*
|
|
339
|
+
* @param theme The theme to choose from. Currently supports a light and dark variant.
|
|
340
|
+
* @returns The appropriate app theme for the variant.
|
|
341
|
+
*/
|
|
342
|
+
declare const SDSChooseTheme: (theme: PaletteMode) => AppTheme;
|
|
494
343
|
/**
|
|
495
344
|
* (masoudmanson): This is to make sure that the old defaultAppTheme
|
|
496
345
|
* export is still available for backward compatibility.
|
|
@@ -502,8 +351,7 @@ declare const defaultAppTheme: AppTheme;
|
|
|
502
351
|
/**
|
|
503
352
|
* This function creates the theme options for the MUI theme provider
|
|
504
353
|
*/
|
|
505
|
-
declare function makeThemeOptions(appTheme: AppTheme): SDSThemeOptions;
|
|
506
|
-
declare function focusVisibleA11yStyle(): string;
|
|
354
|
+
declare function makeThemeOptions(appTheme: AppTheme, mode: PaletteMode): SDSThemeOptions;
|
|
507
355
|
// (thuang): Somehow this namespace needs to be globally unique to prevent
|
|
508
356
|
// namespace collisions.
|
|
509
357
|
// Might be related to using `rollup-plugin-ts`, which does code splitting?
|
|
@@ -516,15 +364,16 @@ declare const getSpaces: ({ theme }: CommonThemeProps) => Spaces | null;
|
|
|
516
364
|
*/
|
|
517
365
|
declare const getSpacings: ({ theme }: CommonThemeProps) => Spaces | null;
|
|
518
366
|
declare const getTypography: ({ theme }: CommonThemeProps) => Typography | null;
|
|
367
|
+
declare const getMode: ({ theme }: CommonThemeProps) => "light" | "dark";
|
|
519
368
|
declare const getPalette: ({ theme }: CommonThemeProps) => PaletteOptions;
|
|
520
369
|
declare const getColors: ({ theme }: CommonThemeProps) => Colors | null;
|
|
521
|
-
declare const
|
|
522
|
-
declare const getSemanticTextColors: ({ theme }: CommonThemeProps) => SemanticTextColors | null;
|
|
370
|
+
declare const getSemanticColors: ({ theme }: CommonThemeProps) => SDSPalette | null;
|
|
523
371
|
declare const getShadows: ({ theme }: CommonThemeProps) => Shadows | null;
|
|
524
372
|
declare const getCorners: ({ theme }: CommonThemeProps) => Corners | null;
|
|
525
373
|
declare const getFontWeights: ({ theme }: CommonThemeProps) => FontWeights | null;
|
|
526
374
|
declare const getIconSizes: ({ theme }: CommonThemeProps) => IconSizes | null;
|
|
527
375
|
declare const getBorders: ({ theme }: CommonThemeProps) => Borders | null;
|
|
376
|
+
declare function focusVisibleA11yStyle(props: CommonThemeProps): string;
|
|
528
377
|
type FontBodyWeight = keyof Typography["styles"]["body"];
|
|
529
378
|
type FontBodySize<T extends FontBodyWeight> = keyof Typography["styles"]["body"][T];
|
|
530
379
|
declare const fontBody: (fontSize: FontBodySize<FontBodyWeight>, fontWeight?: FontBodyWeight) => (props: CommonThemeProps) => SerializedStyles | null;
|
|
@@ -673,6 +522,7 @@ interface IconNameToSizes {
|
|
|
673
522
|
Save: "l" | "xl";
|
|
674
523
|
Search: "xs" | "s" | "l" | "xl";
|
|
675
524
|
SearchLinesHorizontal3: "xs" | "s" | "l" | "xl";
|
|
525
|
+
Send: "l" | "xl";
|
|
676
526
|
Share: "l" | "xl";
|
|
677
527
|
SlidersHorizontal: "l" | "xl";
|
|
678
528
|
SpeechBubbles: "l" | "xl";
|
|
@@ -680,6 +530,8 @@ interface IconNameToSizes {
|
|
|
680
530
|
Starburst: "xs" | "s";
|
|
681
531
|
Star: "l" | "xl";
|
|
682
532
|
Table: "xs" | "s";
|
|
533
|
+
ThumbsDown: "xs" | "s";
|
|
534
|
+
ThumbsUp: "xs" | "s";
|
|
683
535
|
TrashCan: "xs" | "s" | "l" | "xl";
|
|
684
536
|
TreeDendogram: "l" | "xl";
|
|
685
537
|
TreeHorizontal: "xs" | "s" | "l" | "xl";
|
|
@@ -717,9 +569,8 @@ type IconProps<IconName extends keyof IconNameToSizes> = IconExtraProps<IconName
|
|
|
717
569
|
declare const Icon: import("react").ForwardRefExoticComponent<IconExtraProps<keyof IconNameToSizes> & SdsIconWithColor$0 & import("react").RefAttributes<HTMLDivElement | null>>;
|
|
718
570
|
interface InputSearchExtraProps extends CommonThemeProps {
|
|
719
571
|
disabled?: boolean;
|
|
720
|
-
intent?: "default" | "
|
|
572
|
+
intent?: "default" | "negative" | "notice";
|
|
721
573
|
sdsStyle?: "rounded" | "square";
|
|
722
|
-
sdsStage?: "default" | "userInput";
|
|
723
574
|
value?: string;
|
|
724
575
|
}
|
|
725
576
|
interface AccessibleInputSearchProps {
|
|
@@ -772,7 +623,7 @@ type MenuItemProps<IconName extends keyof IconNameToSmallSizes> = MenuItemExtraP
|
|
|
772
623
|
/**
|
|
773
624
|
* @see https://mui.com/material-ui/react-menu/
|
|
774
625
|
*/
|
|
775
|
-
declare const MenuItem: React.ForwardRefExoticComponent<Omit<MenuItemProps<"Bacteria" | "BarChartHorizontal3" | "BarChartVertical3" | "BarChartVertical4" | "Check" | "CheckCircle" | "ChevronDown" | "ChevronDown2" | "ChevronLeft2" | "ChevronLeft" | "ChevronRight2" | "ChevronRight" | "ChevronUp" | "ChevronUp2" | "CirclesOverlap2" | "Copy" | "Cube" | "Document" | "DotsHorizontal" | "Download" | "Edit" | "Envelope" | "ExclamationMarkCircle" | "EyeClosed" | "EyeOpen" | "Filter" | "FlagCheck" | "FlagOutline" | "FlagQuestionMark" | "FlagXMark" | "Gear" | "Globe" | "House" | "InfoCircle" | "LifeRing" | "LightBulb" | "LinesDashed3Solid1" | "LinesHorizontal3" | "Link" | "List" | "Loading" | "Lock" | "LockCircle" | "Minus" | "Open" | "People" | "Percentage" | "Person" | "Pin" | "PinLocation" | "Plus" | "PlusCircle" | "PuzzlePiece" | "Refresh" | "RotateLeft" | "RotateRight" | "Search" | "SearchLinesHorizontal3" | "Starburst" | "Table" | "TrashCan" | "TreeHorizontal" | "TreeVertical" | "TriangleDown" | "TriangleLeft" | "TriangleRight" | "TriangleUp" | "XMark" | "XMarkCircle">, "ref"> & React.RefAttributes<HTMLLIElement | null>>;
|
|
626
|
+
declare const MenuItem: React.ForwardRefExoticComponent<Omit<MenuItemProps<"Bacteria" | "BarChartHorizontal3" | "BarChartVertical3" | "BarChartVertical4" | "Check" | "CheckCircle" | "ChevronDown" | "ChevronDown2" | "ChevronLeft2" | "ChevronLeft" | "ChevronRight2" | "ChevronRight" | "ChevronUp" | "ChevronUp2" | "CirclesOverlap2" | "Copy" | "Cube" | "Document" | "DotsHorizontal" | "Download" | "Edit" | "Envelope" | "ExclamationMarkCircle" | "EyeClosed" | "EyeOpen" | "Filter" | "FlagCheck" | "FlagOutline" | "FlagQuestionMark" | "FlagXMark" | "Gear" | "Globe" | "House" | "InfoCircle" | "LifeRing" | "LightBulb" | "LinesDashed3Solid1" | "LinesHorizontal3" | "Link" | "List" | "Loading" | "Lock" | "LockCircle" | "Minus" | "Open" | "People" | "Percentage" | "Person" | "Pin" | "PinLocation" | "Plus" | "PlusCircle" | "PuzzlePiece" | "Refresh" | "RotateLeft" | "RotateRight" | "Search" | "SearchLinesHorizontal3" | "Starburst" | "Table" | "ThumbsDown" | "ThumbsUp" | "TrashCan" | "TreeHorizontal" | "TreeVertical" | "TriangleDown" | "TriangleLeft" | "TriangleRight" | "TriangleUp" | "XMark" | "XMarkCircle">, "ref"> & React.RefAttributes<HTMLLIElement | null>>;
|
|
776
627
|
interface StyleProps extends CommonThemeProps {
|
|
777
628
|
count?: number;
|
|
778
629
|
icon?: ReactElement;
|
|
@@ -938,7 +789,7 @@ declare const Button: React.ForwardRefExoticComponent<(Omit<import("@mui/materia
|
|
|
938
789
|
isRounded?: boolean | undefined;
|
|
939
790
|
}, "ref">) & React.RefAttributes<HTMLButtonElement>>;
|
|
940
791
|
interface BannerExtraProps extends CommonThemeProps {
|
|
941
|
-
sdsType: "primary" | "secondary"
|
|
792
|
+
sdsType: "primary" | "secondary";
|
|
942
793
|
}
|
|
943
794
|
interface BannerProps extends BannerExtraProps {
|
|
944
795
|
children: React.ReactNode;
|
|
@@ -1066,6 +917,7 @@ type CellComponentProps = CellComponentContentProps & CellComponentExtraProps;
|
|
|
1066
917
|
declare const CellComponent: React.ForwardRefExoticComponent<Omit<CellComponentProps, "ref"> & React.RefAttributes<unknown>>;
|
|
1067
918
|
interface CellHeaderExtraProps extends CommonThemeProps {
|
|
1068
919
|
active?: boolean;
|
|
920
|
+
hideSortIcon?: boolean;
|
|
1069
921
|
horizontalAlign?: "left" | "center" | "right";
|
|
1070
922
|
}
|
|
1071
923
|
type CellHeaderDirection = "asc" | "desc";
|
|
@@ -1152,11 +1004,10 @@ declare const doNotForwardProps: string[];
|
|
|
1152
1004
|
interface InputDropdownProps extends CommonThemeProps, Omit<ButtonProps$0, (typeof doNotForwardProps)[number]> {
|
|
1153
1005
|
children?: ReactNode;
|
|
1154
1006
|
disabled?: boolean;
|
|
1155
|
-
intent?: "default" | "
|
|
1007
|
+
intent?: "default" | "negative" | "notice";
|
|
1156
1008
|
label: ReactNode;
|
|
1157
1009
|
onClick: (event: React.MouseEvent<HTMLElement>) => void;
|
|
1158
1010
|
state?: "default" | "open";
|
|
1159
|
-
sdsStage: "default" | "userInput";
|
|
1160
1011
|
sdsStyle?: "minimal" | "square" | "rounded";
|
|
1161
1012
|
sdsType?: "label" | "value";
|
|
1162
1013
|
multiple?: boolean;
|
|
@@ -1269,7 +1120,7 @@ type DropdownProps<T, Multiple extends boolean | undefined, DisableClearable ext
|
|
|
1269
1120
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
1270
1121
|
declare const Dropdown: <T extends DefaultAutocompleteOption, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined>(props: DropdownProps<T, Multiple, DisableClearable, FreeSolo>) => JSX.Element;
|
|
1271
1122
|
interface CheckboxExtraProps extends CommonThemeProps {
|
|
1272
|
-
intent?: "default" | "
|
|
1123
|
+
intent?: "default" | "negative" | "notice";
|
|
1273
1124
|
disabled?: boolean;
|
|
1274
1125
|
}
|
|
1275
1126
|
interface CheckboxContentProps extends Omit<MUICheckboxProps, "color" | "defaultChecked" | "indeterminate"> {
|
|
@@ -1285,7 +1136,7 @@ type CheckboxProps = CheckboxContentProps & CheckboxExtraProps;
|
|
|
1285
1136
|
*/
|
|
1286
1137
|
declare const InputCheckbox: (props: CheckboxProps) => JSX.Element;
|
|
1287
1138
|
interface RadioExtraProps extends CommonThemeProps {
|
|
1288
|
-
intent?: "default" | "
|
|
1139
|
+
intent?: "default" | "negative" | "notice";
|
|
1289
1140
|
disabled?: boolean;
|
|
1290
1141
|
}
|
|
1291
1142
|
interface RadioContentProps extends Omit<MUIRadioProps, "color" | "defaultChecked"> {
|
|
@@ -1310,9 +1161,8 @@ type InputSliderProps = InputSliderExtraProps;
|
|
|
1310
1161
|
declare const InputSlider: import("react").ForwardRefExoticComponent<Omit<InputSliderExtraProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1311
1162
|
interface InputTextExtraProps extends CommonThemeProps {
|
|
1312
1163
|
disabled?: boolean;
|
|
1313
|
-
intent?: "default" | "
|
|
1164
|
+
intent?: "default" | "negative" | "notice";
|
|
1314
1165
|
sdsType?: "textField" | "textArea";
|
|
1315
|
-
sdsStage?: "default" | "userInput";
|
|
1316
1166
|
hideLabel?: boolean;
|
|
1317
1167
|
}
|
|
1318
1168
|
interface AccessibleInputTextProps {
|
|
@@ -1415,11 +1265,9 @@ type MenuSelectProps<T, Multiple extends boolean | undefined = undefined, Disabl
|
|
|
1415
1265
|
* Please use `Autocomplete` or `Dropdown` instead.
|
|
1416
1266
|
*/
|
|
1417
1267
|
declare const MenuSelect: <T extends DefaultMenuSelectOption, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined>(props: MenuSelectProps<T, Multiple, DisableClearable, FreeSolo>) => JSX.Element;
|
|
1418
|
-
interface NavigationJumpToExtraProps extends Omit<TabsProps, "
|
|
1419
|
-
sdsIndicatorColor?: "accent" | "negative" | "info" | "positive" | "notice" | "beta";
|
|
1268
|
+
interface NavigationJumpToExtraProps extends Omit<TabsProps, "onChange">, CommonThemeProps {
|
|
1420
1269
|
}
|
|
1421
1270
|
interface NavigationJumpToProps extends NavigationJumpToExtraProps {
|
|
1422
|
-
indicatorColor?: "accent" | "negative" | "info" | "positive" | "notice" | "beta";
|
|
1423
1271
|
items: Array<{
|
|
1424
1272
|
title: string;
|
|
1425
1273
|
elementRef: React.MutableRefObject<HTMLElement | null>;
|
|
@@ -1516,7 +1364,7 @@ interface TabProps$0 extends RawTabProps {
|
|
|
1516
1364
|
* @see https://mui.com/material-ui/react-tabs/
|
|
1517
1365
|
*/
|
|
1518
1366
|
declare const Tab: React.ForwardRefExoticComponent<Omit<TabProps$0, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1519
|
-
type SdsTagColorType = "
|
|
1367
|
+
type SdsTagColorType = "info" | "positive" | "notice" | "negative" | "neutral" | "beta" | [
|
|
1520
1368
|
string,
|
|
1521
1369
|
string
|
|
1522
1370
|
] | [
|
|
@@ -1594,5 +1442,5 @@ type TooltipTableContentProps = TooltipTableExtraProps;
|
|
|
1594
1442
|
* @see https://mui.com/material-ui/react-table/
|
|
1595
1443
|
*/
|
|
1596
1444
|
declare const TooltipTableContent: (props: TooltipTableContentProps) => JSX.Element;
|
|
1597
|
-
export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerProps, Banner, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, CalloutIntentType, CalloutProps, ExposedCalloutProps, Callout, CalloutTitle, CellBasicRawProps, CellBasicProps, CellBasic, CellComponentProps, CellComponent, CellHeaderDirection, CellHeaderProps, CellHeader, Chip, InputDropdown as ComplexFilterInputDropdown, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPopper$1 as ComplexFilterPopper, StyledPopper$1 as DropdownPopper, ComplexFilterProps, ComplexFilter, DialogContext, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle$0 as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, StyledPaper$1 as DropdownPaper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, LinkProps$0 as LinkProps, Link, ListProps, List, ListItemLabel, ListItemProps, ListItem, ListSubheaderProps, ListSubheader, LoadingIndicatorProps$0 as LoadingIndicatorProps, LoadingIndicator, MenuProps, Menu, IconNameToSmallSizes, MenuItemExtraProps, MenuItemProps, MenuItem, DefaultMenuSelectOption, MenuSelectProps, MenuSelect, NavigationJumpToProps, NavigationJumpTo, NotificationIntentType, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, SingleButtonDefinition, SegmentedControlProps, SegmentedControl, SdsTableProps, TableProps, Table, TableHeaderProps, TableHeader, TableRowProps, TableRow, Tabs, TabProps$0 as TabProps, Tab, SdsTagProps, TagProps, Tag, SdsTagFilterProps, TagFilterProps, TagFilter, Tooltip, TooltipCondensedProps, TooltipCondensed, TooltipTableContent, TooltipTableContent as TooltipTable,
|
|
1445
|
+
export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerProps, Banner, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, CalloutIntentType, CalloutProps, ExposedCalloutProps, Callout, CalloutTitle, CellBasicRawProps, CellBasicProps, CellBasic, CellComponentProps, CellComponent, CellHeaderDirection, CellHeaderProps, CellHeader, Chip, InputDropdown as ComplexFilterInputDropdown, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPopper$1 as ComplexFilterPopper, StyledPopper$1 as DropdownPopper, ComplexFilterProps, ComplexFilter, DialogContext, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle$0 as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, StyledPaper$1 as DropdownPaper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, LinkProps$0 as LinkProps, Link, ListProps, List, ListItemLabel, ListItemProps, ListItem, ListSubheaderProps, ListSubheader, LoadingIndicatorProps$0 as LoadingIndicatorProps, LoadingIndicator, MenuProps, Menu, IconNameToSmallSizes, MenuItemExtraProps, MenuItemProps, MenuItem, DefaultMenuSelectOption, MenuSelectProps, MenuSelect, NavigationJumpToProps, NavigationJumpTo, NotificationIntentType, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, SingleButtonDefinition, SegmentedControlProps, SegmentedControl, SdsTableProps, TableProps, Table, TableHeaderProps, TableHeader, TableRowProps, TableRow, Tabs, TabProps$0 as TabProps, Tab, SdsTagProps, TagProps, Tag, SdsTagFilterProps, TagFilterProps, TagFilter, Tooltip, TooltipCondensedProps, TooltipCondensed, TooltipTableContent, TooltipTableContent as TooltipTable, AccentColor, BaseColor, IntentColor, SDSPalette, SDSTheme, SDSThemeOptions, AppTheme, Shadows, Typography, FontWeights, Corners, Spaces, Spacings, Color, Colors, IconSize, IconSizes, Border, Borders, Theme$0 as Theme, defaultTheme, SDSLightAppTheme, SDSDarkAppTheme, SDSChooseTheme, defaultAppTheme, makeThemeOptions, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, fontCode, fontCodeXs, fontCodeS, fontCodeSemiboldXs, fontCodeSemiboldS, fontTabular, fontTabularXs, fontTabularS, fontTabularSemiboldXs, fontTabularSemiboldS, CommonThemeProps, getSpaces, getSpacings, getTypography, getMode, getPalette, getColors, getSemanticColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders };
|
|
1598
1446
|
export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };
|