@design-factory/core 21.1.0-next.1 → 22.0.0-next.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/{accordion-D9ba0XYq.js → accordion-B5RqDwi3.js} +76 -15
- package/alert-Db6cG6JE.js +125 -0
- package/{collapse-Bn8iHKrd.js → collapse-D8Jo56k9.js} +2 -2
- package/{common-DFyZvkII.js → common-CP4amR0Z.js} +2 -2
- package/components/accordion/accordion.d.ts +73 -15
- package/components/accordion/index.js +1 -1
- package/components/alert/alert.d.ts +77 -8
- package/components/alert/common.d.ts +9 -9
- package/components/alert/index.js +2 -3
- package/components/carousel/index.js +2 -2
- package/components/collapse/index.js +1 -1
- package/components/drawer/drawer.d.ts +6 -0
- package/components/drawer/index.js +1 -1
- package/components/dropdown/dropdown.d.ts +110 -0
- package/components/dropdown/index.d.ts +1 -0
- package/components/dropdown/index.js +5 -0
- package/components/modal/index.js +1 -1
- package/components/pagination/index.js +1 -1
- package/components/progressbar/index.js +1 -1
- package/components/rating/index.js +1 -1
- package/components/slider/index.js +1 -1
- package/components/slider/slider.d.ts +23 -4
- package/components/toast/index.js +1 -1
- package/components/tooltip/index.d.ts +1 -0
- package/components/tooltip/index.js +174 -0
- package/components/tooltip/tooltip.d.ts +63 -0
- package/components/tree/index.js +1 -1
- package/{directive-CNNSo5Yn.js → directive-CMT2vEDg.js} +7 -4
- package/{drawer-BIIfJa0F.js → drawer-CpGnS2ln.js} +12 -5
- package/dropdown-Bjj2ql6d.js +246 -0
- package/index.d.ts +3 -1
- package/index.js +44 -37
- package/isFocusable-C2iRr0zh.js +72 -0
- package/{modal-C13G13jV.js → modal-CQWh2Sm5.js} +4 -4
- package/package.json +1 -1
- package/{pagination-BQWusWXN.js → pagination-DIRcpdRE.js} +2 -2
- package/{progressbar-S1pNn5rM.js → progressbar-Bth8r3Qu.js} +2 -2
- package/{promise-D-RZVPuv.js → promise-CkIc0KKt.js} +3 -3
- package/{rating-DWgGgwk3.js → rating-DLsgFSyB.js} +2 -2
- package/{scrollbars-CcxSrnCx.js → scrollbars-ChGk75QR.js} +3 -0
- package/services/extendWidget.d.ts +1 -1
- package/services/focusElement.js +2 -2
- package/services/focustrack.js +2 -2
- package/services/matchMedia.js +1 -1
- package/services/mousetrack.d.ts +34 -0
- package/services/mousetrack.js +41 -0
- package/services/navManager.js +2 -2
- package/services/pointerdownPosition.js +1 -1
- package/services/portal.js +1 -1
- package/services/positioning.d.ts +101 -0
- package/services/positioning.js +104 -0
- package/services/resizeObserver.js +1 -1
- package/services/siblingsInert.js +1 -1
- package/services/transitions/baseTransitions.js +3 -3
- package/services/transitions/collapse.js +4 -7
- package/services/transitions/cssTransitions.js +2 -2
- package/services/transitions/simpleClassTransition.js +1 -1
- package/{slider-Br_Qiopx.js → slider-b9cVFNAL.js} +96 -58
- package/{toaster-BUBzFeJM.js → toaster-BS9qeRLF.js} +3 -3
- package/{tree-vD7ZkV8Z.js → tree-DW6iLxdw.js} +2 -2
- package/types.d.ts +8 -1
- package/utils/debounceSignal.d.ts +11 -0
- package/utils/debounceSignal.js +18 -0
- package/utils/directive.js +1 -1
- package/utils/edgeState.d.ts +23 -0
- package/utils/edgeState.js +43 -0
- package/utils/internal/isFocusable.d.ts +40 -0
- package/utils/stores.d.ts +1 -1
- package/utils/stores.js +4 -1
- package/utils/writables.d.ts +27 -13
- package/utils/writables.js +12 -11
- package/{writables-DYGjj5T3.js → writables-_7BriMb2.js} +37 -12
- package/accordion-B0vs8JWM.cjs +0 -314
- package/alert-AhaliJ17.cjs +0 -9
- package/alert-Cb9FhbFQ.js +0 -10
- package/collapse-BnWw4Hnc.cjs +0 -94
- package/common-B5jS-Ih_.cjs +0 -73
- package/components/accordion/index.cjs +0 -7
- package/components/alert/index.cjs +0 -5
- package/components/carousel/index.cjs +0 -292
- package/components/collapse/index.cjs +0 -5
- package/components/drawer/index.cjs +0 -5
- package/components/modal/index.cjs +0 -8
- package/components/pagination/index.cjs +0 -5
- package/components/progressbar/index.cjs +0 -5
- package/components/rating/index.cjs +0 -5
- package/components/slider/index.cjs +0 -5
- package/components/toast/index.cjs +0 -7
- package/components/tree/index.cjs +0 -5
- package/config.cjs +0 -36
- package/directive-DyTodNPd.cjs +0 -523
- package/drawer-C8ojtwIn.cjs +0 -328
- package/index.cjs +0 -134
- package/isFocusable-Ckwus82R.js +0 -32
- package/isFocusable-DfzDLeAN.cjs +0 -31
- package/modal-DWv0VqiG.cjs +0 -252
- package/pagination-BLVa1UsZ.cjs +0 -254
- package/progressbar-RopgvVeA.cjs +0 -86
- package/promise-CxCD3NYv.cjs +0 -118
- package/rating-DZ3OQgtt.cjs +0 -183
- package/scrollbars-CT87iv_6.cjs +0 -30
- package/services/extendWidget.cjs +0 -41
- package/services/floatingUI.cjs +0 -111
- package/services/floatingUI.d.ts +0 -76
- package/services/floatingUI.js +0 -111
- package/services/focusElement.cjs +0 -46
- package/services/focustrack.cjs +0 -47
- package/services/hash.cjs +0 -15
- package/services/intersection.cjs +0 -53
- package/services/matchMedia.cjs +0 -14
- package/services/navManager.cjs +0 -166
- package/services/pointerdownPosition.cjs +0 -60
- package/services/portal.cjs +0 -42
- package/services/resizeObserver.cjs +0 -54
- package/services/siblingsInert.cjs +0 -44
- package/services/transitions/baseTransitions.cjs +0 -186
- package/services/transitions/collapse.cjs +0 -40
- package/services/transitions/cssTransitions.cjs +0 -32
- package/services/transitions/simpleClassTransition.cjs +0 -37
- package/slider-pgDq1V5r.cjs +0 -807
- package/textDirection-zqcZ5-eK.cjs +0 -3
- package/toaster-Dlube4Ya.cjs +0 -161
- package/tree-Chcy4ulJ.cjs +0 -228
- package/types.cjs +0 -6
- package/utils/directive.cjs +0 -28
- package/utils/func.cjs +0 -7
- package/utils/id.cjs +0 -5
- package/utils/stores.cjs +0 -172
- package/utils/widget.cjs +0 -8
- package/utils/writables.cjs +0 -16
- package/writables-Dt68gADJ.cjs +0 -102
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import { computed, writable, readable } from "@amadeus-it-group/tansu";
|
|
2
|
-
import { i as createBrowserStoreDirective, h as createBrowserStoreArrayDirective, s as mergeDirectives, g as createAttributesDirective, d as browserDirective } from "./directive-
|
|
1
|
+
import { computed, derived, writable, readable } from "@amadeus-it-group/tansu";
|
|
2
|
+
import { i as createBrowserStoreDirective, h as createBrowserStoreArrayDirective, s as mergeDirectives, g as createAttributesDirective, o as directiveSubscribe, d as browserDirective } from "./directive-CMT2vEDg.js";
|
|
3
3
|
import { noop } from "./utils/func.js";
|
|
4
4
|
import { writablesForProps, bindableProp, true$, stateStores } from "./utils/stores.js";
|
|
5
|
-
import {
|
|
5
|
+
import { i as typeNumberInRangeFactory, d as typeBoolean, k as typeString, b as typeArray, f as typeFunction, h as typeNumber, m as clamp } from "./writables-_7BriMb2.js";
|
|
6
6
|
import { createResizeObserver, createResizeObserverMap } from "./services/resizeObserver.js";
|
|
7
7
|
import { createPointerdownPositionDirective } from "./services/pointerdownPosition.js";
|
|
8
8
|
import { createWidgetFactory } from "./utils/widget.js";
|
|
9
|
+
import { g as getTextDirection } from "./textDirection-cNgt24LJ.js";
|
|
9
10
|
const decimalRegExp = /(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/;
|
|
10
11
|
function getDecimalPrecision(number) {
|
|
11
12
|
const matches = ("" + number).match(decimalRegExp);
|
|
@@ -90,7 +91,8 @@ const defaultSliderConfig = {
|
|
|
90
91
|
minRange: 0,
|
|
91
92
|
maxRange: 0,
|
|
92
93
|
pushRange: false,
|
|
93
|
-
|
|
94
|
+
flip: false,
|
|
95
|
+
rtl: void 0
|
|
94
96
|
};
|
|
95
97
|
function getSliderDefaultConfig() {
|
|
96
98
|
return { ...defaultSliderConfig };
|
|
@@ -112,6 +114,7 @@ const configValidator = {
|
|
|
112
114
|
showTicks: typeBoolean,
|
|
113
115
|
showTickValues: typeBoolean,
|
|
114
116
|
tickInterval: typeNumberInRangeFactory(0, Infinity, { strict: true }),
|
|
117
|
+
flip: typeBoolean,
|
|
115
118
|
rtl: typeBoolean,
|
|
116
119
|
className: typeString,
|
|
117
120
|
minRange: typeNumberInRangeFactory(0, Infinity),
|
|
@@ -160,6 +163,7 @@ const createSlider = createWidgetFactory(
|
|
|
160
163
|
maxRange$: _dirtyMaximumRange$,
|
|
161
164
|
pushRange$,
|
|
162
165
|
stepSize$,
|
|
166
|
+
flip$,
|
|
163
167
|
rtl$,
|
|
164
168
|
values$: _dirtyValues$,
|
|
165
169
|
ariaLabel$,
|
|
@@ -244,6 +248,31 @@ const createSlider = createWidgetFactory(
|
|
|
244
248
|
const { directive: resizeDirective, dimensions$ } = createResizeObserver();
|
|
245
249
|
const { directive: resizeLabelsDirective, dimensionsMap$: handleDimensions$ } = createResizeObserverMap();
|
|
246
250
|
const { directive: resizeCombineLabelDirective, dimensions$: combinedDimensions$ } = createResizeObserver();
|
|
251
|
+
const autoDetectedRtl$ = derived(
|
|
252
|
+
sliderDom$,
|
|
253
|
+
(el, set) => {
|
|
254
|
+
if (!el) {
|
|
255
|
+
set(false);
|
|
256
|
+
return noop;
|
|
257
|
+
}
|
|
258
|
+
set(getTextDirection(el) === "rtl");
|
|
259
|
+
const observer = new MutationObserver(() => {
|
|
260
|
+
set(getTextDirection(el) === "rtl");
|
|
261
|
+
});
|
|
262
|
+
let current = el;
|
|
263
|
+
while (current) {
|
|
264
|
+
observer.observe(current, { attributes: true, attributeFilter: ["dir"] });
|
|
265
|
+
current = current.parentElement;
|
|
266
|
+
}
|
|
267
|
+
return () => observer.disconnect();
|
|
268
|
+
},
|
|
269
|
+
false
|
|
270
|
+
);
|
|
271
|
+
const resolvedRtl$ = computed(() => {
|
|
272
|
+
const explicit = rtl$();
|
|
273
|
+
return explicit !== void 0 ? explicit : autoDetectedRtl$();
|
|
274
|
+
});
|
|
275
|
+
const effectiveRtl$ = computed(() => resolvedRtl$() !== flip$());
|
|
247
276
|
const updateSliderSize$ = writable({});
|
|
248
277
|
const sliderDomRect$ = computed(
|
|
249
278
|
() => {
|
|
@@ -315,7 +344,7 @@ const createSlider = createWidgetFactory(
|
|
|
315
344
|
}
|
|
316
345
|
const minLabelSize = minLabelSize$();
|
|
317
346
|
const vertical = vertical$();
|
|
318
|
-
const rtl =
|
|
347
|
+
const rtl = effectiveRtl$();
|
|
319
348
|
if (combinedLabelDisplay$()) {
|
|
320
349
|
const combinedLabelSize = combinedLabelSize$();
|
|
321
350
|
const combinedLabelPosition = combinedLabelPosition$();
|
|
@@ -332,7 +361,7 @@ const createSlider = createWidgetFactory(
|
|
|
332
361
|
}
|
|
333
362
|
const maxLabelSize = maxLabelSize$();
|
|
334
363
|
const vertical = vertical$();
|
|
335
|
-
const rtl =
|
|
364
|
+
const rtl = effectiveRtl$();
|
|
336
365
|
if (combinedLabelDisplay$()) {
|
|
337
366
|
const combinedLabelSize = combinedLabelSize$();
|
|
338
367
|
const combinedLabelPosition = combinedLabelPosition$();
|
|
@@ -369,15 +398,15 @@ const createSlider = createWidgetFactory(
|
|
|
369
398
|
const combinedLabelSize = combinedLabelSize$();
|
|
370
399
|
let combinedPosition = (sortedValuesPercent[0] + sortedValuesPercent[1]) / 2;
|
|
371
400
|
combinedPosition = labelPosition(combinedPosition, combinedLabelSize);
|
|
372
|
-
return vertical$() || sortedValuesPercent.length != 2 ? 0 :
|
|
401
|
+
return vertical$() || sortedValuesPercent.length != 2 ? 0 : effectiveRtl$() ? 100 - combinedPosition : combinedPosition;
|
|
373
402
|
});
|
|
374
403
|
const combinedLabelPositionTop$ = computed(() => {
|
|
375
404
|
const sortedValuesPercent = sortedValuesPercent$();
|
|
376
405
|
const combinedPosition = 100 - (sortedValuesPercent[0] + sortedValuesPercent[1]) / 2;
|
|
377
|
-
return vertical$() && sortedValuesPercent.length == 2 ?
|
|
406
|
+
return vertical$() && sortedValuesPercent.length == 2 ? effectiveRtl$() ? 100 - combinedPosition : combinedPosition : 0;
|
|
378
407
|
});
|
|
379
408
|
const handleDisplayOptions$ = computed(() => {
|
|
380
|
-
const vertical = vertical$(), rtl =
|
|
409
|
+
const vertical = vertical$(), rtl = effectiveRtl$();
|
|
381
410
|
return valuesPercent$().map((vp) => {
|
|
382
411
|
return {
|
|
383
412
|
left: rtl ? vertical ? null : 100 - vp : vertical ? null : vp,
|
|
@@ -387,7 +416,7 @@ const createSlider = createWidgetFactory(
|
|
|
387
416
|
});
|
|
388
417
|
const labelPosition = (initialPosition, labelSize) => clamp(initialPosition, 100 - labelSize / 2, labelSize / 2);
|
|
389
418
|
const progressDisplayOptions$ = computed(() => {
|
|
390
|
-
const vertical = vertical$(), sortedValuesPercent = sortedValuesPercent$(), rtl =
|
|
419
|
+
const vertical = vertical$(), sortedValuesPercent = sortedValuesPercent$(), rtl = effectiveRtl$();
|
|
391
420
|
if (sortedValuesPercent.length === 1) {
|
|
392
421
|
return [
|
|
393
422
|
{
|
|
@@ -421,7 +450,7 @@ const createSlider = createWidgetFactory(
|
|
|
421
450
|
const vertical = vertical$();
|
|
422
451
|
const min = min$();
|
|
423
452
|
const max = max$();
|
|
424
|
-
const rtl =
|
|
453
|
+
const rtl = effectiveRtl$();
|
|
425
454
|
const showTickValues = showTickValues$();
|
|
426
455
|
const tickInterval = tickInterval$() || stepSize$();
|
|
427
456
|
const tickArray = [];
|
|
@@ -479,7 +508,7 @@ const createSlider = createWidgetFactory(
|
|
|
479
508
|
const getClickedPercent = (clickedCoordinate) => {
|
|
480
509
|
const sliderDomRectSize = sliderDomRectSize$(), sliderDomRectOffset = sliderDomRectOffset$();
|
|
481
510
|
let clickedPercent = vertical$() ? (sliderDomRectSize - clickedCoordinate + sliderDomRectOffset) / sliderDomRectSize : (clickedCoordinate - sliderDomRectOffset) / sliderDomRectSize;
|
|
482
|
-
clickedPercent =
|
|
511
|
+
clickedPercent = effectiveRtl$() ? 1 - clickedPercent : clickedPercent;
|
|
483
512
|
return clickedPercent;
|
|
484
513
|
};
|
|
485
514
|
const adjustCoordinate = (clickedCoordinate, handleNumber) => {
|
|
@@ -497,9 +526,9 @@ const createSlider = createWidgetFactory(
|
|
|
497
526
|
const horizontal$ = computed(() => !vertical$());
|
|
498
527
|
const containerDirective = createAttributesDirective(() => ({
|
|
499
528
|
classNames: {
|
|
500
|
-
"
|
|
501
|
-
"
|
|
502
|
-
"
|
|
529
|
+
"df-slider": true$,
|
|
530
|
+
"df-slider-vertical": vertical$,
|
|
531
|
+
"df-slider-horizontal": horizontal$
|
|
503
532
|
},
|
|
504
533
|
attributes: {
|
|
505
534
|
class: stateProps.className$
|
|
@@ -511,23 +540,23 @@ const createSlider = createWidgetFactory(
|
|
|
511
540
|
class: stateProps.className$
|
|
512
541
|
},
|
|
513
542
|
classNames: {
|
|
514
|
-
"
|
|
515
|
-
"
|
|
516
|
-
"
|
|
517
|
-
"
|
|
543
|
+
"df-slider-content": true$,
|
|
544
|
+
"df-slider-vertical": vertical$,
|
|
545
|
+
"df-slider-horizontal": horizontal$,
|
|
546
|
+
"df-slider-with-labels": computed(
|
|
518
547
|
() => showValueLabels$() || showMinMaxLabels$() || showTickValues$() && showTicks$()
|
|
519
548
|
),
|
|
520
|
-
disabled: disabled$
|
|
549
|
+
"df-slider-disabled": disabled$
|
|
521
550
|
}
|
|
522
551
|
}));
|
|
523
552
|
const minLabelDirective = createAttributesDirective(() => ({
|
|
524
553
|
classNames: {
|
|
525
|
-
"
|
|
526
|
-
"
|
|
527
|
-
"
|
|
528
|
-
"
|
|
529
|
-
"
|
|
530
|
-
invisible: computed(() => !minValueLabelDisplay$())
|
|
554
|
+
"df-slider-label-vertical": vertical$,
|
|
555
|
+
"df-slider-label-vertical-min": vertical$,
|
|
556
|
+
"df-slider-label": horizontal$,
|
|
557
|
+
"df-slider-label-min": horizontal$,
|
|
558
|
+
"df-slider-rtl": effectiveRtl$,
|
|
559
|
+
"df-slider-invisible": computed(() => !minValueLabelDisplay$())
|
|
531
560
|
},
|
|
532
561
|
attributes: {
|
|
533
562
|
"aria-hidden": readable("true")
|
|
@@ -535,12 +564,12 @@ const createSlider = createWidgetFactory(
|
|
|
535
564
|
}));
|
|
536
565
|
const maxLabelDirective = createAttributesDirective(() => ({
|
|
537
566
|
classNames: {
|
|
538
|
-
"
|
|
539
|
-
"
|
|
540
|
-
"
|
|
541
|
-
"
|
|
542
|
-
"
|
|
543
|
-
invisible: computed(() => !maxValueLabelDisplay$())
|
|
567
|
+
"df-slider-label-vertical": vertical$,
|
|
568
|
+
"df-slider-label-vertical-max": vertical$,
|
|
569
|
+
"df-slider-label": horizontal$,
|
|
570
|
+
"df-slider-label-max": horizontal$,
|
|
571
|
+
"df-slider-rtl": effectiveRtl$,
|
|
572
|
+
"df-slider-invisible": computed(() => !maxValueLabelDisplay$())
|
|
544
573
|
},
|
|
545
574
|
attributes: {
|
|
546
575
|
"aria-hidden": readable("true")
|
|
@@ -588,7 +617,7 @@ const createSlider = createWidgetFactory(
|
|
|
588
617
|
keydown: (event) => {
|
|
589
618
|
const handleIndex = handleContext$().item.id;
|
|
590
619
|
const { key } = event;
|
|
591
|
-
const rtl =
|
|
620
|
+
const rtl = effectiveRtl$(), stepSize = stepSize$(), min = min$(), max = max$(), vertical = vertical$();
|
|
592
621
|
if (interactive$()) {
|
|
593
622
|
switch (key) {
|
|
594
623
|
case "ArrowDown":
|
|
@@ -652,14 +681,23 @@ const createSlider = createWidgetFactory(
|
|
|
652
681
|
showValueLabels$: adjustedShowValueLabels$,
|
|
653
682
|
showMinMaxLabels$,
|
|
654
683
|
showTicks$,
|
|
655
|
-
|
|
684
|
+
flip$,
|
|
685
|
+
rtl$: resolvedRtl$,
|
|
656
686
|
ticks$,
|
|
657
687
|
...stateProps
|
|
658
688
|
}),
|
|
659
689
|
patch,
|
|
660
690
|
api: {},
|
|
661
691
|
directives: {
|
|
662
|
-
|
|
692
|
+
// Eagerly subscribe to dimensions$ so the slider-content ResizeObserver is active before the
|
|
693
|
+
// value-label ResizeObserver callback runs. This prevents the "ResizeObserver loop completed
|
|
694
|
+
// with undelivered notifications" error caused by label layout changes triggered mid-callback.
|
|
695
|
+
sliderDirective: mergeDirectives(
|
|
696
|
+
sliderDirective,
|
|
697
|
+
resizeDirective,
|
|
698
|
+
directiveSubscribe(dimensions$),
|
|
699
|
+
contentDirective
|
|
700
|
+
),
|
|
663
701
|
containerDirective,
|
|
664
702
|
progressDisplayDirective: createAttributesDirective(
|
|
665
703
|
(progressContext$) => ({
|
|
@@ -672,16 +710,16 @@ const createSlider = createWidgetFactory(
|
|
|
672
710
|
height: computed(() => percent(progressContext$().option.height))
|
|
673
711
|
},
|
|
674
712
|
classNames: {
|
|
675
|
-
"
|
|
713
|
+
"df-slider-progress": true$
|
|
676
714
|
}
|
|
677
715
|
})
|
|
678
716
|
),
|
|
679
717
|
clickableAreaDirective: mergeDirectives(
|
|
680
718
|
createAttributesDirective(() => ({
|
|
681
719
|
classNames: {
|
|
682
|
-
"
|
|
683
|
-
"
|
|
684
|
-
"
|
|
720
|
+
"df-slider-clickable-area": horizontal$,
|
|
721
|
+
"df-slider-clickable-area-vertical": vertical$,
|
|
722
|
+
"df-slider-clickable-area-with-ticks": computed(() => showTicks$() && tickInterval$() === 0)
|
|
685
723
|
}
|
|
686
724
|
})),
|
|
687
725
|
createPointerdownPositionDirective((position) => {
|
|
@@ -714,9 +752,9 @@ const createSlider = createWidgetFactory(
|
|
|
714
752
|
top: computed(() => percent(handleDisplayOptions$()[handleContext$().item.id].top))
|
|
715
753
|
},
|
|
716
754
|
classNames: {
|
|
717
|
-
"
|
|
718
|
-
"
|
|
719
|
-
"
|
|
755
|
+
"df-slider-handle": true$,
|
|
756
|
+
"df-slider-handle-vertical": vertical$,
|
|
757
|
+
"df-slider-handle-horizontal": horizontal$
|
|
720
758
|
}
|
|
721
759
|
}))
|
|
722
760
|
),
|
|
@@ -726,14 +764,14 @@ const createSlider = createWidgetFactory(
|
|
|
726
764
|
resizeCombineLabelDirective,
|
|
727
765
|
createAttributesDirective(() => ({
|
|
728
766
|
classNames: {
|
|
729
|
-
"
|
|
730
|
-
"
|
|
731
|
-
"
|
|
732
|
-
"
|
|
767
|
+
"df-slider-label-vertical": vertical$,
|
|
768
|
+
"df-slider-label-vertical-now": vertical$,
|
|
769
|
+
"df-slider-label": horizontal$,
|
|
770
|
+
"df-slider-label-now": horizontal$
|
|
733
771
|
},
|
|
734
772
|
styles: {
|
|
735
|
-
left: computed(() => percent(combinedLabelPositionLeft$())),
|
|
736
|
-
top: computed(() => percent(combinedLabelPositionTop$()))
|
|
773
|
+
left: computed(() => vertical$() ? "" : percent(combinedLabelPositionLeft$())),
|
|
774
|
+
top: computed(() => vertical$() ? percent(combinedLabelPositionTop$()) : "")
|
|
737
775
|
},
|
|
738
776
|
attributes: {
|
|
739
777
|
"aria-hidden": readable("true")
|
|
@@ -745,10 +783,10 @@ const createSlider = createWidgetFactory(
|
|
|
745
783
|
resizeLabelsDirective,
|
|
746
784
|
createAttributesDirective((labelDisplayContext$) => ({
|
|
747
785
|
classNames: {
|
|
748
|
-
"
|
|
749
|
-
"
|
|
750
|
-
"
|
|
751
|
-
"
|
|
786
|
+
"df-slider-label-vertical": vertical$,
|
|
787
|
+
"df-slider-label-vertical-now": vertical$,
|
|
788
|
+
"df-slider-label": horizontal$,
|
|
789
|
+
"df-slider-label-now": horizontal$
|
|
752
790
|
},
|
|
753
791
|
styles: {
|
|
754
792
|
left: computed(() => {
|
|
@@ -766,9 +804,9 @@ const createSlider = createWidgetFactory(
|
|
|
766
804
|
),
|
|
767
805
|
tickDirective: createAttributesDirective((tickContext$) => ({
|
|
768
806
|
classNames: {
|
|
769
|
-
"
|
|
770
|
-
"
|
|
771
|
-
"
|
|
807
|
+
"df-slider-tick": true$,
|
|
808
|
+
"df-slider-tick-horizontal": horizontal$,
|
|
809
|
+
"df-slider-tick-vertical": vertical$
|
|
772
810
|
},
|
|
773
811
|
styles: {
|
|
774
812
|
left: computed(() => vertical$() ? null : percent(tickContext$().tick.position)),
|
|
@@ -785,9 +823,9 @@ const createSlider = createWidgetFactory(
|
|
|
785
823
|
})),
|
|
786
824
|
tickLabelDirective: createAttributesDirective((tickContext$) => ({
|
|
787
825
|
classNames: {
|
|
788
|
-
"
|
|
789
|
-
"
|
|
790
|
-
"
|
|
826
|
+
"df-slider-tick-label": true$,
|
|
827
|
+
"df-slider-tick-label-vertical": vertical$,
|
|
828
|
+
"df-slider-tick-label-now": computed(() => sortedValues$().some((sv) => sv === tickContext$().tick.value))
|
|
791
829
|
},
|
|
792
830
|
styles: {
|
|
793
831
|
left: computed(() => vertical$() ? null : percent(tickContext$().tick.position)),
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { computed, readable, writable } from "@amadeus-it-group/tansu";
|
|
2
2
|
import { extendWidgetProps } from "./services/extendWidget.js";
|
|
3
|
-
import { o as directiveSubscribe, g as createAttributesDirective } from "./directive-
|
|
3
|
+
import { o as directiveSubscribe, g as createAttributesDirective } from "./directive-CMT2vEDg.js";
|
|
4
4
|
import { true$ } from "./utils/stores.js";
|
|
5
|
-
import {
|
|
6
|
-
import { g as getCommonAlertDefaultConfig, c as createCommonAlert } from "./common-
|
|
5
|
+
import { i as typeNumberInRangeFactory, d as typeBoolean } from "./writables-_7BriMb2.js";
|
|
6
|
+
import { g as getCommonAlertDefaultConfig, c as createCommonAlert } from "./common-CP4amR0Z.js";
|
|
7
7
|
import { createWidgetFactory } from "./utils/widget.js";
|
|
8
8
|
const toastDefaultConfig = {
|
|
9
9
|
autoHide: true,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { writable, computed, readable } from "@amadeus-it-group/tansu";
|
|
2
2
|
import { createNavManager } from "./services/navManager.js";
|
|
3
|
-
import { s as mergeDirectives, d as browserDirective, g as createAttributesDirective, b as bindDirective } from "./directive-
|
|
3
|
+
import { s as mergeDirectives, d as browserDirective, g as createAttributesDirective, b as bindDirective } from "./directive-CMT2vEDg.js";
|
|
4
4
|
import { noop } from "./utils/func.js";
|
|
5
5
|
import { writablesForProps, stateStores, true$ } from "./utils/stores.js";
|
|
6
|
-
import {
|
|
6
|
+
import { f as typeFunction, b as typeArray, k as typeString } from "./writables-_7BriMb2.js";
|
|
7
7
|
import { createWidgetFactory } from "./utils/widget.js";
|
|
8
8
|
function getTreeDefaultConfig() {
|
|
9
9
|
return {
|
package/types.d.ts
CHANGED
|
@@ -173,7 +173,14 @@ export declare const INVALID_VALUE: unique symbol;
|
|
|
173
173
|
* @param value - The value to be normalized.
|
|
174
174
|
* @returns The normalized value of type `T` or `INVALID_VALUE` if the value is invalid.
|
|
175
175
|
*/
|
|
176
|
-
export type NormalizeValue<T> = (value:
|
|
176
|
+
export type NormalizeValue<T> = (value: unknown) => T | typeof INVALID_VALUE;
|
|
177
|
+
/**
|
|
178
|
+
* Makes the specified keys of a type required while keeping the rest unchanged.
|
|
179
|
+
*
|
|
180
|
+
* @template T - The original type.
|
|
181
|
+
* @template K - The keys to make required.
|
|
182
|
+
*/
|
|
183
|
+
export type PickRequired<T, K extends keyof T> = Omit<T, K> & Required<Pick<T, K>>;
|
|
177
184
|
/**
|
|
178
185
|
* Interface representing options for a writable store with default values.
|
|
179
186
|
*
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ReadableSignal } from '@amadeus-it-group/tansu';
|
|
2
|
+
/**
|
|
3
|
+
* Creates a debounced readable signal from a source signal.
|
|
4
|
+
*
|
|
5
|
+
* @template T - The type of the signal value
|
|
6
|
+
* @param source$ - The source readable signal to debounce
|
|
7
|
+
* @param delay - The debounce delay in milliseconds, or a function that returns the delay based on the value. If the delay is negative, the value is emitted immediately without debouncing.
|
|
8
|
+
* @param initialValue - The initial value of the debounced signal (defaults to the source signal's current value)
|
|
9
|
+
* @returns A readable signal that emits values from the source signal after the specified delay
|
|
10
|
+
*/
|
|
11
|
+
export declare const debounceSignal: <T>(source$: ReadableSignal<T>, delay: number | ((value: T) => number), initialValue?: T) => ReadableSignal<T>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { derived } from "@amadeus-it-group/tansu";
|
|
2
|
+
const debounceSignal = (source$, delay, initialValue = source$()) => derived(
|
|
3
|
+
source$,
|
|
4
|
+
(value, set) => {
|
|
5
|
+
const delayValue = typeof delay === "function" ? delay(value) : delay;
|
|
6
|
+
if (delayValue >= 0) {
|
|
7
|
+
const timeout = setTimeout(() => set(value), delayValue);
|
|
8
|
+
return () => clearTimeout(timeout);
|
|
9
|
+
} else {
|
|
10
|
+
set(value);
|
|
11
|
+
return void 0;
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
initialValue
|
|
15
|
+
);
|
|
16
|
+
export {
|
|
17
|
+
debounceSignal
|
|
18
|
+
};
|
package/utils/directive.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import "@amadeus-it-group/tansu";
|
|
2
2
|
import "esm-env";
|
|
3
|
-
import { a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u, v } from "../directive-
|
|
3
|
+
import { a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u, v } from "../directive-CMT2vEDg.js";
|
|
4
4
|
import "./func.js";
|
|
5
5
|
export {
|
|
6
6
|
a as attributesData,
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import type { ReadableSignal, WritableSignal } from '@amadeus-it-group/tansu';
|
|
2
|
+
export interface EdgeState<Source extends string = string> extends WritableSignal<boolean> {
|
|
3
|
+
/**
|
|
4
|
+
* Skips the next update from a source when it matches the provided value.
|
|
5
|
+
*
|
|
6
|
+
* @param source - The source signal to skip the next matching update from.
|
|
7
|
+
* @param value - The value to skip.
|
|
8
|
+
*/
|
|
9
|
+
skipNextSourceValue: (source: Source, value: boolean) => void;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Creates an edge-triggered boolean state from multiple input signals.
|
|
13
|
+
*
|
|
14
|
+
* Unlike a simple `computed(() => a() || b())`, this tracks which input signal
|
|
15
|
+
* last changed and adopts its value. This enables a "dismissed" state: an imperative
|
|
16
|
+
* `set(false)` hides the output even while some inputs remain `true`, and the next
|
|
17
|
+
* edge (any input changing) overrides the imperative value.
|
|
18
|
+
*
|
|
19
|
+
* @param sources - Boolean signals to track. The output follows whichever one last changed.
|
|
20
|
+
* @param guard - Optional signal that forces the output to `false` while truthy (e.g. `disabled$`).
|
|
21
|
+
* @return A writable signal that can be set imperatively, but also updates on edges of the input signals.
|
|
22
|
+
*/
|
|
23
|
+
export declare const createEdgeState: <const Sources extends Record<string, ReadableSignal<boolean>>>(sources: Sources, guard?: ReadableSignal<boolean>) => EdgeState<keyof Sources & string>;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { writable, computed, asWritable } from "@amadeus-it-group/tansu";
|
|
2
|
+
const createEdgeState = (sources, guard) => {
|
|
3
|
+
const sourceList = Object.entries(sources).map(([name, signal]) => ({
|
|
4
|
+
name,
|
|
5
|
+
signal,
|
|
6
|
+
current: false,
|
|
7
|
+
previous: false
|
|
8
|
+
}));
|
|
9
|
+
const sourceByName = new Map(sourceList.map((source) => [source.name, source]));
|
|
10
|
+
let prevTrigger = { value: false };
|
|
11
|
+
const trigger$ = writable(prevTrigger);
|
|
12
|
+
let state = false;
|
|
13
|
+
const state$ = computed(() => {
|
|
14
|
+
for (const source of sourceList) {
|
|
15
|
+
source.current = source.signal();
|
|
16
|
+
}
|
|
17
|
+
const t = trigger$();
|
|
18
|
+
if (guard?.()) {
|
|
19
|
+
state = false;
|
|
20
|
+
} else {
|
|
21
|
+
const changed = sourceList.find((source) => source.current !== source.previous);
|
|
22
|
+
if (changed !== void 0) {
|
|
23
|
+
state = changed.current;
|
|
24
|
+
} else if (t !== prevTrigger) {
|
|
25
|
+
state = t.value;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
for (const source of sourceList) {
|
|
29
|
+
source.previous = source.current;
|
|
30
|
+
}
|
|
31
|
+
prevTrigger = t;
|
|
32
|
+
return state;
|
|
33
|
+
});
|
|
34
|
+
return asWritable(state$, {
|
|
35
|
+
set: (v) => trigger$.set({ value: v }),
|
|
36
|
+
skipNextSourceValue: (source, value) => {
|
|
37
|
+
sourceByName.get(source).previous = value;
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
export {
|
|
42
|
+
createEdgeState
|
|
43
|
+
};
|
|
@@ -7,3 +7,43 @@
|
|
|
7
7
|
* @returns true if the element is programmatically focusable.
|
|
8
8
|
*/
|
|
9
9
|
export declare const isFocusable: (element: HTMLElement) => boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Returns the next element in depth-first order after the given element's subtree
|
|
12
|
+
* (i.e. without descending into its descendants), or null if there is none.
|
|
13
|
+
*
|
|
14
|
+
* @param element - element whose subtree should be skipped
|
|
15
|
+
* @returns the next element after the subtree, or null.
|
|
16
|
+
*/
|
|
17
|
+
export declare const findNextElementSkippingSubtree: (element: HTMLElement) => HTMLElement | null;
|
|
18
|
+
/**
|
|
19
|
+
* Returns the next element after the given one in depth-first (pre-order) document order,
|
|
20
|
+
* or null if the given element is the last one in the document.
|
|
21
|
+
*
|
|
22
|
+
* @param element - element to start from
|
|
23
|
+
* @returns the next element in depth-first order, or null.
|
|
24
|
+
*/
|
|
25
|
+
export declare const findNextElement: (element: HTMLElement) => HTMLElement | null;
|
|
26
|
+
/**
|
|
27
|
+
* Returns the previous element before the given one in depth-first (pre-order) document order,
|
|
28
|
+
* or null if the given element is the first one in the document.
|
|
29
|
+
*
|
|
30
|
+
* @param element - element to start from
|
|
31
|
+
* @returns the previous element in depth-first order, or null.
|
|
32
|
+
*/
|
|
33
|
+
export declare const findPreviousElement: (element: HTMLElement) => HTMLElement | null;
|
|
34
|
+
/**
|
|
35
|
+
* Finds the next focusable element after the given one in document order.
|
|
36
|
+
*
|
|
37
|
+
* @param element - element to start from
|
|
38
|
+
* @param findNextElementFn - optional function to customize element traversal order (defaults to depth-first pre-order)
|
|
39
|
+
* @returns the next focusable element, or null if none found.
|
|
40
|
+
*/
|
|
41
|
+
export declare const findNextFocusableElement: (element: HTMLElement, findNextElementFn?: (element: HTMLElement) => HTMLElement | null) => HTMLElement | null;
|
|
42
|
+
/**
|
|
43
|
+
* Finds the previous focusable element before the given one in document order.
|
|
44
|
+
*
|
|
45
|
+
* @param element - element to start from
|
|
46
|
+
* @param findPreviousElementFn - optional function to customize element traversal order (defaults to depth-first pre-order)
|
|
47
|
+
* @returns the previous focusable element, or null if none found.
|
|
48
|
+
*/
|
|
49
|
+
export declare const findPreviousFocusableElement: (element: HTMLElement, findPreviousElementFn?: (element: HTMLElement) => HTMLElement | null) => HTMLElement | null;
|
package/utils/stores.d.ts
CHANGED
|
@@ -176,7 +176,7 @@ export declare const writablesWithDefault: <T extends object>(defConfig: T, prop
|
|
|
176
176
|
* const [{propA$, propB$}, patch] = writablesForProps(defConfig, config, validation);
|
|
177
177
|
* ```
|
|
178
178
|
*/
|
|
179
|
-
export declare const writablesForProps: <T extends object>(defConfig: T, propsConfig?: PropsConfig<T>, options?:
|
|
179
|
+
export declare const writablesForProps: <T extends object>(defConfig: T, propsConfig?: PropsConfig<T>, options?: ConfigValidator<T>) => [ToWritableSignal<T>, ReturnType<typeof createPatch<T>>];
|
|
180
180
|
/**
|
|
181
181
|
* Using input stores, this function builds an object containing the stores as readable and a global state.
|
|
182
182
|
*
|
package/utils/stores.js
CHANGED
|
@@ -63,7 +63,10 @@ const normalizeConfigStores = (keys, config) => {
|
|
|
63
63
|
if (config) {
|
|
64
64
|
const configIsStore = isStore(config);
|
|
65
65
|
for (const key of keys) {
|
|
66
|
-
res[key] = configIsStore ? computed(() => config()[key]) :
|
|
66
|
+
res[key] = configIsStore ? computed(() => config()[key]) : (
|
|
67
|
+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
|
|
68
|
+
toReadableStore(config[key])
|
|
69
|
+
);
|
|
67
70
|
}
|
|
68
71
|
}
|
|
69
72
|
return res;
|