@cloudscape-design/components-themeable 3.0.1070 → 3.0.1072

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 (138) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/app-layout/visual-refresh-toolbar/skeleton/styles.scss +6 -0
  3. package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +1 -1
  4. package/lib/internal/template/app-layout/utils/use-focus-control.d.ts +1 -0
  5. package/lib/internal/template/app-layout/utils/use-focus-control.d.ts.map +1 -1
  6. package/lib/internal/template/app-layout/utils/use-focus-control.js +66 -6
  7. package/lib/internal/template/app-layout/utils/use-focus-control.js.map +1 -1
  8. package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.d.ts.map +1 -1
  9. package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.js +15 -13
  10. package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.js.map +1 -1
  11. package/lib/internal/template/app-layout/visual-refresh-toolbar/index.d.ts.map +1 -1
  12. package/lib/internal/template/app-layout/visual-refresh-toolbar/index.js +37 -350
  13. package/lib/internal/template/app-layout/visual-refresh-toolbar/index.js.map +1 -1
  14. package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.d.ts +20 -0
  15. package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.d.ts.map +1 -1
  16. package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.js.map +1 -1
  17. package/lib/internal/template/app-layout/visual-refresh-toolbar/internal.d.ts +6 -0
  18. package/lib/internal/template/app-layout/visual-refresh-toolbar/internal.d.ts.map +1 -1
  19. package/lib/internal/template/app-layout/visual-refresh-toolbar/internal.js +13 -0
  20. package/lib/internal/template/app-layout/visual-refresh-toolbar/internal.js.map +1 -1
  21. package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js +1 -1
  22. package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js.map +1 -1
  23. package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.js +2 -2
  24. package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.js.map +1 -1
  25. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.d.ts +11 -16
  26. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.d.ts.map +1 -1
  27. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js +21 -30
  28. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js.map +1 -1
  29. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/interfaces.d.ts +21 -0
  30. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/interfaces.d.ts.map +1 -0
  31. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/interfaces.js +2 -0
  32. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/interfaces.js.map +1 -0
  33. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/multi-layout.d.ts +8 -0
  34. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/multi-layout.d.ts.map +1 -0
  35. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/multi-layout.js +41 -0
  36. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/multi-layout.js.map +1 -0
  37. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/{slot-skeletons.d.ts → skeleton-parts.d.ts} +9 -1
  38. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.d.ts.map +1 -0
  39. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.js +21 -0
  40. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.js.map +1 -0
  41. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/{slot-wrappers.d.ts → slots.d.ts} +7 -1
  42. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slots.d.ts.map +1 -0
  43. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/{breadcrumbs/index.js → slots.js} +6 -3
  44. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slots.js.map +1 -0
  45. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +23 -21
  46. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +42 -37
  47. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +23 -21
  48. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/index.d.ts +18 -0
  49. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/index.d.ts.map +1 -0
  50. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/index.js +27 -0
  51. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/index.js.map +1 -0
  52. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/interfaces.d.ts +29 -0
  53. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/interfaces.d.ts.map +1 -0
  54. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/interfaces.js +2 -0
  55. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/interfaces.js.map +1 -0
  56. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/invariants.d.ts +3 -0
  57. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/invariants.d.ts.map +1 -0
  58. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/invariants.js +4 -0
  59. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/invariants.js.map +1 -0
  60. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/props-merger.d.ts +5 -0
  61. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/props-merger.d.ts.map +1 -0
  62. package/lib/internal/template/app-layout/visual-refresh-toolbar/{multi-layout.js → state/props-merger.js} +28 -40
  63. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/props-merger.js.map +1 -0
  64. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.d.ts +6 -0
  65. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.d.ts.map +1 -0
  66. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js +322 -0
  67. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js.map +1 -0
  68. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.d.ts +4 -0
  69. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.d.ts.map +1 -0
  70. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.js +59 -0
  71. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.js.map +1 -0
  72. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.d.ts +2 -2
  73. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.d.ts.map +1 -1
  74. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js.map +1 -1
  75. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.d.ts.map +1 -1
  76. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js +2 -3
  77. package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
  78. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/after-main-slot.d.ts +5 -0
  79. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/after-main-slot.d.ts.map +1 -0
  80. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/after-main-slot.js +29 -0
  81. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/after-main-slot.js.map +1 -0
  82. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/before-main-slot.d.ts +5 -0
  83. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/before-main-slot.d.ts.map +1 -0
  84. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/before-main-slot.js +28 -0
  85. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/before-main-slot.js.map +1 -0
  86. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/bottom-content-slot.d.ts +5 -0
  87. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/bottom-content-slot.d.ts.map +1 -0
  88. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/bottom-content-slot.js +17 -0
  89. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/bottom-content-slot.js.map +1 -0
  90. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/top-content-slot.d.ts +5 -0
  91. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/top-content-slot.d.ts.map +1 -0
  92. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/top-content-slot.js +19 -0
  93. package/lib/internal/template/app-layout/visual-refresh-toolbar/widget-areas/top-content-slot.js.map +1 -0
  94. package/lib/internal/template/breadcrumb-group/internal.d.ts +2 -1
  95. package/lib/internal/template/breadcrumb-group/internal.d.ts.map +1 -1
  96. package/lib/internal/template/breadcrumb-group/internal.js +3 -2
  97. package/lib/internal/template/breadcrumb-group/internal.js.map +1 -1
  98. package/lib/internal/template/button/internal.d.ts.map +1 -1
  99. package/lib/internal/template/button/internal.js +3 -26
  100. package/lib/internal/template/button/internal.js.map +1 -1
  101. package/lib/internal/template/button/style.d.ts +8 -0
  102. package/lib/internal/template/button/style.d.ts.map +1 -0
  103. package/lib/internal/template/button/style.js +33 -0
  104. package/lib/internal/template/button/style.js.map +1 -0
  105. package/lib/internal/template/internal/base-component/styles.scoped.css +1 -1
  106. package/lib/internal/template/internal/environment.js +2 -2
  107. package/lib/internal/template/internal/environment.json +2 -2
  108. package/lib/internal/template/internal/types.d.ts +9 -0
  109. package/lib/internal/template/internal/types.d.ts.map +1 -1
  110. package/lib/internal/template/internal/types.js.map +1 -1
  111. package/lib/internal/template/internal/widget-exports.d.ts +5 -0
  112. package/lib/internal/template/internal/widget-exports.d.ts.map +1 -1
  113. package/lib/internal/template/internal/widget-exports.js +7 -0
  114. package/lib/internal/template/internal/widget-exports.js.map +1 -1
  115. package/lib/internal/template/internal/widgets/index.d.ts +2 -3
  116. package/lib/internal/template/internal/widgets/index.d.ts.map +1 -1
  117. package/lib/internal/template/internal/widgets/index.js.map +1 -1
  118. package/lib/internal/template/internal/widgets/loader-mock.d.ts +3 -0
  119. package/lib/internal/template/internal/widgets/loader-mock.d.ts.map +1 -0
  120. package/lib/internal/template/internal/widgets/loader-mock.js +43 -0
  121. package/lib/internal/template/internal/widgets/loader-mock.js.map +1 -0
  122. package/package.json +1 -1
  123. package/lib/internal/scss/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.scss +0 -9
  124. package/lib/internal/template/app-layout/visual-refresh-toolbar/multi-layout.d.ts +0 -34
  125. package/lib/internal/template/app-layout/visual-refresh-toolbar/multi-layout.d.ts.map +0 -1
  126. package/lib/internal/template/app-layout/visual-refresh-toolbar/multi-layout.js.map +0 -1
  127. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.d.ts +0 -9
  128. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.d.ts.map +0 -1
  129. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.js.map +0 -1
  130. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.css.js +0 -7
  131. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.scoped.css +0 -7
  132. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.selectors.js +0 -8
  133. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.d.ts.map +0 -1
  134. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.js +0 -9
  135. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.js.map +0 -1
  136. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-wrappers.d.ts.map +0 -1
  137. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-wrappers.js +0 -8
  138. package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-wrappers.js.map +0 -1
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "1b71d6c12d9cb72bd92e1610f2cbad1221ec443c"
2
+ "commit": "d76de1aeed6a3ab6d8d68ce752452c8341300cb5"
3
3
  }
