@x33025/sveltely 0.0.29 → 0.0.31
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.
|
@@ -50,6 +50,12 @@
|
|
|
50
50
|
return;
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
+
if (event.key === 'Enter' && !inputValue.trim()) {
|
|
54
|
+
event.preventDefault();
|
|
55
|
+
showInput = false;
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
|
|
53
59
|
if (event.key === 'Escape') {
|
|
54
60
|
inputValue = '';
|
|
55
61
|
showInput = false;
|
|
@@ -57,7 +63,8 @@
|
|
|
57
63
|
}
|
|
58
64
|
|
|
59
65
|
if (event.key === 'Backspace' && !inputValue && tags.length > 0) {
|
|
60
|
-
|
|
66
|
+
event.preventDefault();
|
|
67
|
+
startEditing(tags[tags.length - 1]);
|
|
61
68
|
}
|
|
62
69
|
};
|
|
63
70
|
|
|
@@ -75,14 +82,34 @@
|
|
|
75
82
|
editingEl?.select();
|
|
76
83
|
};
|
|
77
84
|
|
|
78
|
-
const commitEdit = () => {
|
|
79
|
-
if (!editingTag) return;
|
|
85
|
+
const commitEdit = async (source: 'enter' | 'blur' | 'advance', targetTag: string) => {
|
|
86
|
+
if (!editingTag || editingTag !== targetTag) return;
|
|
80
87
|
|
|
81
88
|
const previous = editingTag;
|
|
82
89
|
const next = editingValue.trim();
|
|
83
90
|
editingTag = null;
|
|
84
91
|
|
|
85
|
-
if (!next
|
|
92
|
+
if (!next) {
|
|
93
|
+
if (source === 'enter' || source === 'advance') {
|
|
94
|
+
const previousIndex = tags.indexOf(previous);
|
|
95
|
+
const nextTags = tags.filter((tag) => tag !== previous);
|
|
96
|
+
tags = nextTags;
|
|
97
|
+
if (selection?.includes(previous)) {
|
|
98
|
+
selection = selection.filter((tag) => tag !== previous);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
if (source === 'advance' && nextTags.length > 0) {
|
|
102
|
+
const nextIndex = Math.min(previousIndex, nextTags.length - 1);
|
|
103
|
+
await startEditing(nextTags[nextIndex]);
|
|
104
|
+
} else if (nextTags.length === 0) {
|
|
105
|
+
inputValue = '';
|
|
106
|
+
await openInput();
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
return;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
if (next === previous) return;
|
|
86
113
|
if (tags.includes(next)) return;
|
|
87
114
|
|
|
88
115
|
tags = tags.map((tag) => (tag === previous ? next : tag));
|
|
@@ -96,10 +123,16 @@
|
|
|
96
123
|
editingValue = '';
|
|
97
124
|
};
|
|
98
125
|
|
|
99
|
-
const onEditKeydown = (event: KeyboardEvent) => {
|
|
126
|
+
const onEditKeydown = async (event: KeyboardEvent, tag: string) => {
|
|
100
127
|
if (event.key === 'Enter') {
|
|
101
128
|
event.preventDefault();
|
|
102
|
-
commitEdit();
|
|
129
|
+
await commitEdit('enter', tag);
|
|
130
|
+
return;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
if ((event.key === 'Backspace' || event.key === 'Delete') && !editingValue.trim()) {
|
|
134
|
+
event.preventDefault();
|
|
135
|
+
await commitEdit('advance', tag);
|
|
103
136
|
return;
|
|
104
137
|
}
|
|
105
138
|
|
|
@@ -132,8 +165,8 @@
|
|
|
132
165
|
bind:this={editingEl}
|
|
133
166
|
bind:value={editingValue}
|
|
134
167
|
class="tag-surface tag-input-field min-w-20 outline-none"
|
|
135
|
-
onblur={commitEdit}
|
|
136
|
-
onkeydown={onEditKeydown}
|
|
168
|
+
onblur={() => commitEdit('blur', tag)}
|
|
169
|
+
onkeydown={(event) => onEditKeydown(event, tag)}
|
|
137
170
|
/>
|
|
138
171
|
{:else if selectionEnabled}
|
|
139
172
|
<button
|