@astryxdesign/core 0.7.6-canary.c3cbf38 → 0.7.6-canary.c5fbecb

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 (210) hide show
  1. package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
  2. package/dist/BottomSheet/BottomSheet.js +31 -4
  3. package/dist/BottomSheet/BottomSheetPanel.d.ts +11 -1
  4. package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
  5. package/dist/BottomSheet/BottomSheetPanel.js +14 -1
  6. package/dist/BottomSheet/BottomSheetSwitcher.d.ts +10 -7
  7. package/dist/BottomSheet/BottomSheetSwitcher.d.ts.map +1 -1
  8. package/dist/BottomSheet/BottomSheetSwitcher.js +26 -9
  9. package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts +8 -0
  10. package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts.map +1 -1
  11. package/dist/Calendar/Calendar.d.ts.map +1 -1
  12. package/dist/Calendar/Calendar.js +6 -8
  13. package/dist/Calendar/hooks/useCalendarNavigation.d.ts.map +1 -1
  14. package/dist/Calendar/hooks/useCalendarNavigation.js +4 -7
  15. package/dist/DateInput/MonthScroller.d.ts.map +1 -1
  16. package/dist/DateInput/MonthScroller.js +4 -3
  17. package/dist/DateInput/TouchDateField.d.ts.map +1 -1
  18. package/dist/DateInput/TouchDateField.js +4 -3
  19. package/dist/DateTimeInput/TouchDateTimeField.d.ts.map +1 -1
  20. package/dist/DateTimeInput/TouchDateTimeField.js +4 -3
  21. package/dist/Dialog/Dialog.d.ts +1 -1
  22. package/dist/Dialog/Dialog.d.ts.map +1 -1
  23. package/dist/Dialog/Dialog.js +20 -3
  24. package/dist/Drawer/Drawer.d.ts +1 -1
  25. package/dist/Drawer/Drawer.d.ts.map +1 -1
  26. package/dist/Drawer/Drawer.js +21 -3
  27. package/dist/Field/index.d.ts +1 -0
  28. package/dist/Field/index.d.ts.map +1 -1
  29. package/dist/Field/inputStyles.stylex.d.ts +12 -9
  30. package/dist/Field/inputStyles.stylex.d.ts.map +1 -1
  31. package/dist/Field/inputStyles.stylex.js +12 -9
  32. package/dist/astryx.css +4 -0
  33. package/dist/gestures/GestureArena.d.ts +17 -3
  34. package/dist/gestures/GestureArena.d.ts.map +1 -1
  35. package/dist/gestures/GestureArena.js +70 -38
  36. package/dist/gestures/GestureHost.d.ts +330 -95
  37. package/dist/gestures/GestureHost.d.ts.map +1 -1
  38. package/dist/gestures/GestureHost.js +1304 -475
  39. package/dist/gestures/GestureRecognizer.d.ts +56 -17
  40. package/dist/gestures/GestureRecognizer.d.ts.map +1 -1
  41. package/dist/gestures/GestureRecognizer.js +28 -2
  42. package/dist/gestures/LongPressGestureRecognizer.d.ts +2 -0
  43. package/dist/gestures/LongPressGestureRecognizer.d.ts.map +1 -1
  44. package/dist/gestures/LongPressGestureRecognizer.js +14 -1
  45. package/dist/gestures/PanGestureRecognizer.d.ts +11 -0
  46. package/dist/gestures/PanGestureRecognizer.d.ts.map +1 -1
  47. package/dist/gestures/PanGestureRecognizer.js +25 -0
  48. package/dist/gestures/PinchGestureRecognizer.d.ts +3 -2
  49. package/dist/gestures/PinchGestureRecognizer.d.ts.map +1 -1
  50. package/dist/gestures/PinchGestureRecognizer.js +10 -8
  51. package/dist/gestures/PressTracker.d.ts +31 -3
  52. package/dist/gestures/PressTracker.d.ts.map +1 -1
  53. package/dist/gestures/PressTracker.js +25 -6
  54. package/dist/gestures/TapGestureRecognizer.d.ts +2 -0
  55. package/dist/gestures/TapGestureRecognizer.d.ts.map +1 -1
  56. package/dist/gestures/TapGestureRecognizer.js +5 -0
  57. package/dist/gestures/VelocityTracker.d.ts +12 -0
  58. package/dist/gestures/VelocityTracker.d.ts.map +1 -1
  59. package/dist/gestures/VelocityTracker.js +38 -0
  60. package/dist/gestures/fingerScroll.d.ts +14 -0
  61. package/dist/gestures/fingerScroll.d.ts.map +1 -0
  62. package/dist/gestures/fingerScroll.js +181 -0
  63. package/dist/gestures/haptics.d.ts +6 -3
  64. package/dist/gestures/haptics.d.ts.map +1 -1
  65. package/dist/gestures/haptics.js +8 -5
  66. package/dist/gestures/hostRegistry.d.ts +15 -0
  67. package/dist/gestures/hostRegistry.d.ts.map +1 -0
  68. package/dist/gestures/hostRegistry.js +16 -0
  69. package/dist/gestures/index.d.ts +6 -2
  70. package/dist/gestures/index.d.ts.map +1 -1
  71. package/dist/gestures/index.js +3 -1
  72. package/dist/gestures/nativeScroll.d.ts +2 -32
  73. package/dist/gestures/nativeScroll.d.ts.map +1 -1
  74. package/dist/gestures/nativeScroll.js +5 -17
  75. package/dist/gestures/pageHold.d.ts +21 -0
  76. package/dist/gestures/pageHold.d.ts.map +1 -0
  77. package/dist/gestures/pageHold.js +216 -0
  78. package/dist/gestures/recognizerInternals.d.ts +52 -0
  79. package/dist/gestures/recognizerInternals.d.ts.map +1 -0
  80. package/dist/gestures/recognizerInternals.js +33 -0
  81. package/dist/gestures/selectionLock.d.ts +10 -0
  82. package/dist/gestures/selectionLock.d.ts.map +1 -0
  83. package/dist/gestures/selectionLock.js +12 -0
  84. package/dist/gestures/touchAction.d.ts +10 -12
  85. package/dist/gestures/touchAction.d.ts.map +1 -1
  86. package/dist/gestures/touchAction.js +13 -21
  87. package/dist/gestures/types.d.ts +17 -0
  88. package/dist/gestures/types.d.ts.map +1 -1
  89. package/dist/gestures/useAttachment.d.ts +30 -0
  90. package/dist/gestures/useAttachment.d.ts.map +1 -0
  91. package/dist/gestures/useAttachment.js +90 -0
  92. package/dist/gestures/useFingerScroll.d.ts +33 -0
  93. package/dist/gestures/useFingerScroll.d.ts.map +1 -0
  94. package/dist/gestures/useFingerScroll.js +72 -0
  95. package/dist/gestures/useGestureRecognizer.d.ts +23 -15
  96. package/dist/gestures/useGestureRecognizer.d.ts.map +1 -1
  97. package/dist/gestures/useGestureRecognizer.js +50 -160
  98. package/dist/gestures/usePressTracker.d.ts +34 -0
  99. package/dist/gestures/usePressTracker.d.ts.map +1 -0
  100. package/dist/gestures/usePressTracker.js +167 -0
  101. package/dist/hooks/useLongPress.d.ts +21 -0
  102. package/dist/hooks/useLongPress.d.ts.map +1 -1
  103. package/dist/hooks/useLongPress.js +48 -7
  104. package/dist/hooks/useMenuPress.d.ts +12 -2
  105. package/dist/hooks/useMenuPress.d.ts.map +1 -1
  106. package/dist/hooks/useMenuPress.js +71 -91
  107. package/dist/hooks/useSettledOpen.d.ts +16 -0
  108. package/dist/hooks/useSettledOpen.d.ts.map +1 -0
  109. package/dist/hooks/useSettledOpen.js +44 -0
  110. package/dist/motion/animator.d.ts.map +1 -1
  111. package/dist/motion/animator.js +94 -4
  112. package/dist/motion/presentation.d.ts +44 -0
  113. package/dist/motion/presentation.d.ts.map +1 -0
  114. package/dist/motion/presentation.js +127 -0
  115. package/dist/motion/uikit/gestures.d.ts +9 -18
  116. package/dist/motion/uikit/gestures.d.ts.map +1 -1
  117. package/dist/motion/uikit/gestures.js +14 -9
  118. package/dist/motion/uikit/longPress.d.ts +26 -0
  119. package/dist/motion/uikit/longPress.d.ts.map +1 -0
  120. package/dist/motion/uikit/longPress.js +29 -0
  121. package/dist/privateAttributes/hapticSwitch.stylex.d.ts +5 -0
  122. package/dist/privateAttributes/hapticSwitch.stylex.d.ts.map +1 -0
  123. package/dist/privateAttributes/hapticSwitch.stylex.js +27 -0
  124. package/dist/utils/clickGuard.d.ts +34 -0
  125. package/dist/utils/clickGuard.d.ts.map +1 -0
  126. package/dist/utils/clickGuard.js +150 -0
  127. package/dist/utils/coarsePointer.d.ts +8 -0
  128. package/dist/utils/coarsePointer.d.ts.map +1 -0
  129. package/dist/utils/coarsePointer.js +47 -0
  130. package/dist/utils/flatTree.d.ts +17 -0
  131. package/dist/utils/flatTree.d.ts.map +1 -0
  132. package/dist/utils/flatTree.js +38 -0
  133. package/dist/utils/inputStream.d.ts +17 -0
  134. package/dist/utils/inputStream.d.ts.map +1 -0
  135. package/dist/utils/inputStream.js +149 -0
  136. package/dist/utils/plainDate.d.ts +9 -0
  137. package/dist/utils/plainDate.d.ts.map +1 -1
  138. package/dist/utils/plainDate.js +25 -0
  139. package/dist/utils/pressFeedback.d.ts.map +1 -1
  140. package/dist/utils/pressFeedback.js +72 -27
  141. package/dist/utils/selectionLock.d.ts +14 -0
  142. package/dist/utils/selectionLock.d.ts.map +1 -0
  143. package/dist/utils/selectionLock.js +164 -0
  144. package/dist/utils/standaloneMonthCapitals.generated.d.ts +7 -0
  145. package/dist/utils/standaloneMonthCapitals.generated.d.ts.map +1 -0
  146. package/dist/utils/standaloneMonthCapitals.generated.js +9 -0
  147. package/dist/utils/touchPresentation.d.ts +2 -7
  148. package/dist/utils/touchPresentation.d.ts.map +1 -1
  149. package/dist/utils/touchPresentation.js +4 -7
  150. package/dist/utils/touchQueries.d.ts +17 -1
  151. package/dist/utils/touchQueries.d.ts.map +1 -1
  152. package/dist/utils/touchQueries.js +20 -2
  153. package/package.json +4 -4
  154. package/src/BottomSheet/BottomSheet.tsx +38 -1
  155. package/src/BottomSheet/BottomSheetPanel.tsx +25 -0
  156. package/src/BottomSheet/BottomSheetSwitcher.tsx +31 -8
  157. package/src/BottomSheet/BottomSheetSwitcherContext.ts +8 -0
  158. package/src/Calendar/Calendar.tsx +11 -10
  159. package/src/Calendar/hooks/useCalendarNavigation.ts +9 -10
  160. package/src/DateInput/MonthScroller.tsx +2 -3
  161. package/src/DateInput/TouchDateField.tsx +2 -3
  162. package/src/DateTimeInput/TouchDateTimeField.tsx +2 -3
  163. package/src/Dialog/Dialog.tsx +20 -2
  164. package/src/Drawer/Drawer.tsx +24 -2
  165. package/src/Field/index.ts +1 -0
  166. package/src/Field/inputStyles.stylex.ts +46 -9
  167. package/src/gestures/GestureArena.ts +91 -38
  168. package/src/gestures/GestureHost.ts +1561 -561
  169. package/src/gestures/GestureRecognizer.ts +69 -18
  170. package/src/gestures/LongPressGestureRecognizer.ts +20 -1
  171. package/src/gestures/PanGestureRecognizer.ts +35 -0
  172. package/src/gestures/PinchGestureRecognizer.ts +13 -8
  173. package/src/gestures/PressTracker.ts +55 -8
  174. package/src/gestures/README.md +313 -51
  175. package/src/gestures/TapGestureRecognizer.ts +5 -0
  176. package/src/gestures/VelocityTracker.ts +35 -0
  177. package/src/gestures/fingerScroll.ts +208 -0
  178. package/src/gestures/haptics.ts +8 -5
  179. package/src/gestures/hostRegistry.ts +18 -0
  180. package/src/gestures/index.ts +6 -5
  181. package/src/gestures/nativeScroll.ts +6 -20
  182. package/src/gestures/pageHold.ts +265 -0
  183. package/src/gestures/recognizerInternals.ts +77 -0
  184. package/src/gestures/selectionLock.ts +12 -0
  185. package/src/gestures/touchAction.ts +12 -24
  186. package/src/gestures/types.ts +18 -0
  187. package/src/gestures/useAttachment.ts +99 -0
  188. package/src/gestures/useFingerScroll.ts +85 -0
  189. package/src/gestures/useGestureRecognizer.ts +70 -209
  190. package/src/gestures/usePressTracker.ts +212 -0
  191. package/src/hooks/useLongPress.ts +62 -8
  192. package/src/hooks/useMenuPress.ts +80 -102
  193. package/src/hooks/useSettledOpen.ts +51 -0
  194. package/src/motion/MEASUREMENTS.md +1 -1
  195. package/src/motion/README.md +11 -0
  196. package/src/motion/animator.ts +94 -5
  197. package/src/motion/presentation.ts +149 -0
  198. package/src/motion/uikit/gestures.ts +15 -8
  199. package/src/motion/uikit/longPress.ts +29 -0
  200. package/src/privateAttributes/hapticSwitch.stylex.ts +27 -0
  201. package/src/utils/clickGuard.ts +167 -0
  202. package/src/utils/coarsePointer.ts +53 -0
  203. package/src/utils/flatTree.ts +40 -0
  204. package/src/utils/inputStream.ts +168 -0
  205. package/src/utils/plainDate.ts +28 -0
  206. package/src/utils/pressFeedback.ts +73 -22
  207. package/src/utils/selectionLock.ts +193 -0
  208. package/src/utils/standaloneMonthCapitals.generated.ts +17 -0
  209. package/src/utils/touchPresentation.ts +4 -7
  210. package/src/utils/touchQueries.ts +24 -1
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AAEH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAuDhD,YAAY,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAsJhF,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAEjD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AAo0BxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}
1
+ {"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AAEH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAuDhD,YAAY,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AA6JhF,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAEjD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AAg2BxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}
@@ -77,6 +77,8 @@
77
77
  * - /packages/cli/assets/templates/blocks/components/BottomSheet/BottomSheetShowcase.tsx
78
78
  */
79
79
  import { use, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
80
+ import { useIsHydrating } from "../hooks/useIsHydrating.js";
81
+ import { useSettledOpen } from "../hooks/useSettledOpen.js";
80
82
  import * as stylex from '@stylexjs/stylex';
81
83
  import "../theme/tokens.stylex.js";
82
84
  import { colorVars, durationVars, easeVars, spacingVars } from "../theme/tokens.stylex.js";
@@ -151,6 +153,10 @@ const styles = {
151
153
  k4oj2o: "x15l12jy",
152
154
  $$css: true
153
155
  },
156
+ scrimSettled: {
157
+ k9an0g: "x108qnu8",
158
+ $$css: true
159
+ },
154
160
  scrimClosing: {
155
161
  kb4ib: "x1cz9k3x",
156
162
  $$css: true
@@ -272,7 +278,20 @@ function StandaloneBottomSheet({
272
278
  // state stays the consumer's; nothing here writes it.
273
279
  const host = use(BottomSheetHostContext);
274
280
  const isHostOpen = host?.isOpen ?? true;
275
- const isOpen = isOpenProp && isHostOpen;
281
+ // A sheet open on the server renders closed until hydration, and opens in
282
+ // the render after it, the first one that can enter its native host: a
283
+ // <dialog> painted open with aria-modal before it is modal claims a state it
284
+ // does not have (FR17).
285
+ const isHydrating = useIsHydrating();
286
+ const isOpen = isOpenProp && isHostOpen && !isHydrating;
287
+ // A sheet open on the server was present on page load, so it opens settled,
288
+ // with no rise or fade-in; its later opens and closes animate as usual
289
+ // (spec:AST-013 FR13). It latches on its own request, not its host's state:
290
+ // a host sheet hydrating reads as closed to the sheets inside it.
291
+ // The latch is released when the settled entry's transition ends, so a
292
+ // drag's settle later in the same open glides as usual.
293
+ const [settledOpen, releaseSettledOpen] = useSettledOpen(isOpenProp, isOpen, false);
294
+ const isEntrySettled = settledOpen && isOpen;
276
295
  // Presentation outlives the controlled prop: a closing sheet stays mounted
277
296
  // and in its native host through its exit, and only its motion completion
278
297
  // (or a replace finishing) clears it. The open flip is derived during
@@ -589,7 +608,7 @@ function StandaloneBottomSheet({
589
608
  // The dialog is the panel's positioner, so the stack's recede
590
609
  // transforms the dialog: panel, grabber and all shrink and lift as
591
610
  // one. The backdrop is not a descendant and stays put.
592
- ...stackPositionerStyles(stackView), hasScrim && styles.scrim, hasScrim && isExiting && styles.scrimClosing, !hasScrim && styles.dialogNonModal),
611
+ ...stackPositionerStyles(stackView), hasScrim && styles.scrim, hasScrim && isEntrySettled && styles.scrimSettled, hasScrim && isExiting && styles.scrimClosing, !hasScrim && styles.dialogNonModal),
593
612
  ref: dialogComposedRef
594
613
  // A non-modal sheet is hosted in the top layer as a manual popover
595
614
  // (no light dismiss, no backdrop), so sheets order by presentation
@@ -611,6 +630,8 @@ function StandaloneBottomSheet({
611
630
  ...props,
612
631
  ref: ref,
613
632
  state: panelState,
633
+ isEntrySettled: isEntrySettled,
634
+ onEntrySettled: releaseSettledOpen,
614
635
  isOpenRequested: isOpen,
615
636
  height: height,
616
637
  label: label,
@@ -672,7 +693,9 @@ function SwitcherBottomSheetItem({
672
693
  dialogProps,
673
694
  onDialogCancel,
674
695
  onDialogClick,
675
- onDialogKeyDown
696
+ onDialogKeyDown,
697
+ settledSheet,
698
+ releaseSettledSheet
676
699
  } = switcher;
677
700
  const hasValidSheetId = typeof sheetId === 'string' && sheetId.length > 0;
678
701
  const phase = hasValidSheetId ? getSheetPhase(sheetId) : 'hidden';
@@ -681,6 +704,8 @@ function SwitcherBottomSheetItem({
681
704
  const isInteractive = phase === 'active' || phase === 'entering';
682
705
  const isInactive = phase === 'covered' || phase === 'aligning' || phase === 'fading' || phase === 'exiting';
683
706
  const isPresented = phase !== 'hidden';
707
+ // The step open on the server opens settled (spec:AST-013 FR13).
708
+ const isEntrySettled = hasValidSheetId && isPresented && settledSheet === sheetId;
684
709
  const isTopSheet = phase === 'active' || phase === 'entering';
685
710
  const ownsScrim = hasValidSheetId && isScrimOwner(sheetId);
686
711
  // The flow is one level of the bottom-sheet stack; a sheet outside the flow
@@ -833,7 +858,7 @@ function SwitcherBottomSheetItem({
833
858
  'data-testid': switcherTestId,
834
859
  ...switcherDialogProps
835
860
  } = dialogProps;
836
- const dialogPresentationProps = mergeProps(stylex.props(styles.dialog, isPresented && styles.dialogOpen, hasScrim && styles.scrim, hasScrim && ownsScrim && isFlowClosing && styles.scrimClosing, !hasScrim && styles.dialogNonModalItem, !hasScrim && isTopSheet && styles.dialogNonModalItemTop, switcherXstyle), switcherClassName, switcherStyle);
861
+ const dialogPresentationProps = mergeProps(stylex.props(styles.dialog, isPresented && styles.dialogOpen, hasScrim && styles.scrim, hasScrim && isEntrySettled && styles.scrimSettled, hasScrim && ownsScrim && isFlowClosing && styles.scrimClosing, !hasScrim && styles.dialogNonModalItem, !hasScrim && isTopSheet && styles.dialogNonModalItemTop, switcherXstyle), switcherClassName, switcherStyle);
837
862
  return /*#__PURE__*/_jsxs("dialog", {
838
863
  ...switcherDialogProps,
839
864
  ...dialogPresentationProps,
@@ -860,6 +885,8 @@ function SwitcherBottomSheetItem({
860
885
  ...props,
861
886
  ref: ref,
862
887
  state: panelState,
888
+ isEntrySettled: isEntrySettled,
889
+ onEntrySettled: releaseSettledSheet,
863
890
  isOpenRequested: hasValidSheetId && activeSheet === sheetId,
864
891
  height: height,
865
892
  label: label,
@@ -47,6 +47,16 @@ interface BottomSheetPanelProps extends BaseProps<HTMLDivElement> {
47
47
  /** Ref forwarded to the visual sheet panel. */
48
48
  ref?: React.Ref<HTMLDivElement>;
49
49
  state: BottomSheetPanelState;
50
+ /**
51
+ * Whether the sheet was open on page load: it then opens where it rests,
52
+ * with no entry motion (spec:AST-013 FR13).
53
+ */
54
+ isEntrySettled?: boolean;
55
+ /**
56
+ * Called when the settled entry's transition ends, so the host can release
57
+ * it and later motion in the same open (a drag's settle) animates as usual.
58
+ */
59
+ onEntrySettled?: () => void;
50
60
  /**
51
61
  * The host's controlled open state — false as soon as the host has taken
52
62
  * a close, true while it is open or has refused one — distinct from
@@ -74,7 +84,7 @@ interface BottomSheetPanelProps extends BaseProps<HTMLDivElement> {
74
84
  onMotionComplete?: (motion: BottomSheetPanelMotion) => void;
75
85
  }
76
86
  /** Internal visual and gesture surface shared by every BottomSheet host. */
77
- export declare function BottomSheetPanel({ ref, state, isOpenRequested, height, label, children, padding, snapPoints, className, style, tabIndex, xstyle, isSwipeDismissAllowed, isPageScrollLocked, onDismiss, onScrimOpacity, onElementChange, onMotionStart, onMotionComplete, ...props }: BottomSheetPanelProps): import("react").JSX.Element;
87
+ export declare function BottomSheetPanel({ ref, state, isOpenRequested, height, label, children, padding, snapPoints, className, style, tabIndex, xstyle, isEntrySettled, onEntrySettled, onTransitionEnd, isSwipeDismissAllowed, isPageScrollLocked, onDismiss, onScrimOpacity, onElementChange, onMotionStart, onMotionComplete, ...props }: BottomSheetPanelProps): import("react").JSX.Element;
78
88
  export declare namespace BottomSheetPanel {
79
89
  var displayName: string;
80
90
  }
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA+B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,eAAe,CAAC;AAQvB,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AAC5D,YAAY,EAAC,oBAAoB,EAAC,CAAC;AA+CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AAiN3D,MAAM,MAAM,sBAAsB,GAChC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,MAAM,MAAM,qBAAqB,GAC7B;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAChB;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAC,GACjC;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC1C,eAAe,EAAE,MAAM,CAAC;CACzB,GACD;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,UAAU,qBAAsB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,KAAK,EAAE,qBAAqB,CAAC;IAC7B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,mEAAmE;IACnE,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC7D;AA4HD,4EAA4E;AAC5E,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,eAAe,EACf,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAO,EACP,UAAU,EACV,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,qBAA4B,EAC5B,kBAA0B,EAC1B,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BAoZvB;yBAzae,gBAAgB"}
1
+ {"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA+B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,eAAe,CAAC;AAQvB,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AAC5D,YAAY,EAAC,oBAAoB,EAAC,CAAC;AA+CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AAsN3D,MAAM,MAAM,sBAAsB,GAChC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,MAAM,MAAM,qBAAqB,GAC7B;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAChB;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAC,GACjC;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC1C,eAAe,EAAE,MAAM,CAAC;CACzB,GACD;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,UAAU,qBAAsB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,KAAK,EAAE,qBAAqB,CAAC;IAC7B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,mEAAmE;IACnE,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC7D;AA4HD,4EAA4E;AAC5E,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,eAAe,EACf,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAO,EACP,UAAU,EACV,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,cAAsB,EACtB,cAAc,EACd,eAAe,EACf,qBAA4B,EAC5B,kBAA0B,EAC1B,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BA2ZvB;yBAnbe,gBAAgB"}
@@ -125,6 +125,10 @@ const styles = {
125
125
  k6sLGO: "x1q1rmc8",
126
126
  $$css: true
127
127
  },
128
+ sheetSettled: {
129
+ kIyJzY: "xpvlhck",
130
+ $$css: true
131
+ },
128
132
  sheetClosing: {
129
133
  k3aq6I: "x1weeur4 x1oe9tb1",
130
134
  kSiTet: "x1m67veq",
@@ -293,6 +297,9 @@ export function BottomSheetPanel({
293
297
  style,
294
298
  tabIndex,
295
299
  xstyle,
300
+ isEntrySettled = false,
301
+ onEntrySettled,
302
+ onTransitionEnd,
296
303
  isSwipeDismissAllowed = true,
297
304
  isPageScrollLocked = false,
298
305
  onDismiss,
@@ -582,7 +589,13 @@ export function BottomSheetPanel({
582
589
  ...props,
583
590
  ref: setElement,
584
591
  tabIndex: tabIndex ?? -1,
585
- ...mergeProps(themeProps('bottom-sheet'), stylex.props(layerTextReset.reset, layerStructureReset.reset, styles.sheet, overlayPaddingReset.reset, height === 'hug' ? styles.hugHeight : styles.budget, isClosing && styles.sheetClosing, isClosing && isCrossFade && styles.sheetClosingCrossFade, isFading && styles.sheetFading, isInactive && styles.sheetInactive, xstyle), className, {
592
+ onTransitionEnd: event => {
593
+ onTransitionEnd?.(event);
594
+ if (isEntrySettled && event.target === event.currentTarget) {
595
+ onEntrySettled?.();
596
+ }
597
+ },
598
+ ...mergeProps(themeProps('bottom-sheet'), stylex.props(layerTextReset.reset, layerStructureReset.reset, styles.sheet, overlayPaddingReset.reset, height === 'hug' ? styles.hugHeight : styles.budget, isClosing && styles.sheetClosing, isClosing && isCrossFade && styles.sheetClosingCrossFade, isFading && styles.sheetFading, isInactive && styles.sheetInactive, isEntrySettled && styles.sheetSettled, xstyle), className, {
586
599
  ['--_sheet-budget']: budget,
587
600
  ...(isInteractive ? gestureStyle : isRetained || isClosing ? {
588
601
  height: hostHeight
@@ -76,9 +76,11 @@ import type { BaseProps } from '../BaseProps.js';
76
76
  * by one state value that names the open step; closing the top sheet and
77
77
  * opening the next in the same update, from inside the open step, runs the
78
78
  * same replace handoff (see BottomSheet, "Replacing a sheet"). Keeps working until a future minor
79
- * release removes it: on its own as released (plus two fixes: a toast raised
80
- * from a step now renders above the flow and can be pressed, and reduced motion
81
- * follows design:reduced-motion), as one stack level when stacked.
79
+ * release removes it: on its own as released (plus three fixes: a toast raised
80
+ * from a step now renders above the flow and can be pressed, reduced motion
81
+ * follows design:reduced-motion, and a flow whose active sheet is set on the
82
+ * server renders closed until hydration, then opens that sheet settled), as
83
+ * one stack level when stacked.
82
84
  */
83
85
  export interface BottomSheetSwitcherProps extends BaseProps<HTMLDialogElement> {
84
86
  /**
@@ -129,10 +131,11 @@ export interface BottomSheetSwitcherProps extends BaseProps<HTMLDialogElement> {
129
131
  * `sheetId` and no switcher, for modal and `hasScrim={false}` flows alike; a
130
132
  * step changed from outside the flow's sheets closes and opens with the
131
133
  * sheets' own motion. The switcher keeps working until a future
132
- * minor release removes it: on its own as released (plus two fixes: a toast
133
- * raised from a step now renders above the flow and can be pressed, and reduced
134
- * motion follows design:reduced-motion), and as one level of the stack when
135
- * stacked with other sheets.
134
+ * minor release removes it: on its own as released (plus three fixes: a toast
135
+ * raised from a step now renders above the flow and can be pressed, reduced
136
+ * motion follows design:reduced-motion, and a flow whose active sheet is set
137
+ * on the server renders closed until hydration, then opens that sheet
138
+ * settled), and as one level of the stack when stacked with other sheets.
136
139
  */
137
140
  export declare function BottomSheetSwitcher({ activeSheet: activeSheetProp, onActiveSheetChange, hasScrim, children, ref, onCancel, onClick, onKeyDown, className, style, xstyle, ...restDialogProps }: BottomSheetSwitcherProps): import("react").JSX.Element;
138
141
  export declare namespace BottomSheetSwitcher {
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetSwitcher.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcher.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsEG;AAEH,OAAO,EAUL,KAAK,SAAS,EACd,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6J5C;;;;;;;;GAQG;AACH,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5E;;;;;;OAMG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE9D;;;;;OAKG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,iEAAiE;IACjE,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAEtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAW,EAAE,eAAe,EAC5B,mBAAmB,EACnB,QAAe,EACf,QAAQ,EACR,GAAG,EACH,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,eAAe,EACnB,EAAE,wBAAwB,+BA4vB1B;yBAzwBe,mBAAmB"}
1
+ {"version":3,"file":"BottomSheetSwitcher.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcher.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsEG;AAEH,OAAO,EAUL,KAAK,SAAS,EACd,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6J5C;;;;;;;;;;GAUG;AACH,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5E;;;;;;OAMG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE9D;;;;;OAKG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,iEAAiE;IACjE,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAEtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAW,EAAE,eAAe,EAC5B,mBAAmB,EACnB,QAAe,EACf,QAAQ,EACR,GAAG,EACH,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,eAAe,EACnB,EAAE,wBAAwB,+BA8wB1B;yBA3xBe,mBAAmB"}
@@ -74,6 +74,8 @@
74
74
  * - /packages/cli/assets/templates/blocks/components/BottomSheet/BottomSheetSwitcherShowcase.tsx
75
75
  */
76
76
  import { use, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
77
+ import { useIsHydrating } from "../hooks/useIsHydrating.js";
78
+ import { useSettledOpen } from "../hooks/useSettledOpen.js";
77
79
  import * as stylex from '@stylexjs/stylex';
78
80
  import { useScrollLock } from "../hooks/useScrollLock.js";
79
81
  import { useFocusTrapEscapeCompatibilitySignal } from "../hooks/useFocusTrap.js";
@@ -164,9 +166,11 @@ function takeOverScrim(dialog, opacity) {
164
166
  * by one state value that names the open step; closing the top sheet and
165
167
  * opening the next in the same update, from inside the open step, runs the
166
168
  * same replace handoff (see BottomSheet, "Replacing a sheet"). Keeps working until a future minor
167
- * release removes it: on its own as released (plus two fixes: a toast raised
168
- * from a step now renders above the flow and can be pressed, and reduced motion
169
- * follows design:reduced-motion), as one stack level when stacked.
169
+ * release removes it: on its own as released (plus three fixes: a toast raised
170
+ * from a step now renders above the flow and can be pressed, reduced motion
171
+ * follows design:reduced-motion, and a flow whose active sheet is set on the
172
+ * server renders closed until hydration, then opens that sheet settled), as
173
+ * one stack level when stacked.
170
174
  */
171
175
 
172
176
  /**
@@ -189,10 +193,11 @@ function takeOverScrim(dialog, opacity) {
189
193
  * `sheetId` and no switcher, for modal and `hasScrim={false}` flows alike; a
190
194
  * step changed from outside the flow's sheets closes and opens with the
191
195
  * sheets' own motion. The switcher keeps working until a future
192
- * minor release removes it: on its own as released (plus two fixes: a toast
193
- * raised from a step now renders above the flow and can be pressed, and reduced
194
- * motion follows design:reduced-motion), and as one level of the stack when
195
- * stacked with other sheets.
196
+ * minor release removes it: on its own as released (plus three fixes: a toast
197
+ * raised from a step now renders above the flow and can be pressed, reduced
198
+ * motion follows design:reduced-motion, and a flow whose active sheet is set
199
+ * on the server renders closed until hydration, then opens that sheet
200
+ * settled), and as one level of the stack when stacked with other sheets.
196
201
  */
197
202
  export function BottomSheetSwitcher({
198
203
  activeSheet: activeSheetProp,
@@ -215,7 +220,17 @@ export function BottomSheetSwitcher({
215
220
  // for it; with the host closed the flow simply reads as closed.
216
221
  const host = use(BottomSheetHostContext);
217
222
  const isHostOpen = host?.isOpen ?? true;
218
- const activeSheet = isHostOpen ? activeSheetProp : null;
223
+ // A flow with an active sheet on the server reads as closed until
224
+ // hydration, and opens in the render after it, the first one that can enter
225
+ // its native host: a <dialog> painted open with aria-modal before it is
226
+ // modal claims a state it does not have (`component:BottomSheet` FR17).
227
+ const isHydrating = useIsHydrating();
228
+ const activeSheet = isHostOpen && !isHydrating ? activeSheetProp : null;
229
+ // The step active on the server was present on page load, so it opens
230
+ // settled, with no entry motion; the first change of step animates as
231
+ // usual (spec:AST-013 FR13). It latches on the flow's own request: a host
232
+ // sheet hydrating reads as closed to a flow inside it.
233
+ const [settledSheet, releaseSettledSheet] = useSettledOpen(activeSheetProp, activeSheet, null);
219
234
  // Every sheet host applies the switcher's dialog surface to its own dialog.
220
235
  const dialogProps = useShallowStable({
221
236
  ...restDialogProps,
@@ -746,6 +761,8 @@ export function BottomSheetSwitcher({
746
761
  const onDialogKeyDown = useMemo(() => composeEventHandlers(onKeyDown, handleKeyDown), [handleKeyDown, onKeyDown]);
747
762
  const contextValue = useMemo(() => ({
748
763
  activeSheet,
764
+ settledSheet,
765
+ releaseSettledSheet,
749
766
  hasScrim,
750
767
  onActiveSheetChange,
751
768
  getSheetPhase,
@@ -766,7 +783,7 @@ export function BottomSheetSwitcher({
766
783
  onDialogCancel,
767
784
  onDialogClick,
768
785
  onDialogKeyDown
769
- }), [activeSheet, dialogProps, getSheetAlignmentOffset, getSheetPhase, hasScrim, hostSheet, isCoveredInTopLayer, isFlowClosing, isScrimOwner, onActiveSheetChange, onBeforeSheetPresent, onDialogCancel, onDialogClick, onDialogKeyDown, onSheetEnterStart, onSheetScrimOpacityChange, onSheetTransitionComplete, registerSheetDialog, registerSheetElement, registerSheetPurpose, stackView]);
786
+ }), [activeSheet, dialogProps, getSheetAlignmentOffset, getSheetPhase, hasScrim, hostSheet, isCoveredInTopLayer, isFlowClosing, isScrimOwner, onActiveSheetChange, onBeforeSheetPresent, onDialogCancel, onDialogClick, onDialogKeyDown, onSheetEnterStart, onSheetScrimOpacityChange, onSheetTransitionComplete, registerSheetDialog, registerSheetElement, registerSheetPurpose, releaseSettledSheet, settledSheet, stackView]);
770
787
  return /*#__PURE__*/_jsx(BottomSheetSwitcherContext, {
771
788
  value: contextValue,
772
789
  children: /*#__PURE__*/_jsx("div", {
@@ -26,6 +26,14 @@ export interface BottomSheetSwitcherTransitionEvent {
26
26
  export type BottomSheetSwitcherDialogProps = Omit<BaseProps<HTMLDialogElement>, 'onClick' | 'onKeyDown'>;
27
27
  export interface BottomSheetSwitcherContextValue {
28
28
  activeSheet: string | null;
29
+ /**
30
+ * The sheet that was active on page load, until the active sheet first
31
+ * changes: it opens where it rests, with no entry motion
32
+ * (spec:AST-013 FR13).
33
+ */
34
+ settledSheet: string | null;
35
+ /** Releases `settledSheet` once its settled entry's transition ends. */
36
+ releaseSettledSheet: () => void;
29
37
  hasScrim: boolean;
30
38
  onActiveSheetChange: (sheetId: string | null) => void;
31
39
  getSheetPhase: (sheetId: string) => BottomSheetSwitcherPhase;
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetSwitcherContext.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcherContext.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EACV,aAAa,IAAI,kBAAkB,EACnC,UAAU,IAAI,eAAe,EAC7B,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAE7D,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,QAAQ,GACR,SAAS,GACT,UAAU,GACV,QAAQ,GACR,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,WAAW,kCAAkC;IACjD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;CACvD;AAED;;;;GAIG;AACH,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAC/C,SAAS,CAAC,iBAAiB,CAAC,EAC5B,SAAS,GAAG,WAAW,CACxB,CAAC;AAEF,MAAM,WAAW,+BAA+B;IAC9C,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtD,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,wBAAwB,CAAC;IAC7D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACrD;;;;;OAKG;IACH,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;;;OAIG;IACH,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC3C,4EAA4E;IAC5E,aAAa,EAAE,OAAO,CAAC;IACvB,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7E,mBAAmB,EAAE,CACnB,OAAO,EAAE,MAAM,EACf,MAAM,EAAE,iBAAiB,GAAG,IAAI,KAC7B,IAAI,CAAC;IACV,oBAAoB,EAAE,CACpB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,aAAa,GAAG,IAAI,KAC1B,IAAI,CAAC;IACV;;;OAGG;IACH,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD;;;;OAIG;IACH,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAClD,iBAAiB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,yBAAyB,EAAE,CACzB,KAAK,EAAE,kCAAkC,KACtC,IAAI,CAAC;IACV,yBAAyB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE;;;OAGG;IACH,SAAS,EAAE,oBAAoB,CAAC;IAChC,yEAAyE;IACzE,WAAW,EAAE,8BAA8B,CAAC;IAC5C,cAAc,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,eAAe,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACzE;AAED,eAAO,MAAM,0BAA0B,iEACsB,CAAC"}
1
+ {"version":3,"file":"BottomSheetSwitcherContext.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcherContext.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EACV,aAAa,IAAI,kBAAkB,EACnC,UAAU,IAAI,eAAe,EAC7B,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAE7D,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,QAAQ,GACR,SAAS,GACT,UAAU,GACV,QAAQ,GACR,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,WAAW,kCAAkC;IACjD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;CACvD;AAED;;;;GAIG;AACH,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAC/C,SAAS,CAAC,iBAAiB,CAAC,EAC5B,SAAS,GAAG,WAAW,CACxB,CAAC;AAEF,MAAM,WAAW,+BAA+B;IAC9C,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B;;;;OAIG;IACH,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,wEAAwE;IACxE,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtD,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,wBAAwB,CAAC;IAC7D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACrD;;;;;OAKG;IACH,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;;;OAIG;IACH,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC3C,4EAA4E;IAC5E,aAAa,EAAE,OAAO,CAAC;IACvB,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7E,mBAAmB,EAAE,CACnB,OAAO,EAAE,MAAM,EACf,MAAM,EAAE,iBAAiB,GAAG,IAAI,KAC7B,IAAI,CAAC;IACV,oBAAoB,EAAE,CACpB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,aAAa,GAAG,IAAI,KAC1B,IAAI,CAAC;IACV;;;OAGG;IACH,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD;;;;OAIG;IACH,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAClD,iBAAiB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,yBAAyB,EAAE,CACzB,KAAK,EAAE,kCAAkC,KACtC,IAAI,CAAC;IACV,yBAAyB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE;;;OAGG;IACH,SAAS,EAAE,oBAAoB,CAAC;IAChC,yEAAyE;IACzE,WAAW,EAAE,8BAA8B,CAAC;IAC5C,cAAc,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,eAAe,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACzE;AAED,eAAO,MAAM,0BAA0B,iEACsB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsD5C,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,GACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,EACV,MAAM,oBAAoB,CAAC;AAS5B,+CAA+C;AAC/C,MAAM,WAAW,cAAc;IAC7B,wEAAwE;IACxE,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;CAC3C;AAID,UAAU,iBAAkB,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,cAAc,CAC5B;IACC,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACtC,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEvB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IAEvD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;CAC1C;AAID,UAAU,mBAAoB,SAAQ,iBAAiB;IACrD,qBAAqB;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,mFAAmF;IACnF,KAAK,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAE7B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;CAC9D;AAED,UAAU,kBAAmB,SAAQ,iBAAiB;IACpD,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IAEd,8DAA8D;IAC9D,KAAK,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAEzB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAqBrE;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,aAAa,+BAghBtD;yBAhhBe,QAAQ"}
1
+ {"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsD5C,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,GACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,EACV,MAAM,oBAAoB,CAAC;AAS5B,+CAA+C;AAC/C,MAAM,WAAW,cAAc;IAC7B,wEAAwE;IACxE,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;CAC3C;AAID,UAAU,iBAAkB,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,cAAc,CAC5B;IACC,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACtC,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEvB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IAEvD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;CAC1C;AAID,UAAU,mBAAoB,SAAQ,iBAAiB;IACrD,qBAAqB;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,mFAAmF;IACnF,KAAK,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAE7B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;CAC9D;AAED,UAAU,kBAAmB,SAAQ,iBAAiB;IACpD,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IAEd,8DAA8D;IAC9D,KAAK,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAEzB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAqBrE;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,aAAa,+BAihBtD;yBAjhBe,QAAQ"}
@@ -24,7 +24,8 @@ import { Icon } from "../Icon/index.js";
24
24
  import { useAnnounce, useGridFocus } from "../hooks/index.js";
25
25
  import { useCalendarDays, useCalendarConstraints } from "./hooks/index.js";
26
26
  import { calendarStyles, monthGridStyles, dayCellStyles, dayCellTheme } from "./styles.js";
27
- import { plainDateFromISO, plainDateToISO, plainDateToDate, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays, plainDateDiffDays, getDaysInMonth, plainDateIsAfter, plainDateIsBefore, plainDateIsEqual, plainDateGetWeekNumber, plainDateFormat, plainDateWeekFieldName, DATE_FORMAT_WITH_WEEKDAY, DATE_FORMAT_MONTH_YEAR } from "../utils/plainDate.js";
27
+ import { plainDateFromISO, plainDateToISO, plainDateToDate, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays, plainDateDiffDays, getDaysInMonth, plainDateIsAfter, plainDateIsBefore, plainDateIsEqual, plainDateGetWeekNumber, plainDateFormat, plainDateWeekFieldName, DATE_FORMAT_WITH_WEEKDAY } from "../utils/plainDate.js";
28
+ import { plainDateFormatStandaloneMonthYear } from "../utils/plainDate.js";
28
29
  import { mergeProps, composeEventHandlers, rtlStyles } from "../utils/index.js";
29
30
  import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
30
31
  import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
@@ -201,12 +202,9 @@ export function Calendar({
201
202
  }, [pendingFocus]);
202
203
 
203
204
  // Format month header
204
- const monthYearLabel = useMemo(() => {
205
- if (numberOfMonths === 1) {
206
- return plainDateFormat(visibleMonths[0], DATE_FORMAT_MONTH_YEAR, locale);
207
- }
208
- return visibleMonths.map(m => plainDateFormat(m, DATE_FORMAT_MONTH_YEAR, locale)).join(' – ');
209
- }, [visibleMonths, numberOfMonths, locale]);
205
+ // Each month is its own stand-alone label, so each starts with a capital
206
+ // where the locale capitalizes one (FR1).
207
+ const monthYearLabel = useMemo(() => visibleMonths.map(m => plainDateFormatStandaloneMonthYear(m, locale)).join(' – '), [visibleMonths, locale]);
210
208
 
211
209
  // Announce the newly visible month to screen readers whenever it changes.
212
210
  // The visible month label (`<span>`) carries no live semantics, so paging the
@@ -743,7 +741,7 @@ function MonthGrid({
743
741
 
744
742
  // Month label for announcements
745
743
  const monthLabel = useMemo(() => {
746
- return plainDateFormat(month, DATE_FORMAT_MONTH_YEAR, locale);
744
+ return plainDateFormatStandaloneMonthYear(month, locale);
747
745
  }, [month, locale]);
748
746
  return /*#__PURE__*/_jsx("div", {
749
747
  ...stylex.props(monthGridStyles.monthGrid),
@@ -1 +1 @@
1
- {"version":3,"file":"useCalendarNavigation.d.ts","sourceRoot":"","sources":["../../../src/Calendar/hooks/useCalendarNavigation.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EACL,KAAK,SAAS,EASf,MAAM,uBAAuB,CAAC;AAG/B;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C,gDAAgD;IAChD,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,qDAAqD;IACrD,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,0CAA0C;IAC1C,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IACvD,kCAAkC;IAClC,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACxB;AAED;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C,mEAAmE;IACnE,SAAS,EAAE,SAAS,CAAC;IACrB,sDAAsD;IACtD,aAAa,EAAE,SAAS,EAAE,CAAC;IAC3B,2CAA2C;IAC3C,cAAc,EAAE,MAAM,CAAC;IACvB,sCAAsC;IACtC,aAAa,EAAE,CACb,KAAK,EAAE,MAAM,EACb,WAAW,CAAC,EAAE,aAAa,EAC3B,MAAM,CAAC,EAAE,MAAM,KACZ,IAAI,CAAC;IACV,4CAA4C;IAC5C,YAAY,EAAE,aAAa,GAAG,IAAI,CAAC;IACnC,8BAA8B;IAC9B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,4BAA4B,GACpC,2BAA2B,CAyF7B"}
1
+ {"version":3,"file":"useCalendarNavigation.d.ts","sourceRoot":"","sources":["../../../src/Calendar/hooks/useCalendarNavigation.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EACL,KAAK,SAAS,EAOf,MAAM,uBAAuB,CAAC;AAI/B;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C,gDAAgD;IAChD,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,qDAAqD;IACrD,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,0CAA0C;IAC1C,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IACvD,kCAAkC;IAClC,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACxB;AAED;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C,mEAAmE;IACnE,SAAS,EAAE,SAAS,CAAC;IACrB,sDAAsD;IACtD,aAAa,EAAE,SAAS,EAAE,CAAC;IAC3B,2CAA2C;IAC3C,cAAc,EAAE,MAAM,CAAC;IACvB,sCAAsC;IACtC,aAAa,EAAE,CACb,KAAK,EAAE,MAAM,EACb,WAAW,CAAC,EAAE,aAAa,EAC3B,MAAM,CAAC,EAAE,MAAM,KACZ,IAAI,CAAC;IACV,4CAA4C;IAC5C,YAAY,EAAE,aAAa,GAAG,IAAI,CAAC;IACnC,8BAA8B;IAC9B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,4BAA4B,GACpC,2BAA2B,CAyF7B"}
@@ -12,7 +12,8 @@
12
12
  * - /packages/core/src/Calendar/hooks/index.ts
13
13
  */
14
14
  import { useState, useMemo, useCallback } from 'react';
15
- import { plainDateFromISO, plainDateToISO, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays, plainDateFormat, DATE_FORMAT_MONTH_YEAR } from "../../utils/plainDate.js";
15
+ import { plainDateFromISO, plainDateToISO, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays } from "../../utils/plainDate.js";
16
+ import { plainDateFormatStandaloneMonthYear } from "../../utils/plainDate.js";
16
17
  import { useLocale } from "../../i18n/index.js";
17
18
 
18
19
  /**
@@ -92,12 +93,8 @@ export function useCalendarNavigation(options) {
92
93
  }, [baseMonth, numberOfMonths]);
93
94
 
94
95
  // Format month header
95
- const monthYearLabel = useMemo(() => {
96
- if (numberOfMonths === 1) {
97
- return plainDateFormat(visibleMonths[0], DATE_FORMAT_MONTH_YEAR, locale);
98
- }
99
- return visibleMonths.map(m => plainDateFormat(m, DATE_FORMAT_MONTH_YEAR, locale)).join(' – ');
100
- }, [visibleMonths, numberOfMonths, locale]);
96
+ // Each month is its own stand-alone label (Calendar FR1).
97
+ const monthYearLabel = useMemo(() => visibleMonths.map(m => plainDateFormatStandaloneMonthYear(m, locale)).join(' – '), [visibleMonths, locale]);
101
98
 
102
99
  // Navigate to previous/next month
103
100
  const navigateMonth = useCallback((delta, focusedDate, offset) => {
@@ -1 +1 @@
1
- {"version":3,"file":"MonthScroller.d.ts","sourceRoot":"","sources":["../../src/DateInput/MonthScroller.tsx"],"names":[],"mappings":"AAoDA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,SAAS,EAQf,MAAM,UAAU,CAAC;AAgNlB,MAAM,WAAW,mBAAmB;IAClC,0DAA0D;IAC1D,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,WAAW,kBAAkB;IACjC,yEAAyE;IACzE,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACxD,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAC;IACtB,8CAA8C;IAC9C,aAAa,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+DAA+D;IAC/D,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,+BAA+B;IAC/B,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,4CAA4C;IAC5C,KAAK,EAAE,SAAS,CAAC;IACjB,2DAA2D;IAC3D,cAAc,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAC7C,gCAAgC;IAChC,YAAY,EAAE,SAAS,CAAC;IACxB,kCAAkC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,oBAAoB,EACpB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,YAAY,EACZ,QAAQ,GACT,EAAE,kBAAkB,+BA0fpB;yBArgBe,aAAa"}
1
+ {"version":3,"file":"MonthScroller.d.ts","sourceRoot":"","sources":["../../src/DateInput/MonthScroller.tsx"],"names":[],"mappings":"AAqDA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,SAAS,EAOf,MAAM,UAAU,CAAC;AAgNlB,MAAM,WAAW,mBAAmB;IAClC,0DAA0D;IAC1D,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,WAAW,kBAAkB;IACjC,yEAAyE;IACzE,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACxD,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAC;IACtB,8CAA8C;IAC9C,aAAa,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+DAA+D;IAC/D,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,+BAA+B;IAC/B,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,4CAA4C;IAC5C,KAAK,EAAE,SAAS,CAAC;IACjB,2DAA2D;IAC3D,cAAc,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAC7C,gCAAgC;IAChC,YAAY,EAAE,SAAS,CAAC;IACxB,kCAAkC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,oBAAoB,EACpB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,YAAY,EACZ,QAAQ,GACT,EAAE,kBAAkB,+BA0fpB;yBArgBe,aAAa"}
@@ -36,7 +36,8 @@ import { useDirection, useLocale } from "../i18n/index.js";
36
36
  import "../theme/tokens.stylex.js";
37
37
  import { colorVars, radiusVars, fontWeightVars, typeScaleVars, durationVars, borderVars } from "../theme/tokens.stylex.js";
38
38
  import { focusOutlineStyles } from "../utils/index.js";
39
- import { plainDateAddDays, plainDateDayOfWeek, plainDateFormat, plainDateIsEqual, plainDateToISO, DATE_FORMAT_MONTH_YEAR, DATE_FORMAT_WITH_WEEKDAY } from "../utils/index.js";
39
+ import { plainDateFormatStandaloneMonthYear } from "../utils/plainDate.js";
40
+ import { plainDateAddDays, plainDateDayOfWeek, plainDateFormat, plainDateIsEqual, plainDateToISO, DATE_FORMAT_WITH_WEEKDAY } from "../utils/index.js";
40
41
  import "./tokens.stylex.js";
41
42
  import { dateInputTouchSizes, dateInputTouchGeometry } from "./tokens.stylex.js";
42
43
  import { useOwnScrollGesture } from "./useOwnScrollGesture.js";
@@ -647,11 +648,11 @@ function MonthPane({
647
648
  // with them every snap offset below this month.
648
649
  hasVariableRowCount: false
649
650
  });
650
- const monthLabel = plainDateFormat({
651
+ const monthLabel = plainDateFormatStandaloneMonthYear({
651
652
  year,
652
653
  month,
653
654
  day: 1
654
- }, DATE_FORMAT_MONTH_YEAR, locale);
655
+ }, locale);
655
656
 
656
657
  // Exactly one day per pane is tab-reachable, so Tab moves through the
657
658
  // picker rather than through 42 buttons: the focused day if the keyboard
@@ -1 +1 @@
1
- {"version":3,"file":"TouchDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/TouchDateField.tsx"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AA6ehD;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAIhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAixBhB;yBArzBe,cAAc"}
1
+ {"version":3,"file":"TouchDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/TouchDateField.tsx"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AA6ehD;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAIhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAgxBhB;yBApzBe,cAAc"}
@@ -69,7 +69,8 @@ import "../theme/tokens.stylex.js";
69
69
  import { colorVars, spacingVars, radiusVars, sizeVars, borderVars, fontWeightVars, typeScaleVars, typographyVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
70
70
  import { useTooltip } from "../Tooltip/index.js";
71
71
  import { VisuallyHidden } from "../VisuallyHidden/index.js";
72
- import { focusOutlineStyles, getInputARIA, isImeKeyEvent, mergeProps, rtlStyles, themeProps, formatSharedDate, plainDateFromISO, plainDateToday, plainDateFormat, DATE_FORMAT_MONTH_YEAR, DATE_FORMAT_WEEKDAY_ONLY } from "../utils/index.js";
72
+ import { focusOutlineStyles, getInputARIA, isImeKeyEvent, mergeProps, rtlStyles, themeProps, formatSharedDate, plainDateFromISO, plainDateToday, plainDateFormat, DATE_FORMAT_WEEKDAY_ONLY } from "../utils/index.js";
73
+ import { plainDateFormatStandaloneMonthYear } from "../utils/plainDate.js";
73
74
  import { chainEventHandlers } from "../utils/chainEventHandlers.js";
74
75
  import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
75
76
  import { usePressFeedback } from "../hooks/usePressFeedback.js";
@@ -369,11 +370,11 @@ export function TouchDateField({
369
370
  month: 1,
370
371
  day: 4 + (weekStartsOn + offset) % 7
371
372
  }, DATE_FORMAT_WEEKDAY_ONLY, locale)), [locale, weekStartsOn]);
372
- const monthYearLabel = plainDateFormat({
373
+ const monthYearLabel = plainDateFormatStandaloneMonthYear({
373
374
  year,
374
375
  month,
375
376
  day: 1
376
- }, DATE_FORMAT_MONTH_YEAR, locale);
377
+ }, locale);
377
378
 
378
379
  // Formats the committed value only. A function format is called with the ISO
379
380
  // value; a named one reuses Timestamp's shared date mapping, so the same
@@ -1 +1 @@
1
- {"version":3,"file":"TouchDateTimeField.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/TouchDateTimeField.tsx"],"names":[],"mappings":"AA6GA,OAAO,KAAK,EAAC,kBAAkB,EAAoB,MAAM,iBAAiB,CAAC;AAuV3E,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,UAAkB,EAClB,UAAkB,EAElB,aAAa,EAAE,cAAc,EAC7B,kBAAkB,EAAE,mBAAmB,EACvC,QAAgB,EAChB,WAAW,EAAE,oBAAoB,EACjC,eAAe,EAAE,wBAAwB,EACzC,SAAS,EACT,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EAEZ,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,kBAAkB,+BA+/BpB;yBAtiCe,kBAAkB"}
1
+ {"version":3,"file":"TouchDateTimeField.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/TouchDateTimeField.tsx"],"names":[],"mappings":"AA6GA,OAAO,KAAK,EAAC,kBAAkB,EAAoB,MAAM,iBAAiB,CAAC;AAuV3E,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,UAAkB,EAClB,UAAkB,EAElB,aAAa,EAAE,cAAc,EAC7B,kBAAkB,EAAE,mBAAmB,EACvC,QAAgB,EAChB,WAAW,EAAE,oBAAoB,EACjC,eAAe,EAAE,wBAAwB,EACzC,SAAS,EACT,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EAEZ,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,kBAAkB,+BA8/BpB;yBAriCe,kBAAkB"}
@@ -48,7 +48,8 @@ import { formatLocaleTime } from "../utils/timeFormat.js";
48
48
  import { formatISOTime, isImeKeyEvent, isRenderable, isTimeInRange, clampTime, mergeProps, parseISOTime } from "../utils/index.js";
49
49
  import { chainEventHandlers } from "../utils/chainEventHandlers.js";
50
50
  import { joinAriaIDs } from "../utils/inputAria.js";
51
- import { DATE_FORMAT_LONG, DATE_FORMAT_MONTH_YEAR, DATE_FORMAT_WEEKDAY_ONLY, plainDateFormat, plainDateFromISO, plainDateToday } from "../utils/plainDate.js";
51
+ import { DATE_FORMAT_LONG, DATE_FORMAT_WEEKDAY_ONLY, plainDateFormat, plainDateFromISO, plainDateToday } from "../utils/plainDate.js";
52
+ import { plainDateFormatStandaloneMonthYear } from "../utils/plainDate.js";
52
53
  import { MonthScroller } from "../DateInput/MonthScroller.js";
53
54
  import { MonthYearWheels } from "../DateInput/MonthYearWheels.js";
54
55
  import { Wheel } from "../DateInput/Wheel.js";
@@ -405,11 +406,11 @@ export function TouchDateTimeField({
405
406
  month: 1,
406
407
  day: 4 + (weekStartsOn + offset) % 7
407
408
  }, DATE_FORMAT_WEEKDAY_ONLY, locale)), [weekStartsOn, locale]);
408
- const monthYearLabel = plainDateFormat({
409
+ const monthYearLabel = plainDateFormatStandaloneMonthYear({
409
410
  year,
410
411
  month,
411
412
  day: 1
412
- }, DATE_FORMAT_MONTH_YEAR, locale);
413
+ }, locale);
413
414
  const dateDisplayValue = useMemo(() => {
414
415
  if (selectedDate == null) {
415
416
  return '';
@@ -185,7 +185,7 @@ export interface DialogProps extends BaseProps<HTMLDialogElement> {
185
185
  * </Dialog>
186
186
  * ```
187
187
  */
188
- export declare function Dialog({ isOpen, isInline, onOpenChange, width, maxHeight, position, variant, purpose, padding, children, xstyle, className, style, ref, ...props }: DialogProps): import("react").JSX.Element | null;
188
+ export declare function Dialog({ isOpen: isOpenProp, isInline, onOpenChange, width, maxHeight, position, variant, purpose, padding, children, xstyle, className, style, ref, ...props }: DialogProps): import("react").JSX.Element | null;
189
189
  export declare namespace Dialog {
190
190
  var displayName: string;
191
191
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA2B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAMhD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AA6B9C;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AAEzD,4EAA4E;AAC5E,UAAU,mBAAmB;IAC3B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yEAAyE;IACzE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAuBD,2FAA2F;AAC3F,eAAO,MAAM,uCAAuC;;;;;;;;;;;CAW1C,CAAC;AAqKX;;;;;;;;;GASG;AACH,wBAAgB,4BAA4B,CAAC,QAAQ,EAAE,cAAc;;;;;EAUpE;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IAEpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,QAAgB,EAChB,YAAY,EACZ,KAAW,EACX,SAAmB,EACnB,QAAQ,EACR,OAAoB,EACpB,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,sCA+Wb;yBA/Xe,MAAM"}
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA2B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAMhD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AA6B9C;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AAEzD,4EAA4E;AAC5E,UAAU,mBAAmB;IAC3B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yEAAyE;IACzE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAuBD,2FAA2F;AAC3F,eAAO,MAAM,uCAAuC;;;;;;;;;;;CAW1C,CAAC;AAyKX;;;;;;;;;GASG;AACH,wBAAgB,4BAA4B,CAAC,QAAQ,EAAE,cAAc;;;;;EAUpE;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IAEpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EAAE,UAAU,EAClB,QAAgB,EAChB,YAAY,EACZ,KAAW,EACX,SAAmB,EACnB,QAAQ,EACR,OAAoB,EACpB,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,sCA2Xb;yBA3Ye,MAAM"}
@@ -32,6 +32,8 @@
32
32
  * - /packages/cli/assets/templates/blocks/components/Dialog/ (showcase blocks)
33
33
  */
34
34
  import { useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef } from 'react';
35
+ import { useIsHydrating } from "../hooks/useIsHydrating.js";
36
+ import { useSettledOpen } from "../hooks/useSettledOpen.js";
35
37
  import * as stylex from '@stylexjs/stylex';
36
38
  import { useScrollLock } from "../hooks/useScrollLock.js";
37
39
  import { layerTextReset } from "../Layer/layerTextReset.stylex.js";
@@ -152,6 +154,10 @@ const styles = {
152
154
  kKVMdj: "x1ewfqum x6mpr79 xtuz6mp",
153
155
  $$css: true
154
156
  },
157
+ openSettled: {
158
+ kKVMdj: "x1a5igra",
159
+ $$css: true
160
+ },
155
161
  backdrop: {
156
162
  kGyWv1: "xnixb3f",
157
163
  kba3nw: "x1abwkk1",
@@ -298,7 +304,7 @@ export function resolveDialogPositionOffsets(position) {
298
304
  * ```
299
305
  */
300
306
  export function Dialog({
301
- isOpen,
307
+ isOpen: isOpenProp,
302
308
  isInline = false,
303
309
  onOpenChange,
304
310
  width = 400,
@@ -314,6 +320,17 @@ export function Dialog({
314
320
  ref,
315
321
  ...props
316
322
  }) {
323
+ // A modal dialog open on the server renders closed until hydration, and
324
+ // opens in the render after it, the first one that can call showModal(): a
325
+ // <dialog> painted open with aria-modal before it is modal claims a state it
326
+ // does not have, over a live page (FR8). An inline dialog is not modal and
327
+ // renders as it is.
328
+ const isHydrating = useIsHydrating();
329
+ const isOpen = isOpenProp && (isInline || !isHydrating);
330
+ // A dialog open on the server was present on page load, so it opens settled,
331
+ // with no entry motion; its later opens animate as usual (spec:AST-013 FR13).
332
+ const [settledOpen] = useSettledOpen(isOpenProp && !isInline, isOpen, false);
333
+ const opensSettled = settledOpen && isOpen;
317
334
  // When no explicit padding prop, use theme default (--astryx-dialog-padding)
318
335
  const useThemeDefault = padding == null;
319
336
  const effectivePadding = padding ?? 4;
@@ -581,10 +598,10 @@ export function Dialog({
581
598
  }), focusOutlineProps.focusVisible(layerTextReset.reset, layerStructureReset.reset, styles.dialog, overlayPaddingReset.reset, isOpen && styles.open, styles.backdrop, standardSizing && dynamicStyles.sizing(standardSizing.width, standardSizing.maxWidth, standardSizing.maxHeight), hasPosition && (() => {
582
599
  const o = resolveDialogPositionOffsets(position);
583
600
  return dynamicStyles.position(o.top, o.insetInlineStart, o.insetInlineEnd, o.bottom);
584
- })(), isFullscreen && styles.fullscreen, isFullscreen && isOpen && styles.fullscreenOpen, xstyle), className, style),
601
+ })(), isFullscreen && styles.fullscreen, isFullscreen && isOpen && styles.fullscreenOpen, opensSettled && styles.openSettled, xstyle), className, style),
585
602
  onClick: chainEventHandlers(handleClick, onClickProp),
586
603
  onCancel: handleCancel,
587
- "aria-modal": "true"
604
+ "aria-modal": isHydrating ? undefined : 'true'
588
605
  // The default aria-labelledby (from a DialogHeader title) is set
589
606
  // imperatively in `attachDialog`; a consumer-provided aria-labelledby
590
607
  // flows through {...safeProps} above and wins.
@@ -185,7 +185,7 @@ export interface DrawerProps extends BaseProps<HTMLDialogElement> {
185
185
  * </Drawer>
186
186
  * ```
187
187
  */
188
- export declare function Drawer({ isOpen, onOpenChange, side, width, experimental, label, hasScrim, purpose, padding, children, xstyle, className, style, onClick: onClickProp, onKeyDown: onKeyDownProp, ref, ...props }: DrawerProps): import("react").JSX.Element;
188
+ export declare function Drawer({ isOpen: isOpenProp, onOpenChange, side, width, experimental, label, hasScrim, purpose, padding, children, xstyle, className, style, onClick: onClickProp, onKeyDown: onKeyDownProp, ref, ...props }: DrawerProps): import("react").JSX.Element;
189
189
  export declare namespace Drawer {
190
190
  var displayName: string;
191
191
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../src/Drawer/Drawer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AAEH,OAAO,EAAgC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAEpE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAgB7C,OAAO,KAAK,EAAC,WAAW,EAAe,MAAM,WAAW,CAAC;AAqMzD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,iDAAiD;IACjD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAEvB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;OAKG;IACH,YAAY,CAAC,EAAE;QACb;;;;;;WAMG;QACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;KAC/B,CAAC;IAEF;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,YAAY,EACZ,IAAY,EACZ,KAAW,EACX,YAAY,EACZ,KAAK,EACL,QAAe,EACf,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAmLb;yBArMe,MAAM"}
1
+ {"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../src/Drawer/Drawer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AAEH,OAAO,EAAgC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAIpE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAgB7C,OAAO,KAAK,EAAC,WAAW,EAAe,MAAM,WAAW,CAAC;AA6MzD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,iDAAiD;IACjD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAEvB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;OAKG;IACH,YAAY,CAAC,EAAE;QACb;;;;;;WAMG;QACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;KAC/B,CAAC;IAEF;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EAAE,UAAU,EAClB,YAAY,EACZ,IAAY,EACZ,KAAW,EACX,YAAY,EACZ,KAAK,EACL,QAAe,EACf,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BA+Lb;yBAjNe,MAAM"}