@agnos-ui/core 0.9.3 → 0.10.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.
Files changed (108) hide show
  1. package/{accordion-CoM4efp-.js → accordion-CcirvrjR.js} +10 -15
  2. package/{accordion-cR5JqWJ8.cjs → accordion-yD-czBna.cjs} +10 -15
  3. package/{alert-DtDozJal.cjs → alert-B-jQDQcB.cjs} +1 -1
  4. package/{alert-YIlqdEPO.js → alert-gGz2CDS9.js} +1 -1
  5. package/{collapse-DwXz2kNw.js → collapse-BV4kD3j9.js} +2 -2
  6. package/{collapse-DRp53EuG.cjs → collapse-gLiT080Y.cjs} +2 -2
  7. package/{common-BToNPUDq.cjs → common-D3QcdJ6S.cjs} +1 -1
  8. package/{common-BqUjUBPy.js → common-DK0ADNTX.js} +1 -1
  9. package/components/accordion/index.cjs +1 -1
  10. package/components/accordion/index.js +1 -1
  11. package/components/alert/index.cjs +1 -1
  12. package/components/alert/index.js +1 -1
  13. package/components/carousel/index.cjs +10 -23
  14. package/components/carousel/index.js +10 -23
  15. package/components/collapse/index.cjs +1 -1
  16. package/components/collapse/index.js +1 -1
  17. package/components/drawer/drawer.d.ts +222 -0
  18. package/components/drawer/index.cjs +5 -0
  19. package/components/drawer/index.d.ts +1 -0
  20. package/components/drawer/index.js +5 -0
  21. package/components/modal/index.cjs +2 -1
  22. package/components/modal/index.js +2 -1
  23. package/components/modal/modal.d.ts +5 -0
  24. package/components/pagination/index.cjs +1 -1
  25. package/components/pagination/index.js +1 -1
  26. package/components/progressbar/index.cjs +1 -1
  27. package/components/progressbar/index.js +1 -1
  28. package/components/rating/index.cjs +1 -1
  29. package/components/rating/index.js +1 -1
  30. package/components/select/index.cjs +1 -1
  31. package/components/select/index.js +1 -1
  32. package/components/slider/index.cjs +1 -1
  33. package/components/slider/index.js +1 -1
  34. package/components/toast/index.cjs +1 -1
  35. package/components/toast/index.js +1 -1
  36. package/components/tree/index.cjs +1 -1
  37. package/components/tree/index.js +1 -1
  38. package/config.cjs +2 -2
  39. package/config.d.ts +5 -0
  40. package/config.js +2 -2
  41. package/{dom-gfxqXJpK.js → dom-Bcg9ORcA.js} +64 -54
  42. package/{dom-CuBx1JPZ.cjs → dom-C2gi9OCP.cjs} +47 -37
  43. package/drawer-D5SO73ew.js +251 -0
  44. package/drawer-DP7UPojk.cjs +250 -0
  45. package/index.cjs +19 -13
  46. package/index.d.ts +1 -0
  47. package/index.js +36 -30
  48. package/isFocusable-Ckwus82R.js +32 -0
  49. package/isFocusable-DfzDLeAN.cjs +31 -0
  50. package/{modal-D3wGIDlj.js → modal-CAvQW-vo.js} +26 -32
  51. package/{modal-BEnQ6c5M.cjs → modal-DiXZXYjR.cjs} +27 -33
  52. package/package.json +1 -1
  53. package/{pagination-B97wBLok.js → pagination-BKbMROV6.js} +4 -4
  54. package/{pagination-C1TT-oea.cjs → pagination-DvZ2rLsz.cjs} +4 -4
  55. package/{progressbar-BWBlRk_Y.js → progressbar-D8zIcm9n.js} +2 -2
  56. package/{progressbar-CRvhNB5R.cjs → progressbar-i9xfAxb7.cjs} +2 -2
  57. package/{promise-XSP94FjG.js → promise-Y53vc4Ia.js} +5 -5
  58. package/{rating-BXvy9kXq.js → rating-DEXTGWCU.js} +2 -2
  59. package/{rating-DAb6nR67.cjs → rating-DmG4oUkr.cjs} +2 -2
  60. package/scrollbars-CT87iv_6.cjs +30 -0
  61. package/scrollbars-CcxSrnCx.js +31 -0
  62. package/{select-BdjpnE7_.js → select-Bw68Xdu5.js} +4 -5
  63. package/{select-C0rJJQfl.cjs → select-MFjAnIt7.cjs} +4 -5
  64. package/services/extendWidget.cjs +2 -2
  65. package/services/extendWidget.js +2 -2
  66. package/services/floatingUI.cjs +8 -29
  67. package/services/floatingUI.js +9 -30
  68. package/services/focusElement.cjs +46 -0
  69. package/services/focusElement.d.ts +9 -0
  70. package/services/focusElement.js +46 -0
  71. package/services/focustrack.cjs +1 -1
  72. package/services/focustrack.js +1 -1
  73. package/services/matchMedia.cjs +1 -1
  74. package/services/matchMedia.js +1 -1
  75. package/services/navManager.cjs +7 -37
  76. package/services/navManager.js +6 -36
  77. package/services/portal.cjs +7 -10
  78. package/services/portal.js +7 -10
  79. package/services/resizeObserver.cjs +2 -2
  80. package/services/resizeObserver.js +2 -2
  81. package/services/siblingsInert.cjs +9 -8
  82. package/services/siblingsInert.d.ts +13 -3
  83. package/services/siblingsInert.js +9 -8
  84. package/services/transitions/baseTransitions.cjs +9 -10
  85. package/services/transitions/baseTransitions.js +10 -11
  86. package/services/transitions/collapse.cjs +1 -1
  87. package/services/transitions/collapse.js +1 -1
  88. package/services/transitions/cssTransitions.cjs +1 -1
  89. package/services/transitions/cssTransitions.js +2 -2
  90. package/services/transitions/simpleClassTransition.cjs +1 -1
  91. package/services/transitions/simpleClassTransition.js +1 -1
  92. package/{slider-BmxQ3A_u.js → slider-Cx50Eghd.js} +14 -24
  93. package/{slider-DSx5CAce.cjs → slider-Dl4Trh32.cjs} +14 -24
  94. package/toaster-UDglac7x.cjs +187 -0
  95. package/toaster-_p1GTtHI.js +188 -0
  96. package/{tree-BFrXdJox.js → tree-DV0tfPlZ.js} +7 -11
  97. package/{tree-Pvr2rZ-D.cjs → tree-rGHtmCnS.cjs} +7 -11
  98. package/utils/directive.cjs +3 -1
  99. package/utils/directive.d.ts +47 -0
  100. package/utils/directive.js +14 -12
  101. package/utils/stores.cjs +8 -9
  102. package/utils/stores.js +8 -9
  103. package/utils/writables.cjs +1 -1
  104. package/utils/writables.js +1 -1
  105. package/{writables-Bn3uhKEG.cjs → writables-DcGT98a7.cjs} +1 -1
  106. package/{writables-CgpOQ4hA.js → writables-e0tyaQpe.js} +1 -1
  107. package/toaster-Cayg6Lbq.cjs +0 -209
  108. package/toaster-XfzHDqz_.js +0 -210
