svelte-multiselect 11.3.0 → 11.5.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/package.json +23 -16
- package/readme.md +222 -45
- package/dist/CircleSpinner.svelte +0 -29
- package/dist/CircleSpinner.svelte.d.ts +0 -8
- package/dist/CmdPalette.svelte +0 -74
- package/dist/CmdPalette.svelte.d.ts +0 -66
- package/dist/CodeExample.svelte +0 -87
- package/dist/CodeExample.svelte.d.ts +0 -25
- package/dist/CopyButton.svelte +0 -73
- package/dist/CopyButton.svelte.d.ts +0 -25
- package/dist/FileDetails.svelte +0 -52
- package/dist/FileDetails.svelte.d.ts +0 -23
- package/dist/GitHubCorner.svelte +0 -82
- package/dist/GitHubCorner.svelte.d.ts +0 -13
- package/dist/Icon.svelte +0 -23
- package/dist/Icon.svelte.d.ts +0 -8
- package/dist/MultiSelect.svelte +0 -1017
- package/dist/MultiSelect.svelte.d.ts +0 -25
- package/dist/Nav.svelte +0 -447
- package/dist/Nav.svelte.d.ts +0 -42
- package/dist/PrevNext.svelte +0 -101
- package/dist/PrevNext.svelte.d.ts +0 -56
- package/dist/Toggle.svelte +0 -74
- package/dist/Toggle.svelte.d.ts +0 -11
- package/dist/Wiggle.svelte +0 -15
- package/dist/Wiggle.svelte.d.ts +0 -15
- package/dist/attachments.d.ts +0 -49
- package/dist/attachments.js +0 -489
- package/dist/icons.d.ts +0 -47
- package/dist/icons.js +0 -46
- package/dist/index.d.ts +0 -16
- package/dist/index.js +0 -42
- package/dist/types.d.ts +0 -142
- package/dist/types.js +0 -1
- package/dist/utils.d.ts +0 -4
- package/dist/utils.js +0 -59
package/dist/icons.d.ts
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
export declare const icon_data: {
|
|
2
|
-
readonly Alert: {
|
|
3
|
-
readonly viewBox: "0 0 16 16";
|
|
4
|
-
readonly path: "M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z";
|
|
5
|
-
};
|
|
6
|
-
readonly Check: {
|
|
7
|
-
readonly viewBox: "0 0 12 16";
|
|
8
|
-
readonly path: "M12 5l-8 8l-4-4l1.5-1.5L4 10l6.5-6.5L12 5z";
|
|
9
|
-
};
|
|
10
|
-
readonly ChevronExpand: {
|
|
11
|
-
readonly viewBox: "0 0 16 16";
|
|
12
|
-
readonly path: "M3.646 9.146a.5.5 0 0 1 .708 0L8 12.793l3.646-3.647a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 0-.708zm0-2.292a.5.5 0 0 0 .708 0L8 3.207l3.646 3.647a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 0 0 0 .708z";
|
|
13
|
-
};
|
|
14
|
-
readonly Collapse: {
|
|
15
|
-
readonly viewBox: "0 0 24 24";
|
|
16
|
-
readonly path: "M12 7.59L7.05 2.64L5.64 4.05L12 10.41l6.36-6.36l-1.41-1.41L12 7.59zM5.64 19.95l1.41 1.41L12 16.41l4.95 4.95l1.41-1.41L12 13.59l-6.36 6.36z";
|
|
17
|
-
};
|
|
18
|
-
readonly Copy: {
|
|
19
|
-
readonly viewBox: "0 0 16 16";
|
|
20
|
-
readonly path: "M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z";
|
|
21
|
-
};
|
|
22
|
-
readonly Cross: {
|
|
23
|
-
readonly viewBox: "0 0 24 24";
|
|
24
|
-
readonly path: "M18.3 5.71a.996.996 0 0 0-1.41 0L12 10.59L7.11 5.7A.996.996 0 1 0 5.7 7.11L10.59 12L5.7 16.89a.996.996 0 1 0 1.41 1.41L12 13.41l4.89 4.89a.996.996 0 1 0 1.41-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z";
|
|
25
|
-
};
|
|
26
|
-
readonly Disabled: {
|
|
27
|
-
readonly viewBox: "0 0 24 24";
|
|
28
|
-
readonly path: "M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10Zm-4.906-3.68L18.32 7.094A8 8 0 0 1 7.094 18.32ZM5.68 16.906A8 8 0 0 1 16.906 5.68L5.68 16.906Z";
|
|
29
|
-
};
|
|
30
|
-
readonly Expand: {
|
|
31
|
-
readonly viewBox: "0 0 24 24";
|
|
32
|
-
readonly path: "m12 19.24l-4.95-4.95l-1.41 1.42L12 22.07l6.36-6.36l-1.41-1.42L12 19.24zM5.64 8.29l1.41 1.42L12 4.76l4.95 4.95l1.41-1.42L12 1.93L5.64 8.29z";
|
|
33
|
-
};
|
|
34
|
-
readonly GitHub: {
|
|
35
|
-
readonly viewBox: "0 0 24 24";
|
|
36
|
-
readonly path: "M8.422 20.081c0 .896.01 1.753.016 2.285a.617.617 0 0 0 .422.58c2.078.686 4.317.718 6.414.091l.292-.087a.67.67 0 0 0 .478-.638c.005-.733.017-2.017.017-3.53c0-1.372-.477-2.25-1.031-2.707c3.399-.366 6.97-1.61 6.97-7.227c0-1.61-.592-2.91-1.566-3.934c.153-.366.688-1.866-.153-3.878c0 0-1.28-.403-4.201 1.5a14.76 14.76 0 0 0-3.82-.494c-1.298 0-2.597.165-3.819.494C5.52.65 4.24 1.036 4.24 1.036c-.84 2.012-.306 3.512-.153 3.878a5.565 5.565 0 0 0-1.566 3.934c0 5.598 3.552 6.86 6.951 7.227c-.439.366-.84 1.006-.973 1.957c-.879.384-3.075 1.006-4.45-1.207c-.286-.44-1.146-1.519-2.349-1.5c-1.28.018-.516.695.02.97c.648.347 1.393 1.646 1.565 2.067c.306.823 1.299 2.396 5.137 1.72Z";
|
|
37
|
-
};
|
|
38
|
-
readonly StackBlitz: {
|
|
39
|
-
readonly viewBox: "0 0 24 24";
|
|
40
|
-
readonly path: "M10.797 14.182H3.635L16.728 0l-3.525 9.818h7.162L7.272 24l3.524-9.818Z";
|
|
41
|
-
};
|
|
42
|
-
readonly Svelte: {
|
|
43
|
-
readonly viewBox: "0 0 24 24";
|
|
44
|
-
readonly path: "M10.354 21.125a4.44 4.44 0 0 1-4.765-1.767a4.109 4.109 0 0 1-.703-3.107a3.898 3.898 0 0 1 .134-.522l.105-.321l.287.21a7.21 7.21 0 0 0 2.186 1.092l.208.063l-.02.208a1.253 1.253 0 0 0 .226.83a1.337 1.337 0 0 0 1.435.533a1.231 1.231 0 0 0 .343-.15l5.59-3.562a1.164 1.164 0 0 0 .524-.778a1.242 1.242 0 0 0-.211-.937a1.338 1.338 0 0 0-1.435-.533a1.23 1.23 0 0 0-.343.15l-2.133 1.36a4.078 4.078 0 0 1-1.135.499a4.44 4.44 0 0 1-4.765-1.766a4.108 4.108 0 0 1-.702-3.108a3.855 3.855 0 0 1 1.742-2.582l5.589-3.563a4.072 4.072 0 0 1 1.135-.499a4.44 4.44 0 0 1 4.765 1.767a4.109 4.109 0 0 1 .703 3.107a3.943 3.943 0 0 1-.134.522l-.105.321l-.286-.21a7.204 7.204 0 0 0-2.187-1.093l-.208-.063l.02-.207a1.255 1.255 0 0 0-.226-.831a1.337 1.337 0 0 0-1.435-.532a1.231 1.231 0 0 0-.343.15L8.62 9.368a1.162 1.162 0 0 0-.524.778a1.24 1.24 0 0 0 .211.937a1.338 1.338 0 0 0 1.435.533a1.235 1.235 0 0 0 .344-.151l2.132-1.36a4.067 4.067 0 0 1 1.135-.498a4.44 4.44 0 0 1 4.765 1.766a4.108 4.108 0 0 1 .702 3.108a3.857 3.857 0 0 1-1.742 2.583l-5.589 3.562a4.072 4.072 0 0 1-1.135.499m10.358-17.95C18.484-.015 14.082-.96 10.9 1.068L5.31 4.63a6.412 6.412 0 0 0-2.896 4.295a6.753 6.753 0 0 0 .666 4.336a6.43 6.43 0 0 0-.96 2.396a6.833 6.833 0 0 0 1.168 5.167c2.229 3.19 6.63 4.135 9.812 2.108l5.59-3.562a6.41 6.41 0 0 0 2.896-4.295a6.756 6.756 0 0 0-.665-4.336a6.429 6.429 0 0 0 .958-2.396a6.831 6.831 0 0 0-1.167-5.168Z";
|
|
45
|
-
};
|
|
46
|
-
};
|
|
47
|
-
export type IconName = keyof typeof icon_data;
|
package/dist/icons.js
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
export const icon_data = {
|
|
2
|
-
Alert: {
|
|
3
|
-
viewBox: `0 0 16 16`,
|
|
4
|
-
path: `M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z`,
|
|
5
|
-
},
|
|
6
|
-
Check: {
|
|
7
|
-
viewBox: `0 0 12 16`,
|
|
8
|
-
path: `M12 5l-8 8l-4-4l1.5-1.5L4 10l6.5-6.5L12 5z`,
|
|
9
|
-
},
|
|
10
|
-
ChevronExpand: {
|
|
11
|
-
viewBox: `0 0 16 16`,
|
|
12
|
-
path: `M3.646 9.146a.5.5 0 0 1 .708 0L8 12.793l3.646-3.647a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 0-.708zm0-2.292a.5.5 0 0 0 .708 0L8 3.207l3.646 3.647a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 0 0 0 .708z`,
|
|
13
|
-
},
|
|
14
|
-
Collapse: {
|
|
15
|
-
viewBox: `0 0 24 24`,
|
|
16
|
-
path: `M12 7.59L7.05 2.64L5.64 4.05L12 10.41l6.36-6.36l-1.41-1.41L12 7.59zM5.64 19.95l1.41 1.41L12 16.41l4.95 4.95l1.41-1.41L12 13.59l-6.36 6.36z`,
|
|
17
|
-
},
|
|
18
|
-
Copy: {
|
|
19
|
-
viewBox: `0 0 16 16`,
|
|
20
|
-
path: `M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z`,
|
|
21
|
-
},
|
|
22
|
-
Cross: {
|
|
23
|
-
viewBox: `0 0 24 24`,
|
|
24
|
-
path: `M18.3 5.71a.996.996 0 0 0-1.41 0L12 10.59L7.11 5.7A.996.996 0 1 0 5.7 7.11L10.59 12L5.7 16.89a.996.996 0 1 0 1.41 1.41L12 13.41l4.89 4.89a.996.996 0 1 0 1.41-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z`,
|
|
25
|
-
},
|
|
26
|
-
Disabled: {
|
|
27
|
-
viewBox: `0 0 24 24`,
|
|
28
|
-
path: `M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10Zm-4.906-3.68L18.32 7.094A8 8 0 0 1 7.094 18.32ZM5.68 16.906A8 8 0 0 1 16.906 5.68L5.68 16.906Z`,
|
|
29
|
-
},
|
|
30
|
-
Expand: {
|
|
31
|
-
viewBox: `0 0 24 24`,
|
|
32
|
-
path: `m12 19.24l-4.95-4.95l-1.41 1.42L12 22.07l6.36-6.36l-1.41-1.42L12 19.24zM5.64 8.29l1.41 1.42L12 4.76l4.95 4.95l1.41-1.42L12 1.93L5.64 8.29z`,
|
|
33
|
-
},
|
|
34
|
-
GitHub: {
|
|
35
|
-
viewBox: `0 0 24 24`,
|
|
36
|
-
path: `M8.422 20.081c0 .896.01 1.753.016 2.285a.617.617 0 0 0 .422.58c2.078.686 4.317.718 6.414.091l.292-.087a.67.67 0 0 0 .478-.638c.005-.733.017-2.017.017-3.53c0-1.372-.477-2.25-1.031-2.707c3.399-.366 6.97-1.61 6.97-7.227c0-1.61-.592-2.91-1.566-3.934c.153-.366.688-1.866-.153-3.878c0 0-1.28-.403-4.201 1.5a14.76 14.76 0 0 0-3.82-.494c-1.298 0-2.597.165-3.819.494C5.52.65 4.24 1.036 4.24 1.036c-.84 2.012-.306 3.512-.153 3.878a5.565 5.565 0 0 0-1.566 3.934c0 5.598 3.552 6.86 6.951 7.227c-.439.366-.84 1.006-.973 1.957c-.879.384-3.075 1.006-4.45-1.207c-.286-.44-1.146-1.519-2.349-1.5c-1.28.018-.516.695.02.97c.648.347 1.393 1.646 1.565 2.067c.306.823 1.299 2.396 5.137 1.72Z`,
|
|
37
|
-
},
|
|
38
|
-
StackBlitz: {
|
|
39
|
-
viewBox: `0 0 24 24`,
|
|
40
|
-
path: `M10.797 14.182H3.635L16.728 0l-3.525 9.818h7.162L7.272 24l3.524-9.818Z`,
|
|
41
|
-
},
|
|
42
|
-
Svelte: {
|
|
43
|
-
viewBox: `0 0 24 24`,
|
|
44
|
-
path: `M10.354 21.125a4.44 4.44 0 0 1-4.765-1.767a4.109 4.109 0 0 1-.703-3.107a3.898 3.898 0 0 1 .134-.522l.105-.321l.287.21a7.21 7.21 0 0 0 2.186 1.092l.208.063l-.02.208a1.253 1.253 0 0 0 .226.83a1.337 1.337 0 0 0 1.435.533a1.231 1.231 0 0 0 .343-.15l5.59-3.562a1.164 1.164 0 0 0 .524-.778a1.242 1.242 0 0 0-.211-.937a1.338 1.338 0 0 0-1.435-.533a1.23 1.23 0 0 0-.343.15l-2.133 1.36a4.078 4.078 0 0 1-1.135.499a4.44 4.44 0 0 1-4.765-1.766a4.108 4.108 0 0 1-.702-3.108a3.855 3.855 0 0 1 1.742-2.582l5.589-3.563a4.072 4.072 0 0 1 1.135-.499a4.44 4.44 0 0 1 4.765 1.767a4.109 4.109 0 0 1 .703 3.107a3.943 3.943 0 0 1-.134.522l-.105.321l-.286-.21a7.204 7.204 0 0 0-2.187-1.093l-.208-.063l.02-.207a1.255 1.255 0 0 0-.226-.831a1.337 1.337 0 0 0-1.435-.532a1.231 1.231 0 0 0-.343.15L8.62 9.368a1.162 1.162 0 0 0-.524.778a1.24 1.24 0 0 0 .211.937a1.338 1.338 0 0 0 1.435.533a1.235 1.235 0 0 0 .344-.151l2.132-1.36a4.067 4.067 0 0 1 1.135-.498a4.44 4.44 0 0 1 4.765 1.766a4.108 4.108 0 0 1 .702 3.108a3.857 3.857 0 0 1-1.742 2.583l-5.589 3.562a4.072 4.072 0 0 1-1.135.499m10.358-17.95C18.484-.015 14.082-.96 10.9 1.068L5.31 4.63a6.412 6.412 0 0 0-2.896 4.295a6.753 6.753 0 0 0 .666 4.336a6.43 6.43 0 0 0-.96 2.396a6.833 6.833 0 0 0 1.168 5.167c2.229 3.19 6.63 4.135 9.812 2.108l5.59-3.562a6.41 6.41 0 0 0 2.896-4.295a6.756 6.756 0 0 0-.665-4.336a6.429 6.429 0 0 0 .958-2.396a6.831 6.831 0 0 0-1.167-5.168Z`,
|
|
45
|
-
},
|
|
46
|
-
};
|
package/dist/index.d.ts
DELETED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
export * from './attachments';
|
|
2
|
-
export { default as CircleSpinner } from './CircleSpinner.svelte';
|
|
3
|
-
export { default as CmdPalette } from './CmdPalette.svelte';
|
|
4
|
-
export { default as CodeExample } from './CodeExample.svelte';
|
|
5
|
-
export { default as CopyButton } from './CopyButton.svelte';
|
|
6
|
-
export { default as FileDetails } from './FileDetails.svelte';
|
|
7
|
-
export { default as GitHubCorner } from './GitHubCorner.svelte';
|
|
8
|
-
export { default as Icon } from './Icon.svelte';
|
|
9
|
-
export { default, default as MultiSelect } from './MultiSelect.svelte';
|
|
10
|
-
export { default as Nav } from './Nav.svelte';
|
|
11
|
-
export { default as PrevNext } from './PrevNext.svelte';
|
|
12
|
-
export { default as Toggle } from './Toggle.svelte';
|
|
13
|
-
export * from './types';
|
|
14
|
-
export * from './utils';
|
|
15
|
-
export { default as Wiggle } from './Wiggle.svelte';
|
|
16
|
-
export declare function scroll_into_view_if_needed_polyfill(element: Element, centerIfNeeded?: boolean): IntersectionObserver;
|
package/dist/index.js
DELETED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
export * from './attachments';
|
|
2
|
-
export { default as CircleSpinner } from './CircleSpinner.svelte';
|
|
3
|
-
export { default as CmdPalette } from './CmdPalette.svelte';
|
|
4
|
-
export { default as CodeExample } from './CodeExample.svelte';
|
|
5
|
-
export { default as CopyButton } from './CopyButton.svelte';
|
|
6
|
-
export { default as FileDetails } from './FileDetails.svelte';
|
|
7
|
-
export { default as GitHubCorner } from './GitHubCorner.svelte';
|
|
8
|
-
export { default as Icon } from './Icon.svelte';
|
|
9
|
-
export { default, default as MultiSelect } from './MultiSelect.svelte';
|
|
10
|
-
export { default as Nav } from './Nav.svelte';
|
|
11
|
-
export { default as PrevNext } from './PrevNext.svelte';
|
|
12
|
-
export { default as Toggle } from './Toggle.svelte';
|
|
13
|
-
export * from './types';
|
|
14
|
-
export * from './utils';
|
|
15
|
-
export { default as Wiggle } from './Wiggle.svelte';
|
|
16
|
-
// Firefox lacks support for scrollIntoViewIfNeeded (https://caniuse.com/scrollintoviewifneeded).
|
|
17
|
-
// See https://github.com/janosh/svelte-multiselect/issues/87
|
|
18
|
-
// Polyfill copied from
|
|
19
|
-
// https://github.com/nuxodin/lazyfill/blob/a8e63/polyfills/Element/prototype/scrollIntoViewIfNeeded.js
|
|
20
|
-
// exported for testing
|
|
21
|
-
export function scroll_into_view_if_needed_polyfill(element, centerIfNeeded = true) {
|
|
22
|
-
const observer = new IntersectionObserver(([entry], obs) => {
|
|
23
|
-
const ratio = entry.intersectionRatio;
|
|
24
|
-
if (ratio < 1) {
|
|
25
|
-
const place = ratio <= 0 && centerIfNeeded ? `center` : `nearest`;
|
|
26
|
-
element.scrollIntoView({
|
|
27
|
-
block: place,
|
|
28
|
-
inline: place,
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
obs.disconnect();
|
|
32
|
-
});
|
|
33
|
-
observer.observe(element);
|
|
34
|
-
return observer; // return for testing
|
|
35
|
-
}
|
|
36
|
-
if (typeof Element !== `undefined` &&
|
|
37
|
-
!Element.prototype?.scrollIntoViewIfNeeded &&
|
|
38
|
-
typeof IntersectionObserver !== `undefined`) {
|
|
39
|
-
Element.prototype.scrollIntoViewIfNeeded = function scrollIntoViewIfNeeded() {
|
|
40
|
-
scroll_into_view_if_needed_polyfill(this);
|
|
41
|
-
};
|
|
42
|
-
}
|
package/dist/types.d.ts
DELETED
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
import type { Snippet } from 'svelte';
|
|
2
|
-
import type { HTMLAttributes, HTMLInputAttributes } from 'svelte/elements';
|
|
3
|
-
export type Option = string | number | ObjectOption;
|
|
4
|
-
export type OptionStyle = string | {
|
|
5
|
-
option: string;
|
|
6
|
-
selected: string;
|
|
7
|
-
};
|
|
8
|
-
export type ObjectOption = {
|
|
9
|
-
label: string | number;
|
|
10
|
-
value?: unknown;
|
|
11
|
-
title?: string;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
preselected?: boolean;
|
|
14
|
-
disabledTitle?: string;
|
|
15
|
-
selectedTitle?: string;
|
|
16
|
-
style?: OptionStyle;
|
|
17
|
-
[key: string]: unknown;
|
|
18
|
-
};
|
|
19
|
-
export interface MultiSelectEvents<T extends Option = Option> {
|
|
20
|
-
onadd?: (data: {
|
|
21
|
-
option: T;
|
|
22
|
-
}) => unknown;
|
|
23
|
-
oncreate?: (data: {
|
|
24
|
-
option: T;
|
|
25
|
-
}) => unknown;
|
|
26
|
-
onremove?: (data: {
|
|
27
|
-
option: T;
|
|
28
|
-
}) => unknown;
|
|
29
|
-
onremoveAll?: (data: {
|
|
30
|
-
options: T[];
|
|
31
|
-
}) => unknown;
|
|
32
|
-
onchange?: (data: {
|
|
33
|
-
option?: T;
|
|
34
|
-
options?: T[];
|
|
35
|
-
type: `add` | `remove` | `removeAll`;
|
|
36
|
-
}) => unknown;
|
|
37
|
-
onopen?: (data: {
|
|
38
|
-
event: Event;
|
|
39
|
-
}) => unknown;
|
|
40
|
-
onclose?: (data: {
|
|
41
|
-
event: Event;
|
|
42
|
-
}) => unknown;
|
|
43
|
-
}
|
|
44
|
-
type AfterInputProps = Pick<MultiSelectProps, `selected` | `disabled` | `invalid` | `id` | `placeholder` | `open` | `required`>;
|
|
45
|
-
type UserMsgProps = {
|
|
46
|
-
searchText: string;
|
|
47
|
-
msgType: false | `dupe` | `create` | `no-match`;
|
|
48
|
-
msg: null | string;
|
|
49
|
-
};
|
|
50
|
-
export interface MultiSelectSnippets<T extends Option = Option> {
|
|
51
|
-
expandIcon?: Snippet<[{
|
|
52
|
-
open: boolean;
|
|
53
|
-
}]>;
|
|
54
|
-
selectedItem?: Snippet<[{
|
|
55
|
-
option: T;
|
|
56
|
-
idx: number;
|
|
57
|
-
}]>;
|
|
58
|
-
children?: Snippet<[{
|
|
59
|
-
option: T;
|
|
60
|
-
idx: number;
|
|
61
|
-
}]>;
|
|
62
|
-
removeIcon?: Snippet;
|
|
63
|
-
afterInput?: Snippet<[AfterInputProps]>;
|
|
64
|
-
spinner?: Snippet;
|
|
65
|
-
disabledIcon?: Snippet;
|
|
66
|
-
option?: Snippet<[{
|
|
67
|
-
option: T;
|
|
68
|
-
idx: number;
|
|
69
|
-
}]>;
|
|
70
|
-
userMsg?: Snippet<[UserMsgProps]>;
|
|
71
|
-
}
|
|
72
|
-
export interface PortalParams {
|
|
73
|
-
target_node?: HTMLElement | null;
|
|
74
|
-
active?: boolean;
|
|
75
|
-
}
|
|
76
|
-
export interface MultiSelectProps<T extends Option = Option> extends MultiSelectEvents<T>, MultiSelectSnippets<T>, Omit<HTMLAttributes<HTMLDivElement>, `children` | `onchange` | `onclose`> {
|
|
77
|
-
activeIndex?: number | null;
|
|
78
|
-
activeOption?: T | null;
|
|
79
|
-
createOptionMsg?: string | null;
|
|
80
|
-
allowUserOptions?: boolean | `append`;
|
|
81
|
-
allowEmpty?: boolean;
|
|
82
|
-
autocomplete?: HTMLInputAttributes[`autocomplete`];
|
|
83
|
-
autoScroll?: boolean;
|
|
84
|
-
breakpoint?: number;
|
|
85
|
-
defaultDisabledTitle?: string;
|
|
86
|
-
disabled?: boolean;
|
|
87
|
-
disabledInputTitle?: string;
|
|
88
|
-
duplicateOptionMsg?: string;
|
|
89
|
-
duplicates?: boolean;
|
|
90
|
-
keepSelectedInDropdown?: false | `plain` | `checkboxes`;
|
|
91
|
-
key?: (opt: T) => unknown;
|
|
92
|
-
filterFunc?: (opt: T, searchText: string) => boolean;
|
|
93
|
-
fuzzy?: boolean;
|
|
94
|
-
closeDropdownOnSelect?: boolean | `if-mobile` | `retain-focus`;
|
|
95
|
-
form_input?: HTMLInputElement | null;
|
|
96
|
-
highlightMatches?: boolean;
|
|
97
|
-
id?: string | null;
|
|
98
|
-
input?: HTMLInputElement | null;
|
|
99
|
-
inputClass?: string;
|
|
100
|
-
inputStyle?: string | null;
|
|
101
|
-
inputmode?: HTMLInputAttributes[`inputmode`] | null;
|
|
102
|
-
invalid?: boolean;
|
|
103
|
-
liActiveOptionClass?: string;
|
|
104
|
-
liActiveUserMsgClass?: string;
|
|
105
|
-
liOptionClass?: string;
|
|
106
|
-
liOptionStyle?: string | null;
|
|
107
|
-
liSelectedClass?: string;
|
|
108
|
-
liSelectedStyle?: string | null;
|
|
109
|
-
liUserMsgClass?: string;
|
|
110
|
-
loading?: boolean;
|
|
111
|
-
matchingOptions?: T[];
|
|
112
|
-
maxOptions?: number | undefined;
|
|
113
|
-
maxSelect?: number | null;
|
|
114
|
-
maxSelectMsg?: ((current: number, max: number) => string) | null;
|
|
115
|
-
maxSelectMsgClass?: string;
|
|
116
|
-
name?: string | null;
|
|
117
|
-
noMatchingOptionsMsg?: string;
|
|
118
|
-
open?: boolean;
|
|
119
|
-
options: T[];
|
|
120
|
-
outerDiv?: HTMLDivElement | null;
|
|
121
|
-
outerDivClass?: string;
|
|
122
|
-
parseLabelsAsHtml?: boolean;
|
|
123
|
-
pattern?: string | null;
|
|
124
|
-
placeholder?: string | null;
|
|
125
|
-
removeAllTitle?: string;
|
|
126
|
-
removeBtnTitle?: string;
|
|
127
|
-
minSelect?: number | null;
|
|
128
|
-
required?: boolean | number;
|
|
129
|
-
resetFilterOnAdd?: boolean;
|
|
130
|
-
searchText?: string;
|
|
131
|
-
selected?: T[];
|
|
132
|
-
sortSelected?: boolean | ((op1: T, op2: T) => number);
|
|
133
|
-
selectedOptionsDraggable?: boolean;
|
|
134
|
-
style?: string | null;
|
|
135
|
-
ulOptionsClass?: string;
|
|
136
|
-
ulSelectedClass?: string;
|
|
137
|
-
ulSelectedStyle?: string | null;
|
|
138
|
-
ulOptionsStyle?: string | null;
|
|
139
|
-
value?: T | T[] | null;
|
|
140
|
-
portal?: PortalParams;
|
|
141
|
-
}
|
|
142
|
-
export {};
|
package/dist/types.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/dist/utils.d.ts
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import type { Option } from './types';
|
|
2
|
-
export declare const get_label: (opt: Option) => string | number;
|
|
3
|
-
export declare function get_style(option: Option, key?: `selected` | `option` | null | undefined): string;
|
|
4
|
-
export declare function fuzzy_match(search_text: string, target_text: string): boolean;
|
package/dist/utils.js
DELETED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
// Get the label key from an option object or the option itself
|
|
2
|
-
// if it's a string or number
|
|
3
|
-
export const get_label = (opt) => {
|
|
4
|
-
if (opt instanceof Object) {
|
|
5
|
-
if (opt.label === undefined) {
|
|
6
|
-
const opt_str = JSON.stringify(opt);
|
|
7
|
-
console.error(`MultiSelect option ${opt_str} is an object but has no label key`);
|
|
8
|
-
}
|
|
9
|
-
return opt.label;
|
|
10
|
-
}
|
|
11
|
-
return `${opt}`;
|
|
12
|
-
};
|
|
13
|
-
// This function is used extract CSS strings from a {selected, option} style
|
|
14
|
-
// object to be used in the style attribute of the option.
|
|
15
|
-
// If the style is a string, it will be returned as is
|
|
16
|
-
export function get_style(option, key = null) {
|
|
17
|
-
if (key === undefined)
|
|
18
|
-
key = null;
|
|
19
|
-
let css_str = ``;
|
|
20
|
-
const valid_key = key === null || key === `selected` || key === `option`;
|
|
21
|
-
if (!valid_key)
|
|
22
|
-
console.error(`MultiSelect: Invalid key=${key} for get_style`);
|
|
23
|
-
if (typeof option === `object` && option.style) {
|
|
24
|
-
if (typeof option.style === `string`)
|
|
25
|
-
css_str = option.style;
|
|
26
|
-
if (typeof option.style === `object`) {
|
|
27
|
-
if (key && key in option.style)
|
|
28
|
-
return option.style[key] ?? ``;
|
|
29
|
-
else {
|
|
30
|
-
console.error(`Invalid style object for option=${JSON.stringify(option)}`);
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
// ensure css_str ends with a semicolon
|
|
35
|
-
if (css_str.trim() && !css_str.trim().endsWith(`;`))
|
|
36
|
-
css_str += `;`;
|
|
37
|
-
return css_str;
|
|
38
|
-
}
|
|
39
|
-
// Fuzzy string matching function
|
|
40
|
-
// Returns true if the search string can be found as a subsequence in the target string
|
|
41
|
-
// e.g., "tageoo" matches "tasks/geo-opt" because t-a-g-e-o-o appears in order
|
|
42
|
-
export function fuzzy_match(search_text, target_text) {
|
|
43
|
-
// Handle null/undefined inputs first
|
|
44
|
-
if (search_text === null || search_text === undefined || target_text === null ||
|
|
45
|
-
target_text === undefined)
|
|
46
|
-
return false;
|
|
47
|
-
if (!search_text)
|
|
48
|
-
return true;
|
|
49
|
-
if (!target_text)
|
|
50
|
-
return false;
|
|
51
|
-
const [search, target] = [search_text.toLowerCase(), target_text.toLowerCase()];
|
|
52
|
-
let [search_idx, target_idx] = [0, 0];
|
|
53
|
-
while (search_idx < search.length && target_idx < target.length) {
|
|
54
|
-
if (search[search_idx] === target[target_idx])
|
|
55
|
-
search_idx++;
|
|
56
|
-
target_idx++;
|
|
57
|
-
}
|
|
58
|
-
return search_idx === search.length;
|
|
59
|
-
}
|