@lavalogic/scoria 0.4.1 → 0.4.3
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/Components/DragMenu/DraggableCard.svelte +41 -11
- package/dist/Components/DragMenu/DraggableCard.svelte.d.ts +1 -0
- package/dist/Components/Table/Body/Rows/Columns/TableQuerySelect.svelte +5 -1
- package/dist/Components/Table/Body/Rows/Columns/TableSelect.svelte +5 -1
- package/package.json +24 -24
|
@@ -7,12 +7,15 @@
|
|
|
7
7
|
subtitle: string;
|
|
8
8
|
index: number;
|
|
9
9
|
|
|
10
|
+
touch?: boolean;
|
|
10
11
|
selected?: boolean; // default false
|
|
11
12
|
disabled?: boolean; // default false
|
|
12
13
|
}
|
|
13
14
|
</script>
|
|
14
15
|
|
|
15
16
|
<script lang="ts">
|
|
17
|
+
import { Size } from '../../Types/Internal/Size.js';
|
|
18
|
+
|
|
16
19
|
import Checkbox from '../Checkbox.svelte';
|
|
17
20
|
|
|
18
21
|
let {
|
|
@@ -21,22 +24,29 @@
|
|
|
21
24
|
subtitle,
|
|
22
25
|
index,
|
|
23
26
|
selected = $bindable(false),
|
|
27
|
+
touch = false,
|
|
24
28
|
disabled = false
|
|
25
29
|
}: DraggableCardProps = $props();
|
|
26
30
|
</script>
|
|
27
31
|
|
|
28
|
-
<div class="card">
|
|
32
|
+
<div class="card" class:touch>
|
|
29
33
|
{#if selectable}
|
|
30
|
-
<
|
|
34
|
+
<div class="limit-size" class:touch>
|
|
35
|
+
<Checkbox value={selected} onchange={() => (selected = !selected)} />
|
|
36
|
+
</div>
|
|
31
37
|
{/if}
|
|
32
|
-
<div class="text">
|
|
33
|
-
<span class="title">{title}</span>
|
|
34
|
-
<span class="subtitle">{subtitle}</span>
|
|
38
|
+
<div class="text" class:touch>
|
|
39
|
+
<span class="title" class:touch>{title}</span>
|
|
40
|
+
<span class="subtitle" class:touch>{subtitle}</span>
|
|
35
41
|
</div>
|
|
36
|
-
<span class="row">{index + 1}</span>
|
|
42
|
+
<span class="row" class:touch>{index + 1}</span>
|
|
37
43
|
</div>
|
|
38
44
|
|
|
39
|
-
<style>.
|
|
45
|
+
<style>.limit-size:not(.touch) {
|
|
46
|
+
width: 1.5rem;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.card {
|
|
40
50
|
color: #3a4952;
|
|
41
51
|
fill: #3a4952;
|
|
42
52
|
padding: var(--padding-size, 0.76rem);
|
|
@@ -82,13 +92,25 @@
|
|
|
82
92
|
flex-flow: row nowrap;
|
|
83
93
|
justify-content: flex-start;
|
|
84
94
|
align-items: center;
|
|
95
|
+
gap: 0.75rem;
|
|
96
|
+
padding: 0.375rem 0.75rem;
|
|
97
|
+
}
|
|
98
|
+
.card.touch {
|
|
85
99
|
gap: 1.5rem;
|
|
100
|
+
padding: 0.375rem 0.75rem;
|
|
86
101
|
}
|
|
87
102
|
.card .text {
|
|
88
103
|
display: flex;
|
|
89
|
-
gap: 0.
|
|
104
|
+
gap: 0.375rem;
|
|
90
105
|
flex-flow: column nowrap;
|
|
91
106
|
}
|
|
107
|
+
.card .text.touch {
|
|
108
|
+
gap: 0.5rem;
|
|
109
|
+
}
|
|
110
|
+
.card .title:not(.touch),
|
|
111
|
+
.card .subtitle:not(.touch) {
|
|
112
|
+
font-size: 0.875rem;
|
|
113
|
+
}
|
|
92
114
|
.card .title {
|
|
93
115
|
font-weight: 500;
|
|
94
116
|
color: #455661;
|
|
@@ -101,11 +123,19 @@
|
|
|
101
123
|
flex-flow: row nowrap;
|
|
102
124
|
align-items: center;
|
|
103
125
|
justify-content: center;
|
|
104
|
-
height: 1.75rem;
|
|
105
|
-
width: 1.75rem;
|
|
106
126
|
overflow: hidden;
|
|
107
127
|
margin-left: auto;
|
|
108
|
-
margin-right: 1rem;
|
|
109
128
|
border: solid 3px #cbd4da;
|
|
110
129
|
border-radius: 50%;
|
|
130
|
+
margin-right: 0.375rem;
|
|
131
|
+
}
|
|
132
|
+
.card span.row:not(.touch) {
|
|
133
|
+
height: 1.5rem;
|
|
134
|
+
width: 1.5rem;
|
|
135
|
+
font-size: 0.875rem;
|
|
136
|
+
}
|
|
137
|
+
.card span.row.touch {
|
|
138
|
+
height: 1.75rem;
|
|
139
|
+
width: 1.75rem;
|
|
140
|
+
margin-right: 1rem;
|
|
111
141
|
}</style>
|
|
@@ -234,7 +234,11 @@
|
|
|
234
234
|
onfocus={addKeydownEvent}
|
|
235
235
|
onchange={(newValue) => {
|
|
236
236
|
if (newValue?.value !== value) {
|
|
237
|
-
tableContext.onEditCell(
|
|
237
|
+
tableContext.onEditCell(
|
|
238
|
+
cell.row.original,
|
|
239
|
+
focusDetails.coordinates,
|
|
240
|
+
newValue?.value ?? null
|
|
241
|
+
);
|
|
238
242
|
}
|
|
239
243
|
|
|
240
244
|
tableContext.focusStartIsBeingEdited = false;
|
|
@@ -214,7 +214,11 @@
|
|
|
214
214
|
onchange={(newValue: SelectOption<unknown> | null) => {
|
|
215
215
|
if (newValue?.value !== value) {
|
|
216
216
|
if (optional || newValue?.value != null) {
|
|
217
|
-
tableContext.onEditCell(
|
|
217
|
+
tableContext.onEditCell(
|
|
218
|
+
cell.row.original,
|
|
219
|
+
focusDetails.coordinates,
|
|
220
|
+
newValue?.value ?? null
|
|
221
|
+
);
|
|
218
222
|
}
|
|
219
223
|
}
|
|
220
224
|
tableContext.focusStartIsBeingEdited = false;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lavalogic/scoria",
|
|
3
3
|
"description": "Svelte components used for the FloWMS Web Frontend",
|
|
4
|
-
"version": "0.4.
|
|
4
|
+
"version": "0.4.3",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "restricted"
|
|
7
7
|
},
|
|
@@ -29,52 +29,52 @@
|
|
|
29
29
|
"svelte": "^5.0.0"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@chromatic-com/storybook": "^4.1.
|
|
33
|
-
"@eslint/compat": "^
|
|
32
|
+
"@chromatic-com/storybook": "^4.1.3",
|
|
33
|
+
"@eslint/compat": "^2.0.0",
|
|
34
34
|
"@eslint/js": "^9.39.1",
|
|
35
|
-
"@playwright/test": "^1.
|
|
36
|
-
"@storybook/addon-a11y": "^
|
|
37
|
-
"@storybook/addon-docs": "^
|
|
35
|
+
"@playwright/test": "^1.57.0",
|
|
36
|
+
"@storybook/addon-a11y": "^10.1.4",
|
|
37
|
+
"@storybook/addon-docs": "^10.1.4",
|
|
38
38
|
"@storybook/addon-svelte-csf": "^5.0.10",
|
|
39
|
-
"@storybook/addon-vitest": "^
|
|
40
|
-
"@storybook/sveltekit": "^
|
|
39
|
+
"@storybook/addon-vitest": "^10.1.4",
|
|
40
|
+
"@storybook/sveltekit": "^10.1.4",
|
|
41
41
|
"@sveltejs/adapter-node": "^5.4.0",
|
|
42
|
-
"@sveltejs/kit": "^2.
|
|
43
|
-
"@sveltejs/package": "^2.5.
|
|
42
|
+
"@sveltejs/kit": "^2.49.1",
|
|
43
|
+
"@sveltejs/package": "^2.5.7",
|
|
44
44
|
"@sveltejs/vite-plugin-svelte": "^6.2.1",
|
|
45
45
|
"@types/eslint": "^9.6.1",
|
|
46
|
-
"@types/node": "^
|
|
47
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
48
|
-
"@typescript-eslint/parser": "^8.
|
|
49
|
-
"@vitest/browser": "^
|
|
46
|
+
"@types/node": "^24.10.1",
|
|
47
|
+
"@typescript-eslint/eslint-plugin": "^8.48.1",
|
|
48
|
+
"@typescript-eslint/parser": "^8.48.1",
|
|
49
|
+
"@vitest/browser": "^4.0.15",
|
|
50
50
|
"eslint": "^9.39.1",
|
|
51
51
|
"eslint-config-prettier": "^10.1.8",
|
|
52
|
-
"eslint-plugin-storybook": "
|
|
52
|
+
"eslint-plugin-storybook": "10.1.4",
|
|
53
53
|
"eslint-plugin-svelte": "^3.13.0",
|
|
54
54
|
"globals": "^16.5.0",
|
|
55
55
|
"mdsvex": "^0.12.6",
|
|
56
|
-
"playwright": "^1.
|
|
57
|
-
"prettier": "^3.
|
|
56
|
+
"playwright": "^1.57.0",
|
|
57
|
+
"prettier": "^3.7.4",
|
|
58
58
|
"prettier-plugin-svelte": "^3.4.0",
|
|
59
59
|
"publint": "^0.3.15",
|
|
60
60
|
"sass-embedded": "^1.93.3",
|
|
61
|
-
"storybook": "^
|
|
62
|
-
"svelte": "
|
|
61
|
+
"storybook": "^10.1.4",
|
|
62
|
+
"svelte": "^5.45.5",
|
|
63
63
|
"svelte-check": "^4.3.4",
|
|
64
64
|
"svelte-render-scan": "^1.1.0",
|
|
65
65
|
"typescript": "^5.9.3",
|
|
66
|
-
"typescript-eslint": "^8.
|
|
67
|
-
"vite": "^7.2.
|
|
66
|
+
"typescript-eslint": "^8.48.1",
|
|
67
|
+
"vite": "^7.2.6",
|
|
68
68
|
"vite-plugin-devtools-json": "^1.0.0",
|
|
69
|
-
"vitest": "^
|
|
70
|
-
"vitest-browser-svelte": "^
|
|
69
|
+
"vitest": "^4.0.15",
|
|
70
|
+
"vitest-browser-svelte": "^2.0.1"
|
|
71
71
|
},
|
|
72
72
|
"keywords": [
|
|
73
73
|
"svelte"
|
|
74
74
|
],
|
|
75
75
|
"dependencies": {
|
|
76
76
|
"svelecte": "^5.3.0",
|
|
77
|
-
"svelte-dnd-action": "^0.9.
|
|
77
|
+
"svelte-dnd-action": "^0.9.68"
|
|
78
78
|
},
|
|
79
79
|
"scripts": {
|
|
80
80
|
"dev": "vite dev",
|