package/index.js CHANGED
@@ -1,15 +1,16 @@
1
1
  import { FACTORY_WIDGET_NAME, INVALID_VALUE } from "./types.js";
2
- import { a, c, f, g } from "./accordion-CoM4efp-.js";
3
- import { c as c2, g as g2 } from "./alert-YIlqdEPO.js";
4
- import { c as c3, g as g3 } from "./collapse-DwXz2kNw.js";
5
- import { c as c4, g as g4, a as a2, m } from "./modal-D3wGIDlj.js";
6
- import { c as c5, g as g5 } from "./pagination-B97wBLok.js";
7
- import { c as c6, g as g6 } from "./progressbar-BWBlRk_Y.js";
8
- import { c as c7, g as g7 } from "./rating-BXvy9kXq.js";
9
- import { c as c8, g as g8 } from "./select-BdjpnE7_.js";
10
- import { c as c9, g as g9 } from "./slider-BmxQ3A_u.js";
11
- import { T, c as c10, d, g as g10 } from "./toaster-XfzHDqz_.js";
12
- import { c as c11, g as g11 } from "./tree-BFrXdJox.js";
2
+ import { a, c, f, g } from "./accordion-CcirvrjR.js";
3
+ import { c as c2, g as g2 } from "./alert-gGz2CDS9.js";
4
+ import { c as c3, g as g3 } from "./collapse-BV4kD3j9.js";
5
+ import { c as c4, g as g4, a as a2, b, m } from "./modal-CAvQW-vo.js";
6
+ import { c as c5, g as g5 } from "./pagination-BKbMROV6.js";
7
+ import { c as c6, g as g6 } from "./progressbar-D8zIcm9n.js";
8
+ import { c as c7, g as g7 } from "./rating-DEXTGWCU.js";
9
+ import { c as c8, g as g8 } from "./select-Bw68Xdu5.js";
10
+ import { c as c9, g as g9 } from "./slider-Cx50Eghd.js";
11
+ import { T, c as c10, d, g as g10 } from "./toaster-_p1GTtHI.js";
12
+ import { c as c11, g as g11 } from "./tree-DV0tfPlZ.js";
13
+ import { c as c12, g as g12 } from "./drawer-D5SO73ew.js";
13
14
  import { createWidgetsConfig, mergeInto } from "./config.js";
14
15
  import { extendWidgetProps } from "./services/extendWidget.js";
15
16
  import { createFloatingUI } from "./services/floatingUI.js";
@@ -24,29 +25,32 @@ import { hash$ } from "./services/hash.js";
24
25
  import { createTransition, noAnimation } from "./services/transitions/baseTransitions.js";
25
26
  import { createCSSTransition, getTransitionDurationMs, hasTransition } from "./services/transitions/cssTransitions.js";
26
27
  import { createSimpleClassTransition } from "./services/transitions/simpleClassTransition.js";
