svelte-5-select 1.0.0-beta.0 → 1.0.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.
Files changed (3) hide show
  1. package/README.md +1 -1
  2. package/dist/Select.svelte +34 -7
  3. package/package.json +97 -85
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  <div style="text-align: center;">
2
- <img src="https://raw.githubusercontent.com/rob-balfre/svelte-select/master/svelte-select.png" alt="Svelte Select" width="150" />
2
+ <img src="https://raw.githubusercontent.com/IDontKnowMyUsername/svelte-5-select/master/svelte-select.png" alt="Svelte 5 Select" width="150" />
3
3
  <h1>Svelte 5 Select</h1>
4
4
  </div>
5
5
  <div style="text-align: center;">
package/dist/Select.svelte CHANGED
@@ -401,7 +401,8 @@
401
401
  $effect(() => {
402
402
  // Watch both filterText and loadOptionsDeps for changes
403
403
  const currentFilterText = filterText;
404
- loadOptionsDeps.forEach(dep => dep);
404
+ // Properly track loadOptionsDeps by creating a new array (forces reading each value)
405
+ const currentDeps = [...loadOptionsDeps];
405
406
 
406
407
  if (loadOptions && !disabled) {
407
408
  // Use untrack to prevent infinite loops when setting items/value/loading
@@ -437,6 +438,10 @@
437
438
 
438
439
  if (!valueExists) {
439
440
  value = multiple ? [] : undefined;
441
+ // Also clear justValue when using useJustValue mode
442
+ if (useJustValue) {
443
+ justValue = multiple ? [] : '';
444
+ }
440
445
  }
441
446
  } else if (value && (!items || items.length === 0)) {
442
447
  // Clear value if items is empty
@@ -467,6 +472,17 @@
467
472
  if (currentFilterText.length > 0 && !listOpen) {
468
473
  listOpen = true;
469
474
  }
475
+ } else if (loadOptions && disabled) {
476
+ // When disabled and using loadOptions, clear the value and items
477
+ untrack(() => {
478
+ if (value || (useJustValue && justValue)) {
479
+ value = multiple ? [] : undefined;
480
+ if (useJustValue) {
481
+ justValue = multiple ? [] : '';
482
+ }
483
+ }
484
+ items = null;
485
+ });
470
486
  }
471
487
  });
472
488
 
@@ -653,26 +669,37 @@
653
669
  }
654
670
 