@@ -171,6 +171,7 @@
171
171
  grid-area: toolbar;
172
172
  block-size: 42px;
173
173
  border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-layout;
174
+ box-sizing: border-box;
174
175
  }
175
176
 
176
177
  .notifications-container {
@@ -217,3 +218,8 @@
217
218
  .hidden {
218
219
  display: none;
219
220
  }
221
+
222
+ // backward compatibility before this commit: f3bdaa292ae849b74404f32ef067c9fd6d2e8d7c
223
+ .breadcrumbs-own:not(:empty) + .breadcrumbs-discovered {
224
+ display: none;
225
+ }
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Build environment
3
- $awsui-commit-hash: "1b71d6c1";
3
+ $awsui-commit-hash: "d76de1ae";
4
4
  // Manually managed CSS-variables
5
5
  $maxContentWidth: --awsui-max-content-width-kcc2gu;
6
6
  $minContentWidth: --awsui-min-content-width-kcc2gu;
@@ -23,4 +23,5 @@ export interface FocusControlMultipleStates {
23
23
  }
24
24
  export declare function useMultipleFocusControl(restoreFocus: boolean, activeDrawersIds: Array<string>): FocusControlMultipleStates;
25
25
  export declare function useFocusControl(isOpen: boolean, restoreFocus?: boolean, activeDrawerId?: string | null): FocusControlState;
26
+ export declare function useAsyncFocusControl(isOpen: boolean, restoreFocus?: boolean, activeDrawerId?: string | null): FocusControlState;
26
27
  //# sourceMappingURL=use-focus-control.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-focus-control.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-focus-control.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,SAAS,EAAkC,MAAM,OAAO,CAAC;AAE7E,MAAM,WAAW,SAAS;IACxB,KAAK,IAAI,IAAI,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC5B,MAAM,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,gBAAgB,CAAC;IACvB,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IACvC,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;IACpF,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,uBAAuB,CACrC,YAAY,EAAE,OAAO,EACrB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,GAC9B,0BAA0B,CAgE5B;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,OAAO,EACf,YAAY,UAAQ,EACpB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,GAC7B,iBAAiB,CAmDnB"}
1
+ {"version":3,"file":"use-focus-control.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-focus-control.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,SAAS,EAAkC,MAAM,OAAO,CAAC;AAE7E,MAAM,WAAW,SAAS;IACxB,KAAK,IAAI,IAAI,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC5B,MAAM,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,gBAAgB,CAAC;IACvB,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IACvC,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;IACpF,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,uBAAuB,CACrC,YAAY,EAAE,OAAO,EACrB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,GAC9B,0BAA0B,CAmE5B;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,OAAO,EACf,YAAY,UAAQ,EACpB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,GAC7B,iBAAiB,CAmDnB;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,OAAO,EACf,YAAY,UAAQ,EACpB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,GAC7B,iBAAiB,CAuDnB"}
@@ -14,9 +14,6 @@ export function useMultipleFocusControl(restoreFocus, activeDrawersIds) {
14
14
  });
