@entur/dropdown 5.1.3 → 5.2.0-beta.1
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/Dropdown.d.ts +6 -7
- package/dist/MultiSelect.d.ts +7 -8
- package/dist/NativeDropdown.d.ts +6 -7
- package/dist/SearchableDropdown.d.ts +7 -8
- package/dist/components/DropdownList.d.ts +7 -7
- package/dist/components/FieldComponents.d.ts +10 -8
- package/dist/deprecated/BaseDropdown.d.ts +2 -2
- package/dist/deprecated/DownshiftProvider.d.ts +4 -4
- package/dist/deprecated/Dropdown.d.ts +4 -5
- package/dist/deprecated/DropdownList.d.ts +2 -2
- package/dist/deprecated/MultiSelect.d.ts +5 -6
- package/dist/deprecated/RegularDropdown.d.ts +2 -2
- package/dist/deprecated/SearchableDropdown.d.ts +3 -3
- package/dist/deprecated/types.d.ts +15 -0
- package/dist/dropdown.cjs.development.js +9 -4
- package/dist/dropdown.cjs.development.js.map +1 -1
- package/dist/dropdown.cjs.production.min.js +1 -1
- package/dist/dropdown.cjs.production.min.js.map +1 -1
- package/dist/dropdown.esm.js +9 -4
- package/dist/dropdown.esm.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/styles.css +105 -105
- package/dist/types.d.ts +14 -0
- package/dist/useNormalizedItems.d.ts +2 -12
- package/dist/useResolvedItems.d.ts +3 -8
- package/dist/utils.d.ts +23 -23
- package/package.json +2 -2
package/dist/Dropdown.d.ts
CHANGED
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import React, { Dispatch, SetStateAction } from 'react';
|
|
2
2
|
import { VariantType } from '@entur/form';
|
|
3
|
-
import { NormalizedDropdownItemType } from './
|
|
4
|
-
import { PotentiallyAsyncDropdownItemType } from './useResolvedItems';
|
|
3
|
+
import { NormalizedDropdownItemType, PotentiallyAsyncDropdownItemType } from './types';
|
|
5
4
|
import './Dropdown.scss';
|
|
6
|
-
export type DropdownProps = {
|
|
5
|
+
export type DropdownProps<ValueType> = {
|
|
7
6
|
/** Tilgjengelige valg i dropdown-en */
|
|
8
|
-
items: PotentiallyAsyncDropdownItemType
|
|
7
|
+
items: PotentiallyAsyncDropdownItemType<ValueType>;
|
|
9
8
|
/** Valgt verdi. Bruk null for ingen verdi. */
|
|
10
|
-
selectedItem: NormalizedDropdownItemType | null;
|
|
9
|
+
selectedItem: NormalizedDropdownItemType<ValueType> | null;
|
|
11
10
|
/** Callback ved valg som skal oppdatere selectedItem */
|
|
12
|
-
onChange?: (selectedItem: NormalizedDropdownItemType | null) => void | Dispatch<SetStateAction<NormalizedDropdownItemType | null>>;
|
|
11
|
+
onChange?: (selectedItem: NormalizedDropdownItemType<ValueType> | null) => void | Dispatch<SetStateAction<NormalizedDropdownItemType<ValueType> | null>>;
|
|
13
12
|
/** Beskrivende tekst som forklarer feltet */
|
|
14
13
|
label: string;
|
|
15
14
|
/** Placeholder-tekst når ingenting er satt */
|
|
@@ -76,4 +75,4 @@ export type DropdownProps = {
|
|
|
76
75
|
*/
|
|
77
76
|
ariaLabelSelectedItem?: string;
|
|
78
77
|
};
|
|
79
|
-
export declare const Dropdown: ({ ariaLabelChosenSingular, ariaLabelCloseList, ariaLabelOpenList, ariaLabelSelectedItem, className, clearable, disabled, disableLabelAnimation, feedback, items: initialItems, label, labelClearSelectedItem, listStyle, loadingText, onChange, placeholder, prepend, readOnly, selectedItem, selectOnBlur, selectOnTab, style, variant, ...rest }: DropdownProps) => React.JSX.Element;
|
|
78
|
+
export declare const Dropdown: <ValueType extends unknown>({ ariaLabelChosenSingular, ariaLabelCloseList, ariaLabelOpenList, ariaLabelSelectedItem, className, clearable, disabled, disableLabelAnimation, feedback, items: initialItems, label, labelClearSelectedItem, listStyle, loadingText, onChange, placeholder, prepend, readOnly, selectedItem, selectOnBlur, selectOnTab, style, variant, ...rest }: DropdownProps<ValueType>) => React.JSX.Element;
|
package/dist/MultiSelect.d.ts
CHANGED
|
@@ -1,23 +1,22 @@
|
|
|
1
1
|
import React, { Dispatch, SetStateAction } from 'react';
|
|
2
2
|
import { VariantType } from '@entur/form';
|
|
3
|
-
import { NormalizedDropdownItemType } from './
|
|
4
|
-
import { PotentiallyAsyncDropdownItemType } from './useResolvedItems';
|
|
3
|
+
import { NormalizedDropdownItemType, PotentiallyAsyncDropdownItemType } from './types';
|
|
5
4
|
import './Dropdown.scss';
|
|
6
|
-
export type MultiSelectProps = {
|
|
5
|
+
export type MultiSelectProps<ValueType> = {
|
|
7
6
|
/** Beskrivende tekst som forklarer feltet */
|
|
8
7
|
label: string;
|
|
9
8
|
/** Tilgjengelige valg i MultiSelect */
|
|
10
|
-
items: PotentiallyAsyncDropdownItemType
|
|
9
|
+
items: PotentiallyAsyncDropdownItemType<ValueType>;
|
|
11
10
|
/** Elementer som er valgt blant 'items'. Bruk tom liste for ingen valgte
|
|
12
11
|
*/
|
|
13
|
-
selectedItems: NormalizedDropdownItemType[];
|
|
12
|
+
selectedItems: NormalizedDropdownItemType<ValueType>[];
|
|
14
13
|
/** Callback med alle valgte verdier.
|
|
15
14
|
* Bruk denne til å oppdatere selectedItems-listen */
|
|
16
|
-
onChange?: (selectedItems: NormalizedDropdownItemType[]) => void | Dispatch<SetStateAction<NormalizedDropdownItemType[]>>;
|
|
15
|
+
onChange?: (selectedItems: NormalizedDropdownItemType<ValueType>[]) => void | Dispatch<SetStateAction<NormalizedDropdownItemType<ValueType>[]>>;
|
|
17
16
|
/** Filtreringen som brukes når man skriver inn tekst i inputfeltet
|
|
18
17
|
* @default Regex-test som sjekker om item.label inneholder input-teksten
|
|
19
18
|
*/
|
|
20
|
-
itemFilter?: (item: NormalizedDropdownItemType
|
|
19
|
+
itemFilter?: (item: NormalizedDropdownItemType<ValueType>, inputValue: string | undefined) => boolean;
|
|
21
20
|
/** Hvilken valideringsvariant som gjelder */
|
|
22
21
|
variant?: VariantType;
|
|
23
22
|
/** Valideringsmelding, brukes sammen med `variant` */
|
|
@@ -115,4 +114,4 @@ export type MultiSelectProps = {
|
|
|
115
114
|
*/
|
|
116
115
|
ariaLabelSelectedItem?: string;
|
|
117
116
|
};
|
|
118
|
-
export declare const MultiSelect: ({ className, clearable, clearInputOnSelect, debounceTimeout, disabled, feedback, hideSelectAll, items: initialItems, itemFilter, label, labelAllItemsSelected, labelClearAllItems, labelSelectAll, listStyle, loadingText, maxChips, noMatchesText, onChange, placeholder, readOnly, selectedItems, selectOnBlur, selectOnTab, style, variant, ariaLabelChosenSingular, ariaLabelChosenPlural, ariaLabelCloseList, ariaLabelJumpToInput, ariaLabelOpenList, ariaLabelRemoveSelected, ariaLabelSelectedItem, ...rest }: MultiSelectProps) => React.JSX.Element;
|
|
117
|
+
export declare const MultiSelect: <ValueType extends unknown>({ className, clearable, clearInputOnSelect, debounceTimeout, disabled, feedback, hideSelectAll, items: initialItems, itemFilter, label, labelAllItemsSelected, labelClearAllItems, labelSelectAll, listStyle, loadingText, maxChips, noMatchesText, onChange, placeholder, readOnly, selectedItems, selectOnBlur, selectOnTab, style, variant, ariaLabelChosenSingular, ariaLabelChosenPlural, ariaLabelCloseList, ariaLabelJumpToInput, ariaLabelOpenList, ariaLabelRemoveSelected, ariaLabelSelectedItem, ...rest }: MultiSelectProps<ValueType>) => React.JSX.Element;
|
package/dist/NativeDropdown.d.ts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { VariantType } from '@entur/form';
|
|
3
|
-
import { PotentiallyAsyncDropdownItemType } from './
|
|
4
|
-
import { NormalizedDropdownItemType } from './useNormalizedItems';
|
|
3
|
+
import { NormalizedDropdownItemType, PotentiallyAsyncDropdownItemType } from './types';
|
|
5
4
|
import './Dropdown.scss';
|
|
6
|
-
export type NativeDropdownProps = {
|
|
5
|
+
export type NativeDropdownProps<ValueType> = {
|
|
7
6
|
/** Ekstra klassenavn */
|
|
8
7
|
className?: string;
|
|
9
8
|
/**
|
|
@@ -14,7 +13,7 @@ export type NativeDropdownProps = {
|
|
|
14
13
|
/** Valideringsmelding, brukes sammen med `variant` */
|
|
15
14
|
feedback?: string;
|
|
16
15
|
/** Alle valg for dropdown-en å ha */
|
|
17
|
-
items: PotentiallyAsyncDropdownItemType
|
|
16
|
+
items: PotentiallyAsyncDropdownItemType<ValueType>;
|
|
18
17
|
/** Beskrivende tekst som forklarer feltet */
|
|
19
18
|
label: string;
|
|
20
19
|
/** En callback for endringer av value
|
|
@@ -23,7 +22,7 @@ export type NativeDropdownProps = {
|
|
|
23
22
|
*/
|
|
24
23
|
onChange?: ({ value, selectedItem, target, }: {
|
|
25
24
|
value: string;
|
|
26
|
-
selectedItem: NormalizedDropdownItemType | null;
|
|
25
|
+
selectedItem: NormalizedDropdownItemType<ValueType> | null;
|
|
27
26
|
target: EventTarget & HTMLSelectElement;
|
|
28
27
|
}) => void;
|
|
29
28
|
/** Tekst eller ikon som kommer før dropdown-en */
|
|
@@ -36,7 +35,7 @@ export type NativeDropdownProps = {
|
|
|
36
35
|
/** Den valgte verdien som NormalizedDropdownItemType
|
|
37
36
|
* (Brukes når komponenten er 'controlled')
|
|
38
37
|
*/
|
|
39
|
-
selectedItem?: NormalizedDropdownItemType | null;
|
|
38
|
+
selectedItem?: NormalizedDropdownItemType<ValueType> | null;
|
|
40
39
|
/** Den valgte verdien som sting
|
|
41
40
|
* (Brukes når komponenten er 'controlled)
|
|
42
41
|
*/
|
|
@@ -49,4 +48,4 @@ export type NativeDropdownProps = {
|
|
|
49
48
|
disableLabelAnimation?: boolean;
|
|
50
49
|
[key: string]: any;
|
|
51
50
|
};
|
|
52
|
-
export declare const NativeDropdown: React.
|
|
51
|
+
export declare const NativeDropdown: <ValueType extends string | number>({ className, disabled, disableLabelAnimation, feedback, items, label, loadingText, onChange, prepend, readOnly, selectedItem, style, value, variant, ...rest }: NativeDropdownProps<ValueType>) => React.JSX.Element;
|
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
import React, { Dispatch, SetStateAction } from 'react';
|
|
2
2
|
import { VariantType } from '@entur/form';
|
|
3
|
-
import { NormalizedDropdownItemType } from './
|
|
4
|
-
import { PotentiallyAsyncDropdownItemType } from './useResolvedItems';
|
|
3
|
+
import { NormalizedDropdownItemType, PotentiallyAsyncDropdownItemType } from './types';
|
|
5
4
|
import './Dropdown.scss';
|
|
6
|
-
export type SearchableDropdownProps = {
|
|
5
|
+
export type SearchableDropdownProps<ValueType> = {
|
|
7
6
|
/** Tilgjengelige valg i dropdown-en */
|
|
8
|
-
items: PotentiallyAsyncDropdownItemType
|
|
7
|
+
items: PotentiallyAsyncDropdownItemType<ValueType>;
|
|
9
8
|
/** Valgt element. Bruk null for ingen verdi */
|
|
10
|
-
selectedItem: NormalizedDropdownItemType | null;
|
|
9
|
+
selectedItem: NormalizedDropdownItemType<ValueType> | null;
|
|
11
10
|
/** Callback ved valg som skal brukes til å oppdatere selectedItem */
|
|
12
|
-
onChange?: (selectedItem: NormalizedDropdownItemType | null) => void | Dispatch<SetStateAction<NormalizedDropdownItemType | null>>;
|
|
11
|
+
onChange?: (selectedItem: NormalizedDropdownItemType<ValueType> | null) => void | Dispatch<SetStateAction<NormalizedDropdownItemType<ValueType> | null>>;
|
|
13
12
|
/** Filtreringen som brukes når man skriver inn tekst i inputfeltet
|
|
14
13
|
* @default Regex-test som sjekker om item.label inneholder input-teksten
|
|
15
14
|
*/
|
|
16
|
-
itemFilter?: (item: NormalizedDropdownItemType
|
|
15
|
+
itemFilter?: (item: NormalizedDropdownItemType<ValueType>, inputValue: string | undefined) => boolean;
|
|
17
16
|
/** Beskrivende tekst som forklarer feltet */
|
|
18
17
|
label: string;
|
|
19
18
|
/** Placeholder-tekst når ingenting er satt */
|
|
@@ -86,4 +85,4 @@ export type SearchableDropdownProps = {
|
|
|
86
85
|
*/
|
|
87
86
|
ariaLabelSelectedItem?: string;
|
|
88
87
|
};
|
|
89
|
-
export declare const SearchableDropdown: ({ ariaLabelChosenSingular, ariaLabelCloseList, ariaLabelOpenList, ariaLabelSelectedItem, className, clearable, debounceTimeout, disabled, disableLabelAnimation, feedback, items: initialItems, itemFilter, label, labelClearSelectedItem, listStyle, loadingText, noMatchesText, onChange, placeholder, prepend, readOnly, selectedItem: value, selectOnBlur, selectOnTab, style, variant, ...rest }: SearchableDropdownProps) => React.JSX.Element;
|
|
88
|
+
export declare const SearchableDropdown: <ValueType extends unknown>({ ariaLabelChosenSingular, ariaLabelCloseList, ariaLabelOpenList, ariaLabelSelectedItem, className, clearable, debounceTimeout, disabled, disableLabelAnimation, feedback, items: initialItems, itemFilter, label, labelClearSelectedItem, listStyle, loadingText, noMatchesText, onChange, placeholder, prepend, readOnly, selectedItem: value, selectOnBlur, selectOnTab, style, variant, ...rest }: SearchableDropdownProps<ValueType>) => React.JSX.Element;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { UseComboboxGetMenuPropsOptions, GetPropsCommonOptions, UseComboboxGetItemPropsOptions } from 'downshift';
|
|
3
|
-
import { NormalizedDropdownItemType } from '../
|
|
3
|
+
import { NormalizedDropdownItemType } from '../types';
|
|
4
4
|
import './DropdownList.scss';
|
|
5
|
-
type DropdownListProps = {
|
|
5
|
+
type DropdownListProps<ValueType> = {
|
|
6
6
|
ariaLabelChosenSingular?: string;
|
|
7
7
|
ariaLabelSelectedItem?: string;
|
|
8
|
-
getItemProps: (options: UseComboboxGetItemPropsOptions<NormalizedDropdownItemType
|
|
8
|
+
getItemProps: (options: UseComboboxGetItemPropsOptions<NormalizedDropdownItemType<ValueType>>) => any;
|
|
9
9
|
getMenuProps: (options?: UseComboboxGetMenuPropsOptions | undefined, otherOptions?: GetPropsCommonOptions | undefined) => any;
|
|
10
10
|
highlightedIndex: number;
|
|
11
11
|
isOpen: boolean;
|
|
12
|
-
listItems: NormalizedDropdownItemType[];
|
|
12
|
+
listItems: NormalizedDropdownItemType<ValueType | string>[];
|
|
13
13
|
listStyle: {
|
|
14
14
|
[key: string]: any;
|
|
15
15
|
} | undefined;
|
|
@@ -17,9 +17,9 @@ type DropdownListProps = {
|
|
|
17
17
|
loadingText?: string;
|
|
18
18
|
noMatchesText?: string;
|
|
19
19
|
selectAllCheckboxState?: () => boolean | 'indeterminate';
|
|
20
|
-
selectAllItem?: NormalizedDropdownItemType
|
|
21
|
-
selectedItems: NormalizedDropdownItemType[];
|
|
20
|
+
selectAllItem?: NormalizedDropdownItemType<string>;
|
|
21
|
+
selectedItems: NormalizedDropdownItemType<ValueType>[];
|
|
22
22
|
[key: string]: any;
|
|
23
23
|
};
|
|
24
|
-
export declare const DropdownList: ({ ariaLabelChosenSingular, ariaLabelSelectedItem, getItemProps, getMenuProps, inputValue, isOpen, highlightedIndex, listItems, listStyle, loading, loadingText, noMatchesText, selectAllCheckboxState, selectAllItem, selectedItems, showSelectAllInList, ...rest }: DropdownListProps) => React.JSX.Element;
|
|
24
|
+
export declare const DropdownList: <ValueType extends unknown>({ ariaLabelChosenSingular, ariaLabelSelectedItem, getItemProps, getMenuProps, inputValue, isOpen, highlightedIndex, listItems, listStyle, loading, loadingText, noMatchesText, selectAllCheckboxState, selectAllItem, selectedItems, showSelectAllInList, ...rest }: DropdownListProps<ValueType>) => React.JSX.Element;
|
|
25
25
|
export {};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { UseComboboxGetToggleButtonPropsOptions, UseMultipleSelectionGetSelectedItemPropsOptions } from 'downshift';
|
|
3
|
-
import { NormalizedDropdownItemType } from '../
|
|
3
|
+
import { NormalizedDropdownItemType } from '../types';
|
|
4
4
|
import './FieldComponents.scss';
|
|
5
|
-
export declare const SelectedItemTag: ({ ariaLabelRemoveSelected, ariaLabelChosen, disabled, getSelectedItemProps, index, readOnly, removeSelectedItem, selectedItem, }: {
|
|
5
|
+
export declare const SelectedItemTag: <ValueType extends unknown>({ ariaLabelRemoveSelected, ariaLabelChosen, disabled, getSelectedItemProps, index, readOnly, removeSelectedItem, selectedItem, }: {
|
|
6
6
|
ariaLabelRemoveSelected: string;
|
|
7
7
|
ariaLabelChosen?: string | undefined;
|
|
8
8
|
disabled?: boolean | undefined;
|
|
9
|
-
getSelectedItemProps?: ((options: UseMultipleSelectionGetSelectedItemPropsOptions<NormalizedDropdownItemType
|
|
9
|
+
getSelectedItemProps?: ((options: UseMultipleSelectionGetSelectedItemPropsOptions<NormalizedDropdownItemType<ValueType>>) => any) | undefined;
|
|
10
10
|
index?: number | undefined;
|
|
11
11
|
readOnly?: boolean | undefined;
|
|
12
|
-
removeSelectedItem: (item: NormalizedDropdownItemType) => void;
|
|
13
|
-
selectedItem: NormalizedDropdownItemType
|
|
12
|
+
removeSelectedItem: (item: NormalizedDropdownItemType<ValueType>) => void;
|
|
13
|
+
selectedItem: NormalizedDropdownItemType<ValueType>;
|
|
14
14
|
}) => React.JSX.Element;
|
|
15
|
-
|
|
15
|
+
type FieldAppendProps<ValueType> = {
|
|
16
16
|
ariaHiddenToggleButton?: boolean;
|
|
17
17
|
ariaLabelCloseList?: string;
|
|
18
18
|
ariaLabelOpenList?: string;
|
|
@@ -25,5 +25,7 @@ export declare const FieldAppend: React.FC<{
|
|
|
25
25
|
loading?: boolean;
|
|
26
26
|
loadingText?: string;
|
|
27
27
|
onClear: () => void;
|
|
28
|
-
selectedItems: (NormalizedDropdownItemType | null)[];
|
|
29
|
-
}
|
|
28
|
+
selectedItems: (NormalizedDropdownItemType<ValueType> | null)[];
|
|
29
|
+
};
|
|
30
|
+
export declare const FieldAppend: <ValueType extends unknown>({ ariaHiddenToggleButton, ariaLabelCloseList, ariaLabelOpenList, clearable, labelClearSelectedItems, disabled, focusable, getToggleButtonProps, isOpen, loading, loadingText, onClear, selectedItems, }: FieldAppendProps<ValueType>) => React.JSX.Element | null;
|
|
31
|
+
export {};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { NormalizedDropdownItemType } from '../useNormalizedItems';
|
|
3
2
|
import './BaseDropdown.scss';
|
|
3
|
+
import { NormalizedDropdownItemDeprecatedType } from './types';
|
|
4
4
|
type BaseDropdownDeprecatedProps = {
|
|
5
5
|
className?: string;
|
|
6
6
|
disabled?: boolean;
|
|
7
|
-
items:
|
|
7
|
+
items: NormalizedDropdownItemDeprecatedType[];
|
|
8
8
|
loading?: boolean;
|
|
9
9
|
loadingText?: string;
|
|
10
10
|
placeholder?: string;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ControllerStateAndHelpers } from 'downshift';
|
|
3
|
-
import {
|
|
3
|
+
import { NormalizedDropdownItemDeprecatedType } from './types';
|
|
4
4
|
export type DownshiftProviderProps = {
|
|
5
|
-
onChange?: (selectedItem:
|
|
5
|
+
onChange?: (selectedItem: NormalizedDropdownItemDeprecatedType, stateAndHelpers: ControllerStateAndHelpers<NormalizedDropdownItemDeprecatedType>) => void;
|
|
6
6
|
onInputValueChange?: (value: string) => void;
|
|
7
7
|
inputValue?: string;
|
|
8
|
-
initialSelectedItem?:
|
|
8
|
+
initialSelectedItem?: NormalizedDropdownItemDeprecatedType;
|
|
9
9
|
highlightFirstItemOnOpen?: boolean;
|
|
10
10
|
className?: string;
|
|
11
11
|
style?: React.CSSProperties;
|
|
@@ -13,4 +13,4 @@ export type DownshiftProviderProps = {
|
|
|
13
13
|
[key: string]: any;
|
|
14
14
|
};
|
|
15
15
|
export declare const DownshiftProvider: React.FC<DownshiftProviderProps>;
|
|
16
|
-
export declare const useDownshift: () => ControllerStateAndHelpers<
|
|
16
|
+
export declare const useDownshift: () => ControllerStateAndHelpers<NormalizedDropdownItemDeprecatedType>;
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { VariantType } from '@entur/form';
|
|
3
|
-
import {
|
|
4
|
-
import { PotentiallyAsyncDropdownItemType } from '../useResolvedItems';
|
|
3
|
+
import { NormalizedDropdownItemDeprecatedType, PotentiallyAsyncDropdownItemDeprecatedType } from './types';
|
|
5
4
|
export type DropdownDeprecatedProps = {
|
|
6
5
|
/** Beskrivende tekst som forklarer feltet */
|
|
7
6
|
label: string;
|
|
8
7
|
/** Tilgjengelige valg i dropdownen */
|
|
9
|
-
items:
|
|
8
|
+
items: PotentiallyAsyncDropdownItemDeprecatedType;
|
|
10
9
|
/** Valgt verdi. Bruk null for ingen verdi. */
|
|
11
10
|
value?: string | null;
|
|
12
11
|
/** Om man skal kunne søke i dropdownen eller ikke */
|
|
@@ -28,7 +27,7 @@ export type DropdownDeprecatedProps = {
|
|
|
28
27
|
/** En tekst som beskriver hva som skjer når man venter på items */
|
|
29
28
|
loadingText?: string;
|
|
30
29
|
/** Callback når brukeren endrer valg */
|
|
31
|
-
onChange?: (selectedItem:
|
|
30
|
+
onChange?: (selectedItem: NormalizedDropdownItemDeprecatedType | null) => void;
|
|
32
31
|
/** Lar brukeren velge ved å "tæbbe" seg ut av komponenten */
|
|
33
32
|
selectOnTab?: boolean;
|
|
34
33
|
/** Om man skal vise items ved fokusering av input-feltet, før man skriver inn noe */
|
|
@@ -50,7 +49,7 @@ export type DropdownDeprecatedProps = {
|
|
|
50
49
|
/** Filtreringen som blir brukt dersom man har en searchable Dropdown
|
|
51
50
|
* @default Enkel tekstsammenligning
|
|
52
51
|
*/
|
|
53
|
-
itemFilter?: (item:
|
|
52
|
+
itemFilter?: (item: NormalizedDropdownItemDeprecatedType) => boolean;
|
|
54
53
|
/** Plasserer labelen statisk på toppen av inputfeltet
|
|
55
54
|
* @default false
|
|
56
55
|
*/
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { NormalizedDropdownItemDeprecatedType } from './types';
|
|
3
3
|
import './DropdownList.scss';
|
|
4
4
|
export type DropdownListDeprecatedProps = {
|
|
5
|
-
items:
|
|
5
|
+
items: NormalizedDropdownItemDeprecatedType[];
|
|
6
6
|
[key: string]: any;
|
|
7
7
|
};
|
|
8
8
|
export declare const DropdownListDeprecated: React.FC<DropdownListDeprecatedProps>;
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { UseSelectProps } from 'downshift';
|
|
3
|
-
import { NormalizedDropdownItemType } from '../useNormalizedItems';
|
|
4
3
|
import { VariantType } from '@entur/form';
|
|
5
|
-
import {
|
|
4
|
+
import { NormalizedDropdownItemDeprecatedType, PotentiallyAsyncDropdownItemDeprecatedType } from './types';
|
|
6
5
|
import './MultiSelect.scss';
|
|
7
6
|
import './DropdownList.scss';
|
|
8
7
|
type MultiSelectDeprecatedProps = {
|
|
9
8
|
/** Tilgjengelige valg i MultiSelect */
|
|
10
|
-
items:
|
|
9
|
+
items: PotentiallyAsyncDropdownItemDeprecatedType;
|
|
11
10
|
/** Tekst som vises i boksen når elementer er valgt */
|
|
12
|
-
itemsSelectedLabel?: (selectedItems:
|
|
11
|
+
itemsSelectedLabel?: (selectedItems: NormalizedDropdownItemDeprecatedType[], numberOfItems?: number) => string;
|
|
13
12
|
/** Beskrivende tekst som forklarer feltet */
|
|
14
13
|
label?: string;
|
|
15
14
|
/** Hvilken valideringsvariant som gjelder */
|
|
@@ -48,8 +47,8 @@ type MultiSelectDeprecatedProps = {
|
|
|
48
47
|
clearable?: boolean;
|
|
49
48
|
loading?: boolean;
|
|
50
49
|
style?: React.CSSProperties;
|
|
51
|
-
initialSelectedItems?:
|
|
52
|
-
} & Omit<UseSelectProps<
|
|
50
|
+
initialSelectedItems?: NormalizedDropdownItemDeprecatedType[];
|
|
51
|
+
} & Omit<UseSelectProps<NormalizedDropdownItemDeprecatedType>, 'initialSelectedItem' | 'items'>;
|
|
53
52
|
/**
|
|
54
53
|
* @deprecated
|
|
55
54
|
* New MultiSelect available
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { NormalizedDropdownItemDeprecatedType } from './types';
|
|
3
3
|
type RegularDropdownDeprecatedProps = {
|
|
4
|
-
items:
|
|
4
|
+
items: NormalizedDropdownItemDeprecatedType[];
|
|
5
5
|
disabled?: boolean;
|
|
6
6
|
placeholder?: string;
|
|
7
7
|
loading?: boolean;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { NormalizedDropdownItemDeprecatedType } from './types';
|
|
3
3
|
import './SearchableDropdown.scss';
|
|
4
4
|
type SearchableDropdownDeprecatedProps = {
|
|
5
5
|
className?: string;
|
|
6
6
|
disabled?: boolean;
|
|
7
|
-
items:
|
|
7
|
+
items: NormalizedDropdownItemDeprecatedType[];
|
|
8
8
|
loading?: boolean;
|
|
9
9
|
loadingText?: string;
|
|
10
10
|
placeholder?: string;
|
|
@@ -16,7 +16,7 @@ type SearchableDropdownDeprecatedProps = {
|
|
|
16
16
|
[key: string]: any;
|
|
17
17
|
};
|
|
18
18
|
clearable: boolean;
|
|
19
|
-
itemFilter?: (item:
|
|
19
|
+
itemFilter?: (item: NormalizedDropdownItemDeprecatedType) => boolean;
|
|
20
20
|
disableLabelAnimation?: boolean;
|
|
21
21
|
[key: string]: any;
|
|
22
22
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export type DropdownItemDeprecatedType = {
|
|
3
|
+
value?: string;
|
|
4
|
+
label: string;
|
|
5
|
+
icons?: React.ComponentType<any>[];
|
|
6
|
+
} | string;
|
|
7
|
+
export type NormalizedDropdownItemDeprecatedType = {
|
|
8
|
+
value: string;
|
|
9
|
+
label: string;
|
|
10
|
+
icons?: React.ComponentType<any>[];
|
|
11
|
+
};
|
|
12
|
+
type AsyncDropdownItemDeprecatedType = (inputType: string, abortControllerRef: React.MutableRefObject<AbortController>) => Promise<DropdownItemDeprecatedType[]>;
|
|
13
|
+
type SyncDropdownItemDeprecatedType = (inputType: string, abortControllerRef: React.MutableRefObject<AbortController>) => DropdownItemDeprecatedType[];
|
|
14
|
+
export type PotentiallyAsyncDropdownItemDeprecatedType = DropdownItemDeprecatedType[] | SyncDropdownItemDeprecatedType | AsyncDropdownItemDeprecatedType;
|
|
15
|
+
export {};
|
|
@@ -793,12 +793,14 @@ var useNormalizedItems = function useNormalizedItems(items) {
|
|
|
793
793
|
label: item
|
|
794
794
|
};
|
|
795
795
|
}
|
|
796
|
-
if (
|
|
796
|
+
if ((item == null ? void 0 : item.value) === undefined) {
|
|
797
797
|
return _extends({}, item, {
|
|
798
798
|
value: item.label
|
|
799
799
|
});
|
|
800
800
|
}
|
|
801
|
-
return item
|
|
801
|
+
return _extends({}, item, {
|
|
802
|
+
value: item.value
|
|
803
|
+
});
|
|
802
804
|
});
|
|
803
805
|
}, [items]);
|
|
804
806
|
};
|
|
@@ -995,7 +997,7 @@ var useMultiSelectOldContext = function useMultiSelectOldContext() {
|
|
|
995
997
|
return context;
|
|
996
998
|
};
|
|
997
999
|
function stateReducer(state,
|
|
998
|
-
//StateChangeOptions<
|
|
1000
|
+
//StateChangeOptions<NormalizedDropdownItemDeprecatedType>,
|
|
999
1001
|
actionAndChanges) {
|
|
1000
1002
|
var changes = actionAndChanges.changes,
|
|
1001
1003
|
type = actionAndChanges.type;
|
|
@@ -1338,6 +1340,9 @@ var DropdownList = function DropdownList(_ref) {
|
|
|
1338
1340
|
})
|
|
1339
1341
|
}, getItemProps({
|
|
1340
1342
|
key: (item == null ? void 0 : item.label) + (item == null ? void 0 : item.value),
|
|
1343
|
+
// @ts-expect-error Since getItemProps expects the same item type
|
|
1344
|
+
// here as items, it throws error when selectAllItem is a string.
|
|
1345
|
+
// This does, however, not cause any functional issues.
|
|
1341
1346
|
item: item,
|
|
1342
1347
|
index: index
|
|
1343
1348
|
})), itemIsSelectAll ? selectAllListItemContent() : listItemContent(item));
|
|
@@ -2213,7 +2218,7 @@ var MultiSelect = function MultiSelect(_ref) {
|
|
|
2213
2218
|
disabled: disabled,
|
|
2214
2219
|
getSelectedItemProps: getSelectedItemProps,
|
|
2215
2220
|
index: index,
|
|
2216
|
-
key: selectedItem == null ? void 0 : selectedItem.value,
|
|
2221
|
+
key: (selectedItem == null ? void 0 : selectedItem.label) + (typeof (selectedItem == null ? void 0 : selectedItem.value) === 'string' ? selectedItem.value : ''),
|
|
2217
2222
|
readOnly: readOnly,
|
|
2218
2223
|
removeSelectedItem: function removeSelectedItem() {
|
|
2219
2224
|
var _inputRef$current6;
|