655
671
  function computeJustValue(): any {
656
- if (useJustValue && !value && !clearState) { // Change back to value
672
+ const hasJustValue = multiple
673
+ ? (Array.isArray(justValue) && justValue.length > 0)
674
+ : (justValue !== '' && justValue != null);
675
+
676
+ if (useJustValue && !value && !clearState && hasJustValue) {
677
+ // Lookup justValue in items and set value
657
678
  const typedItems = (items as SelectItem[]) || [];
658
679
  if (multiple) {
659
680
  value = typedItems.filter((item: SelectItem) =>
660
681
  justValue.includes((item as Record<string, any>)[itemId])
661
682
  );
662
683
  } else {
663
- value = typedItems.filter((item: SelectItem) => // Change back to value
684
+ value = typedItems.filter((item: SelectItem) =>
664
685
  (item as Record<string, any>)[itemId] === justValue
665
686
  )[0];
666
687
  }
667
688
  }
668
689
 
690
+ // Capture clearState before resetting it
691
+ const wasClearing = clearState;
669
692
  clearState = false;
670
693
 
694
+ // Preserve justValue when in useJustValue mode with no value
695
+ // BUT allow clearing when user clicked clear button
696
+ if (useJustValue && !value && !wasClearing) {
697
+ return justValue;
698
+ }
699
+
671
700
  // Handle multiple selection
672
701
  if (multiple && Array.isArray(value)) {
673
- return value ? value.map((item: SelectItem) =>
674
- (item as Record<string, any>)[itemId]
675
- ) : null;
702
+ return value.map((item: SelectItem) => item[itemId]);
676
703
  }
677
704
 
678
705
  // Handle single selection
@@ -680,7 +707,7 @@
680
707
  return value;
681
708
  }
682
709
 
683
- return (value as Record<string, any>)[itemId];
710
+ return value[itemId];
684
711
  }
685
712
 
686
713
  function checkValueForDuplicates(): boolean {
package/package.json CHANGED
@@ -1,86 +1,98 @@
1
1
  {
2
- "name": "svelte-5-select",
3
- "version": "1.0.0-beta.0",
4
- "publishConfig": {
5
- "access": "public"
6
- },
7
- "repository": "https://github.com/IDontKnowMyUsername/svelte-5-select.git",
8
- "description": "A <Select> component for Svelte 5 apps",
9
- "devDependencies": {
10
- "@sveltejs/adapter-auto": "7.0.0",
11
- "@sveltejs/adapter-static": "3.0.10",
12
- "@sveltejs/kit": "2.47.3",
13
- "@sveltejs/package": "^2.5.4",
14
- "@sveltejs/vite-plugin-svelte": "6.2.1",
15
- "@testing-library/svelte": "^5.2.8",
16
- "@testing-library/user-event": "^14.6.1",
17
- "@vitest/coverage-v8": "^3.2.4",
18
- "@vitest/ui": "^3.2.4",
19
- "autoprefixer": "^10.4.21",
20
- "cross-env": "^10.1.0",
21
- "find-in-files": "^0.5.0",
22
- "fuse.js": "^7.1.0",
23
- "happy-dom": "^20.0.8",
24
- "npm-check-updates": "^19.1.1",
25
- "prettier": "~3.6.2",
26
- "prettier-plugin-svelte": "^3.4.0",
27
- "release-it": "^19.0.5",
28
- "svelte-check": "^4.3.3",
29
- "svelte-highlight": "^7.9.0",
30
- "svelte-preprocess": "^6.0.3",
31
- "svelte-virtual-list": "^3.0.1",
32
- "svelte2tsx": "^0.7.45",
33
- "tsx": "^4.20.6",
34
- "typescript": "^5.9.3",
35
- "vite": "^7.1.12",
36
- "vitest": "^3.2.4"
37
- },
38
- "author": "https://github.com/IDontKnowMyUsername/svelte-5-select, https://github.com/kodaicoder, Robert Balfré <rob.balfre@gmail.com> (https://github.com/rob-balfre)",
39
- "license": "ISC",
40
- "homepage": "https://github.com/IDontKnowMyUsername/svelte-5-select#readme",
41
- "bugs": {
42
- "url": "https://github.com/IDontKnowMyUsername/svelte-5-select/issues"
43
- },
44
- "keywords": [
45
- "svelte",
46
- "svelte5",
47
- "select",
48
- "dropdown",
49
- "component",
50
- "select-component"
51
- ],
52
- "type": "module",
53
- "exports": {
54
- ".": {
55
- "types": "./dist/index.d.ts",
56
- "svelte": "./dist/index.js"
57
- }
58
- },
59
- "svelte": "./dist/index.js",
60
- "files": [
61
- "dist"
62
- ],
63
- "peerDependencies": {
64
- "svelte": "^5.41.2"
65
- },
66
- "dependencies": {
67
- "@floating-ui/dom": "^1.7.4",
68
- "svelte-floating-ui": "1.6.2"
69
- },
70
- "scripts": {
71
- "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
72
- "dev": "vite dev",
73
- "build": "vite build",
74
- "build:lib": "vite build --config vite.lib.config.ts",
75
- "coverage": "vitest run --coverage",
76
- "preview": "vite preview",
77
- "test": "vitest",
78
- "test:ui": "vitest --ui",
79
- "test:run": "vitest run",
80
- "gen:docs": "node docs/generate_theming_variables_md.cjs",
81
- "package": "svelte-kit sync && svelte-package",
82
- "preprepare": "tsx src/remove-styles.ts",
83
- "postprepare": "tsx src/post-prepare.ts && npm run gen:docs",
84
- "release": "release-it"
85
- }
86
- }
2
+ "name": "svelte-5-select",
3
+ "version": "1.0.0-beta.1",
4
+ "publishConfig": {
5
+ "access": "public"
6
+ },
7
+ "repository": "https://github.com/IDontKnowMyUsername/svelte-5-select.git",
8
+ "description": "A <Select> component for Svelte 5 apps",
9
+ "scripts": {
10
+ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
11
+ "dev": "vite dev",
12
+ "build": "vite build",
13
+ "build:lib": "vite build --config vite.lib.config.ts",
14
+ "coverage": "vitest run --coverage",
15
+ "preview": "vite preview",
16
+ "test": "vitest",
17
+ "test:ui": "vitest --ui",
18
+ "test:run": "vitest run",
19
+ "gen:docs": "node docs/generate_theming_variables_md.cjs",
20
+ "package": "svelte-kit sync && svelte-package",
21
+ "preprepare": "tsx src/remove-styles.ts",
22
+ "prepare": "svelte-package",
23
+ "postprepare": "tsx src/post-prepare.ts && npm run gen:docs",
24
+ "release": "release-it"
25
+ },
26
+ "devDependencies": {
27
+ "@sveltejs/adapter-auto": "7.0.0",
28
+ "@sveltejs/adapter-static": "3.0.10",
29
+ "@sveltejs/kit": "2.48.2",
30
+ "@sveltejs/package": "^2.5.4",
31
+ "@sveltejs/vite-plugin-svelte": "6.2.1",
32
+ "@testing-library/svelte": "^5.2.8",
33
+ "@testing-library/user-event": "^14.6.1",
34
+ "@vitest/coverage-v8": "^3.2.4",
35
+ "@vitest/ui": "^3.2.4",
36
+ "autoprefixer": "^10.4.21",
37
+ "cross-env": "^10.1.0",
38
+ "find-in-files": "^0.5.0",
39
+ "fuse.js": "^7.1.0",
40
+ "happy-dom": "^20.0.8",
41
+ "npm-check-updates": "^19.1.2",
42
+ "postcss": "^8.5.6",
43
+ "postcss-load-config": "^6.0.1",
44
+ "prettier": "~3.6.2",
45
+ "prettier-plugin-svelte": "^3.4.0",
46
+ "release-it": "^19.0.5",
47
+ "svelte-check": "^4.3.3",
48
+ "svelte-highlight": "^7.9.0",
49
+ "svelte-preprocess": "^6.0.3",
50
+ "sveltekit-superforms": "^2.28.0",
51
+ "svelte-virtual-list": "^3.0.1",
52
+ "svelte2tsx": "^0.7.45",
53
+ "tsx": "^4.20.6",
54
+ "typescript": "^5.9.3",
55
+ "vite": "^7.1.12",
56
+ "vitest": "^3.2.4",
57
+ "zod": "^3.25.76"
58
+ },
59
+ "author": "https://github.com/IDontKnowMyUsername/svelte-5-select, https://github.com/kodaicoder, Robert Balfré <rob.balfre@gmail.com> (https://github.com/rob-balfre)",
60
+ "license": "ISC",
61
+ "homepage": "https://github.com/IDontKnowMyUsername/svelte-5-select#readme",
62
+ "bugs": {
63
+ "url": "https://github.com/IDontKnowMyUsername/svelte-5-select/issues"
64
+ },
65
+ "keywords": [
66
+ "svelte",
67
+ "svelte5",
68
+ "select",
69
+ "dropdown",
70
+ "component",
71
+ "select-component"
72
+ ],
73
+ "type": "module",
74
+ "exports": {
75
+ ".": {
76
+ "types": "./dist/index.d.ts",
77
+ "svelte": "./dist/index.js"
78
+ }
79
+ },
80
+ "svelte": "./dist/index.js",
81
+ "files": [
82
+ "dist"
83
+ ],
84
+ "peerDependencies": {
85
+ "svelte": "^5.41.2",
86
+ "tailwindcss": "^4.1.16"
87
+ },
88
+ "peerDependenciesMeta": {
89
+ "tailwindcss": {
90
+ "optional": true
91
+ }
92
+ },
93
+ "dependencies": {
94
+ "@floating-ui/dom": "^1.7.4",
95
+ "svelte-floating-ui": "1.6.2"
96
+ },
97
+ "packageManager": "pnpm@10.20.0"
98
+ }