15
15
  const doFocus = useCallback((drawerId, open = true) => {
16
16
  var _a, _b, _c, _d, _e, _f;
17
- if (!shouldFocus.current) {
18
- return;
19
- }
20
17
  const ref = refs.current[drawerId];
21
18
  if (open) {
22
19
  previousFocusedElement.current =
@@ -37,14 +34,15 @@ export function useMultipleFocusControl(restoreFocus, activeDrawersIds) {
37
34
  (_f = (_e = ref === null || ref === void 0 ? void 0 : ref.toggle) === null || _e === void 0 ? void 0 : _e.current) === null || _f === void 0 ? void 0 : _f.focus();
38
35
  }
39
36
  }
40
- shouldFocus.current = false;
41
37
  }, [refs, restoreFocus]);
42
38
  const setFocus = (params) => {
43
39
  const { force = false, drawerId = null, open = true } = params || {};
44
- shouldFocus.current = true;
45
40
  if (force && (!drawerId || activeDrawersIds.includes(drawerId))) {
46
41
  doFocus(drawerId, open);
47
42
  }
43
+ else {
44
+ shouldFocus.current = true;
45
+ }
48
46
  };
49
47
  const loseFocus = useCallback(() => {
50
48
  previousFocusedElement.current = undefined;
@@ -52,7 +50,13 @@ export function useMultipleFocusControl(restoreFocus, activeDrawersIds) {
52
50
  const previousFocusedElement = useRef();
53
51
  const shouldFocus = useRef(false);
54
52
  useEffect(() => {
55
- doFocus(activeDrawersIds[0]);
53
+ const drawerId = activeDrawersIds[0];
54
+ if (shouldFocus.current) {
55
+ Promise.resolve().then(() => {
56
+ doFocus(drawerId);
57
+ shouldFocus.current = false;
58
+ });
59
+ }
56
60
  }, [activeDrawersIds, doFocus]);
57
61
  return {
58
62
  refs: refs.current,
@@ -111,4 +115,60 @@ export function useFocusControl(isOpen, restoreFocus = false, activeDrawerId) {
111
115
  loseFocus,
112
116
  };
113
117
  }
118
+ export function useAsyncFocusControl(isOpen, restoreFocus = false, activeDrawerId) {
119
+ const refs = {
120
+ toggle: useRef(null),
121
+ close: useRef(null),
122
+ slider: useRef(null),
123
+ };
124
+ const previousFocusedElement = useRef();
125
+ const shouldFocus = useRef(false);
126
+ const doFocus = () => {
127
+ var _a, _b, _c;
128
+ if (isOpen) {
129
+ previousFocusedElement.current =
130
+ document.activeElement !== document.body ? document.activeElement : undefined;
131
+ if (refs.slider.current) {
132
+ (_a = refs.slider.current) === null || _a === void 0 ? void 0 : _a.focus();
133
+ }
134
+ else {
135
+ (_b = refs.close.current) === null || _b === void 0 ? void 0 : _b.focus();
136
+ }
137
+ }
138
+ else {
139
+ if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {
140
+ previousFocusedElement.current.focus();
141
+ previousFocusedElement.current = undefined;
142
+ }
143
+ else {
144
+ (_c = refs.toggle.current) === null || _c === void 0 ? void 0 : _c.focus();
145
+ }
146
+ }
147
+ };
148
+ const setFocus = (force) => {
149
+ if (force && isOpen) {
150
+ doFocus();
151
+ }
152
+ else {
153
+ shouldFocus.current = true;
154
+ }
155
+ };
156
+ useEffect(() => {
157
+ if (shouldFocus.current) {
158
+ Promise.resolve().then(() => {
159
+ doFocus();
160
+ shouldFocus.current = false;
161
+ });
162
+ }
163
+ // eslint-disable-next-line react-hooks/exhaustive-deps
164
+ }, [isOpen, activeDrawerId]);
165
+ const loseFocus = useCallback(() => {
166
+ previousFocusedElement.current = undefined;
167
+ }, []);
168
+ return {
169
+ refs,
170
+ setFocus,
171
+ loseFocus,
172
+ };
173
+ }
114
174
  //# sourceMappingURL=use-focus-control.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-focus-control.js","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-focus-control.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createRef, RefObject, useCallback, useEffect, useRef } from 'react';\n\nexport interface Focusable {\n focus(): void;\n}\n\nexport interface FocusControlRefs {\n toggle: RefObject<Focusable>;\n close: RefObject<Focusable>;\n slider: RefObject<HTMLDivElement>;\n}\n\nexport interface FocusControlState {\n refs: FocusControlRefs;\n setFocus: (force?: boolean) => void;\n loseFocus: () => void;\n}\n\nexport interface FocusControlMultipleStates {\n refs: Record<string, FocusControlRefs>;\n setFocus: (params?: { force?: boolean; drawerId?: string; open?: boolean }) => void;\n loseFocus: () => void;\n}\n\nexport function useMultipleFocusControl(\n restoreFocus: boolean,\n activeDrawersIds: Array<string>\n): FocusControlMultipleStates {\n const refs = useRef<Record<string, FocusControlRefs>>({});\n\n activeDrawersIds.forEach(drawerId => {\n if (!refs.current[drawerId]) {\n refs.current[drawerId] = {\n toggle: createRef<Focusable>(),\n close: createRef<Focusable>(),\n slider: createRef<HTMLDivElement>(),\n };\n }\n });\n\n const doFocus = useCallback(\n (drawerId: string, open = true) => {\n if (!shouldFocus.current) {\n return;\n }\n const ref = refs.current[drawerId];\n if (open) {\n previousFocusedElement.current =\n document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n if (ref?.slider?.current) {\n ref.slider.current?.focus();\n } else {\n ref?.close?.current?.focus();\n }\n } else {\n if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n previousFocusedElement.current.focus();\n previousFocusedElement.current = undefined;\n } else {\n ref?.toggle?.current?.focus();\n }\n }\n shouldFocus.current = false;\n },\n [refs, restoreFocus]\n );\n\n const setFocus = (params?: { force?: boolean; drawerId?: string; open?: boolean }) => {\n const { force = false, drawerId = null, open = true } = params || {};\n shouldFocus.current = true;\n if (force && (!drawerId || activeDrawersIds.includes(drawerId))) {\n doFocus(drawerId!, open);\n }\n };\n\n const loseFocus = useCallback(() => {\n previousFocusedElement.current = undefined;\n }, []);\n\n const previousFocusedElement = useRef<HTMLElement>();\n const shouldFocus = useRef(false);\n\n useEffect(() => {\n doFocus(activeDrawersIds[0]);\n }, [activeDrawersIds, doFocus]);\n\n return {\n refs: refs.current,\n setFocus,\n loseFocus,\n };\n}\n\nexport function useFocusControl(\n isOpen: boolean,\n restoreFocus = false,\n activeDrawerId?: string | null\n): FocusControlState {\n const refs = {\n toggle: useRef<Focusable>(null),\n close: useRef<Focusable>(null),\n slider: useRef<HTMLDivElement>(null),\n };\n const previousFocusedElement = useRef<HTMLElement>();\n const shouldFocus = useRef(false);\n\n const doFocus = () => {\n if (!shouldFocus.current) {\n return;\n }\n if (isOpen) {\n previousFocusedElement.current =\n document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n if (refs.slider.current) {\n refs.slider.current?.focus();\n } else {\n refs.close.current?.focus();\n }\n } else {\n if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n previousFocusedElement.current.focus();\n previousFocusedElement.current = undefined;\n } else {\n refs.toggle.current?.focus();\n }\n }\n shouldFocus.current = false;\n };\n\n const setFocus = (force?: boolean) => {\n shouldFocus.current = true;\n if (force && isOpen) {\n doFocus();\n }\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(doFocus, [isOpen, activeDrawerId]);\n\n const loseFocus = useCallback(() => {\n previousFocusedElement.current = undefined;\n }, []);\n\n return {\n refs,\n setFocus,\n loseFocus,\n };\n}\n"]}
1
+ {"version":3,"file":"use-focus-control.js","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-focus-control.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createRef, RefObject, useCallback, useEffect, useRef } from 'react';\n\nexport interface Focusable {\n focus(): void;\n}\n\nexport interface FocusControlRefs {\n toggle: RefObject<Focusable>;\n close: RefObject<Focusable>;\n slider: RefObject<HTMLDivElement>;\n}\n\nexport interface FocusControlState {\n refs: FocusControlRefs;\n setFocus: (force?: boolean) => void;\n loseFocus: () => void;\n}\n\nexport interface FocusControlMultipleStates {\n refs: Record<string, FocusControlRefs>;\n setFocus: (params?: { force?: boolean; drawerId?: string; open?: boolean }) => void;\n loseFocus: () => void;\n}\n\nexport function useMultipleFocusControl(\n restoreFocus: boolean,\n activeDrawersIds: Array<string>\n): FocusControlMultipleStates {\n const refs = useRef<Record<string, FocusControlRefs>>({});\n\n activeDrawersIds.forEach(drawerId => {\n if (!refs.current[drawerId]) {\n refs.current[drawerId] = {\n toggle: createRef<Focusable>(),\n close: createRef<Focusable>(),\n slider: createRef<HTMLDivElement>(),\n };\n }\n });\n\n const doFocus = useCallback(\n (drawerId: string, open = true) => {\n const ref = refs.current[drawerId];\n if (open) {\n previousFocusedElement.current =\n document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n if (ref?.slider?.current) {\n ref.slider.current?.focus();\n } else {\n ref?.close?.current?.focus();\n }\n } else {\n if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n previousFocusedElement.current.focus();\n previousFocusedElement.current = undefined;\n } else {\n ref?.toggle?.current?.focus();\n }\n }\n },\n [refs, restoreFocus]\n );\n\n const setFocus = (params?: { force?: boolean; drawerId?: string; open?: boolean }) => {\n const { force = false, drawerId = null, open = true } = params || {};\n if (force && (!drawerId || activeDrawersIds.includes(drawerId))) {\n doFocus(drawerId!, open);\n } else {\n shouldFocus.current = true;\n }\n };\n\n const loseFocus = useCallback(() => {\n previousFocusedElement.current = undefined;\n }, []);\n\n const previousFocusedElement = useRef<HTMLElement>();\n const shouldFocus = useRef(false);\n\n useEffect(() => {\n const drawerId = activeDrawersIds[0];\n if (shouldFocus.current) {\n Promise.resolve().then(() => {\n doFocus(drawerId);\n shouldFocus.current = false;\n });\n }\n }, [activeDrawersIds, doFocus]);\n\n return {\n refs: refs.current,\n setFocus,\n loseFocus,\n };\n}\n\nexport function useFocusControl(\n isOpen: boolean,\n restoreFocus = false,\n activeDrawerId?: string | null\n): FocusControlState {\n const refs = {\n toggle: useRef<Focusable>(null),\n close: useRef<Focusable>(null),\n slider: useRef<HTMLDivElement>(null),\n };\n const previousFocusedElement = useRef<HTMLElement>();\n const shouldFocus = useRef(false);\n\n const doFocus = () => {\n if (!shouldFocus.current) {\n return;\n }\n if (isOpen) {\n previousFocusedElement.current =\n document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n if (refs.slider.current) {\n refs.slider.current?.focus();\n } else {\n refs.close.current?.focus();\n }\n } else {\n if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n previousFocusedElement.current.focus();\n previousFocusedElement.current = undefined;\n } else {\n refs.toggle.current?.focus();\n }\n }\n shouldFocus.current = false;\n };\n\n const setFocus = (force?: boolean) => {\n shouldFocus.current = true;\n if (force && isOpen) {\n doFocus();\n }\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(doFocus, [isOpen, activeDrawerId]);\n\n const loseFocus = useCallback(() => {\n previousFocusedElement.current = undefined;\n }, []);\n\n return {\n refs,\n setFocus,\n loseFocus,\n };\n}\n\nexport function useAsyncFocusControl(\n isOpen: boolean,\n restoreFocus = false,\n activeDrawerId?: string | null\n): FocusControlState {\n const refs = {\n toggle: useRef<Focusable>(null),\n close: useRef<Focusable>(null),\n slider: useRef<HTMLDivElement>(null),\n };\n const previousFocusedElement = useRef<HTMLElement>();\n const shouldFocus = useRef(false);\n\n const doFocus = () => {\n if (isOpen) {\n previousFocusedElement.current =\n document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n if (refs.slider.current) {\n refs.slider.current?.focus();\n } else {\n refs.close.current?.focus();\n }\n } else {\n if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n previousFocusedElement.current.focus();\n previousFocusedElement.current = undefined;\n } else {\n refs.toggle.current?.focus();\n }\n }\n };\n\n const setFocus = (force?: boolean) => {\n if (force && isOpen) {\n doFocus();\n } else {\n shouldFocus.current = true;\n }\n };\n\n useEffect(() => {\n if (shouldFocus.current) {\n Promise.resolve().then(() => {\n doFocus();\n shouldFocus.current = false;\n });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpen, activeDrawerId]);\n\n const loseFocus = useCallback(() => {\n previousFocusedElement.current = undefined;\n }, []);\n\n return {\n refs,\n setFocus,\n loseFocus,\n };\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"use-split-panel-focus-control.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-split-panel-focus-control.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,KAAK,yBAAyB,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC;AAE7F,MAAM,WAAW,0BAA0B;IACzC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAClC,WAAW,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACnC;AACD,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,0BAA0B,CAAC;IACjC,kBAAkB,EAAE,CAAC,WAAW,EAAE,yBAAyB,KAAK,IAAI,CAAC;CACtE;AAED,wBAAgB,yBAAyB,CAAC,YAAY,EAAE,cAAc,GAAG,2BAA2B,CA4BnG"}
1
+ {"version":3,"file":"use-split-panel-focus-control.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-split-panel-focus-control.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,KAAK,yBAAyB,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC;AAE7F,MAAM,WAAW,0BAA0B;IACzC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAClC,WAAW,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACnC;AACD,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,0BAA0B,CAAC;IACjC,kBAAkB,EAAE,CAAC,WAAW,EAAE,yBAAyB,KAAK,IAAI,CAAC;CACtE;AAED,wBAAgB,yBAAyB,CAAC,YAAY,EAAE,cAAc,GAAG,2BAA2B,CA8BnG"}
@@ -9,19 +9,21 @@ export function useSplitPanelFocusControl(dependencies) {
9
9
  };
10
10
  const lastInteraction = useRef(null);
11
11
  useEffect(() => {
12
- var _a, _b, _c, _d;
13
- switch ((_a = lastInteraction.current) === null || _a === void 0 ? void 0 : _a.type) {
14
- case 'open':
15
- (_b = refs.slider.current) === null || _b === void 0 ? void 0 : _b.focus();
16
- break;
17
- case 'close':
18
- (_c = refs.toggle.current) === null || _c === void 0 ? void 0 : _c.focus();
19
- break;
20
- case 'position':
21
- (_d = refs.preferences.current) === null || _d === void 0 ? void 0 : _d.focus();
22
- break;
23
- }
24
- lastInteraction.current = null;
12
+ Promise.resolve().then(() => {
13
+ var _a, _b, _c, _d;
14
+ switch ((_a = lastInteraction.current) === null || _a === void 0 ? void 0 : _a.type) {
15
+ case 'open':
16
+ (_b = refs.slider.current) === null || _b === void 0 ? void 0 : _b.focus();
17
+ break;
18
+ case 'close':
19
+ (_c = refs.toggle.current) === null || _c === void 0 ? void 0 : _c.focus();
20
+ break;
21
+ case 'position':
22
+ (_d = refs.preferences.current) === null || _d === void 0 ? void 0 : _d.focus();
23
+ break;
24
+ }
25
+ lastInteraction.current = null;
26
+ });
25
27
  // eslint-disable-next-line react-hooks/exhaustive-deps
26
28
  }, dependencies);
27
29
  return {
@@ -1 +1 @@
1
- {"version":3,"file":"use-split-panel-focus-control.js","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-split-panel-focus-control.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAA6B,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAgBrE,MAAM,UAAU,yBAAyB,CAAC,YAA4B;IACpE,MAAM,IAAI,GAAG;QACX,MAAM,EAAE,MAAM,CAAY,IAAI,CAAC;QAC/B,MAAM,EAAE,MAAM,CAAiB,IAAI,CAAC;QACpC,WAAW,EAAE,MAAM,CAAY,IAAI,CAAC;KACrC,CAAC;IACF,MAAM,eAAe,GAAG,MAAM,CAAmC,IAAI,CAAC,CAAC;IAEvE,SAAS,CAAC,GAAG,EAAE;;QACb,QAAQ,MAAA,eAAe,CAAC,OAAO,0CAAE,IAAI,EAAE;YACrC,KAAK,MAAM;gBACT,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;gBAC7B,MAAM;YACR,KAAK,OAAO;gBACV,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;gBAC7B,MAAM;YACR,KAAK,UAAU;gBACb,MAAA,IAAI,CAAC,WAAW,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;gBAClC,MAAM;SACT;QACD,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;QAC/B,uDAAuD;IACzD,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,OAAO;QACL,IAAI;QACJ,kBAAkB,EAAE,CAAC,WAAsC,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC,OAAO,GAAG,WAAW,CAAC;KACxG,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DependencyList, RefObject, useEffect, useRef } from 'react';\n\nimport { Focusable } from './use-focus-control';\n\ntype SplitPanelLastInteraction = { type: 'open' } | { type: 'close' } | { type: 'position' };\n\nexport interface SplitPanelFocusControlRefs {\n toggle: RefObject<Focusable>;\n slider: RefObject<HTMLDivElement>;\n preferences: RefObject<Focusable>;\n}\nexport interface SplitPanelFocusControlState {\n refs: SplitPanelFocusControlRefs;\n setLastInteraction: (interaction: SplitPanelLastInteraction) => void;\n}\n\nexport function useSplitPanelFocusControl(dependencies: DependencyList): SplitPanelFocusControlState {\n const refs = {\n toggle: useRef<Focusable>(null),\n slider: useRef<HTMLDivElement>(null),\n preferences: useRef<Focusable>(null),\n };\n const lastInteraction = useRef<SplitPanelLastInteraction | null>(null);\n\n useEffect(() => {\n switch (lastInteraction.current?.type) {\n case 'open':\n refs.slider.current?.focus();\n break;\n case 'close':\n refs.toggle.current?.focus();\n break;\n case 'position':\n refs.preferences.current?.focus();\n break;\n }\n lastInteraction.current = null;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, dependencies);\n\n return {\n refs,\n setLastInteraction: (interaction: SplitPanelLastInteraction) => (lastInteraction.current = interaction),\n };\n}\n"]}
1
+ {"version":3,"file":"use-split-panel-focus-control.js","sourceRoot":"","sources":["../../../../src/app-layout/utils/use-split-panel-focus-control.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAA6B,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAgBrE,MAAM,UAAU,yBAAyB,CAAC,YAA4B;IACpE,MAAM,IAAI,GAAG;QACX,MAAM,EAAE,MAAM,CAAY,IAAI,CAAC;QAC/B,MAAM,EAAE,MAAM,CAAiB,IAAI,CAAC;QACpC,WAAW,EAAE,MAAM,CAAY,IAAI,CAAC;KACrC,CAAC;IACF,MAAM,eAAe,GAAG,MAAM,CAAmC,IAAI,CAAC,CAAC;IAEvE,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;;YAC1B,QAAQ,MAAA,eAAe,CAAC,OAAO,0CAAE,IAAI,EAAE;gBACrC,KAAK,MAAM;oBACT,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;oBAC7B,MAAM;gBACR,KAAK,OAAO;oBACV,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;oBAC7B,MAAM;gBACR,KAAK,UAAU;oBACb,MAAA,IAAI,CAAC,WAAW,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;oBAClC,MAAM;aACT;YACD,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;QACjC,CAAC,CAAC,CAAC;QACH,uDAAuD;IACzD,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,OAAO;QACL,IAAI;QACJ,kBAAkB,EAAE,CAAC,WAAsC,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC,OAAO,GAAG,WAAW,CAAC;KACxG,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DependencyList, RefObject, useEffect, useRef } from 'react';\n\nimport { Focusable } from './use-focus-control';\n\ntype SplitPanelLastInteraction = { type: 'open' } | { type: 'close' } | { type: 'position' };\n\nexport interface SplitPanelFocusControlRefs {\n toggle: RefObject<Focusable>;\n slider: RefObject<HTMLDivElement>;\n preferences: RefObject<Focusable>;\n}\nexport interface SplitPanelFocusControlState {\n refs: SplitPanelFocusControlRefs;\n setLastInteraction: (interaction: SplitPanelLastInteraction) => void;\n}\n\nexport function useSplitPanelFocusControl(dependencies: DependencyList): SplitPanelFocusControlState {\n const refs = {\n toggle: useRef<Focusable>(null),\n slider: useRef<HTMLDivElement>(null),\n preferences: useRef<Focusable>(null),\n };\n const lastInteraction = useRef<SplitPanelLastInteraction | null>(null);\n\n useEffect(() => {\n Promise.resolve().then(() => {\n switch (lastInteraction.current?.type) {\n case 'open':\n refs.slider.current?.focus();\n break;\n case 'close':\n refs.toggle.current?.focus();\n break;\n case 'position':\n refs.preferences.current?.focus();\n break;\n }\n lastInteraction.current = null;\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, dependencies);\n\n return {\n refs,\n setLastInteraction: (interaction: SplitPanelLastInteraction) => (lastInteraction.current = interaction),\n };\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4E,MAAM,OAAO,CAAC;AAajG,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAc/C,OAAO,EAAE,sBAAsB,EAAsB,MAAM,cAAc,CAAC;AAa1E,QAAA,MAAM,6BAA6B,mGAwgBlC,CAAC;AAEF,eAAe,6BAA6B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAI5E,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,sBAAsB,EAAyB,MAAM,cAAc,CAAC;AAqD7E,QAAA,MAAM,6BAA6B,mGAgClC,CAAC;AAEF,eAAe,6BAA6B,CAAC"}