simplesvelte 2.4.9 → 2.4.12
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/Input.svelte +145 -141
- package/dist/Select.svelte +9 -0
- package/package.json +22 -22
package/dist/Input.svelte
CHANGED
|
@@ -1,141 +1,145 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import { SvelteDate } from 'svelte/reactivity'
|
|
3
|
-
import Label from './Label.svelte'
|
|
4
|
-
type Props = {
|
|
5
|
-
value?: any
|
|
6
|
-
name?: string
|
|
7
|
-
label?: string
|
|
8
|
-
class?: string
|
|
9
|
-
required?: boolean
|
|
10
|
-
disabled?: boolean
|
|
11
|
-
element?: HTMLElement
|
|
12
|
-
type?:
|
|
13
|
-
| 'text'
|
|
14
|
-
| 'number'
|
|
15
|
-
| 'password'
|
|
16
|
-
| 'email'
|
|
17
|
-
| 'number'
|
|
18
|
-
| 'tel'
|
|
19
|
-
| 'url'
|
|
20
|
-
| 'date'
|
|
21
|
-
| 'datetime-local'
|
|
22
|
-
| 'color'
|
|
23
|
-
| 'file'
|
|
24
|
-
| 'checkbox'
|
|
25
|
-
error?: string
|
|
26
|
-
hideOptional?: boolean
|
|
27
|
-
zodErrors?: {
|
|
28
|
-
expected: string
|
|
29
|
-
code: string
|
|
30
|
-
path: string[]
|
|
31
|
-
message: string
|
|
32
|
-
}[]
|
|
33
|
-
[x: string]: any
|
|
34
|
-
}
|
|
35
|
-
let {
|
|
36
|
-
value = $bindable(),
|
|
37
|
-
element = $bindable(),
|
|
38
|
-
label,
|
|
39
|
-
type = 'text',
|
|
40
|
-
name,
|
|
41
|
-
required,
|
|
42
|
-
disabled,
|
|
43
|
-
class: myClass,
|
|
44
|
-
error,
|
|
45
|
-
hideOptional,
|
|
46
|
-
zodErrors,
|
|
47
|
-
...rest
|
|
48
|
-
}: Props = $props()
|
|
49
|
-
function getValue() {
|
|
50
|
-
if (type == 'date') {
|
|
51
|
-
if (!value) return ''
|
|
52
|
-
const dateString = new Date(value).toISOString().split('T')[0]
|
|
53
|
-
return dateString
|
|
54
|
-
} else if (type == 'datetime-local') {
|
|
55
|
-
if (!value) return ''
|
|
56
|
-
const date = new Date(value)
|
|
57
|
-
const dateString = new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1)
|
|
58
|
-
return dateString
|
|
59
|
-
}
|
|
60
|
-
return value ?? ''
|
|
61
|
-
}
|
|
62
|
-
function setValue(newValue: any) {
|
|
63
|
-
if (type == 'number') {
|
|
64
|
-
if (isNaN(Number(newValue))) {
|
|
65
|
-
value = null
|
|
66
|
-
} else {
|
|
67
|
-
value = Number(newValue)
|
|
68
|
-
}
|
|
69
|
-
} else if (type == 'date') {
|
|
70
|
-
const date = new SvelteDate(newValue)
|
|
71
|
-
if (isNaN(date.getTime())) {
|
|
72
|
-
value = null
|
|
73
|
-
} else {
|
|
74
|
-
date.setUTCHours(0, 0, 0, 0)
|
|
75
|
-
value = date
|
|
76
|
-
}
|
|
77
|
-
} else if (type == 'datetime-local') {
|
|
78
|
-
const date = new SvelteDate(newValue)
|
|
79
|
-
if (isNaN(date.getTime())) {
|
|
80
|
-
value = null
|
|
81
|
-
} else {
|
|
82
|
-
date.setSeconds(0, 0)
|
|
83
|
-
value = date
|
|
84
|
-
}
|
|
85
|
-
} else {
|
|
86
|
-
value = newValue
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
// File input handlers - FileList is readonly
|
|
91
|
-
function getFiles() {
|
|
92
|
-
return value
|
|
93
|
-
}
|
|
94
|
-
function setFiles(fileList: FileList | null) {
|
|
95
|
-
// FileList is readonly, so we just set it directly
|
|
96
|
-
value = fileList
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
let inputClass = $derived.by(() => {
|
|
100
|
-
if (type == 'file') return 'file-input w-full'
|
|
101
|
-
if (type == 'checkbox') return 'checkbox checkbox-lg'
|
|
102
|
-
return 'input w-full'
|
|
103
|
-
})
|
|
104
|
-
|
|
105
|
-
let showOptional = $derived.by(() => {
|
|
106
|
-
if (hideOptional) return false
|
|
107
|
-
return !required && !disabled && type != 'checkbox'
|
|
108
|
-
})
|
|
109
|
-
|
|
110
|
-
const errorText = $derived.by(() => {
|
|
111
|
-
if (error) return error
|
|
112
|
-
if (!name) return undefined
|
|
113
|
-
if (zodErrors) return zodErrors.find((e) => e.path.includes(name))?.message
|
|
114
|
-
return undefined
|
|
115
|
-
})
|
|
116
|
-
</script>
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
{
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
{
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
{
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { SvelteDate } from 'svelte/reactivity'
|
|
3
|
+
import Label from './Label.svelte'
|
|
4
|
+
type Props = {
|
|
5
|
+
value?: any
|
|
6
|
+
name?: string
|
|
7
|
+
label?: string
|
|
8
|
+
class?: string
|
|
9
|
+
required?: boolean
|
|
10
|
+
disabled?: boolean
|
|
11
|
+
element?: HTMLElement
|
|
12
|
+
type?:
|
|
13
|
+
| 'text'
|
|
14
|
+
| 'number'
|
|
15
|
+
| 'password'
|
|
16
|
+
| 'email'
|
|
17
|
+
| 'number'
|
|
18
|
+
| 'tel'
|
|
19
|
+
| 'url'
|
|
20
|
+
| 'date'
|
|
21
|
+
| 'datetime-local'
|
|
22
|
+
| 'color'
|
|
23
|
+
| 'file'
|
|
24
|
+
| 'checkbox'
|
|
25
|
+
error?: string
|
|
26
|
+
hideOptional?: boolean
|
|
27
|
+
zodErrors?: {
|
|
28
|
+
expected: string
|
|
29
|
+
code: string
|
|
30
|
+
path: string[]
|
|
31
|
+
message: string
|
|
32
|
+
}[]
|
|
33
|
+
[x: string]: any
|
|
34
|
+
}
|
|
35
|
+
let {
|
|
36
|
+
value = $bindable(),
|
|
37
|
+
element = $bindable(),
|
|
38
|
+
label,
|
|
39
|
+
type = 'text',
|
|
40
|
+
name,
|
|
41
|
+
required,
|
|
42
|
+
disabled,
|
|
43
|
+
class: myClass,
|
|
44
|
+
error,
|
|
45
|
+
hideOptional,
|
|
46
|
+
zodErrors,
|
|
47
|
+
...rest
|
|
48
|
+
}: Props = $props()
|
|
49
|
+
function getValue() {
|
|
50
|
+
if (type == 'date') {
|
|
51
|
+
if (!value) return ''
|
|
52
|
+
const dateString = new Date(value).toISOString().split('T')[0]
|
|
53
|
+
return dateString
|
|
54
|
+
} else if (type == 'datetime-local') {
|
|
55
|
+
if (!value) return ''
|
|
56
|
+
const date = new Date(value)
|
|
57
|
+
const dateString = new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1)
|
|
58
|
+
return dateString
|
|
59
|
+
}
|
|
60
|
+
return value ?? ''
|
|
61
|
+
}
|
|
62
|
+
function setValue(newValue: any) {
|
|
63
|
+
if (type == 'number') {
|
|
64
|
+
if (isNaN(Number(newValue))) {
|
|
65
|
+
value = null
|
|
66
|
+
} else {
|
|
67
|
+
value = Number(newValue)
|
|
68
|
+
}
|
|
69
|
+
} else if (type == 'date') {
|
|
70
|
+
const date = new SvelteDate(newValue)
|
|
71
|
+
if (isNaN(date.getTime())) {
|
|
72
|
+
value = null
|
|
73
|
+
} else {
|
|
74
|
+
date.setUTCHours(0, 0, 0, 0)
|
|
75
|
+
value = date
|
|
76
|
+
}
|
|
77
|
+
} else if (type == 'datetime-local') {
|
|
78
|
+
const date = new SvelteDate(newValue)
|
|
79
|
+
if (isNaN(date.getTime())) {
|
|
80
|
+
value = null
|
|
81
|
+
} else {
|
|
82
|
+
date.setSeconds(0, 0)
|
|
83
|
+
value = date
|
|
84
|
+
}
|
|
85
|
+
} else {
|
|
86
|
+
value = newValue
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
// File input handlers - FileList is readonly
|
|
91
|
+
function getFiles() {
|
|
92
|
+
return value
|
|
93
|
+
}
|
|
94
|
+
function setFiles(fileList: FileList | null) {
|
|
95
|
+
// FileList is readonly, so we just set it directly
|
|
96
|
+
value = fileList
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
let inputClass = $derived.by(() => {
|
|
100
|
+
if (type == 'file') return 'file-input w-full'
|
|
101
|
+
if (type == 'checkbox') return 'checkbox checkbox-lg'
|
|
102
|
+
return 'input w-full'
|
|
103
|
+
})
|
|
104
|
+
|
|
105
|
+
let showOptional = $derived.by(() => {
|
|
106
|
+
if (hideOptional) return false
|
|
107
|
+
return !required && !disabled && type != 'checkbox'
|
|
108
|
+
})
|
|
109
|
+
|
|
110
|
+
const errorText = $derived.by(() => {
|
|
111
|
+
if (error) return error
|
|
112
|
+
if (!name) return undefined
|
|
113
|
+
if (zodErrors) return zodErrors.find((e) => e.path.includes(name))?.message
|
|
114
|
+
return undefined
|
|
115
|
+
})
|
|
116
|
+
</script>
|
|
117
|
+
|
|
118
|
+
{#if type != 'file'}
|
|
119
|
+
<input type="hidden" {name} value={value ?? ''} />
|
|
120
|
+
{/if}
|
|
121
|
+
|
|
122
|
+
<Label class={myClass} {label} {name} optional={showOptional} {disabled} error={errorText}>
|
|
123
|
+
{#if type == 'checkbox'}
|
|
124
|
+
<input bind:this={element} type="checkbox" {disabled} class={inputClass} {...rest} bind:checked={value} />
|
|
125
|
+
{:else if type == 'file'}
|
|
126
|
+
<input
|
|
127
|
+
bind:this={element}
|
|
128
|
+
{name}
|
|
129
|
+
type="file"
|
|
130
|
+
{disabled}
|
|
131
|
+
{required}
|
|
132
|
+
class={inputClass}
|
|
133
|
+
{...rest}
|
|
134
|
+
bind:files={getFiles, setFiles} />
|
|
135
|
+
{:else}
|
|
136
|
+
<input
|
|
137
|
+
bind:this={element}
|
|
138
|
+
{type}
|
|
139
|
+
{disabled}
|
|
140
|
+
{required}
|
|
141
|
+
class="disabled:text-base-content disabled:!border-base-content/20 {inputClass} "
|
|
142
|
+
{...rest}
|
|
143
|
+
bind:value={getValue, setValue} />
|
|
144
|
+
{/if}
|
|
145
|
+
</Label>
|
package/dist/Select.svelte
CHANGED
|
@@ -470,6 +470,15 @@
|
|
|
470
470
|
}
|
|
471
471
|
</script>
|
|
472
472
|
|
|
473
|
+
<!-- Data inputs for form submission -->
|
|
474
|
+
{#if multiple && Array.isArray(normalizedValue)}
|
|
475
|
+
{#each normalizedValue as val, i (val + '-' + i)}
|
|
476
|
+
<input type="hidden" {name} value={val} />
|
|
477
|
+
{/each}
|
|
478
|
+
{:else if !multiple && normalizedValue !== undefined && normalizedValue !== null && normalizedValue !== ''}
|
|
479
|
+
<input type="hidden" {name} value={normalizedValue} />
|
|
480
|
+
{/if}
|
|
481
|
+
|
|
473
482
|
<Label {label} {name} optional={!required && !hideOptional} class={className} error={errorText}>
|
|
474
483
|
{#if !disabled}
|
|
475
484
|
<!-- Trigger button with popover target and anchor positioning -->
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "simplesvelte",
|
|
3
|
-
"version": "2.4.
|
|
3
|
+
"version": "2.4.12",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"dev": "bun vite dev",
|
|
6
6
|
"build": "bun vite build && bun run prepack",
|
|
@@ -30,38 +30,38 @@
|
|
|
30
30
|
}
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
|
-
"ag-grid-enterprise": "^
|
|
33
|
+
"ag-grid-enterprise": "^35.1.0",
|
|
34
34
|
"svelte": "^5.0.0",
|
|
35
|
-
"sweetalert2": "^11.
|
|
35
|
+
"sweetalert2": "^11.26.21"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@eslint/compat": "^
|
|
39
|
-
"@eslint/js": "^
|
|
40
|
-
"@sveltejs/adapter-cloudflare": "^7.2.
|
|
41
|
-
"@sveltejs/kit": "^2.
|
|
38
|
+
"@eslint/compat": "^2.0.2",
|
|
39
|
+
"@eslint/js": "^10.0.1",
|
|
40
|
+
"@sveltejs/adapter-cloudflare": "^7.2.8",
|
|
41
|
+
"@sveltejs/kit": "^2.53.4",
|
|
42
42
|
"@sveltejs/package": "^2.5.7",
|
|
43
43
|
"@sveltejs/vite-plugin-svelte": "^6.2.4",
|
|
44
|
-
"@tailwindcss/cli": "^4.1
|
|
45
|
-
"@tailwindcss/vite": "^4.1
|
|
44
|
+
"@tailwindcss/cli": "^4.2.1",
|
|
45
|
+
"@tailwindcss/vite": "^4.2.1",
|
|
46
46
|
"@testing-library/svelte": "^5.3.1",
|
|
47
47
|
"@testing-library/user-event": "^14.6.1",
|
|
48
|
-
"daisyui": "^5.5.
|
|
49
|
-
"eslint": "^
|
|
48
|
+
"daisyui": "^5.5.19",
|
|
49
|
+
"eslint": "^10.0.2",
|
|
50
50
|
"eslint-config-prettier": "^10.1.8",
|
|
51
|
-
"eslint-plugin-svelte": "^3.
|
|
52
|
-
"globals": "^
|
|
53
|
-
"jsdom": "^
|
|
51
|
+
"eslint-plugin-svelte": "^3.15.0",
|
|
52
|
+
"globals": "^17.4.0",
|
|
53
|
+
"jsdom": "^28.1.0",
|
|
54
54
|
"prettier": "^3.8.1",
|
|
55
|
-
"prettier-plugin-svelte": "^3.
|
|
56
|
-
"prettier-plugin-tailwindcss": "^0.
|
|
57
|
-
"publint": "^0.3.
|
|
58
|
-
"svelte": "^5.
|
|
59
|
-
"svelte-check": "^4.
|
|
60
|
-
"tailwindcss": "^4.1
|
|
55
|
+
"prettier-plugin-svelte": "^3.5.1",
|
|
56
|
+
"prettier-plugin-tailwindcss": "^0.7.2",
|
|
57
|
+
"publint": "^0.3.18",
|
|
58
|
+
"svelte": "^5.53.7",
|
|
59
|
+
"svelte-check": "^4.4.4",
|
|
60
|
+
"tailwindcss": "^4.2.1",
|
|
61
61
|
"typescript": "^5.9.3",
|
|
62
|
-
"typescript-eslint": "^8.
|
|
62
|
+
"typescript-eslint": "^8.56.1",
|
|
63
63
|
"vite": "^7.3.1",
|
|
64
|
-
"vitest": "^
|
|
64
|
+
"vitest": "^4.0.18"
|
|
65
65
|
},
|
|
66
66
|
"keywords": [
|
|
67
67
|
"svelte"
|