svelte-multiselect 11.1.0 → 11.2.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.
Files changed (42) hide show
  1. package/dist/CircleSpinner.svelte +2 -1
  2. package/dist/CmdPalette.svelte +13 -7
  3. package/dist/CmdPalette.svelte.d.ts +4 -5
  4. package/dist/CodeExample.svelte +80 -0
  5. package/dist/CodeExample.svelte.d.ts +22 -0
  6. package/dist/CopyButton.svelte +47 -0
  7. package/dist/CopyButton.svelte.d.ts +25 -0
  8. package/dist/FileDetails.svelte +53 -0
  9. package/dist/FileDetails.svelte.d.ts +21 -0
  10. package/dist/GitHubCorner.svelte +82 -0
  11. package/dist/GitHubCorner.svelte.d.ts +13 -0
  12. package/dist/Icon.svelte +23 -0
  13. package/dist/Icon.svelte.d.ts +8 -0
  14. package/dist/MultiSelect.svelte +128 -75
  15. package/dist/MultiSelect.svelte.d.ts +2 -3
  16. package/dist/PrevNext.svelte +100 -0
  17. package/dist/PrevNext.svelte.d.ts +48 -0
  18. package/dist/RadioButtons.svelte +67 -0
  19. package/dist/RadioButtons.svelte.d.ts +44 -0
  20. package/dist/Toggle.svelte +78 -0
  21. package/dist/Toggle.svelte.d.ts +16 -0
  22. package/dist/icons.d.ts +47 -0
  23. package/dist/icons.js +46 -0
  24. package/dist/index.d.ts +10 -3
  25. package/dist/index.js +10 -3
  26. package/dist/types.d.ts +141 -0
  27. package/dist/utils.d.ts +6 -22
  28. package/dist/utils.js +17 -25
  29. package/package.json +18 -37
  30. package/readme.md +287 -121
  31. package/dist/icons/ChevronExpand.svelte +0 -9
  32. package/dist/icons/ChevronExpand.svelte.d.ts +0 -4
  33. package/dist/icons/Cross.svelte +0 -10
  34. package/dist/icons/Cross.svelte.d.ts +0 -4
  35. package/dist/icons/Disabled.svelte +0 -10
  36. package/dist/icons/Disabled.svelte.d.ts +0 -4
  37. package/dist/icons/Octocat.svelte +0 -9
  38. package/dist/icons/Octocat.svelte.d.ts +0 -4
  39. package/dist/icons/index.d.ts +0 -4
  40. package/dist/icons/index.js +0 -4
  41. package/dist/props.d.ts +0 -143
  42. package/dist/props.js +0 -1
