rei-kit 2.0.0 → 2.1.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 (15) hide show
  1. package/README.md +44 -1
  2. package/dist/{GoogleButton-DS-3rpUA.js → GoogleButton-D82EoXSQ.js} +10 -12
  3. package/dist/{GoogleButton-DS-3rpUA.js.map → GoogleButton-D82EoXSQ.js.map} +1 -1
  4. package/dist/app.js +9 -6
  5. package/dist/app.js.map +1 -1
  6. package/dist/index.js +6 -6
  7. package/dist/index.js.map +1 -1
  8. package/dist/inert-B441LoCD.js +53 -0
  9. package/dist/inert-B441LoCD.js.map +1 -0
  10. package/dist/styles.css +64 -58
  11. package/dist/tokens.css +14 -0
  12. package/dist/utils/inert.d.ts +16 -0
  13. package/dist/web.js +8 -1
  14. package/dist/web.js.map +1 -1
  15. package/package.json +3 -2
package/dist/inert-B441LoCD.js ADDED
@@ -0,0 +1,53 @@
1
+ //#region src/utils/inert.ts
2
+ /**
3
+ * How many open layers hold each element inert. An element set inert by the
4
+ * app itself is never in here, so releasing never undoes the app's own choice.
5
+ */
6
+ var holds = /* @__PURE__ */ new Map();
7
+ /**
8
+ * Takes everything on the page except the branch holding `keep` out of tab
9
+ * order and pointer events, and returns the function that gives it back.
10
+ *
11
+ * `inert` is a real focus trap without keydown bookkeeping, and the only one
12
+ * that also stops a screen reader's virtual cursor. It used to be applied to
13
+ * `document.getElementById('app')` — the id Vite's template happens to use —
14
+ * so an app mounted on `#root` got a dialog whose background was still
15
+ * reachable with Tab, and nothing said so. Working from `<body>`'s children
16
+ * instead holds whatever the app is mounted on, and anything else teleported
17
+ * there too.
18
+ *
19
+ * Counted per element, so a sheet opened over a sheet, or a tour over either,
20
+ * does not hand the page back when the inner one closes.
21
+ */
22
+ function inertOutside(keep) {
23
+ if (typeof document === "undefined") return () => {};
24
+ const taken = [];
25
+ for (const element of Array.from(document.body.children)) {
26
+ if (element.contains(keep)) continue;
27
+ const count = holds.get(element);
28
+ if (count === void 0) {
29
+ if (element.hasAttribute("inert")) continue;
30
+ element.setAttribute("inert", "");
31
+ }
32
+ holds.set(element, (count ?? 0) + 1);
33
+ taken.push(element);
34
+ }
35
+ let released = false;
36
+ return () => {
37
+ if (released) return;
38
+ released = true;
39
+ for (const element of taken) {
40
+ const count = (holds.get(element) ?? 1) - 1;
41
+ if (count > 0) {
42
+ holds.set(element, count);
43
+ continue;
44
+ }
45
+ holds.delete(element);
46
+ element.removeAttribute("inert");
47
+ }
48
+ };
49
+ }
50
+ //#endregion
51
+ export { inertOutside as t };
52
+
53
+ //# sourceMappingURL=inert-B441LoCD.js.map
package/dist/inert-B441LoCD.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"inert-B441LoCD.js","names":[],"sources":["../src/utils/inert.ts"],"sourcesContent":["/**\n * How many open layers hold each element inert. An element set inert by the\n * app itself is never in here, so releasing never undoes the app's own choice.\n */\nconst holds = new Map<Element, number>()\n\n/**\n * Takes everything on the page except the branch holding `keep` out of tab\n * order and pointer events, and returns the function that gives it back.\n *\n * `inert` is a real focus trap without keydown bookkeeping, and the only one\n * that also stops a screen reader's virtual cursor. It used to be applied to\n * `document.getElementById('app')` — the id Vite's template happens to use —\n * so an app mounted on `#root` got a dialog whose background was still\n * reachable with Tab, and nothing said so. Working from `<body>`'s children\n * instead holds whatever the app is mounted on, and anything else teleported\n * there too.\n *\n * Counted per element, so a sheet opened over a sheet, or a tour over either,\n * does not hand the page back when the inner one closes.\n */\nexport function inertOutside(keep: Element): () => void {\n if (typeof document === 'undefined') return () => {}\n\n const taken: Element[] = []\n\n for (const element of Array.from(document.body.children)) {\n if (element.contains(keep)) continue\n\n const count = holds.get(element)\n if (count === undefined) {\n if (element.hasAttribute('inert')) continue\n element.setAttribute('inert', '')\n }\n holds.set(element, (count ?? 0) + 1)\n taken.push(element)\n }\n\n let released = false\n\n return () => {\n if (released) return\n released = true\n\n for (const element of taken) {\n const count = (holds.get(element) ?? 1) - 1\n if (count > 0) {\n holds.set(element, count)\n continue\n }\n holds.delete(element)\n element.removeAttribute('inert')\n }\n }\n}\n"],"mappings":";;;;;AAIA,IAAM,wBAAQ,IAAI,IAAqB;;;;;;;;;;;;;;;;AAiBvC,SAAgB,aAAa,MAA2B;CACtD,IAAI,OAAO,aAAa,aAAa,aAAa,CAAC;CAEnD,MAAM,QAAmB,CAAC;CAE1B,KAAK,MAAM,WAAW,MAAM,KAAK,SAAS,KAAK,QAAQ,GAAG;EACxD,IAAI,QAAQ,SAAS,IAAI,GAAG;EAE5B,MAAM,QAAQ,MAAM,IAAI,OAAO;EAC/B,IAAI,UAAU,KAAA,GAAW;GACvB,IAAI,QAAQ,aAAa,OAAO,GAAG;GACnC,QAAQ,aAAa,SAAS,EAAE;EAClC;EACA,MAAM,IAAI,UAAU,SAAS,KAAK,CAAC;EACnC,MAAM,KAAK,OAAO;CACpB;CAEA,IAAI,WAAW;CAEf,aAAa;EACX,IAAI,UAAU;EACd,WAAW;EAEX,KAAK,MAAM,WAAW,OAAO;GAC3B,MAAM,SAAS,MAAM,IAAI,OAAO,KAAK,KAAK;GAC1C,IAAI,QAAQ,GAAG;IACb,MAAM,IAAI,SAAS,KAAK;IACxB;GACF;GACA,MAAM,OAAO,OAAO;GACpB,QAAQ,gBAAgB,OAAO;EACjC;CACF;AACF"}
package/dist/styles.css CHANGED
@@ -1,26 +1,26 @@
1
1
 
