@agnos-ui/core 0.4.4 → 0.5.0
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 +2 -2
- package/{accordion-BnaSamoQ.js → accordion-BGv150k9.js} +10 -13
- package/{accordion-DmPT0O0j.cjs → accordion-Lp-LEbZ2.cjs} +10 -13
- package/{alert-CEFbEgvG.cjs → alert-Bq101evB.cjs} +1 -1
- package/{alert-DdGuK__c.js → alert-DJ2l7bcA.js} +1 -1
- package/{common-CO5b5G_J.js → common-Banw3FYN.js} +15 -14
- package/{common-nxv_hKNE.cjs → common-DvPjK7SS.cjs} +15 -14
- package/components/accordion/accordion.d.ts +35 -8
- package/components/accordion/index.cjs +1 -1
- package/components/accordion/index.js +1 -1
- package/components/alert/alert.d.ts +16 -1
- package/components/alert/common.d.ts +19 -1
- package/components/alert/index.cjs +1 -1
- package/components/alert/index.js +1 -1
- package/components/commonProps.d.ts +3 -0
- package/components/modal/index.cjs +1 -1
- package/components/modal/index.js +1 -1
- package/components/modal/modal.d.ts +3 -135
- package/components/pagination/index.cjs +1 -1
- package/components/pagination/index.js +1 -1
- package/components/pagination/pagination.d.ts +30 -217
- package/components/progressbar/index.cjs +1 -1
- package/components/progressbar/index.js +1 -1
- package/components/progressbar/progressbar.d.ts +13 -3
- package/components/rating/index.cjs +1 -1
- package/components/rating/index.js +1 -1
- package/components/rating/rating.d.ts +26 -115
- package/components/select/index.cjs +1 -1
- package/components/select/index.js +1 -1
- package/components/select/select.d.ts +21 -148
- package/components/slider/index.cjs +1 -1
- package/components/slider/index.js +1 -1
- package/components/slider/slider.d.ts +31 -126
- package/components/toast/index.cjs +1 -1
- package/components/toast/index.js +1 -1
- package/components/toast/toast.d.ts +16 -1
- package/config.d.ts +17 -1
- package/{directive-3-8yr-ZK.js → directive-CKEccryv.js} +11 -5
- package/{directive-j-xRk-h3.cjs → directive-DdlwGFtf.cjs} +11 -5
- package/index.cjs +13 -13
- package/index.js +15 -15
- package/{modal-D4d8sy85.cjs → modal-DDHcrykD.cjs} +10 -21
- package/{modal-CeTI4jxI.js → modal-DP-4I7vf.js} +11 -22
- package/package.json +6 -5
- package/{pagination-B9WFv70F.cjs → pagination-CBysiPUs.cjs} +23 -35
- package/{pagination-BpPHKQsH.js → pagination-DwDRot6q.js} +23 -35
- package/{progressbar-BybOg5FE.js → progressbar-CGmNq0cS.js} +3 -4
- package/{progressbar-DXCMeJvL.cjs → progressbar-DghzCJ6_.cjs} +3 -4
- package/{rating-D6Tv_4Vx.js → rating-Da38uaZz.js} +61 -54
- package/{rating-C2Y95r50.cjs → rating-DlfOuwuX.cjs} +61 -54
- package/{select-jUrt_lSn.js → select-CAEPqdz1.js} +92 -72
- package/{select-BBiF-m3N.cjs → select-LBVhNdrd.cjs} +92 -72
- package/services/extendWidget.d.ts +37 -4
- package/services/floatingUI.cjs +3 -2
- package/services/floatingUI.d.ts +28 -27
- package/services/floatingUI.js +3 -2
- package/services/focustrack.cjs +1 -1
- package/services/focustrack.d.ts +21 -0
- package/services/focustrack.js +1 -1
- package/services/hash.d.ts +2 -1
- package/services/intersection.cjs +1 -1
- package/services/intersection.d.ts +9 -13
- package/services/intersection.js +1 -1
- package/services/matchMedia.cjs +1 -1
- package/services/matchMedia.d.ts +2 -1
- package/services/matchMedia.js +1 -1
- package/services/navManager.cjs +1 -1
- package/services/navManager.d.ts +85 -41
- package/services/navManager.js +1 -1
- package/services/portal.cjs +1 -1
- package/services/portal.d.ts +3 -0
- package/services/portal.js +1 -1
- package/services/resizeObserver.cjs +2 -2
- package/services/resizeObserver.d.ts +2 -6
- package/services/resizeObserver.js +2 -2
- package/services/siblingsInert.cjs +3 -3
- package/services/siblingsInert.d.ts +3 -5
- package/services/siblingsInert.js +3 -3
- package/services/transitions/baseTransitions.cjs +4 -5
- package/services/transitions/baseTransitions.d.ts +21 -4
- package/services/transitions/baseTransitions.js +4 -5
- package/services/transitions/collapse.cjs +1 -1
- package/services/transitions/collapse.d.ts +6 -0
- package/services/transitions/collapse.js +1 -1
- package/services/transitions/cssTransitions.cjs +1 -1
- package/services/transitions/cssTransitions.d.ts +3 -0
- package/services/transitions/cssTransitions.js +1 -1
- package/services/transitions/simpleClassTransition.cjs +1 -1
- package/services/transitions/simpleClassTransition.d.ts +9 -2
- package/services/transitions/simpleClassTransition.js +1 -1
- package/{slider-ByDkbyr1.js → slider-DYrwS7Mv.js} +118 -116
- package/{slider-BdsZpxJr.cjs → slider-DlOAawbZ.cjs} +118 -116
- package/{toast-BzxextBQ.js → toast-CpvsibAI.js} +3 -3
- package/{toast-Dy3ck2cM.cjs → toast-D_uSrRZL.cjs} +3 -3
- package/types.cjs +0 -8
- package/types.d.ts +151 -19
- package/types.js +1 -9
- package/utils/directive.cjs +1 -1
- package/utils/directive.d.ts +81 -32
- package/utils/directive.js +1 -1
- package/utils/internal/checks.d.ts +6 -0
- package/utils/internal/dom.d.ts +5 -5
- package/utils/internal/promise.d.ts +9 -0
- package/utils/internal/sort.d.ts +2 -2
- package/utils/internal/ssrHTMLElement.d.ts +4 -0
- package/utils/stores.cjs +1 -1
- package/utils/stores.d.ts +80 -42
- package/utils/stores.js +1 -1
- package/utils/writables.cjs +2 -1
- package/utils/writables.d.ts +52 -3
- package/utils/writables.js +2 -1
- package/{writables-D46sFgGK.cjs → writables-BPAJvaL_.cjs} +9 -0
- package/{writables-DoU_XYTX.js → writables-DCiBdIBK.js} +11 -2
|
@@ -3,7 +3,7 @@ import { offset, autoPlacement, size } from "@floating-ui/dom";
|
|
|
3
3
|
import { createFloatingUI } from "./services/floatingUI.js";
|
|
4
4
|
import { createHasFocus } from "./services/focustrack.js";
|
|
5
5
|
import { createNavManager } from "./services/navManager.js";
|
|
6
|
-
import { t as generateId, k as mergeDirectives, a as bindDirective, n as createAttributesDirective } from "./directive-
|
|
6
|
+
import { t as generateId, k as mergeDirectives, a as bindDirective, n as createAttributesDirective } from "./directive-CKEccryv.js";
|
|
7
7
|
import { n as noop } from "./func-DR0n-ShK.js";
|
|
8
8
|
import { writablesForProps, bindableProp, bindableDerived, stateStores } from "./utils/stores.js";
|
|
9
9
|
const defaultConfig = {
|
|
@@ -143,7 +143,9 @@ function createSelect(config) {
|
|
|
143
143
|
widget.api.unselect(item);
|
|
144
144
|
if (referenceElement instanceof HTMLElement) {
|
|
145
145
|
setTimeout(() => {
|
|
146
|
-
focusLeft({ event, referenceElement })
|
|
146
|
+
if (!focusLeft({ event, referenceElement })) {
|
|
147
|
+
focusRight({ event, referenceElement });
|
|
148
|
+
}
|
|
147
149
|
});
|
|
148
150
|
}
|
|
149
151
|
event.preventDefault();
|
|
@@ -165,7 +167,20 @@ function createSelect(config) {
|
|
|
165
167
|
"au-select-badge": true
|
|
166
168
|
},
|
|
167
169
|
events: {
|
|
168
|
-
keydown: (
|
|
170
|
+
keydown: (event) => {
|
|
171
|
+
let keyManaged = false;
|
|
172
|
+
switch (event.key) {
|
|
173
|
+
case "Backspace":
|
|
174
|
+
case "Delete": {
|
|
175
|
+
onRemoveBadge(event, itemContext$().item);
|
|
176
|
+
keyManaged = true;
|
|
177
|
+
break;
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
if (keyManaged) {
|
|
181
|
+
event.preventDefault();
|
|
182
|
+
}
|
|
183
|
+
}
|
|
169
184
|
}
|
|
170
185
|
}));
|
|
171
186
|
const menuAttributesDirective = createAttributesDirective(() => ({
|
|
@@ -193,6 +208,77 @@ function createSelect(config) {
|
|
|
193
208
|
click: () => widget.api.toggleItem(itemContext$().item)
|
|
194
209
|
}
|
|
195
210
|
}));
|
|
211
|
+
const inputDirective = createAttributesDirective(() => ({
|
|
212
|
+
attributes: {
|
|
213
|
+
id: id$(),
|
|
214
|
+
type: "text",
|
|
215
|
+
"aria-label": ariaLabel$(),
|
|
216
|
+
"aria-autocomplete": "list",
|
|
217
|
+
autocorrect: "off",
|
|
218
|
+
autocapitalize: "none",
|
|
219
|
+
autocomplete: "off"
|
|
220
|
+
},
|
|
221
|
+
classNames: {
|
|
222
|
+
"au-select-input": true
|
|
223
|
+
},
|
|
224
|
+
events: {
|
|
225
|
+
input: (event) => {
|
|
226
|
+
const value = event.target.value;
|
|
227
|
+
batch(() => {
|
|
228
|
+
open$.set(value != null && value !== "");
|
|
229
|
+
filterText$.set(value);
|
|
230
|
+
});
|
|
231
|
+
},
|
|
232
|
+
keydown: ({ ctrlKey, key, preventDefault }) => {
|
|
233
|
+
let keyManaged = true;
|
|
234
|
+
switch (key) {
|
|
235
|
+
case "ArrowDown": {
|
|
236
|
+
const isOpen = open$();
|
|
237
|
+
if (isOpen) {
|
|
238
|
+
if (ctrlKey) {
|
|
239
|
+
widget.api.highlightLast();
|
|
240
|
+
} else {
|
|
241
|
+
widget.api.highlightNext();
|
|
242
|
+
}
|
|
243
|
+
} else {
|
|
244
|
+
widget.api.open();
|
|
245
|
+
widget.api.highlightFirst();
|
|
246
|
+
}
|
|
247
|
+
break;
|
|
248
|
+
}
|
|
249
|
+
case "ArrowUp":
|
|
250
|
+
if (ctrlKey) {
|
|
251
|
+
widget.api.highlightFirst();
|
|
252
|
+
} else {
|
|
253
|
+
widget.api.highlightPrevious();
|
|
254
|
+
}
|
|
255
|
+
break;
|
|
256
|
+
case "Enter": {
|
|
257
|
+
const itemCtx = highlighted$();
|
|
258
|
+
if (itemCtx) {
|
|
259
|
+
widget.api.toggleItem(itemCtx.item);
|
|
260
|
+
}
|
|
261
|
+
break;
|
|
262
|
+
}
|
|
263
|
+
case "Escape":
|
|
264
|
+
open$.set(false);
|
|
265
|
+
break;
|
|
266
|
+
default:
|
|
267
|
+
keyManaged = false;
|
|
268
|
+
}
|
|
269
|
+
if (keyManaged) {
|
|
270
|
+
preventDefault();
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
}
|
|
274
|
+
}));
|
|
275
|
+
const badgeCloseButtonDirective = createAttributesDirective((itemContext$) => ({
|
|
276
|
+
events: {
|
|
277
|
+
click: (event) => {
|
|
278
|
+
onRemoveBadge(event, itemContext$().item);
|
|
279
|
+
}
|
|
280
|
+
}
|
|
281
|
+
}));
|
|
196
282
|
const widget = {
|
|
197
283
|
...stateStores({
|
|
198
284
|
id$,
|
|
@@ -278,75 +364,9 @@ function createSelect(config) {
|
|
|
278
364
|
inputContainerDirective: mergeDirectives(bindDirective(navDirective, navManagerConfig$), inputContainerAttributesDirective),
|
|
279
365
|
badgeAttributesDirective,
|
|
280
366
|
menuAttributesDirective,
|
|
281
|
-
itemAttributesDirective
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
onInput({ target }) {
|
|
285
|
-
const value = target.value;
|
|
286
|
-
batch(() => {
|
|
287
|
-
open$.set(value != null && value !== "");
|
|
288
|
-
filterText$.set(value);
|
|
289
|
-
});
|
|
290
|
-
},
|
|
291
|
-
onRemoveBadgeClick(event, item) {
|
|
292
|
-
onRemoveBadge(event, item);
|
|
293
|
-
},
|
|
294
|
-
onInputKeydown(e) {
|
|
295
|
-
const { ctrlKey, key } = e;
|
|
296
|
-
let keyManaged = true;
|
|
297
|
-
switch (key) {
|
|
298
|
-
case "ArrowDown": {
|
|
299
|
-
const isOpen = open$();
|
|
300
|
-
if (isOpen) {
|
|
301
|
-
if (ctrlKey) {
|
|
302
|
-
widget.api.highlightLast();
|
|
303
|
-
} else {
|
|
304
|
-
widget.api.highlightNext();
|
|
305
|
-
}
|
|
306
|
-
} else {
|
|
307
|
-
widget.api.open();
|
|
308
|
-
widget.api.highlightFirst();
|
|
309
|
-
}
|
|
310
|
-
break;
|
|
311
|
-
}
|
|
312
|
-
case "ArrowUp":
|
|
313
|
-
if (ctrlKey) {
|
|
314
|
-
widget.api.highlightFirst();
|
|
315
|
-
} else {
|
|
316
|
-
widget.api.highlightPrevious();
|
|
317
|
-
}
|
|
318
|
-
break;
|
|
319
|
-
case "Enter": {
|
|
320
|
-
const itemCtx = highlighted$();
|
|
321
|
-
if (itemCtx) {
|
|
322
|
-
widget.api.toggleItem(itemCtx.item);
|
|
323
|
-
}
|
|
324
|
-
break;
|
|
325
|
-
}
|
|
326
|
-
case "Escape":
|
|
327
|
-
open$.set(false);
|
|
328
|
-
break;
|
|
329
|
-
default:
|
|
330
|
-
keyManaged = false;
|
|
331
|
-
}
|
|
332
|
-
if (keyManaged) {
|
|
333
|
-
e.preventDefault();
|
|
334
|
-
}
|
|
335
|
-
},
|
|
336
|
-
onBadgeKeydown(event, item) {
|
|
337
|
-
let keyManaged = false;
|
|
338
|
-
switch (event.key) {
|
|
339
|
-
case "Backspace":
|
|
340
|
-
case "Delete": {
|
|
341
|
-
onRemoveBadge(event, item);
|
|
342
|
-
keyManaged = true;
|
|
343
|
-
break;
|
|
344
|
-
}
|
|
345
|
-
}
|
|
346
|
-
if (keyManaged) {
|
|
347
|
-
event.preventDefault();
|
|
348
|
-
}
|
|
349
|
-
}
|
|
367
|
+
itemAttributesDirective,
|
|
368
|
+
inputDirective,
|
|
369
|
+
badgeCloseButtonDirective
|
|
350
370
|
}
|
|
351
371
|
};
|
|
352
372
|
return widget;
|
|
@@ -4,7 +4,7 @@ const dom = require("@floating-ui/dom");
|
|
|
4
4
|
const services_floatingUI = require("./services/floatingUI.cjs");
|
|
5
5
|
const services_focustrack = require("./services/focustrack.cjs");
|
|
6
6
|
const services_navManager = require("./services/navManager.cjs");
|
|
7
|
-
const utils_directive = require("./directive-
|
|
7
|
+
const utils_directive = require("./directive-DdlwGFtf.cjs");
|
|
8
8
|
const func = require("./func-Qd3cD9a3.cjs");
|
|
9
9
|
const utils_stores = require("./utils/stores.cjs");
|
|
10
10
|
const defaultConfig = {
|
|
@@ -144,7 +144,9 @@ function createSelect(config) {
|
|
|
144
144
|
widget.api.unselect(item);
|
|
145
145
|
if (referenceElement instanceof HTMLElement) {
|
|
146
146
|
setTimeout(() => {
|
|
147
|
-
focusLeft({ event, referenceElement })
|
|
147
|
+
if (!focusLeft({ event, referenceElement })) {
|
|
148
|
+
focusRight({ event, referenceElement });
|
|
149
|
+
}
|
|
148
150
|
});
|
|
149
151
|
}
|
|
150
152
|
event.preventDefault();
|
|
@@ -166,7 +168,20 @@ function createSelect(config) {
|
|
|
166
168
|
"au-select-badge": true
|
|
167
169
|
},
|
|
168
170
|
events: {
|
|
169
|
-
keydown: (
|
|
171
|
+
keydown: (event) => {
|
|
172
|
+
let keyManaged = false;
|
|
173
|
+
switch (event.key) {
|
|
174
|
+
case "Backspace":
|
|
175
|
+
case "Delete": {
|
|
176
|
+
onRemoveBadge(event, itemContext$().item);
|
|
177
|
+
keyManaged = true;
|
|
178
|
+
break;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
if (keyManaged) {
|
|
182
|
+
event.preventDefault();
|
|
183
|
+
}
|
|
184
|
+
}
|
|
170
185
|
}
|
|
171
186
|
}));
|
|
172
187
|
const menuAttributesDirective = utils_directive.createAttributesDirective(() => ({
|
|
@@ -194,6 +209,77 @@ function createSelect(config) {
|
|
|
194
209
|
click: () => widget.api.toggleItem(itemContext$().item)
|
|
195
210
|
}
|
|
196
211
|
}));
|
|
212
|
+
const inputDirective = utils_directive.createAttributesDirective(() => ({
|
|
213
|
+
attributes: {
|
|
214
|
+
id: id$(),
|
|
215
|
+
type: "text",
|
|
216
|
+
"aria-label": ariaLabel$(),
|
|
217
|
+
"aria-autocomplete": "list",
|
|
218
|
+
autocorrect: "off",
|
|
219
|
+
autocapitalize: "none",
|
|
220
|
+
autocomplete: "off"
|
|
221
|
+
},
|
|
222
|
+
classNames: {
|
|
223
|
+
"au-select-input": true
|
|
224
|
+
},
|
|
225
|
+
events: {
|
|
226
|
+
input: (event) => {
|
|
227
|
+
const value = event.target.value;
|
|
228
|
+
tansu.batch(() => {
|
|
229
|
+
open$.set(value != null && value !== "");
|
|
230
|
+
filterText$.set(value);
|
|
231
|
+
});
|
|
232
|
+
},
|
|
233
|
+
keydown: ({ ctrlKey, key, preventDefault }) => {
|
|
234
|
+
let keyManaged = true;
|
|
235
|
+
switch (key) {
|
|
236
|
+
case "ArrowDown": {
|
|
237
|
+
const isOpen = open$();
|
|
238
|
+
if (isOpen) {
|
|
239
|
+
if (ctrlKey) {
|
|
240
|
+
widget.api.highlightLast();
|
|
241
|
+
} else {
|
|
242
|
+
widget.api.highlightNext();
|
|
243
|
+
}
|
|
244
|
+
} else {
|
|
245
|
+
widget.api.open();
|
|
246
|
+
widget.api.highlightFirst();
|
|
247
|
+
}
|
|
248
|
+
break;
|
|
249
|
+
}
|
|
250
|
+
case "ArrowUp":
|
|
251
|
+
if (ctrlKey) {
|
|
252
|
+
widget.api.highlightFirst();
|
|
253
|
+
} else {
|
|
254
|
+
widget.api.highlightPrevious();
|
|
255
|
+
}
|
|
256
|
+
break;
|
|
257
|
+
case "Enter": {
|
|
258
|
+
const itemCtx = highlighted$();
|
|
259
|
+
if (itemCtx) {
|
|
260
|
+
widget.api.toggleItem(itemCtx.item);
|
|
261
|
+
}
|
|
262
|
+
break;
|
|
263
|
+
}
|
|
264
|
+
case "Escape":
|
|
265
|
+
open$.set(false);
|
|
266
|
+
break;
|
|
267
|
+
default:
|
|
268
|
+
keyManaged = false;
|
|
269
|
+
}
|
|
270
|
+
if (keyManaged) {
|
|
271
|
+
preventDefault();
|
|
272
|
+
}
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
}));
|
|
276
|
+
const badgeCloseButtonDirective = utils_directive.createAttributesDirective((itemContext$) => ({
|
|
277
|
+
events: {
|
|
278
|
+
click: (event) => {
|
|
279
|
+
onRemoveBadge(event, itemContext$().item);
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
}));
|
|
197
283
|
const widget = {
|
|
198
284
|
...utils_stores.stateStores({
|
|
199
285
|
id$,
|
|
@@ -279,75 +365,9 @@ function createSelect(config) {
|
|
|
279
365
|
inputContainerDirective: utils_directive.mergeDirectives(utils_directive.bindDirective(navDirective, navManagerConfig$), inputContainerAttributesDirective),
|
|
280
366
|
badgeAttributesDirective,
|
|
281
367
|
menuAttributesDirective,
|
|
282
|
-
itemAttributesDirective
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
onInput({ target }) {
|
|
286
|
-
const value = target.value;
|
|
287
|
-
tansu.batch(() => {
|
|
288
|
-
open$.set(value != null && value !== "");
|
|
289
|
-
filterText$.set(value);
|
|
290
|
-
});
|
|
291
|
-
},
|
|
292
|
-
onRemoveBadgeClick(event, item) {
|
|
293
|
-
onRemoveBadge(event, item);
|
|
294
|
-
},
|
|
295
|
-
onInputKeydown(e) {
|
|
296
|
-
const { ctrlKey, key } = e;
|
|
297
|
-
let keyManaged = true;
|
|
298
|
-
switch (key) {
|
|
299
|
-
case "ArrowDown": {
|
|
300
|
-
const isOpen = open$();
|
|
301
|
-
if (isOpen) {
|
|
302
|
-
if (ctrlKey) {
|
|
303
|
-
widget.api.highlightLast();
|
|
304
|
-
} else {
|
|
305
|
-
widget.api.highlightNext();
|
|
306
|
-
}
|
|
307
|
-
} else {
|
|
308
|
-
widget.api.open();
|
|
309
|
-
widget.api.highlightFirst();
|
|
310
|
-
}
|
|
311
|
-
break;
|
|
312
|
-
}
|
|
313
|
-
case "ArrowUp":
|
|
314
|
-
if (ctrlKey) {
|
|
315
|
-
widget.api.highlightFirst();
|
|
316
|
-
} else {
|
|
317
|
-
widget.api.highlightPrevious();
|
|
318
|
-
}
|
|
319
|
-
break;
|
|
320
|
-
case "Enter": {
|
|
321
|
-
const itemCtx = highlighted$();
|
|
322
|
-
if (itemCtx) {
|
|
323
|
-
widget.api.toggleItem(itemCtx.item);
|
|
324
|
-
}
|
|
325
|
-
break;
|
|
326
|
-
}
|
|
327
|
-
case "Escape":
|
|
328
|
-
open$.set(false);
|
|
329
|
-
break;
|
|
330
|
-
default:
|
|
331
|
-
keyManaged = false;
|
|
332
|
-
}
|
|
333
|
-
if (keyManaged) {
|
|
334
|
-
e.preventDefault();
|
|
335
|
-
}
|
|
336
|
-
},
|
|
337
|
-
onBadgeKeydown(event, item) {
|
|
338
|
-
let keyManaged = false;
|
|
339
|
-
switch (event.key) {
|
|
340
|
-
case "Backspace":
|
|
341
|
-
case "Delete": {
|
|
342
|
-
onRemoveBadge(event, item);
|
|
343
|
-
keyManaged = true;
|
|
344
|
-
break;
|
|
345
|
-
}
|
|
346
|
-
}
|
|
347
|
-
if (keyManaged) {
|
|
348
|
-
event.preventDefault();
|
|
349
|
-
}
|
|
350
|
-
}
|
|
368
|
+
itemAttributesDirective,
|
|
369
|
+
inputDirective,
|
|
370
|
+
badgeCloseButtonDirective
|
|
351
371
|
}
|
|
352
372
|
};
|
|
353
373
|
return widget;
|
|
@@ -1,24 +1,57 @@
|
|
|
1
1
|
import type { ConfigValidator, IsSlotContent, SlotContent, Widget, WidgetFactory, WidgetProps, WidgetSlotContext, WidgetState } from '../types';
|
|
2
2
|
/**
|
|
3
3
|
* Type extending the original Widget props and state with ExtraProps
|
|
4
|
+
*
|
|
5
|
+
* @template W - The base widget type to be extended.
|
|
6
|
+
* @template ExtraProps - Additional properties to be added to the widget.
|
|
7
|
+
* @template ExtraDirectives - Additional directives to be added to the widget. Defaults to an empty object.
|
|
4
8
|
*/
|
|
5
|
-
export type ExtendWidgetProps<W extends Widget, ExtraProps extends object, ExtraDirectives extends object = object> = Widget<ExtendWidgetAdaptSlotWidgetProps<WidgetProps<W>, ExtraProps, ExtraDirectives>, ExtendWidgetAdaptSlotWidgetProps<WidgetState<W>, ExtraProps, ExtraDirectives>, W['api'],
|
|
9
|
+
export type ExtendWidgetProps<W extends Widget, ExtraProps extends object, ExtraDirectives extends object = object> = Widget<ExtendWidgetAdaptSlotWidgetProps<WidgetProps<W>, ExtraProps, ExtraDirectives>, ExtendWidgetAdaptSlotWidgetProps<WidgetState<W>, ExtraProps, ExtraDirectives>, W['api'], ExtendWidgetInterfaces<W['directives'], ExtraDirectives>>;
|
|
6
10
|
/**
|
|
7
|
-
*
|
|
11
|
+
* Combines two interface types into a single type.
|
|
12
|
+
*
|
|
13
|
+
* @template Interfaces - The base interface type.
|
|
14
|
+
* @template ExtraInterfaces - The additional interface type to extend the base interface.
|
|
15
|
+
* @typedef {Interfaces & ExtraInterfaces} ExtendWidgetInterfaces - The resulting type that includes properties from both Interfaces and ExtraInterfaces.
|
|
8
16
|
*/
|
|
9
17
|
export type ExtendWidgetInterfaces<Interfaces, ExtraInterfaces> = Interfaces & ExtraInterfaces;
|
|
10
18
|
/**
|
|
11
|
-
* Type
|
|
19
|
+
* Type to adapt the slot content properties of a widget by extending its props, extra props, and extra directives.
|
|
20
|
+
*
|
|
21
|
+
* @template Props - The original properties of the widget slot context.
|
|
22
|
+
* @template ExtraProps - Additional properties to extend the widget slot context.
|
|
23
|
+
* @template ExtraDirectives - Additional directives to extend the widget slot context.
|
|
24
|
+
*
|
|
25
|
+
* @remarks
|
|
26
|
+
* This type conditionally checks if `Props` extends `WidgetSlotContext` and, if so, extends the widget slot context
|
|
27
|
+
* with additional properties and directives while omitting the original widget slot context properties.
|
|
12
28
|
*/
|
|
13
29
|
export type ExtendWidgetAdaptSlotContentProps<Props extends Record<string, any>, ExtraProps extends object, ExtraDirectives extends object> = Props extends WidgetSlotContext<infer U> ? WidgetSlotContext<ExtendWidgetProps<U, ExtraProps, ExtraDirectives>> & Omit<Props, keyof WidgetSlotContext<any>> : Props;
|
|
14
30
|
/**
|
|
15
|
-
* Type
|
|
31
|
+
* Type definition for extending widget properties with additional properties and directives.
|
|
32
|
+
*
|
|
33
|
+
* This type takes three generic parameters:
|
|
34
|
+
* - `Props`: The original properties of the widget.
|
|
35
|
+
* - `ExtraProps`: Additional properties to be merged with the original properties.
|
|
36
|
+
* - `ExtraDirectives`: Additional directives to be merged with the original properties.
|
|
37
|
+
*
|
|
38
|
+
* The resulting type combines `ExtraProps` with the original `Props`. For each property in `Props`,
|
|
39
|
+
* if the property is of type `SlotContent`, it will be extended with the additional properties and directives.
|
|
40
|
+
*
|
|
41
|
+
* @template Props - The original properties of the widget.
|
|
42
|
+
* @template ExtraProps - Additional properties to be merged with the original properties.
|
|
43
|
+
* @template ExtraDirectives - Additional directives to be merged with the original properties.
|
|
16
44
|
*/
|
|
17
45
|
export type ExtendWidgetAdaptSlotWidgetProps<Props, ExtraProps extends object, ExtraDirectives extends object> = ExtraProps & {
|
|
18
46
|
[K in keyof Props]: IsSlotContent<Props[K]> extends SlotContent<infer U> ? SlotContent<ExtendWidgetAdaptSlotContentProps<U, ExtraProps, ExtraDirectives>> : Props[K];
|
|
19
47
|
};
|
|
20
48
|
/**
|
|
21
49
|
* Method to extend the original widget with extra props with validator
|
|
50
|
+
*
|
|
51
|
+
* @template W - The type of the widget.
|
|
52
|
+
* @template ExtraProps - The type of the additional properties.
|
|
53
|
+
* @template ExtraDirectives - The type of the additional directives (default is an empty object).
|
|
54
|
+
*
|
|
22
55
|
* @param factory - original widget factory
|
|
23
56
|
* @param extraPropsDefaults - object containing default value for each extra prop
|
|
24
57
|
* @param extraPropsConfig - object verifying the type of each extra prop
|
package/services/floatingUI.cjs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const tansu = require("@amadeus-it-group/tansu");
|
|
4
4
|
const dom = require("@floating-ui/dom");
|
|
5
|
-
const utils_directive = require("../directive-
|
|
5
|
+
const utils_directive = require("../directive-DdlwGFtf.cjs");
|
|
6
6
|
const promise = require("../promise-BMJ8qhA8.cjs");
|
|
7
7
|
const utils_stores = require("../utils/stores.cjs");
|
|
8
8
|
const defaultConfig = {
|
|
@@ -125,7 +125,8 @@ const createFloatingUI = (propsConfig) => {
|
|
|
125
125
|
* Directive to be used on the arrow element, if any
|
|
126
126
|
*/
|
|
127
127
|
arrowDirective: utils_directive.mergeDirectives(arrowDirective, utils_directive.directiveSubscribe(arrowStyleApplyAction$))
|
|
128
|
-
}
|
|
128
|
+
},
|
|
129
|
+
api: {}
|
|
129
130
|
};
|
|
130
131
|
};
|
|
131
132
|
exports.createFloatingUI = createFloatingUI;
|
package/services/floatingUI.d.ts
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import type { ArrowOptions, AutoUpdateOptions, ComputePositionConfig, Derivable, MiddlewareData, Placement, Strategy } from '@floating-ui/dom';
|
|
2
|
-
import type { PropsConfig } from '../types';
|
|
2
|
+
import type { Directive, PropsConfig, SSRHTMLElement, Widget } from '../types';
|
|
3
|
+
/**
|
|
4
|
+
* Interface representing the properties for configuring Floating UI.
|
|
5
|
+
*/
|
|
3
6
|
export interface FloatingUIProps {
|
|
4
7
|
/**
|
|
5
8
|
* Options to use when calling computePosition from Floating UI
|
|
@@ -14,6 +17,9 @@ export interface FloatingUIProps {
|
|
|
14
17
|
*/
|
|
15
18
|
arrowOptions: Omit<ArrowOptions, 'element'> | Derivable<Omit<ArrowOptions, 'element'>>;
|
|
16
19
|
}
|
|
20
|
+
/**
|
|
21
|
+
* Represents the state of a floating UI element.
|
|
22
|
+
*/
|
|
17
23
|
export interface FloatingUIState {
|
|
18
24
|
/**
|
|
19
25
|
* The x coordinate of the floating ui
|
|
@@ -36,7 +42,26 @@ export interface FloatingUIState {
|
|
|
36
42
|
*/
|
|
37
43
|
middlewareData: MiddlewareData | undefined;
|
|
38
44
|
}
|
|
39
|
-
export
|
|
45
|
+
export interface FloatingUIDirectives {
|
|
46
|
+
/**
|
|
47
|
+
* Directive to attach to the reference element
|
|
48
|
+
*/
|
|
49
|
+
referenceDirective: Directive<void, SSRHTMLElement>;
|
|
50
|
+
/**
|
|
51
|
+
* Directive to attach to the floating element
|
|
52
|
+
*/
|
|
53
|
+
floatingDirective: Directive<void, SSRHTMLElement>;
|
|
54
|
+
/**
|
|
55
|
+
* Directive to attach to the arrow element
|
|
56
|
+
*/
|
|
57
|
+
arrowDirective: Directive<void, SSRHTMLElement>;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* Represents the type returned by the `createFloatingUI` function.
|
|
61
|
+
*
|
|
62
|
+
* This type is used to define the structure and behavior of the Floating UI component.
|
|
63
|
+
*/
|
|
64
|
+
export type FloatingUI = Widget<FloatingUIProps, FloatingUIState, object, FloatingUIDirectives>;
|
|
40
65
|
/**
|
|
41
66
|
* Create a floating UI service.
|
|
42
67
|
*
|
|
@@ -45,28 +70,4 @@ export type FloatingUI = ReturnType<typeof createFloatingUI>;
|
|
|
45
70
|
* @param propsConfig - the props config for the floating UI service
|
|
46
71
|
* @returns the floating UI service
|
|
47
72
|
*/
|
|
48
|
-
export declare const createFloatingUI: (propsConfig?: PropsConfig<FloatingUIProps>) =>
|
|
49
|
-
directives: {
|
|
50
|
-
/**
|
|
51
|
-
* Directive to be used on the reference element from where the floating element will be positioned
|
|
52
|
-
*/
|
|
53
|
-
referenceDirective: import("../types").Directive<void, import("../types").SSRHTMLElement>;
|
|
54
|
-
/**
|
|
55
|
-
* Directive to be used on the floating element
|
|
56
|
-
*/
|
|
57
|
-
floatingDirective: import("../types").Directive<void, import("../types").SSRHTMLElement>;
|
|
58
|
-
/**
|
|
59
|
-
* Directive to be used on the arrow element, if any
|
|
60
|
-
*/
|
|
61
|
-
arrowDirective: import("../types").Directive<void, import("../types").SSRHTMLElement>;
|
|
62
|
-
};
|
|
63
|
-
state$: import("@amadeus-it-group/tansu").ReadableSignal<FloatingUIState>;
|
|
64
|
-
stores: {
|
|
65
|
-
x$: import("@amadeus-it-group/tansu").ReadableSignal<number | undefined>;
|
|
66
|
-
y$: import("@amadeus-it-group/tansu").ReadableSignal<number | undefined>;
|
|
67
|
-
strategy$: import("@amadeus-it-group/tansu").ReadableSignal<Strategy | undefined>;
|
|
68
|
-
placement$: import("@amadeus-it-group/tansu").ReadableSignal<Placement | undefined>;
|
|
69
|
-
middlewareData$: import("@amadeus-it-group/tansu").ReadableSignal<MiddlewareData | undefined>;
|
|
70
|
-
};
|
|
71
|
-
patch: <U extends Partial<FloatingUIProps>>(storesValues?: void | U | undefined) => void;
|
|
72
|
-
};
|
|
73
|
+
export declare const createFloatingUI: (propsConfig?: PropsConfig<FloatingUIProps>) => FloatingUI;
|
package/services/floatingUI.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { computed, derived } from "@amadeus-it-group/tansu";
|
|
2
2
|
import { arrow, autoUpdate, computePosition } from "@floating-ui/dom";
|
|
3
|
-
import { j as createBrowserStoreDirective, k as mergeDirectives, d as directiveSubscribe } from "../directive-
|
|
3
|
+
import { j as createBrowserStoreDirective, k as mergeDirectives, d as directiveSubscribe } from "../directive-CKEccryv.js";
|
|
4
4
|
import { p as promiseStoreToValueStore } from "../promise-CY2U8bTP.js";
|
|
5
5
|
import { writablesForProps, stateStores } from "../utils/stores.js";
|
|
6
6
|
const defaultConfig = {
|
|
@@ -123,7 +123,8 @@ const createFloatingUI = (propsConfig) => {
|
|
|
123
123
|
* Directive to be used on the arrow element, if any
|
|
124
124
|
*/
|
|
125
125
|
arrowDirective: mergeDirectives(arrowDirective, directiveSubscribe(arrowStyleApplyAction$))
|
|
126
|
-
}
|
|
126
|
+
},
|
|
127
|
+
api: {}
|
|
127
128
|
};
|
|
128
129
|
};
|
|
129
130
|
export {
|
package/services/focustrack.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const tansu = require("@amadeus-it-group/tansu");
|
|
4
|
-
const utils_directive = require("../directive-
|
|
4
|
+
const utils_directive = require("../directive-DdlwGFtf.cjs");
|
|
5
5
|
const esmEnv = require("esm-env");
|
|
6
6
|
const evtFocusIn = "focusin";
|
|
7
7
|
const evtFocusOut = "focusout";
|
package/services/focustrack.d.ts
CHANGED
|
@@ -1,6 +1,27 @@
|
|
|
1
1
|
import type { ReadableSignal } from '@amadeus-it-group/tansu';
|
|
2
2
|
import type { Directive } from '../types';
|
|
3
|
+
/**
|
|
4
|
+
* A readable store that tracks the currently active (focused) element in the document.
|
|
5
|
+
*
|
|
6
|
+
* This store is only active in a browser environment. When not in a browser environment,
|
|
7
|
+
* it will be a readable store with a `null` value.
|
|
8
|
+
*
|
|
9
|
+
* @example
|
|
10
|
+
* ```typescript
|
|
11
|
+
* import { activeElement$ } from './focustrack';
|
|
12
|
+
*
|
|
13
|
+
* activeElement$.subscribe((element) => {
|
|
14
|
+
* console.log('Active element:', element);
|
|
15
|
+
* });
|
|
16
|
+
* ```
|
|
17
|
+
*
|
|
18
|
+
* The store updates whenever the active element changes, such as when the user focuses
|
|
19
|
+
* on a different input field or clicks on a different part of the document.
|
|
20
|
+
*/
|
|
3
21
|
export declare const activeElement$: ReadableSignal<Element | null>;
|
|
22
|
+
/**
|
|
23
|
+
* Interface representing an element that can have focus tracking.
|
|
24
|
+
*/
|
|
4
25
|
export interface HasFocus {
|
|
5
26
|
/**
|
|
6
27
|
* Directive to put on some elements.
|
package/services/focustrack.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { readable, computed } from "@amadeus-it-group/tansu";
|
|
2
|
-
import { g as createBrowserStoreArrayDirective } from "../directive-
|
|
2
|
+
import { g as createBrowserStoreArrayDirective } from "../directive-CKEccryv.js";
|
|
3
3
|
import { BROWSER } from "esm-env";
|
|
4
4
|
const evtFocusIn = "focusin";
|
|
5
5
|
const evtFocusOut = "focusout";
|
package/services/hash.d.ts
CHANGED
|
@@ -44,7 +44,7 @@ const createIntersection = (config) => {
|
|
|
44
44
|
/**
|
|
45
45
|
* Store of map that contains the visible elements (for the key) and the corresponding entries
|
|
46
46
|
*
|
|
47
|
-
*
|
|
47
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry | MDN documentation}
|
|
48
48
|
*/
|
|
49
49
|
visibleElements$: tansu.asReadable(visibleElements$),
|
|
50
50
|
patch
|
|
@@ -1,13 +1,17 @@
|
|
|
1
|
+
import { type ReadableSignal } from '@amadeus-it-group/tansu';
|
|
1
2
|
import type { PropsConfig } from '../types';
|
|
3
|
+
/**
|
|
4
|
+
* Interface representing the properties for the Intersection service.
|
|
5
|
+
*/
|
|
2
6
|
export interface IntersectionProps {
|
|
3
7
|
/**
|
|
4
8
|
* elements to observe
|
|
5
9
|
*/
|
|
6
10
|
elements: HTMLElement[];
|
|
7
11
|
/**
|
|
8
|
-
* IntersectionObserverInit used in the IntersectionObserver
|
|
12
|
+
* IntersectionObserverInit used in the {@link IntersectionObserver}
|
|
9
13
|
*
|
|
10
|
-
*
|
|
14
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver/IntersectionObserver#options | MDN documentation}
|
|
11
15
|
*/
|
|
12
16
|
options: Partial<IntersectionObserverInit> | undefined;
|
|
13
17
|
}
|
|
@@ -20,15 +24,7 @@ export interface IntersectionProps {
|
|
|
20
24
|
* @returns the intersection service
|
|
21
25
|
*/
|
|
22
26
|
export declare const createIntersection: (config?: PropsConfig<IntersectionProps>) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
elements$: import("@amadeus-it-group/tansu").ReadableSignal<HTMLElement[]>;
|
|
27
|
-
/**
|
|
28
|
-
* Store of map that contains the visible elements (for the key) and the corresponding entries
|
|
29
|
-
*
|
|
30
|
-
* See the [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry)
|
|
31
|
-
*/
|
|
32
|
-
visibleElements$: import("@amadeus-it-group/tansu").ReadableSignal<Map<Element, IntersectionObserverEntry>>;
|
|
33
|
-
patch: <U extends Partial<IntersectionProps>>(storesValues?: void | U | undefined) => void;
|
|
27
|
+
elements$: ReadableSignal<HTMLElement[]>;
|
|
28
|
+
visibleElements$: ReadableSignal<Map<Element, IntersectionObserverEntry>>;
|
|
29
|
+
patch: (storesValues: Partial<IntersectionProps>) => void;
|
|
34
30
|
};
|