@@ -1,9 +0,0 @@
1
- <script lang="ts">let { ...props } = $props();
2
- export {};
3
- </script>
4
-
5
- <svg {...props} fill="currentColor" viewBox="0 0 16 16">
6
- <path
7
- d="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"
8
- />
9
- </svg>
@@ -1,4 +0,0 @@
1
- import type { SVGAttributes } from 'svelte/elements';
2
- declare const ChevronExpand: import("svelte").Component<SVGAttributes<EventTarget>, {}, "">;
3
- type ChevronExpand = ReturnType<typeof ChevronExpand>;
4
- export default ChevronExpand;
@@ -1,10 +0,0 @@
1
- <script lang="ts">let { ...props } = $props();
2
- export {};
3
- </script>
4
-
5
- <!-- https://api.iconify.design/ic:round-clear.svg -->
6
- <svg {...props} viewBox="0 0 24 24" fill="currentColor">
7
- <path
8
- d="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"
9
- />
10
- </svg>
@@ -1,4 +0,0 @@
1
- import type { SVGAttributes } from 'svelte/elements';
2
- declare const Cross: import("svelte").Component<SVGAttributes<EventTarget>, {}, "">;
3
- type Cross = ReturnType<typeof Cross>;
4
- export default Cross;
@@ -1,10 +0,0 @@
1
- <script lang="ts">let { ...props } = $props();
2
- export {};
3
- </script>
4
-
5
- <!-- https://api.iconify.design/fe:disabled.svg -->
6
- <svg {...props} viewBox="0 0 24 24" fill="currentColor">
7
- <path
8
- d="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"
9
- />
10
- </svg>
@@ -1,4 +0,0 @@
1
- import type { SVGAttributes } from 'svelte/elements';
2
- declare const Disabled: import("svelte").Component<SVGAttributes<EventTarget>, {}, "">;
3
- type Disabled = ReturnType<typeof Disabled>;
4
- export default Disabled;
@@ -1,9 +0,0 @@
1
- <script lang="ts">let { ...props } = $props();
2
- export {};
3
- </script>
4
-
5
- <svg {...props} viewBox="0 0 24 24" fill="currentColor">
6
- <path
7
- d="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"
8
- />
9
- </svg>
@@ -1,4 +0,0 @@
1
- import type { SVGAttributes } from 'svelte/elements';
2
- declare const Octocat: import("svelte").Component<SVGAttributes<EventTarget>, {}, "">;
3
- type Octocat = ReturnType<typeof Octocat>;
4
- export default Octocat;
@@ -1,4 +0,0 @@
1
- export { default as ExpandIcon } from './ChevronExpand.svelte';
2
- export { default as CrossIcon } from './Cross.svelte';
3
- export { default as DisabledIcon } from './Disabled.svelte';
4
- export { default as Octocat } from './Octocat.svelte';
@@ -1,4 +0,0 @@
1
- export { default as ExpandIcon } from './ChevronExpand.svelte';
2
- export { default as CrossIcon } from './Cross.svelte';
3
- export { default as DisabledIcon } from './Disabled.svelte';
4
- export { default as Octocat } from './Octocat.svelte';
package/dist/props.d.ts DELETED
@@ -1,143 +0,0 @@
1
- import type { Snippet } from 'svelte';
2
- import type { FocusEventHandler, HTMLInputAttributes, KeyboardEventHandler, MouseEventHandler, TouchEventHandler } from 'svelte/elements';
3
- import type { Option } from './types';
4
- export interface MultiSelectNativeEvents {
5
- onblur?: FocusEventHandler<HTMLInputElement>;
6
- onclick?: MouseEventHandler<HTMLInputElement>;
7
- onfocus?: FocusEventHandler<HTMLInputElement>;
8
- onkeydown?: KeyboardEventHandler<HTMLInputElement>;
9
- onkeyup?: KeyboardEventHandler<HTMLInputElement>;
10
- onmousedown?: MouseEventHandler<HTMLInputElement>;
11
- onmouseenter?: MouseEventHandler<HTMLInputElement>;
12
- onmouseleave?: MouseEventHandler<HTMLInputElement>;
13
- ontouchcancel?: TouchEventHandler<HTMLInputElement>;
14
- ontouchend?: TouchEventHandler<HTMLInputElement>;
15
- ontouchmove?: TouchEventHandler<HTMLInputElement>;
16
- ontouchstart?: TouchEventHandler<HTMLInputElement>;
17
- }
18
- export interface MultiSelectComponentEvents<T extends Option = Option> {
19
- onadd?: (data: {
20
- option: T;
21
- }) => unknown;
22
- oncreate?: (data: {
23
- option: T;
24
- }) => unknown;
25
- onremove?: (data: {
26
- option: T;
27
- }) => unknown;
28
- onremoveAll?: (data: {
29
- options: T[];
30
- }) => unknown;
31
- onchange?: (data: {
32
- option?: T;
33
- options?: T[];
34
- type: `add` | `remove` | `removeAll`;
35
- }) => unknown;
36
- onopen?: (data: {
37
- event: Event;
38
- }) => unknown;
39
- onclose?: (data: {
40
- event: Event;
41
- }) => unknown;
42
- }
43
- export interface MultiSelectSnippets<T extends Option = Option> {
44
- expandIcon?: Snippet<[{
45
- open: boolean;
46
- }]>;
47
- selectedItem?: Snippet<[{
48
- option: T;
49
- idx: number;
50
- }]>;
51
- children?: Snippet<[{
52
- option: T;
53
- idx: number;
54
- }]>;
55
- removeIcon?: Snippet;
56
- afterInput?: Snippet<[
57
- Pick<MultiSelectParameters, `selected` | `disabled` | `invalid` | `id` | `placeholder` | `open` | `required`>
58
- ]>;
59
- spinner?: Snippet;
60
- disabledIcon?: Snippet;
61
- option?: Snippet<[{
62
- option: T;
63
- idx: number;
64
- }]>;
65
- userMsg?: Snippet<[
66
- {
67
- searchText: string;
68
- msgType: false | `dupe` | `create` | `no-match`;
69
- msg: null | string;
70
- }
71
- ]>;
72
- }
73
- export interface PortalParams {
74
- target_node?: HTMLElement | null;
75
- active?: boolean;
76
- }
77
- export interface MultiSelectParameters<T extends Option = Option> {
78
- activeIndex?: number | null;
79
- activeOption?: T | null;
80
- createOptionMsg?: string | null;
81
- allowUserOptions?: boolean | `append`;
82
- allowEmpty?: boolean;
83
- autocomplete?: HTMLInputAttributes[`autocomplete`];
84
- autoScroll?: boolean;
85
- breakpoint?: number;
86
- defaultDisabledTitle?: string;
87
- disabled?: boolean;
88
- disabledInputTitle?: string;
89
- duplicateOptionMsg?: string;
90
- duplicates?: boolean;
91
- key?: (opt: T) => unknown;
92
- filterFunc?: (opt: T, searchText: string) => boolean;
93
- closeDropdownOnSelect?: boolean | `desktop`;
94
- form_input?: HTMLInputElement | null;
95
- highlightMatches?: boolean;
96
- id?: string | null;
97
- input?: HTMLInputElement | null;
98
- inputClass?: string;
99
- inputStyle?: string | null;
100
- inputmode?: HTMLInputAttributes[`inputmode`] | null;
101
- invalid?: boolean;
102
- liActiveOptionClass?: string;
103
- liActiveUserMsgClass?: string;
104
- liOptionClass?: string;
105
- liOptionStyle?: string | null;
106
- liSelectedClass?: string;
107
- liSelectedStyle?: string | null;
108
- liUserMsgClass?: string;
109
- loading?: boolean;
110
- matchingOptions?: T[];
111
- maxOptions?: number | undefined;
112
- maxSelect?: number | null;
113
- maxSelectMsg?: ((current: number, max: number) => string) | null;
114
- maxSelectMsgClass?: string;
115
- name?: string | null;
116
- noMatchingOptionsMsg?: string;
117
- open?: boolean;
118
- options: T[];
119
- outerDiv?: HTMLDivElement | null;
120
- outerDivClass?: string;
121
- parseLabelsAsHtml?: boolean;
122
- pattern?: string | null;
123
- placeholder?: string | null;
124
- removeAllTitle?: string;
125
- removeBtnTitle?: string;
126
- minSelect?: number | null;
127
- required?: boolean | number;
128
- resetFilterOnAdd?: boolean;
129
- searchText?: string;
130
- selected?: T[];
131
- sortSelected?: boolean | ((op1: T, op2: T) => number);
132
- selectedOptionsDraggable?: boolean;
133
- style?: string | null;
134
- ulOptionsClass?: string;
135
- ulSelectedClass?: string;
136
- ulSelectedStyle?: string | null;
137
- ulOptionsStyle?: string | null;
138
- value?: T | T[] | null;
139
- portal?: PortalParams;
140
- [key: string]: unknown;
141
- }
142
- export interface MultiSelectProps<T extends Option = Option> extends MultiSelectNativeEvents, MultiSelectComponentEvents<T>, MultiSelectSnippets<T>, MultiSelectParameters<T> {
143
- }
package/dist/props.js DELETED
@@ -1 +0,0 @@
1
- export {};