2
- .sheet-enter-active[data-v-6194b8f4],
3
- .sheet-leave-active[data-v-6194b8f4] {
2
+ .sheet-enter-active[data-v-2855eea3],
3
+ .sheet-leave-active[data-v-2855eea3] {
4
4
  transition: opacity var(--duration-base) ease;
5
5
  }
6
- .sheet-enter-from[data-v-6194b8f4],
7
- .sheet-leave-to[data-v-6194b8f4] {
6
+ .sheet-enter-from[data-v-2855eea3],
7
+ .sheet-leave-to[data-v-2855eea3] {
8
8
  opacity: 0;
9
9
  }
10
10
 
11
11
  /* The panel travels further than the scrim fades, which is what makes the
12
12
  sheet read as rising rather than appearing. */
13
- .sheet-enter-active .sheet-panel[data-v-6194b8f4],
14
- .sheet-leave-active .sheet-panel[data-v-6194b8f4] {
13
+ .sheet-enter-active .sheet-panel[data-v-2855eea3],
14
+ .sheet-leave-active .sheet-panel[data-v-2855eea3] {
15
15
  transition: transform var(--duration-slow) var(--ease-sheet);
16
16
  }
17
- .sheet-enter-from .sheet-panel[data-v-6194b8f4],
18
- .sheet-leave-to .sheet-panel[data-v-6194b8f4] {
17
+ .sheet-enter-from .sheet-panel[data-v-2855eea3],
18
+ .sheet-leave-to .sheet-panel[data-v-2855eea3] {
19
19
  transform: translateY(6%);
20
20
  }
21
21
  @media (prefers-reduced-motion: reduce) {
22
- .sheet-enter-from .sheet-panel[data-v-6194b8f4],
23
- .sheet-leave-to .sheet-panel[data-v-6194b8f4] {
22
+ .sheet-enter-from .sheet-panel[data-v-2855eea3],
23
+ .sheet-leave-to .sheet-panel[data-v-2855eea3] {
24
24
  transform: none;
25
25
  }
26
26
  }
@@ -209,12 +209,12 @@
209
209
  cannot reach slot content, which belongs to the caller's scope, so
210
210
  `.tour-forward-*` and `.tour-backward-*` ship unscoped in
211
211
  `rei-kit/shell/mobile.css` where the caller's slide can actually see them. */
212
- .tour-enter-active[data-v-3bbf95fc],
213
- .tour-leave-active[data-v-3bbf95fc] {
212
+ .tour-enter-active[data-v-88982fee],
213
+ .tour-leave-active[data-v-88982fee] {
214
214
  transition: opacity var(--duration-base) ease;
215
215
  }
216
- .tour-enter-from[data-v-3bbf95fc],
217
- .tour-leave-to[data-v-3bbf95fc] {
216
+ .tour-enter-from[data-v-88982fee],
217
+ .tour-leave-to[data-v-88982fee] {
218
218
  opacity: 0;
219
219
  }
220
220
 
@@ -650,7 +650,7 @@ to {
650
650
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
651
651
  @layer properties {
652
652
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
653
- [data-v-e9bd0632],[data-v-e9bd0632]:before,[data-v-e9bd0632]:after,[data-v-e9bd0632]::backdrop {
653
+ [data-v-a76891c4],[data-v-a76891c4]:before,[data-v-a76891c4]:after,[data-v-a76891c4]::backdrop {
654
654
  --tw-translate-x: 0;
655
655
  --tw-translate-y: 0;
656
656
  --tw-translate-z: 0;
@@ -664,7 +664,7 @@ to {
664
664
  }
665
665
  }
666
666
  }
667
- .tab-bar[data-v-e9bd0632] {
667
+ .tab-bar[data-v-a76891c4] {
668
668
  z-index: 40;
669
669
  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
670
670
  width: 100%;
@@ -675,18 +675,18 @@ to {
675
675
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
676
676
  position: absolute;
677
677
  }
678
- .tab-bar-inner[data-v-e9bd0632] {
678
+ .tab-bar-inner[data-v-a76891c4] {
679
679
  justify-content: space-between;
680
680
  align-items: center;
681
681
  gap: var(--spacing, .25rem);
682
682
  display: flex;
683
683
  }
684
684
  @supports (color: color-mix(in lab, red, red)) {
685
- .tab-bar-inner[data-v-e9bd0632] {
685
+ .tab-bar-inner[data-v-a76891c4] {
686
686
  background-color: color-mix(in oklab, var(--color-surface) var(--surface-opacity), transparent);
687
687
  }
688
688
  }
689
- .tab-bar-inner[data-v-e9bd0632] {
689
+ .tab-bar-inner[data-v-a76891c4] {
690
690
  border: var(--surface-border-width) solid var(--surface-border-color);
691
691
  box-shadow: var(--shadow-raised);
692
692
  -webkit-backdrop-filter: var(--surface-backdrop);
@@ -694,15 +694,15 @@ to {
694
694
  background-color: #fff;
695
695
  }
696
696
  @supports (color: color-mix(in lab, red, red)) {
697
- .tab-bar-inner[data-v-e9bd0632] {
697
+ .tab-bar-inner[data-v-a76891c4] {
698
698
  background-color: color-mix(in oklab, var(--color-surface) min(var(--surface-opacity), 88%), transparent);
699
699
  }
700
700
  }
701
- .tab-bar-inner[data-v-e9bd0632] {
701
+ .tab-bar-inner[data-v-a76891c4] {
702
702
  -webkit-backdrop-filter: var(--surface-backdrop, blur(12px));
703
703
  border-radius: var(--radius-shell);
704
704
  }
705
- .tab-link[data-v-e9bd0632] {
705
+ .tab-link[data-v-a76891c4] {
706
706
  cursor: pointer;
707
707
  justify-content: center;
708
708
  align-items: center;
@@ -710,16 +710,22 @@ to {
710
710
  min-height: 52px;
711
711
  padding-block: calc(var(--spacing, .25rem) * 1.5);
712
712
  color: var(--color-ink-soft, #5c7480);
713
- border-radius: calc(var(--radius-shell) - 6px);
714
- transition: color var(--duration-base) ease;
715
713
  flex-direction: column;
716
714
  flex: 1;
717
715
  display: flex;
718
716
  }
719
- .tab-link[data-v-e9bd0632]:hover {
717
+ .tab-link[data-v-a76891c4]:focus-visible {
718
+ outline: 2px solid var(--color-primary);
719
+ outline-offset: 2px;
720
+ }
721
+ .tab-link[data-v-a76891c4] {
722
+ border-radius: calc(var(--radius-shell) - 6px);
723
+ transition: color var(--duration-base) ease;
724
+ }
725
+ .tab-link[data-v-a76891c4]:hover {
720
726
  color: var(--color-ink, #0f2229);
721
727
  }
722
- .tab-icon-slot[data-v-e9bd0632] {
728
+ .tab-icon-slot[data-v-a76891c4] {
723
729
  height: calc(var(--spacing, .25rem) * 7);
724
730
  width: calc(var(--spacing, .25rem) * 12);
725
731
  transition-property: all;
@@ -734,16 +740,16 @@ to {
734
740
  align-items: center;
735
741
  display: flex;
736
742
  }
737
- .tab-link:active .tab-icon-slot[data-v-e9bd0632] {
743
+ .tab-link:active .tab-icon-slot[data-v-a76891c4] {
738
744
  transform: scale(.88);
739
745
  }
740
- .is-active[data-v-e9bd0632] {
746
+ .is-active[data-v-a76891c4] {
741
747
  color: var(--color-primary, #26667f);
742
748
  }
743
- .is-active .tab-icon-slot[data-v-e9bd0632] {
749
+ .is-active .tab-icon-slot[data-v-a76891c4] {
744
750
  background-color: var(--color-muted, #ddf4e7);
745
751
  }
746
- .tab-icon[data-v-e9bd0632] {
752
+ .tab-icon[data-v-a76891c4] {
747
753
  stroke-width: 2px;
748
754
  width: 18px;
749
755
  height: 18px;
@@ -753,29 +759,29 @@ to {
753
759
  --tw-duration: var(--duration-base);
754
760
  transition-duration: var(--duration-base);
755
761
  }
756
- .is-active .tab-icon[data-v-e9bd0632] {
762
+ .is-active .tab-icon[data-v-a76891c4] {
757
763
  --tw-scale-x: 110%;
758
764
  --tw-scale-y: 110%;
759
765
  --tw-scale-z: 110%;
760
766
  scale: var(--tw-scale-x) var(--tw-scale-y);
761
767
  stroke-width: 2.5px;
762
768
  }
763
- .tab-label[data-v-e9bd0632] {
769
+ .tab-label[data-v-a76891c4] {
764
770
  --tw-leading: 1;
765
771
  --tw-font-weight: var(--font-weight-medium, 500);
766
772
  font-size: 10px;
767
773
  line-height: 1;
768
774
  font-weight: var(--font-weight-medium, 500);
769
775
  }
770
- .is-active .tab-label[data-v-e9bd0632] {
776
+ .is-active .tab-label[data-v-a76891c4] {
771
777
  --tw-font-weight: var(--font-weight-semibold, 600);
772
778
  font-weight: var(--font-weight-semibold, 600);
773
779
  }
774
780
  @media (prefers-reduced-motion: reduce) {
775
- .tab-icon-slot[data-v-e9bd0632], .tab-icon[data-v-e9bd0632] {
781
+ .tab-icon-slot[data-v-a76891c4], .tab-icon[data-v-a76891c4] {
776
782
  transition: none;
777
783
  }
778
- .tab-link:active .tab-icon-slot[data-v-e9bd0632] {
784
+ .tab-link:active .tab-icon-slot[data-v-a76891c4] {
779
785
  transform: none;
780
786
  }
781
787
  }
@@ -1087,7 +1093,7 @@ to {
1087
1093
  }
1088
1094
  }
1089
1095
 
1090
- .rk-modal-scrim[data-v-c6537cc8] {
1096
+ .rk-modal-scrim[data-v-61956691] {
1091
1097
  position: fixed;
1092
1098
  inset: 0;
1093
1099
  z-index: 50;
@@ -1097,7 +1103,7 @@ to {
1097
1103
  background: color-mix(in srgb, var(--color-ink) 70%, transparent);
1098
1104
  backdrop-filter: blur(4px);
1099
1105
  }
1100
- .rk-modal-panel[data-v-c6537cc8] {
1106
+ .rk-modal-panel[data-v-61956691] {
1101
1107
  width: 100%;
1102
1108
  max-width: 28rem;
1103
1109
  max-height: 85vh;
@@ -1105,21 +1111,21 @@ to {
1105
1111
  border-radius: var(--radius-card);
1106
1112
  padding: 1.5rem;
1107
1113
  }
1108
- .rk-modal-panel[data-v-c6537cc8]:focus {
1114
+ .rk-modal-panel[data-v-61956691]:focus {
1109
1115
  outline: none;
1110
1116
  }
1111
- .rk-modal-head[data-v-c6537cc8] {
1117
+ .rk-modal-head[data-v-61956691] {
1112
1118
  display: flex;
1113
1119
  align-items: flex-start;
1114
1120
  justify-content: space-between;
1115
1121
  gap: 1rem;
1116
1122
  }
1117
- .rk-modal-title[data-v-c6537cc8] {
1123
+ .rk-modal-title[data-v-61956691] {
1118
1124
  font-size: 1.0625rem;
1119
1125
  font-weight: 600;
1120
1126
  color: var(--color-ink);
1121
1127
  }
1122
- .rk-modal-close[data-v-c6537cc8] {
1128
+ .rk-modal-close[data-v-61956691] {
1123
1129
  display: grid;
1124
1130
  place-items: center;
1125
1131
  flex-shrink: 0;
@@ -1129,58 +1135,58 @@ to {
1129
1135
  color: var(--color-ink-soft);
1130
1136
  transition: background-color var(--duration-fast);
1131
1137
  }
1132
- .rk-modal-close[data-v-c6537cc8]:hover {
1138
+ .rk-modal-close[data-v-61956691]:hover {
1133
1139
  background: var(--color-muted);
1134
1140
  }
1135
- .rk-modal-close[data-v-c6537cc8]:focus-visible {
1141
+ .rk-modal-close[data-v-61956691]:focus-visible {
1136
1142
  outline: 2px solid var(--color-primary);
1137
1143
  outline-offset: 2px;
1138
1144
  }
1139
- .rk-modal-close svg[data-v-c6537cc8] {
1145
+ .rk-modal-close svg[data-v-61956691] {
1140
1146
  width: 1rem;
1141
1147
  height: 1rem;
1142
1148
  }
1143
- .rk-modal-body[data-v-c6537cc8] {
1149
+ .rk-modal-body[data-v-61956691] {
1144
1150
  margin-top: 0.75rem;
1145
1151
  color: var(--color-ink-soft);
1146
1152
  font-size: 0.875rem;
1147
1153
  line-height: 1.625;
1148
1154
  }
1149
- .rk-modal-actions[data-v-c6537cc8] {
1155
+ .rk-modal-actions[data-v-61956691] {
1150
1156
  margin-top: 1.5rem;
1151
1157
  display: flex;
1152
1158
  justify-content: flex-end;
1153
1159
  gap: 0.5rem;
1154
1160
  }
1155
- .rk-modal-enter-active[data-v-c6537cc8],
1156
- .rk-modal-leave-active[data-v-c6537cc8] {
1161
+ .rk-modal-enter-active[data-v-61956691],
1162
+ .rk-modal-leave-active[data-v-61956691] {
1157
1163
  transition: opacity var(--duration-base) ease;
1158
1164
  }
1159
- .rk-modal-enter-active .rk-modal-panel[data-v-c6537cc8],
1160
- .rk-modal-leave-active .rk-modal-panel[data-v-c6537cc8] {
1165
+ .rk-modal-enter-active .rk-modal-panel[data-v-61956691],
1166
+ .rk-modal-leave-active .rk-modal-panel[data-v-61956691] {
1161
1167
  transition:
1162
1168
  transform var(--duration-base) var(--ease-sheet),
1163
1169
  opacity var(--duration-base) ease;
1164
1170
  }
1165
- .rk-modal-enter-from[data-v-c6537cc8],
1166
- .rk-modal-leave-to[data-v-c6537cc8] {
1171
+ .rk-modal-enter-from[data-v-61956691],
1172
+ .rk-modal-leave-to[data-v-61956691] {
1167
1173
  opacity: 0;
1168
1174
  }
1169
1175
 
1170
1176
  /* From nowhere, not from an edge: a scale is what separates this from a sheet. */
1171
- .rk-modal-enter-from .rk-modal-panel[data-v-c6537cc8],
1172
- .rk-modal-leave-to .rk-modal-panel[data-v-c6537cc8] {
1177
+ .rk-modal-enter-from .rk-modal-panel[data-v-61956691],
1178
+ .rk-modal-leave-to .rk-modal-panel[data-v-61956691] {
1173
1179
  transform: scale(0.96);
1174
1180
  opacity: 0;
1175
1181
  }
1176
1182
  @media (prefers-reduced-motion: reduce) {
1177
- .rk-modal-enter-active .rk-modal-panel[data-v-c6537cc8],
1178
- .rk-modal-leave-active .rk-modal-panel[data-v-c6537cc8] {
1183
+ .rk-modal-enter-active .rk-modal-panel[data-v-61956691],
1184
+ .rk-modal-leave-active .rk-modal-panel[data-v-61956691] {
1179
1185
  transition: opacity var(--duration-base) ease;
1180
1186
  transform: none;
1181
1187
  }
1182
- .rk-modal-enter-from .rk-modal-panel[data-v-c6537cc8],
1183
- .rk-modal-leave-to .rk-modal-panel[data-v-c6537cc8] {
1188
+ .rk-modal-enter-from .rk-modal-panel[data-v-61956691],
1189
+ .rk-modal-leave-to .rk-modal-panel[data-v-61956691] {
1184
1190
  transform: none;
1185
1191
  }
1186
1192
  }
package/dist/tokens.css CHANGED
@@ -298,6 +298,20 @@
298
298
  background-attachment: fixed;
299
299
  }
300
300
 
301
+ /* The keyboard focus ring, in one place.
302
+
303
+ Every raw control the kit renders carries this or states its own ring. A
304
+ control without one is invisible to anyone moving through the page with
305
+ Tab — `SegmentedControl` shipped that way, its real input hidden and its
306
+ visible pill never told it had focus. Only `:focus-visible`, so a mouse
307
+ click draws nothing. */
308
+ @utility focus-ring {
309
+ &:focus-visible {
310
+ outline: 2px solid var(--color-primary);
311
+ outline-offset: 2px;
312
+ }
313
+ }
314
+
301
315
  /* Scrolling stays, the bar goes. On a narrow column a visible track reads as a
302
316
  stray line rather than as a control. */
303
317
  @utility no-scrollbar {
package/dist/utils/inert.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ /**
2
+ * Takes everything on the page except the branch holding `keep` out of tab
3
+ * order and pointer events, and returns the function that gives it back.
4
+ *
5
+ * `inert` is a real focus trap without keydown bookkeeping, and the only one
6
+ * that also stops a screen reader's virtual cursor. It used to be applied to
7
+ * `document.getElementById('app')` — the id Vite's template happens to use —
8
+ * so an app mounted on `#root` got a dialog whose background was still
9
+ * reachable with Tab, and nothing said so. Working from `<body>`'s children
10
+ * instead holds whatever the app is mounted on, and anything else teleported
11
+ * there too.
12
+ *
13
+ * Counted per element, so a sheet opened over a sheet, or a tour over either,
14
+ * does not hand the page back when the inner one closes.
15
+ */
16
+ export declare function inertOutside(keep: Element): () => void;
package/dist/web.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.js";
2
+ import { t as inertOutside } from "./inert-B441LoCD.js";
2
3
  import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, onBeforeUnmount, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, shallowRef, toDisplayString, unref, useId, useModel, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
3
4
  import { RouterLink } from "vue-router";
4
5
  //#region src/web/BaseAccordion.vue?vue&type=script&setup=true&lang.ts
@@ -214,6 +215,8 @@ var BaseModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
214
215
  const panel = ref(null);
215
216
  /** Who had focus before this opened, so it can be given back. */
216
217
  let restoreTo = null;
218
+ /** Gives the page behind back; set while open. */
219
+ let releaseInert = null;
217
220
  function focusable() {
218
221
  if (!panel.value) return [];
219
222
  return Array.from(panel.value.querySelectorAll(FOCUSABLE));
@@ -243,15 +246,19 @@ var BaseModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
243
246
  restoreTo = document.activeElement;
244
247
  document.body.style.overflow = "hidden";
245
248
  await nextTick();
249
+ if (panel.value) releaseInert = inertOutside(panel.value);
246
250
  (focusable()[0] ?? panel.value)?.focus();
247
251
  } else {
248
252
  document.body.style.overflow = "";
253
+ releaseInert?.();
254
+ releaseInert = null;
249
255
  restoreTo?.focus();
250
256
  restoreTo = null;
251
257
  }
252
258
  });
253
259
  onBeforeUnmount(() => {
254
260
  if (open.value) document.body.style.overflow = "";
261
+ releaseInert?.();
255
262
  });
256
263
  return (_ctx, _cache) => {
257
264
  return openBlock(), createBlock(Teleport, { to: "body" }, [createVNode(Transition, { name: "rk-modal" }, {
@@ -291,7 +298,7 @@ var BaseModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
291
298
  })]);
292
299
  };
293
300
  }
294
- }), [["__scopeId", "data-v-c6537cc8"]]);
301
+ }), [["__scopeId", "data-v-61956691"]]);
295
302
  //#endregion
296
303
  //#region src/web/BasePagination.vue?vue&type=script&setup=true&lang.ts
297
304
  var _hoisted_1$3 = ["aria-label"];