@ibobbyts/svelte-ui-utils 0.2.8 → 0.2.10
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/README.md +21 -13
- package/dist/data-table/FilterControl.svelte +3 -0
- package/dist/data-table/types.d.ts +3 -0
- package/dist/data-table/types.d.ts.map +1 -1
- package/dist/dropdown/Dropdown.svelte +4 -1
- package/dist/dropdown/Dropdown.svelte.d.ts +2 -1
- package/dist/dropdown/Dropdown.svelte.d.ts.map +1 -1
- package/dist/dropdown/index.d.ts +1 -1
- package/dist/dropdown/index.d.ts.map +1 -1
- package/dist/dropdown/types.d.ts +1 -0
- package/dist/dropdown/types.d.ts.map +1 -1
- package/dist/dropdown-search/DropdownSearch.svelte +43 -3
- package/dist/dropdown-search/DropdownSearch.svelte.d.ts +3 -0
- package/dist/dropdown-search/DropdownSearch.svelte.d.ts.map +1 -1
- package/dist/style.css +19 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -121,6 +121,10 @@ Set `closeOnValid={true}` to hide the result list after validation finds a
|
|
|
121
121
|
usable exact match. The default is `false`, so existing validated searches keep
|
|
122
122
|
showing their current result list until the field closes or the user selects an
|
|
123
123
|
option.
|
|
124
|
+
Use `showOptionsOnFocus={true}` with `focusOptions` to show a controlled set of
|
|
125
|
+
options as soon as the field receives focus, including when the current value is
|
|
126
|
+
empty or already valid. Pass `footerText` to render a non-selectable note below
|
|
127
|
+
the options, separated by a divider.
|
|
124
128
|
When the input has text, `DropdownSearch` shows an internal clear button on the
|
|
125
129
|
right side of the field. Use `clearLabel` to localize that button's accessible
|
|
126
130
|
label, or use `language` to select the package default.
|
|
@@ -255,6 +259,7 @@ countdown bar.
|
|
|
255
259
|
options={pageSizeOptions}
|
|
256
260
|
ariaLabel="Rows"
|
|
257
261
|
placement="down"
|
|
262
|
+
menuAlign="left"
|
|
258
263
|
onChange={(next) => {
|
|
259
264
|
pageSize = next;
|
|
260
265
|
}}
|
|
@@ -263,7 +268,11 @@ countdown bar.
|
|
|
263
268
|
|
|
264
269
|
`Dropdown` is a controlled select-like component for simple option lists. Use
|
|
265
270
|
`placement="up"` when the menu should open above the trigger, such as bottom
|
|
266
|
-
pagination bars. `
|
|
271
|
+
pagination bars. Use `menuAlign="left"` when the expanded menu should share the
|
|
272
|
+
trigger's left edge; the default is `right` for backward compatibility.
|
|
273
|
+
`fitContent` can be combined with `menuAlign="left"` to size the menu to its
|
|
274
|
+
longest option while keeping its left edge aligned. `DataTable` uses this same
|
|
275
|
+
component for its page-size picker.
|
|
267
276
|
|
|
268
277
|
## DataTable
|
|
269
278
|
|
|
@@ -488,23 +497,22 @@ inside a theme root:
|
|
|
488
497
|
|
|
489
498
|
## Release
|
|
490
499
|
|
|
491
|
-
Publishing is release-driven:
|
|
492
|
-
|
|
493
500
|
Do not publish this package as part of consumer-app local integration work.
|
|
494
|
-
|
|
495
|
-
|
|
501
|
+
Publish only when a release is explicitly requested. Releases are published
|
|
502
|
+
directly from the maintainer's machine to npm; do not create a GitHub Actions
|
|
503
|
+
secret or a GitHub Release for package publishing.
|
|
504
|
+
|
|
505
|
+
The npm token is exported as `NPM_TOKEN` from `~/.zshrc`. After updating the
|
|
506
|
+
package version, run the validation and publish commands locally:
|
|
496
507
|
|
|
497
508
|
```bash
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
gh run watch
|
|
509
|
+
npm run check
|
|
510
|
+
npm test
|
|
511
|
+
npm run package
|
|
512
|
+
npm publish --access public
|
|
503
513
|
```
|
|
504
514
|
|
|
505
|
-
|
|
506
|
-
the repository secret `NPM_TOKEN`. The token must have permission to publish
|
|
507
|
-
`@ibobbyts/svelte-ui-utils`; do not commit it to this repository.
|
|
515
|
+
Never commit the npm token or copy it into repository settings.
|
|
508
516
|
|
|
509
517
|
## Bun install verification
|
|
510
518
|
|
|
@@ -96,6 +96,9 @@
|
|
|
96
96
|
limit={control.limit ?? 10}
|
|
97
97
|
minLength={control.minLength ?? 1}
|
|
98
98
|
closeOnValid={control.closeOnValid ?? false}
|
|
99
|
+
showOptionsOnFocus={control.showOptionsOnFocus ?? false}
|
|
100
|
+
focusOptions={control.focusOptions ?? []}
|
|
101
|
+
footerText={control.footerText}
|
|
99
102
|
{language}
|
|
100
103
|
noResultsText={control.noResultsText}
|
|
101
104
|
loadingText={control.loadingText}
|
|
@@ -106,6 +106,9 @@ export interface DropdownSearchFilterControl {
|
|
|
106
106
|
limit?: number;
|
|
107
107
|
minLength?: number;
|
|
108
108
|
closeOnValid?: boolean;
|
|
109
|
+
showOptionsOnFocus?: boolean;
|
|
110
|
+
focusOptions?: DropdownSearchItem[];
|
|
111
|
+
footerText?: string;
|
|
109
112
|
noResultsText?: string;
|
|
110
113
|
loadingText?: string;
|
|
111
114
|
clearLabel?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/data-table/types.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/data-table/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -2,13 +2,14 @@
|
|
|
2
2
|
|
|
3
3
|
<script lang="ts">
|
|
4
4
|
import { onDestroy, tick } from 'svelte';
|
|
5
|
-
import type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
5
|
+
import type { DropdownChangeHandler, DropdownMenuAlign, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
6
6
|
|
|
7
7
|
export let id: string | undefined = undefined;
|
|
8
8
|
export let value: DropdownValue = '';
|
|
9
9
|
export let options: DropdownOption[] = [];
|
|
10
10
|
export let ariaLabel: string | undefined = undefined;
|
|
11
11
|
export let placement: DropdownPlacement = 'down';
|
|
12
|
+
export let menuAlign: DropdownMenuAlign = 'right';
|
|
12
13
|
export let fitViewport = false;
|
|
13
14
|
export let fitContent = false;
|
|
14
15
|
export let disabled = false;
|
|
@@ -224,6 +225,8 @@
|
|
|
224
225
|
class="suu-dropdown__menu"
|
|
225
226
|
class:suu-dropdown__menu--up={placement === 'up'}
|
|
226
227
|
class:suu-dropdown__menu--down={placement === 'down'}
|
|
228
|
+
class:suu-dropdown__menu--left={menuAlign === 'left'}
|
|
229
|
+
class:suu-dropdown__menu--right={menuAlign === 'right'}
|
|
227
230
|
class:suu-dropdown__menu--fit-content={fitContent}
|
|
228
231
|
>
|
|
229
232
|
<div class="suu-dropdown__panel" role="listbox" aria-label={ariaLabel}>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
1
|
+
import type { DropdownChangeHandler, DropdownMenuAlign, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
2
2
|
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
3
|
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
4
|
$$bindings?: Bindings;
|
|
@@ -18,6 +18,7 @@ declare const Dropdown: $$__sveltets_2_IsomorphicComponent<{
|
|
|
18
18
|
options?: DropdownOption[];
|
|
19
19
|
ariaLabel?: string | undefined;
|
|
20
20
|
placement?: DropdownPlacement;
|
|
21
|
+
menuAlign?: DropdownMenuAlign;
|
|
21
22
|
fitViewport?: boolean;
|
|
22
23
|
fitContent?: boolean;
|
|
23
24
|
disabled?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/Dropdown.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"Dropdown.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/Dropdown.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAkO7H,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,QAAQ;SAVyN,MAAM,GAAG,SAAS;YAAU,aAAa;cAAY,cAAc,EAAE;gBAAc,MAAM,GAAG,SAAS;gBAAc,iBAAiB;gBAAc,iBAAiB;;;;eAA2G,qBAAqB,GAAG,SAAS;;;kBAUzb,CAAC;AAC5E,KAAK,QAAQ,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AAChD,eAAe,QAAQ,CAAC"}
|
package/dist/dropdown/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { default as Dropdown } from './Dropdown.svelte';
|
|
2
|
-
export type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
2
|
+
export type { DropdownChangeHandler, DropdownMenuAlign, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
|
|
3
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,YAAY,EAAE,qBAAqB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,YAAY,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}
|
package/dist/dropdown/types.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,MAAM,CAAC;AAE9C,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,qBAAqB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,MAAM,CAAC;AAE9C,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AAEjD,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,qBAAqB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC"}
|
|
@@ -30,6 +30,9 @@
|
|
|
30
30
|
export let minLength = 1;
|
|
31
31
|
export let validate = true;
|
|
32
32
|
export let closeOnValid = false;
|
|
33
|
+
export let showOptionsOnFocus = false;
|
|
34
|
+
export let focusOptions: DropdownSearchItem[] = [];
|
|
35
|
+
export let footerText: string | undefined = undefined;
|
|
33
36
|
export let loadOptions: DropdownSearchLoadOptions;
|
|
34
37
|
export let id: string | undefined = undefined;
|
|
35
38
|
export let name: string | undefined = undefined;
|
|
@@ -76,6 +79,7 @@
|
|
|
76
79
|
let activeController: AbortController | undefined;
|
|
77
80
|
let requestId = 0;
|
|
78
81
|
let lastHandledValue = value;
|
|
82
|
+
let showingFocusOptions = false;
|
|
79
83
|
|
|
80
84
|
$: messages = getUiMessages(language);
|
|
81
85
|
$: resolvedNoResultsText = noResultsText?.trim()
|
|
@@ -90,21 +94,27 @@
|
|
|
90
94
|
$: resolvedListboxId = listboxId ?? (id ? `${id}-options` : undefined);
|
|
91
95
|
$: hasQuery = normalizeDropdownSearchValue(value).length > 0;
|
|
92
96
|
$: hideOptionsOnValid =
|
|
93
|
-
closeOnValid && !multiselect && validate && status === 'valid';
|
|
97
|
+
closeOnValid && !showingFocusOptions && !multiselect && validate && status === 'valid';
|
|
94
98
|
$: showOptions =
|
|
95
99
|
focused &&
|
|
96
100
|
!disabled &&
|
|
97
101
|
!hideOptionsOnValid &&
|
|
98
|
-
(
|
|
102
|
+
((showingFocusOptions && (options.length > 0 || Boolean(footerText?.trim()))) ||
|
|
103
|
+
hasQuery ||
|
|
104
|
+
(multiselect && options.length > 0)) &&
|
|
99
105
|
(options.length > 0 ||
|
|
100
106
|
status === 'loading' ||
|
|
101
|
-
(validate && hasQuery && options.length === 0)
|
|
107
|
+
(validate && hasQuery && options.length === 0) ||
|
|
108
|
+
(showingFocusOptions && Boolean(footerText?.trim())));
|
|
102
109
|
$: if (!validate && status !== 'empty' && status !== 'loading') {
|
|
103
110
|
setStatus('empty');
|
|
104
111
|
}
|
|
105
112
|
$: if (value !== lastHandledValue && value !== inputValue) {
|
|
106
113
|
handleIncomingValue(value);
|
|
107
114
|
}
|
|
115
|
+
$: if (showOptionsOnFocus && showingFocusOptions && focused) {
|
|
116
|
+
options = [...focusOptions];
|
|
117
|
+
}
|
|
108
118
|
|
|
109
119
|
function emitChange() {
|
|
110
120
|
const detail = { value, selectedItem, selectedItems, status };
|
|
@@ -168,7 +178,18 @@
|
|
|
168
178
|
}
|
|
169
179
|
}
|
|
170
180
|
|
|
181
|
+
function showFocusOptions() {
|
|
182
|
+
if (!showOptionsOnFocus) {
|
|
183
|
+
return;
|
|
184
|
+
}
|
|
185
|
+
clearSearchTimer();
|
|
186
|
+
abortActiveSearch();
|
|
187
|
+
options = [...focusOptions];
|
|
188
|
+
showingFocusOptions = true;
|
|
189
|
+
}
|
|
190
|
+
|
|
171
191
|
async function runSearch(query: string) {
|
|
192
|
+
showingFocusOptions = false;
|
|
172
193
|
const trimmed = normalizeDropdownSearchValue(query);
|
|
173
194
|
|
|
174
195
|
if (!trimmed || trimmed.length < minLength) {
|
|
@@ -259,6 +280,7 @@
|
|
|
259
280
|
function handleInputValue(nextValue: string) {
|
|
260
281
|
clearBlurTimer();
|
|
261
282
|
focused = true;
|
|
283
|
+
showingFocusOptions = false;
|
|
262
284
|
inputValue = nextValue;
|
|
263
285
|
resetSearchState(nextValue);
|
|
264
286
|
scheduleSearch(nextValue);
|
|
@@ -282,6 +304,7 @@
|
|
|
282
304
|
function handleFocus() {
|
|
283
305
|
clearBlurTimer();
|
|
284
306
|
focused = true;
|
|
307
|
+
showFocusOptions();
|
|
285
308
|
}
|
|
286
309
|
|
|
287
310
|
function handleBlur(event: FocusEvent) {
|
|
@@ -289,6 +312,9 @@
|
|
|
289
312
|
clearBlurTimer();
|
|
290
313
|
blurTimer = setTimeout(() => {
|
|
291
314
|
focused = document.activeElement === inputElement;
|
|
315
|
+
if (!focused) {
|
|
316
|
+
showingFocusOptions = false;
|
|
317
|
+
}
|
|
292
318
|
blurTimer = undefined;
|
|
293
319
|
}, 120);
|
|
294
320
|
}
|
|
@@ -321,6 +347,7 @@
|
|
|
321
347
|
|
|
322
348
|
clearSearchTimer();
|
|
323
349
|
abortActiveSearch();
|
|
350
|
+
showingFocusOptions = false;
|
|
324
351
|
selectedItem = item;
|
|
325
352
|
exactMatch = validate ? item : null;
|
|
326
353
|
value = getItemValue(item);
|
|
@@ -426,6 +453,7 @@
|
|
|
426
453
|
}
|
|
427
454
|
exactMatch = null;
|
|
428
455
|
options = [];
|
|
456
|
+
showingFocusOptions = false;
|
|
429
457
|
setStatus(
|
|
430
458
|
resolveDropdownSearchStatus({
|
|
431
459
|
value,
|
|
@@ -438,6 +466,7 @@
|
|
|
438
466
|
}),
|
|
439
467
|
);
|
|
440
468
|
focused = true;
|
|
469
|
+
showFocusOptions();
|
|
441
470
|
emitChange();
|
|
442
471
|
inputElement?.focus();
|
|
443
472
|
}
|
|
@@ -445,6 +474,11 @@
|
|
|
445
474
|
function handleIncomingValue(nextValue: string) {
|
|
446
475
|
inputValue = nextValue;
|
|
447
476
|
|
|
477
|
+
if (showOptionsOnFocus && focused) {
|
|
478
|
+
showFocusOptions();
|
|
479
|
+
return;
|
|
480
|
+
}
|
|
481
|
+
|
|
448
482
|
if (searchOnExternalValueChange) {
|
|
449
483
|
handleExternalValue(nextValue);
|
|
450
484
|
return;
|
|
@@ -492,6 +526,9 @@
|
|
|
492
526
|
});
|
|
493
527
|
|
|
494
528
|
onMount(() => {
|
|
529
|
+
if (showOptionsOnFocus && focused) {
|
|
530
|
+
showFocusOptions();
|
|
531
|
+
}
|
|
495
532
|
if (searchOnExternalValueChange && normalizeDropdownSearchValue(value)) {
|
|
496
533
|
handleExternalValue(value);
|
|
497
534
|
}
|
|
@@ -631,6 +668,9 @@
|
|
|
631
668
|
<div class="suu-dropdown-search__empty">{resolvedNoResultsText}</div>
|
|
632
669
|
{/if}
|
|
633
670
|
</div>
|
|
671
|
+
{#if footerText?.trim()}
|
|
672
|
+
<div class="suu-dropdown-search__footer" role="note">{footerText}</div>
|
|
673
|
+
{/if}
|
|
634
674
|
</div>
|
|
635
675
|
{/if}
|
|
636
676
|
</div>
|
|
@@ -25,6 +25,9 @@ declare const DropdownSearch: $$__sveltets_2_IsomorphicComponent<{
|
|
|
25
25
|
minLength?: number;
|
|
26
26
|
validate?: boolean;
|
|
27
27
|
closeOnValid?: boolean;
|
|
28
|
+
showOptionsOnFocus?: boolean;
|
|
29
|
+
focusOptions?: DropdownSearchItem[];
|
|
30
|
+
footerText?: string | undefined;
|
|
28
31
|
loadOptions: DropdownSearchLoadOptions;
|
|
29
32
|
id?: string | undefined;
|
|
30
33
|
name?: string | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownSearch.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/DropdownSearch.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAAiB,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAM5D,OAAO,KAAK,EACR,0BAA0B,EAC1B,yBAAyB,EACzB,kBAAkB,EAClB,6BAA6B,EAC7B,yBAAyB,EACzB,qCAAqC,EACrC,wCAAwC,EACxC,oBAAoB,EACrB,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownSearch.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/DropdownSearch.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAAiB,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAM5D,OAAO,KAAK,EACR,0BAA0B,EAC1B,yBAAyB,EACzB,kBAAkB,EAClB,6BAA6B,EAC7B,yBAAyB,EACzB,qCAAqC,EACrC,wCAAwC,EACxC,oBAAoB,EACrB,MAAM,YAAY,CAAC;AA2lBtB,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,cAAc;;mBAdihC,kBAAkB,GAAG,IAAI;oBAAkB,kBAAkB,EAAE;aAAW,oBAAoB;;;;;;;;;mBAAyR,kBAAkB,EAAE;iBAAe,MAAM,GAAG,SAAS;iBAAe,yBAAyB;SAAO,MAAM,GAAG,SAAS;WAAS,MAAM,GAAG,SAAS;gBAAc,MAAM,GAAG,SAAS;gBAAc,MAAM,GAAG,SAAS;;eAAyC,UAAU;oBAAkB,MAAM,GAAG,SAAS;kBAAgB,MAAM,GAAG,SAAS;iBAAe,MAAM,GAAG,SAAS;;YAA4E,MAAM,GAAG,SAAS;eAAa,MAAM,GAAG,SAAS;eAAa,MAAM,GAAG,SAAS;;8BAA8E,qCAAqC,GAChhE,SAAS;mBAAiB,6BAA6B;eAAe,CAAC,CAAC,MAAM,EAAE,0BAA0B,KAAK,IAAI,CAAC,GACpH,SAAS;eAAa,CAAC,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC,GAAG,SAAS;iBAAe,CAAC,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC,GAAG,SAAS;4BAA4B,wCAAwC,GACzM,SAAS;qBAAqB,CAAC,CAAC,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC,GACtE,SAAS;kBAAgB,CAAC,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC,GAAG,SAAS;cAAY,CAAC,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC,GAAG,SAAS;;;;;kBAU1C,CAAC;AAClF,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,eAAe,cAAc,CAAC"}
|
package/dist/style.css
CHANGED
|
@@ -436,6 +436,14 @@
|
|
|
436
436
|
background: color-mix(in srgb, var(--suu-color-accent) 8%, var(--suu-color-bg));
|
|
437
437
|
}
|
|
438
438
|
|
|
439
|
+
.suu-dropdown-search__footer {
|
|
440
|
+
border-top: 1px solid var(--suu-color-border);
|
|
441
|
+
padding: 9px 10px;
|
|
442
|
+
background: var(--suu-color-bg);
|
|
443
|
+
color: var(--suu-color-muted);
|
|
444
|
+
font-size: 0.875em;
|
|
445
|
+
}
|
|
446
|
+
|
|
439
447
|
.suu-dropdown-search__check {
|
|
440
448
|
display: inline-grid;
|
|
441
449
|
grid-row: 1 / span 2;
|
|
@@ -1154,6 +1162,7 @@
|
|
|
1154
1162
|
position: absolute;
|
|
1155
1163
|
top: calc(100% + 6px);
|
|
1156
1164
|
right: 0;
|
|
1165
|
+
left: auto;
|
|
1157
1166
|
z-index: 100;
|
|
1158
1167
|
min-width: 100%;
|
|
1159
1168
|
overflow: hidden;
|
|
@@ -1163,6 +1172,16 @@
|
|
|
1163
1172
|
box-shadow: 0 18px 42px rgb(15 23 42 / 0.16);
|
|
1164
1173
|
}
|
|
1165
1174
|
|
|
1175
|
+
.suu-dropdown__menu--left {
|
|
1176
|
+
right: auto;
|
|
1177
|
+
left: 0;
|
|
1178
|
+
}
|
|
1179
|
+
|
|
1180
|
+
.suu-dropdown__menu--right {
|
|
1181
|
+
right: 0;
|
|
1182
|
+
left: auto;
|
|
1183
|
+
}
|
|
1184
|
+
|
|
1166
1185
|
.suu-dropdown__menu--up {
|
|
1167
1186
|
top: auto;
|
|
1168
1187
|
bottom: calc(100% + 6px);
|
package/package.json
CHANGED