@lumx/react 4.3.2-alpha.11 → 4.3.2-alpha.12

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.
@@ -1,873 +0,0 @@
1
- import React__default, { Ref, ReactElement, AriaAttributes, ReactNode, ReactText, SyntheticEvent } from 'react';
2
- import { Selector } from '@lumx/core/js/types/Selector';
3
- import { ValueOf, GenericProps, HasAriaDisabled as HasAriaDisabled$1, HasTheme as HasTheme$1, HasCloseMode } from '@lumx/core/js/types';
4
- import { Size as Size$1 } from '@lumx/core/js/constants';
5
-
6
- /** LumX Component Type. */
7
- type Comp<P, T = HTMLElement> = {
8
- (props: P & {
9
- ref?: Ref<T>;
10
- }): ReactElement | null;
11
- /** React component type. */
12
- readonly $$typeof: symbol;
13
- /** Component default props. */
14
- defaultProps?: Partial<P>;
15
- /** Component name. */
16
- displayName?: string;
17
- /** Component base class name. */
18
- className?: string;
19
- };
20
-
21
- /**
22
- * Alignments.
23
- */
24
- declare const Alignment: {
25
- readonly bottom: "bottom";
26
- readonly center: "center";
27
- readonly end: "end";
28
- readonly left: "left";
29
- readonly right: "right";
30
- readonly spaceAround: "space-around";
31
- readonly spaceBetween: "space-between";
32
- readonly spaceEvenly: "space-evenly";
33
- readonly start: "start";
34
- readonly top: "top";
35
- };
36
- type Alignment = ValueOf<typeof Alignment>;
37
- type VerticalAlignment = Extract<Alignment, 'top' | 'center' | 'bottom'>;
38
- type HorizontalAlignment = Extract<Alignment, 'right' | 'center' | 'left'>;
39
- declare const Theme: {
40
- readonly light: "light";
41
- readonly dark: "dark";
42
- };
43
- type Theme = ValueOf<typeof Theme>;
44
- declare const Size: {
45
- readonly xxs: "xxs";
46
- readonly xs: "xs";
47
- readonly s: "s";
48
- readonly m: "m";
49
- readonly l: "l";
50
- readonly xl: "xl";
51
- readonly xxl: "xxl";
52
- readonly tiny: "tiny";
53
- readonly regular: "regular";
54
- readonly medium: "medium";
55
- readonly big: "big";
56
- readonly huge: "huge";
57
- };
58
- type Size = ValueOf<typeof Size>;
59
- type GlobalSize = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;
60
- declare const Orientation: {
61
- readonly horizontal: "horizontal";
62
- readonly vertical: "vertical";
63
- };
64
- type Orientation = ValueOf<typeof Orientation>;
65
- declare const Emphasis: {
66
- readonly low: "low";
67
- readonly medium: "medium";
68
- readonly high: "high";
69
- };
70
- type Emphasis = ValueOf<typeof Emphasis>;
71
- /**
72
- * List of typographies that can't be customized.
73
- */
74
- declare const TypographyInterface: {
75
- readonly overline: "overline";
76
- readonly caption: "caption";
77
- readonly body1: "body1";
78
- readonly body2: "body2";
79
- readonly subtitle1: "subtitle1";
80
- readonly subtitle2: "subtitle2";
81
- readonly title: "title";
82
- readonly headline: "headline";
83
- readonly display1: "display1";
84
- };
85
- type TypographyInterface = ValueOf<typeof TypographyInterface>;
86
- /**
87
- * List of typographies that can be customized (via CSS variables).
88
- */
89
- declare const TypographyCustom: {
90
- readonly intro: "custom-intro";
91
- readonly 'body-large': "custom-body-large";
92
- readonly body: "custom-body";
93
- readonly quote: "custom-quote";
94
- readonly 'publish-info': "custom-publish-info";
95
- readonly button: "custom-button";
96
- readonly title1: "custom-title1";
97
- readonly title2: "custom-title2";
98
- readonly title3: "custom-title3";
99
- readonly title4: "custom-title4";
100
- readonly title5: "custom-title5";
101
- readonly title6: "custom-title6";
102
- };
103
- type TypographyCustom = ValueOf<typeof TypographyCustom>;
104
- /**
105
- * List of all typographies.
106
- */
107
- declare const Typography: {
108
- readonly custom: {
109
- readonly intro: "custom-intro";
110
- readonly 'body-large': "custom-body-large";
111
- readonly body: "custom-body";
112
- readonly quote: "custom-quote";
113
- readonly 'publish-info': "custom-publish-info";
114
- readonly button: "custom-button";
115
- readonly title1: "custom-title1";
116
- readonly title2: "custom-title2";
117
- readonly title3: "custom-title3";
118
- readonly title4: "custom-title4";
119
- readonly title5: "custom-title5";
120
- readonly title6: "custom-title6";
121
- };
122
- readonly overline: "overline";
123
- readonly caption: "caption";
124
- readonly body1: "body1";
125
- readonly body2: "body2";
126
- readonly subtitle1: "subtitle1";
127
- readonly subtitle2: "subtitle2";
128
- readonly title: "title";
129
- readonly headline: "headline";
130
- readonly display1: "display1";
131
- };
132
- type Typography = TypographyInterface | TypographyCustom;
133
- /**
134
- * All available aspect ratios.
135
- */
136
- declare const AspectRatio: {
137
- /** Intrinsic content ratio. */
138
- readonly original: "original";
139
- /** Ratio 3:1 */
140
- readonly panoramic: "panoramic";
141
- /** Ratio 16:9 */
142
- readonly wide: "wide";
143
- /** Ratio 3:2 */
144
- readonly horizontal: "horizontal";
145
- /** Ratio 3:2 */
146
- readonly vertical: "vertical";
147
- /** Ratio 1:1 */
148
- readonly square: "square";
149
- /** Ratio constrained by the parent. */
150
- readonly free: "free";
151
- };
152
- type AspectRatio = ValueOf<typeof AspectRatio>;
153
- /**
154
- * Semantic info about the purpose of the component
155
- */
156
- declare const Kind: {
157
- readonly info: "info";
158
- readonly success: "success";
159
- readonly warning: "warning";
160
- readonly error: "error";
161
- };
162
- type Kind = ValueOf<typeof Kind>;
163
- /**
164
- * All available white-space values
165
- * */
166
- declare const WhiteSpace: {
167
- normal: string;
168
- nowrap: string;
169
- pre: string;
170
- 'pre-wrap': string;
171
- 'pre-line': string;
172
- 'break-spaces': string;
173
- };
174
- type WhiteSpace = ValueOf<typeof WhiteSpace>;
175
- /**
176
- * See SCSS variable $lumx-color-palette
177
- */
178
- declare const ColorPalette: {
179
- readonly primary: "primary";
180
- readonly secondary: "secondary";
181
- readonly blue: "blue";
182
- readonly dark: "dark";
183
- readonly green: "green";
184
- readonly yellow: "yellow";
185
- readonly red: "red";
186
- readonly light: "light";
187
- readonly grey: "grey";
188
- };
189
- type ColorPalette = ValueOf<typeof ColorPalette>;
190
- /**
191
- * See SCSS variable $lumx-color-variants
192
- */
193
- declare const ColorVariant: {
194
- readonly D1: "D1";
195
- readonly D2: "D2";
196
- readonly L1: "L1";
197
- readonly L2: "L2";
198
- readonly L3: "L3";
199
- readonly L4: "L4";
200
- readonly L5: "L5";
201
- readonly L6: "L6";
202
- readonly N: "N";
203
- };
204
- type ColorVariant = ValueOf<typeof ColorVariant>;
205
- /** ColorPalette with all possible color variant combination */
206
- type ColorWithVariants = ColorPalette | Exclude<`${ColorPalette}-${ColorVariant}`, `light-D${number}` | `dark-D${number}`>;
207
-
208
- interface HasClassName {
209
- /**
210
- * Class name forwarded to the root element of the component.
211
- */
212
- className?: string;
213
- }
214
-
215
- interface HasTheme {
216
- /**
217
- * Theme adapting the component to light or dark background.
218
- */
219
- theme?: Theme;
220
- }
221
-
222
- /**
223
- * Framework-agnostic type for renderable content.
224
- * Vue components should cast VNode[] from slots to this type.
225
- *
226
- * Note: Uses type-only import to avoid runtime dependencies.
227
- */
228
- type JSXElement = React__default.ReactNode;
229
-
230
- type CommonRef = any;
231
-
232
- type Booleanish = boolean | 'true' | 'false';
233
-
234
- interface HasAriaDisabled {
235
- /** Similar to `disabled` but does not block pointer events or focus */
236
- 'aria-disabled'?: Booleanish;
237
- }
238
-
239
- interface HasDisabled {
240
- /** Whether the component is disabled or not. */
241
- isDisabled?: boolean;
242
- /** @alias isDisabled */
243
- disabled?: boolean;
244
- }
245
-
246
- interface BaseClickableProps extends HasDisabled, HasAriaDisabled {
247
- children?: JSXElement;
248
- onClick?: (event?: any) => void;
249
- ref?: CommonRef;
250
- }
251
-
252
- /**
253
- * Button size definition.
254
- */
255
- type ButtonSize = Extract<Size, 's' | 'm'>;
256
- interface BaseButtonProps extends Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>, HasClassName, HasTheme, HasAriaDisabled, BaseClickableProps {
257
- /** Color variant. */
258
- color?: ColorPalette;
259
- /** Emphasis variant. */
260
- emphasis?: Emphasis;
261
- /** Whether or not the button has a background color in low emphasis. */
262
- hasBackground?: boolean;
263
- /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */
264
- href?: string;
265
- /** Whether the component is disabled or not. */
266
- isDisabled?: boolean;
267
- /** Whether the component is selected or not (unsupported in `high` emphasis). */
268
- isSelected?: boolean;
269
- /** Native button name property. */
270
- name?: string;
271
- /** Size variant. */
272
- size?: ButtonSize;
273
- /** Native anchor target property. */
274
- target?: '_self' | '_blank' | '_parent' | '_top';
275
- /** Native button type. */
276
- type?: 'submit' | 'reset' | 'button' | undefined;
277
- /** Custom component for the link (can be used to inject router Link). */
278
- linkAs?: 'a' | any;
279
- /** whether the button is dispalyed in full width or not */
280
- fullWidth?: boolean;
281
- /** whether the button is currently active or not */
282
- isActive?: boolean;
283
- /** whether the button is currently focused or not */
284
- isFocused?: boolean;
285
- /** whether the button is currently focused or not */
286
- isHovered?: boolean;
287
- }
288
-
289
- interface IconButtonProps$1 extends BaseButtonProps {
290
- /**
291
- * Icon (SVG path).
292
- * If `image` is also set, `image` will be used instead.
293
- */
294
- icon?: string;
295
- /**
296
- * Image (image url).
297
- * Has priority over `icon`.
298
- */
299
- image?: string;
300
- /**
301
- * Label text (required for a11y purpose).
302
- * If you really don't want an aria-label, you can set an empty label (this is not recommended).
303
- */
304
- label: string;
305
- /** text to be displayed on hover */
306
- title?: string;
307
- }
308
-
309
- interface IconButtonProps extends GenericProps, Omit<IconButtonProps$1, 'title' | 'children'> {
310
- /**
311
- * Props to pass to the tooltip.
312
- * If undefined or if tooltipProps.label is undefined, the label prop will be used as tooltip label.
313
- * */
314
- tooltipProps?: Partial<TooltipProps>;
315
- /** Whether the tooltip should be hidden or not. */
316
- hideTooltip?: boolean;
317
- }
318
- /**
319
- * IconButton component.
320
- *
321
- * @param props Component props.
322
- * @param ref Component ref.
323
- * @return React element.
324
- */
325
- declare const IconButton: Comp<IconButtonProps, HTMLButtonElement>;
326
-
327
- /**
328
- * The source of the combobox option selection
329
- * It could either be on click / touch or keyboard selection
330
- */
331
- type ComboboxOptionSelectEventSource = 'keyboard' | 'click';
332
- type ComboboxSelectionType = 'single' | 'multiple';
333
- type BaseLoadingStatus = 'loading' | 'loadingMore' | 'idle' | 'error' | 'debouncing' | 'filtering' | 'empty';
334
- /**
335
- * Options related types
336
- */
337
- /** All possible values a combobox option can have */
338
- type BaseComboboxOptionProps<O = any> = {
339
- /**
340
- * A unique id to track the option
341
- */
342
- id: string;
343
- /**
344
- * Whether the current input value should filter this option.
345
- */
346
- filterFromInput?: boolean;
347
- /**
348
- * Callback to call when the option is selected.
349
- * This should only be used to add custom actions on options.
350
- * For most cases, the "onSelect" on the Combobox root component should be enough.
351
- */
352
- onSelect?: (option: O, eventSource?: ComboboxOptionSelectEventSource) => void;
353
- /**
354
- * Additional data to link to the option. This can be useful to retrieve with `onSelect`.
355
- */
356
- data?: O;
357
- /**
358
- * Whether the option is disabled
359
- */
360
- isDisabled?: boolean;
361
- /**
362
- * The components to use to visually customize options.
363
- * ! Options must not have interactive elements.
364
- * ! If you need additional actions, you might need to create custom options and search how to
365
- * ! make them accessible.
366
- */
367
- children?: ReactNode;
368
- /**
369
- * The text value the option has.
370
- * This is the value used to filter the options by when manual filtering is disabled
371
- * and that will be used as input value when an option is selected
372
- */
373
- textValue?: string;
374
- /**
375
- * Element to display before the content of the option.
376
- * ! Options must not have interactive elements.
377
- * ! If you need additional actions, you might need to create custom options and search how to
378
- * ! make them accessible.
379
- */
380
- before?: ReactNode;
381
- /**
382
- * Element to display after the content of the option.
383
- * ! Options must not have interactive elements.
384
- * ! If you need additional actions, you might need to create custom options and search how to
385
- * ! make them accessible.
386
- */
387
- after?: ReactNode;
388
- /**
389
- * Size of the list item.
390
- * Default to tiny
391
- */
392
- size?: ListItemSize;
393
- /**
394
- * Fill to activate a tooltip on mouse over
395
- */
396
- tooltipProps?: Partial<TooltipProps>;
397
- };
398
- /**
399
- * Props for when an option has no children.
400
- * In these case, we need at least the text value to know what to display
401
- * */
402
- type TextValueOnly<O = any> = BaseComboboxOptionProps<O> & {
403
- children?: never;
404
- textValue: string;
405
- };
406
- /**
407
- * Props for when an option has a react element as string
408
- * In that case, we can use the children as the textValue without having
409
- * to set a manual props.
410
- * The props is still available to have a text value different than the displayed value.
411
- */
412
- type StringOption<O = any> = BaseComboboxOptionProps<O> & {
413
- children: ReactText;
414
- textValue?: string;
415
- };
416
- /**
417
- * Props for when an option has a react element as children
418
- * In that case, we cannot know what the actual value of the
419
- * option is, so the `textValue` prop has to be set.
420
- */
421
- type NodeOption<O = any> = BaseComboboxOptionProps<O> & {
422
- children: Exclude<ReactNode, ReactText>;
423
- textValue: string;
424
- };
425
- /** Props for the ComboboxOption component */
426
- type ComboboxOptionProps<O = any> = TextValueOnly<O> | StringOption<O> | NodeOption<O>;
427
- /** Shared data between all combobox option types. */
428
- interface BaseRegisteredComboboxOption {
429
- id: string;
430
- /** The id that was generated for this option */
431
- generatedId: string;
432
- /** Whether the "option" is an action */
433
- isAction?: boolean;
434
- /** Whether the "option" is disabled */
435
- isDisabled?: boolean;
436
- }
437
- /** Values of action type options */
438
- interface RegisteredComboboxAction extends BaseRegisteredComboboxOption {
439
- /** Whether the "option" is an action */
440
- isAction: true;
441
- /** Callback when the action is triggered. */
442
- onSelect?: () => void;
443
- }
444
- /** Combobox value */
445
- interface RegisteredComboboxOptionValue<O = any> extends BaseRegisteredComboboxOption, Pick<ComboboxOptionProps<O>, 'data' | 'filterFromInput' | 'textValue' | 'onSelect'> {
446
- /** The section the option is a child of. */
447
- sectionId?: string;
448
- /** Whether the "option" is an action */
449
- isAction?: never;
450
- }
451
- /** The option values stored in the state */
452
- type RegisteredComboboxOption<O = any> = RegisteredComboboxAction | RegisteredComboboxOptionValue<O>;
453
- type OnComboboxSelect<O = any> = (option: RegisteredComboboxOptionValue<O>) => void;
454
- type OnComboboxInputChange = TextFieldProps['onChange'];
455
- type ComboboxTranslations = {
456
- clearLabel: string;
457
- showSuggestionsLabel: string;
458
- loadingLabel: string;
459
- noResultsForInputLabel: (input?: string) => string;
460
- serviceUnavailableLabel: string;
461
- tryReloadLabel: string;
462
- nbOptionsLabel: (options: number) => string;
463
- };
464
- /** Props for the main combobox component. */
465
- type ComboboxProps<O = any> = {
466
- /**
467
- * HTML id
468
- */
469
- id?: string;
470
- /**
471
- * The current option id to set as selected.
472
- * If omitted, the local state will be used instead;
473
- */
474
- selectedIds?: Array<string | number>;
475
- /**
476
- * The current value for the combobox input.
477
- * If omitted, the input is controlled locally */
478
- inputValue?: string;
479
- /**
480
- * The default value to set on the input.
481
- * Use this if you want to initialize the input with a value and not control it
482
- */
483
- defaultInputValue?: string;
484
- /**
485
- * Whether the options should be automatically filtered or not.
486
- * By default, the combobox will try to filter the options from the current input value
487
- * using a "contains" strategy.
488
- * If this is `false`, the option will not be automatically filtered and must be manually filtered by the parent.
489
- * Useful for asynchronous comboboxes.
490
- */
491
- autoFilter: boolean;
492
- /**
493
- * Whether the combobox should open on focus
494
- */
495
- openOnFocus?: boolean;
496
- /**
497
- * Whether the combobox should open on click
498
- */
499
- openOnClick?: boolean;
500
- /**
501
- * Status of the combobox
502
- */
503
- status?: BaseLoadingStatus;
504
- /**
505
- * Callback when the input changes.
506
- */
507
- onInputChange?: OnComboboxInputChange;
508
- /**
509
- * Callback for when an option is selected
510
- */
511
- onSelect?: OnComboboxSelect<O>;
512
- /**
513
- * Callback called when the combobox opens
514
- */
515
- onOpen?: (options: {
516
- currentValue?: string;
517
- manual: boolean;
518
- }) => void;
519
- /**
520
- * The combobox components to render.
521
- * Must be one of the exposed components (Combobox.Input, Combobox.ListBox etc...)
522
- */
523
- children: ReactNode;
524
- /**
525
- * The combobox can have a specific selection type:
526
- * - Single: only one item is selected
527
- * - Multiple: several items can be selected (this impacts the combobox list, which will now not close when selectiong an option)
528
- */
529
- selectionType?: ComboboxSelectionType;
530
- /**
531
- * Whether the error state should be displayed when the status is in error.
532
- * @default `true` if `status` is defined
533
- */
534
- showErrorState?: boolean;
535
- /**
536
- * Whether the empty state should be displayed when there is no results.
537
- * @default `true` if `autoFilter=false`
538
- */
539
- showEmptyState?: boolean;
540
- /** custom className */
541
- className?: string;
542
- /** translations to be used across the combobox */
543
- translations: ComboboxTranslations;
544
- };
545
- /** Entity related types for single selection. */
546
- type SingleSelection<O = any> = {
547
- selectionType: 'single';
548
- /**
549
- * Selected option object
550
- */
551
- value?: O;
552
- /**
553
- * Callback on option object selected
554
- */
555
- onChange?(newValue?: O): void;
556
- /**
557
- * No chips in single selection mode.
558
- */
559
- renderChip?: never;
560
- };
561
- /** Entity related types for multiple selection. */
562
- type MultipleSelection<O = any> = {
563
- selectionType: 'multiple';
564
- /**
565
- * Selected options array
566
- */
567
- value?: O[];
568
- /**
569
- * Callback on option array selected
570
- */
571
- onChange?(newValue?: O[]): void;
572
- /**
573
- * Custom selection chip render function
574
- */
575
- renderChip?: (option: O) => ReactNode;
576
- };
577
- /** Shared props between SelectTextField and SelectButton */
578
- type BaseSelectProps<O = any> = {
579
- /**
580
- * List of option objects
581
- */
582
- options?: Array<O>;
583
- /**
584
- * Option object id selector (either the property name or a function to get the id)
585
- */
586
- getOptionId: Selector<O>;
587
- /**
588
- * Option object name selector (either the property name or a function to get the name)
589
- * Fallbacks on the ID if not defined
590
- */
591
- getOptionName?: Selector<O, string | undefined | null>;
592
- /**
593
- * Option object description selector (either the property name or a function to get the description)
594
- */
595
- getOptionDescription?: Selector<O, string | undefined | null>;
596
- /**
597
- * Option object section id selector.
598
- * Providing this will group options by sections (and may change their order)
599
- * If the section id is a string, it is used as section label. Else, the section won't have a label.
600
- */
601
- getSectionId?: Selector<O, any>;
602
- /**
603
- * option object section title selector.
604
- * If provided, the section will be rendered using this function.
605
- */
606
- renderSectionTitle?: (option: O, sectionIndex: number) => React.ReactNode;
607
- /**
608
- * Whether the sections are separated by dividers
609
- */
610
- hasSectionDividers?: boolean;
611
- /**
612
- * Option object render function
613
- * Default to rendering option using the id & name obtained with `optionIdSelector` & `optionNameSelector`
614
- *
615
- * **The direct child must be a Combobox.Option, otherwise it will not render the children.**.
616
- */
617
- renderOption?: (option: O, index: number) => React.ReactNode;
618
- /**
619
- * Callback to load more items
620
- */
621
- onLoadMore?(): void;
622
- /**
623
- * Props passed to the option list.
624
- */
625
- /**
626
- * Add custom elements before the options
627
- */
628
- beforeOptions?: ReactNode;
629
- /**
630
- * Data attribute scope
631
- */
632
- scope?: string;
633
- };
634
- type OpenComboboxAction = {
635
- type: 'OPEN_COMBOBOX';
636
- payload?: {
637
- manual?: boolean;
638
- };
639
- };
640
- type CloseComboboxAction = {
641
- type: 'CLOSE_COMBOBOX';
642
- };
643
- type SetInputValueAction = {
644
- type: 'SET_INPUT_VALUE';
645
- payload: string;
646
- };
647
- type AddOptionAction = {
648
- type: 'ADD_OPTION';
649
- payload: {
650
- id: string;
651
- option: RegisteredComboboxOption;
652
- };
653
- };
654
- type RemoveOptionAction = {
655
- type: 'REMOVE_OPTION';
656
- payload: {
657
- id: string;
658
- };
659
- };
660
- type ComboboxAction = OpenComboboxAction | CloseComboboxAction | SetInputValueAction | AddOptionAction | RemoveOptionAction;
661
-
662
- /**
663
- * Different possible placements for the popover.
664
- */
665
- declare const Placement: {
666
- readonly AUTO: "auto";
667
- readonly AUTO_END: "auto-end";
668
- readonly AUTO_START: "auto-start";
669
- readonly TOP: "top";
670
- readonly TOP_END: "top-end";
671
- readonly TOP_START: "top-start";
672
- readonly RIGHT: "right";
673
- readonly RIGHT_END: "right-end";
674
- readonly RIGHT_START: "right-start";
675
- readonly BOTTOM: "bottom";
676
- readonly BOTTOM_END: "bottom-end";
677
- readonly BOTTOM_START: "bottom-start";
678
- readonly LEFT: "left";
679
- readonly LEFT_END: "left-end";
680
- readonly LEFT_START: "left-start";
681
- };
682
- type Placement = ValueOf<typeof Placement>;
683
- /**
684
- * Offset of the popover.
685
- */
686
- interface Offset {
687
- /** Offset size along the reference. */
688
- along?: number;
689
- /** Offset size away from the reference. */
690
- away?: number;
691
- }
692
- /**
693
- * Popover elevation index.
694
- */
695
- type Elevation = 1 | 2 | 3 | 4 | 5;
696
- /**
697
- * Popover fit anchor width options.
698
- */
699
- declare const FitAnchorWidth: {
700
- readonly MAX_WIDTH: "maxWidth";
701
- readonly MIN_WIDTH: "minWidth";
702
- readonly WIDTH: "width";
703
- };
704
- type FitAnchorWidth = ValueOf<typeof FitAnchorWidth>;
705
-
706
- interface InputLabelProps$1 extends HasClassName, HasTheme {
707
- /** Typography variant. */
708
- typography?: Typography;
709
- /** Label content. */
710
- children: JSXElement;
711
- /** Native htmlFor property. */
712
- htmlFor: string;
713
- /** Whether the component is required or not. */
714
- isRequired?: boolean;
715
- /** ref to the root element */
716
- ref?: CommonRef;
717
- }
718
-
719
- interface InputLabelProps extends InputLabelProps$1, GenericProps {
720
- }
721
- /**
722
- * InputLabel component.
723
- *
724
- * @param props Component props.
725
- * @param ref Component ref.
726
- * @return React element.
727
- */
728
- declare const InputLabel: Comp<InputLabelProps, HTMLLabelElement>;
729
-
730
- type ListItemSize = Extract<Size$1, 'tiny' | 'regular' | 'big' | 'huge'>;
731
- /**
732
- * Defines the props of the component.
733
- */
734
- interface ListItemProps extends GenericProps, HasAriaDisabled$1 {
735
- /** A component to be rendered after the content. */
736
- after?: ReactNode;
737
- /** A component to be rendered before the content. */
738
- before?: ReactNode;
739
- /** Content. */
740
- children: string | ReactNode;
741
- /** Whether the list item should be highlighted or not. */
742
- isHighlighted?: boolean;
743
- /** Whether the component is selected or not. */
744
- isSelected?: boolean;
745
- /** Whether link/button is disabled or not. */
746
- isDisabled?: boolean;
747
- /** Reference to the <li> element. */
748
- listItemRef?: Ref<HTMLLIElement>;
749
- /** Custom react component for the link (can be used to inject react router Link). */
750
- linkAs?: 'a' | any;
751
- /** Props that will be passed on to the Link */
752
- linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
753
- /** Reference to the link element. */
754
- linkRef?: Ref<HTMLAnchorElement>;
755
- /** Size variant. */
756
- size?: ListItemSize;
757
- /** On selected callback. */
758
- onItemSelected?(evt: SyntheticEvent): void;
759
- }
760
- /**
761
- * Check if the list item is clickable.
762
- * @return `true` if the list item is clickable; `false` otherwise.
763
- */
764
- declare function isClickable({ linkProps, onItemSelected }: Partial<ListItemProps>): boolean;
765
- /**
766
- * ListItem component.
767
- *
768
- * @param props Component props.
769
- * @param ref Component ref.
770
- * @return React element.
771
- */
772
- declare const ListItem: Comp<ListItemProps, HTMLLIElement>;
773
-
774
- /**
775
- * Defines the props of the component.
776
- */
777
- interface TextFieldProps extends GenericProps, HasTheme$1, HasAriaDisabled$1 {
778
- /** Chip Group to be rendered before the main text input. */
779
- chips?: ReactNode;
780
- /** Props to pass to the clear button (minus those already set by the TextField props). If not specified, the button won't be displayed. */
781
- clearButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
782
- /** Error message. */
783
- error?: string | ReactNode;
784
- /** Whether we force the focus style or not. */
785
- forceFocusStyle?: boolean;
786
- /** Whether the text field is displayed with error style or not. */
787
- hasError?: boolean;
788
- /** Additional element to put at the end of the text field. */
789
- afterElement?: ReactNode;
790
- /** Helper text. */
791
- helper?: string | ReactNode;
792
- /** Icon (SVG path). */
793
- icon?: string;
794
- /** Native input id property (generated if not provided to link the label element). */
795
- id?: string;
796
- /** Reference to the <input> or <textarea> element. */
797
- inputRef?: Ref<HTMLInputElement | HTMLTextAreaElement>;
798
- /** Whether the component is disabled or not. */
799
- isDisabled?: boolean;
800
- /** Whether the component is required or not. */
801
- isRequired?: boolean;
802
- /** Whether the text field is displayed with valid style or not. */
803
- isValid?: boolean;
804
- /** Label text. */
805
- label?: string;
806
- /** Additional label props. */
807
- labelProps?: InputLabelProps;
808
- /** Max string length the input accepts (constrains the input and displays a character counter). */
809
- maxLength?: number;
810
- /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */
811
- minimumRows?: number;
812
- /** Whether the text field is a textarea or an input. */
813
- multiline?: boolean;
814
- /** Native input name property. */
815
- name?: string;
816
- /** Placeholder text. */
817
- placeholder?: string;
818
- /** Reference to the wrapper. */
819
- textFieldRef?: Ref<HTMLDivElement>;
820
- /** Native input type (only when `multiline` is disabled). */
821
- type?: React.ComponentProps<'input'>['type'];
822
- /** Value. */
823
- value?: string;
824
- /** On blur callback. */
825
- onBlur?(event: React.FocusEvent): void;
826
- /** On change callback. */
827
- onChange(value: string, name?: string, event?: SyntheticEvent): void;
828
- /** On clear callback. */
829
- onClear?(event?: SyntheticEvent): void;
830
- /** On focus callback. */
831
- onFocus?(event: React.FocusEvent): void;
832
- }
833
- /**
834
- * TextField component.
835
- *
836
- * @param props Component props.
837
- * @param ref Component ref.
838
- * @return React element.
839
- */
840
- declare const TextField: Comp<TextFieldProps, HTMLDivElement>;
841
-
842
- declare const ARIA_LINK_MODES: readonly ["aria-describedby", "aria-labelledby"];
843
-
844
- /** Position of the tooltip relative to the anchor element. */
845
- type TooltipPlacement = Extract<Placement, 'top' | 'right' | 'bottom' | 'left'>;
846
- /**
847
- * Defines the props of the component.
848
- */
849
- interface TooltipProps extends GenericProps, HasCloseMode {
850
- /** Anchor (element on which we activate the tooltip). */
851
- children: ReactNode;
852
- /** Delay (in ms) before closing the tooltip. */
853
- delay?: number;
854
- /** Whether the tooltip is displayed even without the mouse hovering the anchor. */
855
- forceOpen?: boolean;
856
- /** Label text. */
857
- label?: string | null | false;
858
- /** Placement of the tooltip relative to the anchor. */
859
- placement?: TooltipPlacement;
860
- /** Choose how the tooltip text should link to the anchor */
861
- ariaLinkMode?: (typeof ARIA_LINK_MODES)[number];
862
- }
863
- /**
864
- * Tooltip component.
865
- *
866
- * @param props Component props.
867
- * @param ref Component ref.
868
- * @return React element.
869
- */
870
- declare const Tooltip: Comp<TooltipProps, HTMLDivElement>;
871
-
872
- export { Alignment as A, FitAnchorWidth as F, Kind as K, ListItem as L, Placement as P, isClickable as Q, Size as S, WhiteSpace as W, ColorPalette as a, ColorVariant as i, Typography as j, Orientation as l, AspectRatio as m, TypographyInterface as n, IconButton as q, InputLabel as r, TextField as y, Tooltip as z };
873
- export type { BaseButtonProps as B, Comp as C, TooltipPlacement as D, Elevation as E, GlobalSize as G, HasClassName as H, IconButtonProps as I, JSXElement as J, MultipleSelection as M, TooltipProps as N, Offset as O, ComboboxAction as R, TextFieldProps as T, ComboboxSelectionType as U, VerticalAlignment as V, ComboboxTranslations as X, BaseLoadingStatus as Y, RegisteredComboboxOption as Z, ComboboxOptionSelectEventSource as _, CommonRef as b, HasTheme as c, HasAriaDisabled as d, HasDisabled as e, ComboboxOptionProps as f, ComboboxProps as g, ColorWithVariants as h, HorizontalAlignment as k, BaseSelectProps as o, ButtonSize as p, InputLabelProps as s, ListItemProps as t, ListItemSize as u, OnComboboxInputChange as v, OnComboboxSelect as w, SingleSelection as x };