27
- import { o, a as a3, c as c12, b, p, n, g as g12, j, f as f2, h, q, d as d2, e, i, m as m2, k, l, r, s } from "./dom-gfxqXJpK.js";
28
+ import { q, a as a3, c as c13, b as b2, s, p, h, l, j, f as f2, g as g13, k, t, d as d2, e, i, m as m2, n, o, r, u } from "./dom-Bcg9ORcA.js";
28
29
  import { bindableDerived, bindableProp, createPatch, false$, findChangedProperties, idWithDefault, isStore, mergeConfigStores, normalizeConfigStores, stateStores, toReadableStore, toWritableStore, true$, writableWithDefault, writablesForProps, writablesWithDefault } from "./utils/stores.js";
29
- import { j as j2, t, i as i2, c as c13, d as d3, g as g13, h as h2, a as a4, b as b2, e as e2, f as f3 } from "./writables-CgpOQ4hA.js";
30
+ import { j as j2, t as t2, i as i2, c as c14, d as d3, g as g14, h as h2, a as a4, b as b3, e as e2, f as f3 } from "./writables-e0tyaQpe.js";
30
31
  export {
31
32
  FACTORY_WIDGET_NAME,
32
33
  INVALID_VALUE,
33
34
  T as Toaster,
34
35
  activeElement$,
35
- o as attributesData,
36
+ q as attributesData,
36
37
  a3 as bindDirective,
37
- c12 as bindDirectiveNoArg,
38
+ c13 as bindDirectiveNoArg,
38
39
  bindableDerived,
39
40
  bindableProp,
40
- b as browserDirective,
41
- p as classDirective,
41
+ b2 as browserDirective,
42
+ s as classDirective,
42
43
  a as createAccordion,
43
44
  c as createAccordionItem,
44
45
  c2 as createAlert,
45
- n as createAttributesDirective,
46
- g12 as createBrowserStoreArrayDirective,
47
- j as createBrowserStoreDirective,
46
+ p as createAttributesDirective,
47
+ h as createBrowserStoreArrayDirective,
48
+ l as createBrowserStoreDirective,
48
49
  createCSSTransition,
49
50
  c3 as createCollapse,
51
+ j as createConditionalBrowserStoreArrayDirective,
52
+ f2 as createConditionalStoreArrayDirective,
53
+ c12 as createDrawer,
50
54
  createFloatingUI,
51
55
  createHasFocus,
52
56
  createIntersection,
@@ -61,15 +65,15 @@ export {
61
65
  c8 as createSelect,
62
66
  createSimpleClassTransition,
63
67
  c9 as createSlider,
64
- f2 as createStoreArrayDirective,
65
- h as createStoreDirective,
68
+ g13 as createStoreArrayDirective,
69
+ k as createStoreDirective,
66
70
  c10 as createToast,
67
71
  createTransition,
68
72
  c11 as createTree,
69
73
  j2 as createTypeEnum,
70
74
  createWidgetsConfig,
71
75
  d as defaultToasterProps,
72
- q as directiveAttributes,
76
+ t as directiveAttributes,
73
77
  d2 as directiveSubscribe,
74
78
  e as directiveUpdate,
75
79
  extendWidgetProps,
@@ -79,6 +83,7 @@ export {
79
83
  g as getAccordionDefaultConfig,
80
84
  g2 as getAlertDefaultConfig,
81
85
  g3 as getCollapseDefaultConfig,
86
+ g12 as getDrawerDefaultConfig,
82
87
  getKeyName,
83
88
  g4 as getModalDefaultConfig,
84
89
  g5 as getPaginationDefaultConfig,
@@ -97,29 +102,30 @@ export {
97
102
  isStore,
98
103
  m2 as mapDirectiveArg,
99
104
  mergeConfigStores,
100
- k as mergeDirectives,
105
+ n as mergeDirectives,
101
106
  mergeInto,
102
107
  a2 as modalCloseButtonClick,
108
+ b as modalCloseEscape,
103
109
  m as modalOutsideClick,
104
- l as multiDirective,
110
+ o as multiDirective,
105
111
  noAnimation,
106
112
  normalizeConfigStores,
107
113
  portal,
108
114
  r as registrationArray,
109
115
  siblingsInert,
110
- s as ssrAttributes,
116
+ u as ssrAttributes,
111
117
  stateStores,
112
- t as testToNormalizeValue,
118
+ t2 as testToNormalizeValue,
113
119
  toReadableStore,
114
120
  toWritableStore,
115
121
  true$,
116
122
  i2 as typeArray,
117
- c13 as typeBoolean,
123
+ c14 as typeBoolean,
118
124
  d3 as typeBooleanOrNull,
119
- g13 as typeFunction,
125
+ g14 as typeFunction,
120
126
  h2 as typeHTMLElementOrNull,
121
127
  a4 as typeNumber,
122
- b2 as typeNumberInRangeFactory,
128
+ b3 as typeNumberInRangeFactory,
123
129
  e2 as typeString,
124
130
  f3 as typeStringOrNull,
125
131
  writableWithDefault,
@@ -0,0 +1,32 @@
1
+ const isInertOrInvisible = (element) => {
2
+ let curElement = element;
3
+ while (curElement) {
4
+ const style = getComputedStyle(curElement);
5
+ if (curElement.inert || curElement.hidden || style.display === "none" || style.visibility === "hidden") {
6
+ return true;
7
+ }
8
+ curElement = curElement.parentElement;
9
+ }
10
+ return false;
11
+ };
12
+ const checkNotDisabled = (element) => {
13
+ if (element.disabled) {
14
+ return false;
15
+ }
16
+ const parentFieldset = element.parentElement?.closest("fieldset");
17
+ return parentFieldset ? checkNotDisabled(parentFieldset) : true;
18
+ };
19
+ const isFocusableOtherTags = (element) => element.isContentEditable || !!element.hasAttribute("tabindex");
20
+ const isFocusableByTagName = {
21
+ INPUT: (element) => element.type !== "hidden" && checkNotDisabled(element),
22
+ SELECT: checkNotDisabled,
23
+ TEXTAREA: checkNotDisabled,
24
+ BUTTON: checkNotDisabled,
25
+ A: (element) => !!element.href || isFocusableOtherTags(element)
26
+ };
27
+ const isFocusable = (element) => {
28
+ return document.contains(element) && !isInertOrInvisible(element) && (isFocusableByTagName[element.tagName] ?? isFocusableOtherTags)(element);
29
+ };
30
+ export {
31
+ isFocusable as i
32
+ };
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+ const isInertOrInvisible = (element) => {
3
+ let curElement = element;
4
+ while (curElement) {
5
+ const style = getComputedStyle(curElement);
6
+ if (curElement.inert || curElement.hidden || style.display === "none" || style.visibility === "hidden") {
7
+ return true;
8
+ }
9
+ curElement = curElement.parentElement;
10
+ }
11
+ return false;
12
+ };
13
+ const checkNotDisabled = (element) => {
14
+ if (element.disabled) {
15
+ return false;
16
+ }
17
+ const parentFieldset = element.parentElement?.closest("fieldset");
18
+ return parentFieldset ? checkNotDisabled(parentFieldset) : true;
19
+ };
20
+ const isFocusableOtherTags = (element) => element.isContentEditable || !!element.hasAttribute("tabindex");
21
+ const isFocusableByTagName = {
22
+ INPUT: (element) => element.type !== "hidden" && checkNotDisabled(element),
23
+ SELECT: checkNotDisabled,
24
+ TEXTAREA: checkNotDisabled,
25
+ BUTTON: checkNotDisabled,
26
+ A: (element) => !!element.href || isFocusableOtherTags(element)
27
+ };
28
+ const isFocusable = (element) => {
29
+ return document.contains(element) && !isInertOrInvisible(element) && (isFocusableByTagName[element.tagName] ?? isFocusableOtherTags)(element);
30
+ };
31
+ exports.isFocusable = isFocusable;
@@ -1,41 +1,18 @@
1
1
  import { computed, readable } from "@amadeus-it-group/tansu";
2
- import { c as typeBoolean, g as typeFunction, e as typeString, h as typeHTMLElementOrNull } from "./writables-CgpOQ4hA.js";
2
+ import { c as typeBoolean, g as typeFunction, e as typeString, h as typeHTMLElementOrNull } from "./writables-e0tyaQpe.js";
3
3
  import { writablesForProps, stateStores } from "./utils/stores.js";
4
4
  import { createTransition } from "./services/transitions/baseTransitions.js";
5
- import { d as promiseFromStore } from "./promise-XSP94FjG.js";
5
+ import { p as promiseFromStore } from "./promise-Y53vc4Ia.js";
6
6
  import { noop } from "./utils/func.js";
7
- import { a as bindDirective, r as registrationArray, n as createAttributesDirective, k as mergeDirectives, d as directiveSubscribe, b as browserDirective } from "./dom-gfxqXJpK.js";
7
+ import { r as removeScrollbars, a as revertScrollbars } from "./scrollbars-CcxSrnCx.js";
8
+ import { a as bindDirective, r as registrationArray, p as createAttributesDirective, n as mergeDirectives, d as directiveSubscribe, c as bindDirectiveNoArg, b as browserDirective } from "./dom-Bcg9ORcA.js";
8
9
  import { portal } from "./services/portal.js";
9
10
  import { siblingsInert } from "./services/siblingsInert.js";
10
11
  import { createWidgetFactory } from "./utils/widget.js";
11
- const internalRemoveScrollbars = () => {
12
- const scrollbarWidth = Math.abs(window.innerWidth - document.documentElement.clientWidth);
13
- const body = document.body;
14
- const bodyStyle = body.style;
15
- const { overflow, paddingRight } = bodyStyle;
16
- if (scrollbarWidth > 0) {
17
- const actualPadding = parseFloat(window.getComputedStyle(body).paddingRight);
18
- bodyStyle.paddingRight = `${actualPadding + scrollbarWidth}px`;
19
- }
20
- bodyStyle.overflow = "hidden";
21
- return () => {
22
- if (scrollbarWidth > 0) {
23
- bodyStyle.paddingRight = paddingRight;
24
- }
25
- bodyStyle.overflow = overflow;
26
- };
27
- };
28
- let internalRevert = noop;
29
- const removeScrollbars = () => {
30
- internalRevert();
31
- internalRevert = internalRemoveScrollbars();
32
- };
33
- const revertScrollbars = () => {
34
- internalRevert();
35
- internalRevert = noop;
36
- };
12
+ import { focusElement } from "./services/focusElement.js";
37
13
  const modalOutsideClick = Symbol();
38
14
  const modalCloseButtonClick = Symbol();
15
+ const modalCloseEscape = Symbol();
39
16
  const defaultConfig = {
40
17
  animated: true,
41
18
  ariaCloseButtonLabel: "Close",
@@ -160,7 +137,7 @@ const createModal = createWidgetFactory("modal", (config$) => {
160
137
  const element = container ? modalTransition.stores.element$() : void 0;
161
138
  return {
162
139
  container,
163
- insertBefore: (element == null ? void 0 : element.parentElement) === container ? element : void 0
140
+ insertBefore: element?.parentElement === container ? element : void 0
164
141
  };
165
142
  })
166
143
  );
@@ -187,13 +164,23 @@ const createModal = createWidgetFactory("modal", (config$) => {
187
164
  }));
188
165
  const modalAttributeDirective = createAttributesDirective(() => ({
189
166
  attributes: {
190
- class: className$
167
+ class: className$,
168
+ tabIndex: readable("-1")
191
169
  },
192
170
  events: {
193
171
  click: (event) => {
194
172
  if (event.currentTarget === event.target && closeOnOutsideClick$()) {
195
173
  close(modalOutsideClick);
196
174
  }
175
+ },
176
+ keydown: (event) => {
177
+ const { key } = event;
178
+ switch (key) {
179
+ case "Escape":
180
+ close(modalCloseEscape);
181
+ event.stopPropagation();
182
+ break;
183
+ }
197
184
  }
198
185
  }
199
186
  }));
@@ -214,7 +201,13 @@ const createModal = createWidgetFactory("modal", (config$) => {
214
201
  modalPortalDirective,
215
202
  backdropPortalDirective,
216
203
  backdropDirective: mergeDirectives(backdropTransition.directives.directive, backdropAttributeDirective),
217
- modalDirective: mergeDirectives(modalTransition.directives.directive, siblingsInert, directiveSubscribe(action$), modalAttributeDirective),
204
+ modalDirective: mergeDirectives(
205
+ modalTransition.directives.directive,
206
+ bindDirectiveNoArg(siblingsInert),
207
+ directiveSubscribe(action$),
208
+ modalAttributeDirective,
209
+ focusElement
210
+ ),
218
211
  closeButtonDirective,
219
212
  dialogDirective: bindDirective(
220
213
  browserDirective((dialog, visible) => {
@@ -248,6 +241,7 @@ const createModal = createWidgetFactory("modal", (config$) => {
248
241
  });
249
242
  export {
250
243
  modalCloseButtonClick as a,
244
+ modalCloseEscape as b,
251
245
  createModal as c,
252
246
  getModalDefaultConfig as g,
253
247
  modalOutsideClick as m
@@ -1,42 +1,19 @@
1
1
  "use strict";
2
2
  const tansu = require("@amadeus-it-group/tansu");
3
- const utils_writables = require("./writables-Bn3uhKEG.cjs");
3
+ const utils_writables = require("./writables-DcGT98a7.cjs");
4
4
  const utils_stores = require("./utils/stores.cjs");
5
5
  const services_transitions_baseTransitions = require("./services/transitions/baseTransitions.cjs");
6
6
  const promise = require("./promise-CxCD3NYv.cjs");
7
7
  const utils_func = require("./utils/func.cjs");
8
- const utils_directive = require("./dom-CuBx1JPZ.cjs");
8
+ const scrollbars = require("./scrollbars-CT87iv_6.cjs");
9
+ const utils_directive = require("./dom-C2gi9OCP.cjs");
9
10
  const services_portal = require("./services/portal.cjs");
10
11
  const services_siblingsInert = require("./services/siblingsInert.cjs");
11
12
  const utils_widget = require("./utils/widget.cjs");
12
- const internalRemoveScrollbars = () => {
13
- const scrollbarWidth = Math.abs(window.innerWidth - document.documentElement.clientWidth);
14
- const body = document.body;
15
- const bodyStyle = body.style;
16
- const { overflow, paddingRight } = bodyStyle;
17
- if (scrollbarWidth > 0) {
18
- const actualPadding = parseFloat(window.getComputedStyle(body).paddingRight);
19
- bodyStyle.paddingRight = `${actualPadding + scrollbarWidth}px`;
20
- }
21
- bodyStyle.overflow = "hidden";
22
- return () => {
23
- if (scrollbarWidth > 0) {
24
- bodyStyle.paddingRight = paddingRight;
25
- }
26
- bodyStyle.overflow = overflow;
27
- };
28
- };
29
- let internalRevert = utils_func.noop;
30
- const removeScrollbars = () => {
31
- internalRevert();
32
- internalRevert = internalRemoveScrollbars();
33
- };
34
- const revertScrollbars = () => {
35
- internalRevert();
36
- internalRevert = utils_func.noop;
37
- };
13
+ const services_focusElement = require("./services/focusElement.cjs");
38
14
  const modalOutsideClick = Symbol();
39
15
  const modalCloseButtonClick = Symbol();
16
+ const modalCloseEscape = Symbol();
40
17
  const defaultConfig = {
41
18
  animated: true,
42
19
  ariaCloseButtonLabel: "Close",
@@ -78,9 +55,9 @@ const modals$ = utils_directive.registrationArray();
78
55
  const hasModals$ = tansu.computed(() => modals$().length > 0);
79
56
  const scrollbarsAction$ = tansu.computed(() => {
80
57
  if (hasModals$()) {
81
- removeScrollbars();
58
+ scrollbars.removeScrollbars();
82
59
  } else {
83
- revertScrollbars();
60
+ scrollbars.revertScrollbars();
84
61
  }
85
62
  });
86
63
  const modalsAction$ = tansu.computed(() => {
@@ -161,7 +138,7 @@ const createModal = utils_widget.createWidgetFactory("modal", (config$) => {
161
138
  const element = container ? modalTransition.stores.element$() : void 0;
162
139
  return {
163
140
  container,
164
- insertBefore: (element == null ? void 0 : element.parentElement) === container ? element : void 0
141
+ insertBefore: element?.parentElement === container ? element : void 0
165
142
  };
166
143
  })
167
144
  );
@@ -188,13 +165,23 @@ const createModal = utils_widget.createWidgetFactory("modal", (config$) => {
188
165
  }));
189
166
  const modalAttributeDirective = utils_directive.createAttributesDirective(() => ({
190
167
  attributes: {
191
- class: className$
168
+ class: className$,
169
+ tabIndex: tansu.readable("-1")
192
170
  },
193
171
  events: {
194
172
  click: (event) => {
195
173
  if (event.currentTarget === event.target && closeOnOutsideClick$()) {
196
174
  close(modalOutsideClick);
197
175
  }
176
+ },
177
+ keydown: (event) => {
178
+ const { key } = event;
179
+ switch (key) {
180
+ case "Escape":
181
+ close(modalCloseEscape);
182
+ event.stopPropagation();
183
+ break;
184
+ }
198
185
  }
199
186
  }
200
187
  }));
@@ -215,7 +202,13 @@ const createModal = utils_widget.createWidgetFactory("modal", (config$) => {
215
202
  modalPortalDirective,
216
203
  backdropPortalDirective,
217
204
  backdropDirective: utils_directive.mergeDirectives(backdropTransition.directives.directive, backdropAttributeDirective),
218
- modalDirective: utils_directive.mergeDirectives(modalTransition.directives.directive, services_siblingsInert.siblingsInert, utils_directive.directiveSubscribe(action$), modalAttributeDirective),
205
+ modalDirective: utils_directive.mergeDirectives(
206
+ modalTransition.directives.directive,
207
+ utils_directive.bindDirectiveNoArg(services_siblingsInert.siblingsInert),
208
+ utils_directive.directiveSubscribe(action$),
209
+ modalAttributeDirective,
210
+ services_focusElement.focusElement
211
+ ),
219
212
  closeButtonDirective,
220
213
  dialogDirective: utils_directive.bindDirective(
221
214
  utils_directive.browserDirective((dialog, visible) => {
@@ -250,4 +243,5 @@ const createModal = utils_widget.createWidgetFactory("modal", (config$) => {
250
243
  exports.createModal = createModal;
251
244
  exports.getModalDefaultConfig = getModalDefaultConfig;
252
245
  exports.modalCloseButtonClick = modalCloseButtonClick;
246
+ exports.modalCloseEscape = modalCloseEscape;
253
247
  exports.modalOutsideClick = modalOutsideClick;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@agnos-ui/core",
3
3
  "description": "Framework-agnostic headless component library.",
4
- "version": "0.9.3",
4
+ "version": "0.10.0-next.0",
5
5
  "type": "module",
6
6
  "main": "./index.cjs",
7
7
  "module": "./index.js",
@@ -1,8 +1,8 @@
1
1
  import { computed } from "@amadeus-it-group/tansu";
2
2
  import { writablesForProps, bindableProp, stateStores, true$ } from "./utils/stores.js";
3
- import { l as isNumber, e as typeString, g as typeFunction, c as typeBoolean, a as typeNumber, k as clamp } from "./writables-CgpOQ4hA.js";
3
+ import { l as isNumber, e as typeString, g as typeFunction, c as typeBoolean, a as typeNumber, k as clamp } from "./writables-e0tyaQpe.js";
4
4
  import { noop } from "./utils/func.js";
5
- import { n as createAttributesDirective } from "./dom-gfxqXJpK.js";
5
+ import { p as createAttributesDirective } from "./dom-Bcg9ORcA.js";
6
6
  import { createWidgetFactory } from "./utils/widget.js";
7
7
  const PAGE_LINK_DEFAULT = "#";
8
8
  const defaultConfig = {
@@ -110,10 +110,10 @@ const createPagination = createWidgetFactory("pagination", (config) => {
110
110
  const ariaLiveLabelText$ = computed(() => ariaLiveLabel$()(page$(), pageCount$()));
111
111
  function handleNavigation(pageNumber, event) {
112
112
  if (pagesHrefs$()[pageNumber - 1] === PAGE_LINK_DEFAULT) {
113
- event == null ? void 0 : event.preventDefault();
113
+ event?.preventDefault();
114
114
  }
115
115
  if (!event || !(event.ctrlKey || event.metaKey)) {
116
- event == null ? void 0 : event.preventDefault();
116
+ event?.preventDefault();
117
117
  page$.set(pageNumber);
118
118
  }
119
119
  }
@@ -1,9 +1,9 @@
1
1
  "use strict";
2
2
  const tansu = require("@amadeus-it-group/tansu");
3
3
  const utils_stores = require("./utils/stores.cjs");
4
- const utils_writables = require("./writables-Bn3uhKEG.cjs");
4
+ const utils_writables = require("./writables-DcGT98a7.cjs");
5
5
  const utils_func = require("./utils/func.cjs");
6
- const utils_directive = require("./dom-CuBx1JPZ.cjs");
6
+ const utils_directive = require("./dom-C2gi9OCP.cjs");
7
7
  const utils_widget = require("./utils/widget.cjs");
8
8
  const PAGE_LINK_DEFAULT = "#";
9
9
  const defaultConfig = {
@@ -111,10 +111,10 @@ const createPagination = utils_widget.createWidgetFactory("pagination", (config)
111
111
  const ariaLiveLabelText$ = tansu.computed(() => ariaLiveLabel$()(page$(), pageCount$()));
112
112
  function handleNavigation(pageNumber, event) {
113
113
  if (pagesHrefs$()[pageNumber - 1] === PAGE_LINK_DEFAULT) {
114
- event == null ? void 0 : event.preventDefault();
114
+ event?.preventDefault();
115
115
  }
116
116
  if (!event || !(event.ctrlKey || event.metaKey)) {
117
- event == null ? void 0 : event.preventDefault();
117
+ event?.preventDefault();
118
118
  page$.set(pageNumber);
119
119
  }
120
120
  }
@@ -1,7 +1,7 @@
1
- import { k as clamp, g as typeFunction, e as typeString, a as typeNumber } from "./writables-CgpOQ4hA.js";
1
+ import { k as clamp, g as typeFunction, e as typeString, a as typeNumber } from "./writables-e0tyaQpe.js";
2
2
  import { writablesForProps, stateStores } from "./utils/stores.js";
3
3
  import { computed, readable } from "@amadeus-it-group/tansu";
4
- import { n as createAttributesDirective } from "./dom-gfxqXJpK.js";
4
+ import { p as createAttributesDirective } from "./dom-Bcg9ORcA.js";
5
5
  import { createWidgetFactory } from "./utils/widget.js";
6
6
  const defaultConfig = {
7
7
  min: 0,
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
- const utils_writables = require("./writables-Bn3uhKEG.cjs");
2
+ const utils_writables = require("./writables-DcGT98a7.cjs");
3
3
  const utils_stores = require("./utils/stores.cjs");
4
4
  const tansu = require("@amadeus-it-group/tansu");
5
- const utils_directive = require("./dom-CuBx1JPZ.cjs");
5
+ const utils_directive = require("./dom-C2gi9OCP.cjs");
6
6
  const utils_widget = require("./utils/widget.cjs");
7
7
  const defaultConfig = {
8
8
  min: 0,
@@ -111,9 +111,9 @@ const promiseWithResolve = () => {
111
111
  return { promise, resolve };
112
112
  };
113
113
  export {
114
- promiseFromEvent as a,
115
- promiseFromTimeout as b,
116
- promiseWithResolve as c,
117
- promiseFromStore as d,
118
- promiseStoreToValueStore as p
114
+ promiseStoreToValueStore as a,
115
+ promiseFromEvent as b,
116
+ promiseFromTimeout as c,
117
+ promiseWithResolve as d,
118
+ promiseFromStore as p
119
119
  };
@@ -1,7 +1,7 @@
1
1
  import { computed, writable, readable } from "@amadeus-it-group/tansu";
2
2
  import { INVALID_VALUE } from "./types.js";
3
- import { n as createAttributesDirective } from "./dom-gfxqXJpK.js";
4
- import { e as typeString, g as typeFunction, c as typeBoolean, a as typeNumber, k as clamp, l as isNumber } from "./writables-CgpOQ4hA.js";
3
+ import { p as createAttributesDirective } from "./dom-Bcg9ORcA.js";
4
+ import { e as typeString, g as typeFunction, c as typeBoolean, a as typeNumber, k as clamp, l as isNumber } from "./writables-e0tyaQpe.js";
5
5
  import { noop } from "./utils/func.js";
6
6
  import { writablesForProps, bindableProp, stateStores, true$ } from "./utils/stores.js";
7
7
  import { createWidgetFactory } from "./utils/widget.js";
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
  const tansu = require("@amadeus-it-group/tansu");
3
3
  const types = require("./types.cjs");
4
- const utils_directive = require("./dom-CuBx1JPZ.cjs");
5
- const utils_writables = require("./writables-Bn3uhKEG.cjs");
4
+ const utils_directive = require("./dom-C2gi9OCP.cjs");
5
+ const utils_writables = require("./writables-DcGT98a7.cjs");
6
6
  const utils_func = require("./utils/func.cjs");
7
7
  const utils_stores = require("./utils/stores.cjs");
8
8
  const utils_widget = require("./utils/widget.cjs");
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ const utils_func = require("./utils/func.cjs");
3
+ const internalRemoveScrollbars = () => {
4
+ const scrollbarWidth = Math.abs(window.innerWidth - document.documentElement.clientWidth);
5
+ const body = document.body;
6
+ const bodyStyle = body.style;
7
+ const { overflow, paddingRight } = bodyStyle;
8
+ if (scrollbarWidth > 0) {
9
+ const actualPadding = parseFloat(window.getComputedStyle(body).paddingRight);
10
+ bodyStyle.paddingRight = `${actualPadding + scrollbarWidth}px`;
11
+ }
12
+ bodyStyle.overflow = "hidden";
13
+ return () => {
14
+ if (scrollbarWidth > 0) {
15
+ bodyStyle.paddingRight = paddingRight;
16
+ }
17
+ bodyStyle.overflow = overflow;
18
+ };
19
+ };
20
+ let internalRevert = utils_func.noop;
21
+ const removeScrollbars = () => {
22
+ internalRevert();
23
+ internalRevert = internalRemoveScrollbars();
24
+ };
25
+ const revertScrollbars = () => {
26
+ internalRevert();
27
+ internalRevert = utils_func.noop;
28
+ };
29
+ exports.removeScrollbars = removeScrollbars;
30
+ exports.revertScrollbars = revertScrollbars;
@@ -0,0 +1,31 @@
1
+ import { noop } from "./utils/func.js";
2
+ const internalRemoveScrollbars = () => {
3
+ const scrollbarWidth = Math.abs(window.innerWidth - document.documentElement.clientWidth);
4
+ const body = document.body;
5
+ const bodyStyle = body.style;
6
+ const { overflow, paddingRight } = bodyStyle;
7
+ if (scrollbarWidth > 0) {
8
+ const actualPadding = parseFloat(window.getComputedStyle(body).paddingRight);
9
+ bodyStyle.paddingRight = `${actualPadding + scrollbarWidth}px`;
10
+ }
11
+ bodyStyle.overflow = "hidden";
12
+ return () => {
13
+ if (scrollbarWidth > 0) {
14
+ bodyStyle.paddingRight = paddingRight;
15
+ }
16
+ bodyStyle.overflow = overflow;
17
+ };
18
+ };
19
+ let internalRevert = noop;
20
+ const removeScrollbars = () => {
21
+ internalRevert();
22
+ internalRevert = internalRemoveScrollbars();
23
+ };
24
+ const revertScrollbars = () => {
25
+ internalRevert();
26
+ internalRevert = noop;
27
+ };
28
+ export {
29
+ revertScrollbars as a,
30
+ removeScrollbars as r
31
+ };
@@ -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, n as createAttributesDirective, a as bindDirective } from "./dom-gfxqXJpK.js";
6
+ import { v as generateId, n as mergeDirectives, p as createAttributesDirective, a as bindDirective } from "./dom-Bcg9ORcA.js";
7
7
  import { noop } from "./utils/func.js";
8
8
  import { writablesForProps, bindableProp, bindableDerived, stateStores, true$ } from "./utils/stores.js";
9
9
  import { createWidgetFactory } from "./utils/widget.js";
@@ -70,7 +70,7 @@ const createSelect = createWidgetFactory("select", (config) => {
70
70
  return selectedItemsContext;
71
71
  });
72
72
  const selectedContexts$ = computed(() => [...selectedContextsMap$().values()]);
73
- const highlightedIndex$ = function() {
73
+ const highlightedIndex$ = (function() {
74
74
  const store = writable(0);
75
75
  return asWritable(store, (index) => {
76
76
  const { length } = visibleItems$();
@@ -85,7 +85,7 @@ const createSelect = createWidgetFactory("select", (config) => {
85
85
  }
86
86
  store.set(index);
87
87
  });
88
- }();
88
+ })();
89
89
  const itemContexts$ = computed(() => {
90
90
  const itemContexts = /* @__PURE__ */ new Map();
91
91
  if (open$()) {
@@ -318,7 +318,6 @@ const createSelect = createWidgetFactory("select", (config) => {
318
318
  return;
319
319
  }
320
320
  selected$.update((selectedItems) => {
321
- var _a;
322
321
  selectedItems = [...selectedItems];
323
322
  if (selected && !isInSelected) {
324
323
  selectedItems.push(item);
@@ -326,7 +325,7 @@ const createSelect = createWidgetFactory("select", (config) => {
326
325
  const index = selectedItems.findIndex((item2) => itemIdFn(item2) === itemId);
327
326
  selectedItems.splice(index, 1);
328
327
  }
329
- (_a = onSelectedChange$()) == null ? void 0 : _a(selectedItems);
328
+ onSelectedChange$()?.(selectedItems);
330
329
  return selectedItems;
331
330
  });
332
331
  },