@astryxdesign/core 0.7.8-canary.ea33daf → 0.7.8-canary.eb985e5

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 (170) hide show
  1. package/dist/BottomSheet/BottomSheetPanel.d.ts +1 -1
  2. package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
  3. package/dist/BottomSheet/BottomSheetPanel.js +30 -14
  4. package/dist/BottomSheet/bottomSheetStack.js +1 -1
  5. package/dist/BottomSheet/useSheetGestures.d.ts +3 -1
  6. package/dist/BottomSheet/useSheetGestures.d.ts.map +1 -1
  7. package/dist/BottomSheet/useSheetGestures.js +4 -0
  8. package/dist/CheckboxList/CheckboxList.d.ts +13 -2
  9. package/dist/CheckboxList/CheckboxList.d.ts.map +1 -1
  10. package/dist/CheckboxList/CheckboxList.js +10 -4
  11. package/dist/CheckboxList/CheckboxListContext.d.ts +7 -0
  12. package/dist/CheckboxList/CheckboxListContext.d.ts.map +1 -1
  13. package/dist/CheckboxList/CheckboxListContext.js +2 -1
  14. package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
  15. package/dist/CheckboxList/CheckboxListItem.js +14 -2
  16. package/dist/CheckboxList/requiredGroup.d.ts +22 -0
  17. package/dist/CheckboxList/requiredGroup.d.ts.map +1 -0
  18. package/dist/CheckboxList/requiredGroup.js +52 -0
  19. package/dist/DateInput/PickerWheel.d.ts +1 -1
  20. package/dist/DateInput/PickerWheel.d.ts.map +1 -1
  21. package/dist/DateInput/PickerWheel.js +27 -6
  22. package/dist/DateInput/Wheel.d.ts +2 -2
  23. package/dist/DateInput/Wheel.d.ts.map +1 -1
  24. package/dist/DateInput/Wheel.js +20 -6
  25. package/dist/DateInput/datePickerTouch.d.ts +13 -0
  26. package/dist/DateInput/datePickerTouch.d.ts.map +1 -0
  27. package/dist/DateInput/datePickerTouch.js +14 -0
  28. package/dist/DateInput/wheelOptions.d.ts +22 -2
  29. package/dist/DateInput/wheelOptions.d.ts.map +1 -1
  30. package/dist/DateInput/wheelOptions.js +14 -2
  31. package/dist/DateTimeInput/TouchDateTimeField.d.ts.map +1 -1
  32. package/dist/DateTimeInput/TouchDateTimeField.js +62 -119
  33. package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
  34. package/dist/HoverCard/useHoverCard.js +6 -1
  35. package/dist/Overlay/Overlay.d.ts.map +1 -1
  36. package/dist/Overlay/Overlay.js +7 -2
  37. package/dist/PowerSearch/PowerSearch.d.ts +4 -2
  38. package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
  39. package/dist/PowerSearch/PowerSearchBottomSheet.d.ts +24 -1
  40. package/dist/PowerSearch/PowerSearchBottomSheet.d.ts.map +1 -1
  41. package/dist/PowerSearch/PowerSearchBottomSheet.js +172 -50
  42. package/dist/TimeInput/TimeWheels.d.ts +32 -0
  43. package/dist/TimeInput/TimeWheels.d.ts.map +1 -0
  44. package/dist/TimeInput/TimeWheels.js +144 -0
  45. package/dist/TimeInput/TouchTimeField.d.ts.map +1 -1
  46. package/dist/TimeInput/TouchTimeField.js +63 -118
  47. package/dist/TimeInput/timeWheelRules.d.ts +124 -0
  48. package/dist/TimeInput/timeWheelRules.d.ts.map +1 -0
  49. package/dist/TimeInput/timeWheelRules.js +277 -0
  50. package/dist/Tokenizer/TokenizerBottomSheet.js +8 -12
  51. package/dist/Tooltip/useTooltip.d.ts.map +1 -1
  52. package/dist/Tooltip/useTooltip.js +6 -0
  53. package/dist/astryx.css +3 -1
  54. package/dist/gestures/GestureHost.d.ts.map +1 -1
  55. package/dist/gestures/GestureHost.js +3 -0
  56. package/dist/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.d.ts.map +1 -1
  57. package/dist/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.js +5 -2
  58. package/dist/i18n/generated-english/TimeInput/TimeWheels.generated.d.ts +8 -0
  59. package/dist/i18n/generated-english/TimeInput/TimeWheels.generated.d.ts.map +1 -0
  60. package/dist/i18n/generated-english/TimeInput/TimeWheels.generated.js +17 -0
  61. package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
  62. package/dist/i18n/generated-locales/en.generated.js +5 -2
  63. package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
  64. package/dist/i18n/generated-locales/pseudo.generated.js +5 -2
  65. package/dist/keyboard/index.d.ts +17 -0
  66. package/dist/keyboard/index.d.ts.map +1 -0
  67. package/dist/keyboard/index.js +19 -0
  68. package/dist/keyboard/keyboardHeight.d.ts +149 -0
  69. package/dist/keyboard/keyboardHeight.d.ts.map +1 -0
  70. package/dist/keyboard/keyboardHeight.js +432 -0
  71. package/dist/keyboard/keyboardLayoutGuide.d.ts +59 -0
  72. package/dist/keyboard/keyboardLayoutGuide.d.ts.map +1 -0
  73. package/dist/keyboard/keyboardLayoutGuide.js +207 -0
  74. package/dist/keyboard/keyboardModel.d.ts +93 -0
  75. package/dist/keyboard/keyboardModel.d.ts.map +1 -0
  76. package/dist/keyboard/keyboardModel.js +220 -0
  77. package/dist/keyboard/rideKeyboard.d.ts +42 -0
  78. package/dist/keyboard/rideKeyboard.d.ts.map +1 -0
  79. package/dist/keyboard/rideKeyboard.js +77 -0
  80. package/dist/keyboard/useMobileKeyboard.d.ts +61 -0
  81. package/dist/keyboard/useMobileKeyboard.d.ts.map +1 -0
  82. package/dist/keyboard/useMobileKeyboard.js +699 -0
  83. package/dist/motion/android/index.d.ts +16 -0
  84. package/dist/motion/android/index.d.ts.map +1 -0
  85. package/dist/motion/android/index.js +18 -0
  86. package/dist/motion/android/keyboard.d.ts +83 -0
  87. package/dist/motion/android/keyboard.d.ts.map +1 -0
  88. package/dist/motion/android/keyboard.js +96 -0
  89. package/dist/motion/uikit/datePicker.d.ts +58 -0
  90. package/dist/motion/uikit/datePicker.d.ts.map +1 -0
  91. package/dist/motion/uikit/datePicker.js +60 -0
  92. package/dist/motion/uikit/index.d.ts +4 -3
  93. package/dist/motion/uikit/index.d.ts.map +1 -1
  94. package/dist/motion/uikit/index.js +4 -3
  95. package/dist/utils/interactionOverlay.stylex.d.ts +3 -2
  96. package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
  97. package/dist/utils/interactionOverlay.stylex.js +3 -2
  98. package/dist/utils/layoutViewport.d.ts +25 -0
  99. package/dist/utils/layoutViewport.d.ts.map +1 -0
  100. package/dist/utils/layoutViewport.js +102 -0
  101. package/dist/utils/pressFeedback.d.ts.map +1 -1
  102. package/dist/utils/pressFeedback.js +74 -9
  103. package/dist/utils/pressGesture.d.ts +4 -2
  104. package/dist/utils/pressGesture.d.ts.map +1 -1
  105. package/dist/utils/pressGesture.js +3 -1
  106. package/dist/utils/selectionLock.d.ts +10 -1
  107. package/dist/utils/selectionLock.d.ts.map +1 -1
  108. package/dist/utils/selectionLock.js +31 -5
  109. package/dist/utils/sharedMutationObserver.d.ts +2 -1
  110. package/dist/utils/sharedMutationObserver.d.ts.map +1 -1
  111. package/dist/utils/sharedMutationObserver.js +2 -1
  112. package/dist/utils/timeParser.d.ts +2 -1
  113. package/dist/utils/timeParser.d.ts.map +1 -1
  114. package/dist/utils/timeParser.js +29 -3
  115. package/locales/en.json +21 -9
  116. package/locales/pseudo.json +15 -6
  117. package/package.json +4 -4
  118. package/src/BottomSheet/BottomSheet.doc.mjs +1 -1
  119. package/src/BottomSheet/BottomSheetPanel.tsx +41 -13
  120. package/src/BottomSheet/bottomSheetStack.ts +1 -1
  121. package/src/BottomSheet/useSheetGestures.ts +6 -0
  122. package/src/CheckboxList/CheckboxList.doc.mjs +7 -0
  123. package/src/CheckboxList/CheckboxList.tsx +34 -2
  124. package/src/CheckboxList/CheckboxListContext.tsx +9 -1
  125. package/src/CheckboxList/CheckboxListItem.tsx +23 -2
  126. package/src/CheckboxList/requiredGroup.ts +77 -0
  127. package/src/DateInput/PickerWheel.tsx +37 -4
  128. package/src/DateInput/Wheel.tsx +30 -3
  129. package/src/DateInput/datePickerTouch.ts +15 -0
  130. package/src/DateInput/wheelOptions.ts +31 -2
  131. package/src/DateTimeInput/TouchDateTimeField.tsx +94 -178
  132. package/src/HoverCard/useHoverCard.tsx +6 -1
  133. package/src/Overlay/Overlay.tsx +7 -2
  134. package/src/PowerSearch/PowerSearch.doc.mjs +2 -2
  135. package/src/PowerSearch/PowerSearch.tsx +4 -2
  136. package/src/PowerSearch/PowerSearchBottomSheet.tsx +237 -62
  137. package/src/TimeInput/TimeWheels.tsx +218 -0
  138. package/src/TimeInput/TouchTimeField.tsx +93 -157
  139. package/src/TimeInput/timeWheelRules.ts +352 -0
  140. package/src/Tokenizer/TokenizerBottomSheet.tsx +8 -12
  141. package/src/Tooltip/useTooltip.tsx +6 -0
  142. package/src/gestures/GestureHost.ts +5 -4
  143. package/src/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.ts +5 -2
  144. package/src/i18n/generated-english/TimeInput/TimeWheels.generated.ts +18 -0
  145. package/src/i18n/generated-locales/en.generated.ts +6 -4
  146. package/src/i18n/generated-locales/pseudo.generated.ts +6 -4
  147. package/src/keyboard/README.md +197 -0
  148. package/src/keyboard/index.ts +48 -0
  149. package/src/keyboard/keyboardHeight.ts +543 -0
  150. package/src/keyboard/keyboardLayoutGuide.ts +266 -0
  151. package/src/keyboard/keyboardModel.ts +301 -0
  152. package/src/keyboard/rideKeyboard.ts +100 -0
  153. package/src/keyboard/useMobileKeyboard.ts +866 -0
  154. package/src/motion/MEASUREMENTS.md +10 -0
  155. package/src/motion/README.md +2 -0
  156. package/src/motion/android/index.ts +18 -0
  157. package/src/motion/android/keyboard.ts +96 -0
  158. package/src/motion/uikit/datePicker.ts +60 -0
  159. package/src/motion/uikit/index.ts +4 -3
  160. package/src/utils/interactionOverlay.stylex.ts +3 -2
  161. package/src/utils/layoutViewport.ts +104 -0
  162. package/src/utils/pressFeedback.ts +99 -21
  163. package/src/utils/pressGesture.ts +4 -2
  164. package/src/utils/selectionLock.ts +40 -6
  165. package/src/utils/sharedMutationObserver.ts +2 -1
  166. package/src/utils/timeParser.ts +40 -3
  167. package/dist/BottomSheet/useMobileKeyboard.d.ts +0 -21
  168. package/dist/BottomSheet/useMobileKeyboard.d.ts.map +0 -1
  169. package/dist/BottomSheet/useMobileKeyboard.js +0 -413
  170. package/src/BottomSheet/useMobileKeyboard.ts +0 -542
@@ -10,7 +10,7 @@
10
10
  * - /packages/core/src/BottomSheet/BottomSheet.tsx
11
11
  * - /packages/core/src/BottomSheet/BottomSheetPanel.test.tsx
12
12
  * - /packages/core/src/BottomSheet/snapOffsets.ts
13
- * - /packages/core/src/BottomSheet/useMobileKeyboard.ts
13
+ * - /packages/core/src/keyboard/useMobileKeyboard.ts
14
14
  * - /packages/core/src/BottomSheet/useSheetGestures.ts
15
15
  * - /packages/core/src/Layout/container.stylex.ts (bottom-sheet padding chain)
16
16
  */
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;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;AA4CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AA+M3D,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;AAyJD,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"}
1
+ {"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;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;AA4CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AA+N3D,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;AAyJD,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,+BAuavB;yBA/be,gBAAgB"}
@@ -14,7 +14,7 @@
14
14
  * - /packages/core/src/BottomSheet/BottomSheet.tsx
15
15
  * - /packages/core/src/BottomSheet/BottomSheetPanel.test.tsx
16
16
  * - /packages/core/src/BottomSheet/snapOffsets.ts
17
- * - /packages/core/src/BottomSheet/useMobileKeyboard.ts
17
+ * - /packages/core/src/keyboard/useMobileKeyboard.ts
18
18
  * - /packages/core/src/BottomSheet/useSheetGestures.ts
19
19
  * - /packages/core/src/Layout/container.stylex.ts (bottom-sheet padding chain)
20
20
  */
@@ -34,7 +34,7 @@ import { LayerContentBoundary } from "../Layer/layerScopedContext.js";
34
34
  import { container } from "../Layout/container.stylex.js";
35
35
  import { containerPaddingBlockEndVarStyles, containerPaddingBlockStartVarStyles, containerPaddingInlineVarStyles, overlayPaddingReset, paddingStyles, spacingStepToToken } from "../Layout/padding.stylex.js";
36
36
  import { isValidSnapPoint, resolveSnapPoints } from "./snapOffsets.js";
37
- import { useMobileKeyboard } from "./useMobileKeyboard.js";
37
+ import { useMobileKeyboard } from "../keyboard/useMobileKeyboard.js";
38
38
  import { scrollPreservationPadding, sheetLayoutHeight, useSheetGestures } from "./useSheetGestures.js";
39
39
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
40
40
  const HEIGHT_BUDGETS = {
@@ -83,6 +83,10 @@ function snapPointsKeyFor(points) {
83
83
  const REDUCED_MOTION_COARSE = '@media (prefers-reduced-motion: reduce) and (pointer: coarse)';
84
84
  export const REDUCED_MOTION_COARSE_QUERY = '(prefers-reduced-motion: reduce) and (pointer: coarse)';
85
85
  const CROSS_FADE_MS = 200;
86
+ const _temp = {
87
+ k4zj60: "x1ipgmjk",
88
+ "$$css": true
89
+ };
86
90
  const styles = {
87
91
  sheet: {
88
92
  kfzvcC: "x67bb7w",
@@ -161,12 +165,18 @@ const styles = {
161
165
  },
162
166
  tallKeyboardBody: {
163
167
  kFlMNQ: "xrw9175",
168
+ $$css: true
169
+ },
170
+ tallKeyboardContent: {
164
171
  k5JduY: "x1s928wv",
165
172
  kc3QkE: "xhkezso",
166
- k4zj60: "xu6fald",
173
+ k4zj60: "x1gmr53x",
167
174
  kloYau: "x2q1x1w",
168
175
  $$css: true
169
176
  },
177
+ keyboardInset: inset => [_temp, {
178
+ "--x-nsbhg8": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(inset)
179
+ }],
170
180
  budget: {
171
181
  kZKoxP: "x1tpcejd",
172
182
  $$css: true
@@ -321,6 +331,7 @@ export function BottomSheetPanel({
321
331
  ...props
322
332
  }) {
323
333
  const elementRef = useRef(null);
334
+ const dismissKeyboardRef = useRef(null);
324
335
  const previousStateRef = useRef(state);
325
336
  const reactivatedEntranceRef = useRef(false);
326
337
  const onMotionStartRef = useRef(onMotionStart);
@@ -388,7 +399,6 @@ export function BottomSheetPanel({
388
399
  dragOffset,
389
400
  settledOffset,
390
401
  isDragging,
391
- isTraveling,
392
402
  isDismissedByTouchDrag,
393
403
  sheetHeight,
394
404
  scrollPreservationInset,
@@ -402,6 +412,10 @@ export function BottomSheetPanel({
402
412
  offscreenBlockEndInset: OVERSCROLL_PADDING,
403
413
  onDismiss,
404
414
  snapHeights,
415
+ onTravelStart: () => {
416
+ // Focusing the sheet dismisses the keyboard as the sheet starts to move.
417
+ dismissKeyboardRef.current?.(elementRef.current ?? undefined);
418
+ },
405
419
  onScrimOpacity,
406
420
  hasFixedHeight: consumerHeight != null
407
421
  });
@@ -437,17 +451,19 @@ export function BottomSheetPanel({
437
451
  isPresentedRef.current = isPresented;
438
452
  sheetRef(isPresented ? elementRef.current : null);
439
453
  }, [isPresented, sheetRef]);
440
- useMobileKeyboard({
441
- bodyRef: bodyElementRef,
442
- bottomClearance: MOBILE_KEYBOARD_BOTTOM_CLEARANCE,
443
- isEnabled: height === 'tall',
444
- isFullyExpanded: settledOffset === 0,
445
- isPageScrollLocked,
446
- isSheetTraveling: isTraveling,
454
+ const keyboard = useMobileKeyboard(elementRef, {
455
+ move: 'ride',
456
+ inset: true,
457
+ offset: MOBILE_KEYBOARD_BOTTOM_CLEARANCE,
458
+ isEnabled: height === 'tall' && isPresented,
459
+ isExpanded: settledOffset === 0,
447
460
  isOpen: isInteractive,
448
- isPresented,
449
- sheetRef: elementRef
461
+ isPageScrollLocked
450
462
  });
463
+ const keyboardInset = keyboard.inset;
464
+ // The drag's own callback dismisses the keyboard as the sheet starts to
465
+ // move. It runs in the gesture, so it reads the newest dismiss.
466
+ dismissKeyboardRef.current = keyboard.dismiss;
451
467
  // Keep controller registration attached to one stable host ref. React
452
468
  // detaches an old callback ref when a consumer supplies a new identity; if
453
469
  // that public ref were merged with setElement, an ordinary parent rerender
@@ -629,7 +645,7 @@ export function BottomSheetPanel({
629
645
  } : {})
630
646
  })),
631
647
  children: /*#__PURE__*/_jsx("div", {
632
- ...whilePresented(isPresented, getContentProps(stylex.props(styles.content, ...container(usesThemePadding ? {
648
+ ...whilePresented(isPresented, getContentProps(stylex.props(styles.content, height === 'tall' && styles.tallKeyboardContent, height === 'tall' && keyboardInset > 0 && styles.keyboardInset(keyboardInset), ...container(usesThemePadding ? {
633
649
  useThemeDefault: 'bottom-sheet'
634
650
  } : {
635
651
  paddingInnerX: paddingToken,
@@ -1513,7 +1513,7 @@ export function getBottomSheetBeneath(key) {
1513
1513
 
1514
1514
  // preventScroll on both: presenting a sheet must not scroll the page to reveal
1515
1515
  // what it just focused. For an autofocused field that reveal is the mobile
1516
- // keyboard's, and it moves the document under a fixed sheet; useMobileKeyboard
1516
+ // keyboard's, and it moves the document under a fixed sheet. useMobileKeyboard
1517
1517
  // brings the field into view within the sheet instead.
1518
1518
  /**
1519
1519
  * Move focus into a sheet panel. Focus already inside the sheet stays put:
@@ -92,6 +92,8 @@ export interface UseSheetGesturesOptions {
92
92
  snapHeights?: () => number[];
93
93
  /** Notified when the settled visible detent height (px) changes. */
94
94
  onSnap?: (heightPx: number) => void;
95
+ /** Called once a drag first moves the sheet off its detent. */
96
+ onTravelStart?: () => void;
95
97
  /**
96
98
  * Called with the scrim opacity the sheet should show (1 = fully visible,
97
99
  * 0 = hidden) as the drag moves and on settle. Full while the sheet is at
@@ -226,5 +228,5 @@ export interface UseSheetGesturesResult {
226
228
  * </div>
227
229
  * ```
228
230
  */
229
- export declare function useSheetGestures({ isOpen, isOpenRequested, canDismiss, offscreenBlockEndInset, onDismiss, snapHeights, onSnap, onScrimOpacity, hasFixedHeight, }: UseSheetGesturesOptions): UseSheetGesturesResult;
231
+ export declare function useSheetGestures({ isOpen, isOpenRequested, canDismiss, offscreenBlockEndInset, onDismiss, snapHeights, onSnap, onTravelStart, onScrimOpacity, hasFixedHeight, }: UseSheetGesturesOptions): UseSheetGesturesResult;
230
232
  //# sourceMappingURL=useSheetGestures.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAoCH,OAAO,EAOL,KAAK,aAAa,EAClB,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACtC,KAAK,SAAS,EACd,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,OAAO,IAAI,YAAY,EAC7B,MAAM,OAAO,CAAC;AAmHf;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,WAAW,EAAE,MAAM,EACnB,YAAY,EAAE,MAAM,GACnB,MAAM,CAER;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAE3E;AA+BD;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,WAAW,GAAG,IAAI,EAC1B,IAAI,EAAE,WAAW,GAChB,OAAO,CAWT;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,WAAW,GAAG,IAAI,EAC1B,IAAI,EAAE,WAAW,GAChB,WAAW,EAAE,CAaf;AA4BD,MAAM,WAAW,uBAAuB;IACtC,0EAA0E;IAC1E,MAAM,EAAE,OAAO,CAAC;IAChB;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,gFAAgF;IAChF,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB;;;;;;;;;;OAUG;IACH,WAAW,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAC7B,oEAAoE;IACpE,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,aAAa,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,aAAa,CAAC;IACrB,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAChD,oBAAoB,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD,YAAY,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC/C,WAAW,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;CAC/C;AAED,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAChD,oBAAoB,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CACtD;AAED,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,8HAA8H;IAC9H,YAAY,EAAE,iBAAiB,CAAC;IAChC,gEAAgE;IAChE,WAAW,EAAE,gBAAgB,CAAC;IAC9B;;;;OAIG;IACH,SAAS,EAAE,cAAc,CAAC;IAC1B;;;;;OAKG;IACH,cAAc,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C;;;;;OAKG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,aAAa,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,UAAU,EAAE,OAAO,CAAC;IACpB,4EAA4E;IAC5E,WAAW,EAAE,OAAO,CAAC;IACrB;;;;;;;OAOG;IACH,sBAAsB,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,eAAe,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACnC,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,4EAA4E;IAC5E,uBAAuB,EAAE,MAAM,CAAC;IAChC,qEAAqE;IACrE,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC;;;;;;;OAOG;IACH,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC;;;;OAIG;IACH,mBAAmB,EAAE,MAAM,CAAC;CAC7B;AASD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,eAAwB,EACxB,UAAiB,EACjB,sBAA0B,EAC1B,SAAS,EACT,WAAW,EACX,MAAM,EACN,cAAc,EACd,cAAsB,GACvB,EAAE,uBAAuB,GAAG,sBAAsB,CAq1ClD"}
1
+ {"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"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"}
@@ -290,6 +290,7 @@ export function useSheetGestures({
290
290
  onDismiss,
291
291
  snapHeights,
292
292
  onSnap,
293
+ onTravelStart,
293
294
  onScrimOpacity,
294
295
  hasFixedHeight = false
295
296
  }) {
@@ -404,6 +405,8 @@ export function useSheetGestures({
404
405
  // stops by the time the re-anchor read it.
405
406
  const snapHeightsRef = useRef(snapHeights);
406
407
  snapHeightsRef.current = snapHeights;
408
+ const onTravelStartRef = useRef(onTravelStart);
409
+ onTravelStartRef.current = onTravelStart;
407
410
  const onDismissRef = useRef(onDismiss);
408
411
  const canDismissRef = useRef(canDismiss);
409
412
  const onSnapRef = useRef(onSnap);
@@ -895,6 +898,7 @@ export function useSheetGestures({
895
898
  if (!state.hasTraveled && next !== state.baseOffset) {
896
899
  state.hasTraveled = true;
897
900
  setIsTraveling(true);
901
+ onTravelStartRef.current?.();
898
902
  }
899
903
 
900
904
  // Mirror the scrim to the live drag: full at/above the mid detent,
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @file CheckboxList.tsx
3
- * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext
3
+ * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext, requiredGroup
4
4
  * @output Exports CheckboxList component, CheckboxListProps
5
5
  * @position Core implementation; consumed by index.ts, tested by CheckboxList.test.tsx
6
6
  *
@@ -39,6 +39,17 @@ export interface CheckboxListProps extends Omit<FieldInputBaseProps<HTMLDivEleme
39
39
  * @default false
40
40
  */
41
41
  isOptional?: boolean;
42
+ /**
43
+ * Whether the group needs at least one checked box. Shows the required
44
+ * indicator after the group label by the same rules as every input field.
45
+ * While no box is checked, the browser blocks submit and moves focus to
46
+ * the first box that is neither disabled nor read-only. A disabled or
47
+ * read-only group requires nothing. Show your own error text through
48
+ * `status`.
49
+ * Mutually exclusive with isOptional.
50
+ * @default false
51
+ */
52
+ isRequired?: boolean;
42
53
  /**
43
54
  * Status indicator for the checkbox group.
44
55
  * When set with a message, displays a colored message box below the group.
@@ -122,7 +133,7 @@ export interface CheckboxListProps extends Omit<FieldInputBaseProps<HTMLDivEleme
122
133
  * </CheckboxList>
123
134
  * ```
124
135
  */
125
- export declare function CheckboxList({ label, isLabelHidden, description, isOptional, status, value, onChange, changeAction, density, hasDividers, isDisabled, disabledMessage, isReadOnly, children, ref, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, 'aria-labelledby': ariaLabelledByProp, 'aria-describedby': ariaDescribedByProp, ...restProps }: CheckboxListProps): import("react").JSX.Element;
136
+ export declare function CheckboxList({ label, isLabelHidden, description, isOptional, isRequired, status, value, onChange, changeAction, density, hasDividers, isDisabled, disabledMessage, isReadOnly, children, ref, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, 'aria-labelledby': ariaLabelledByProp, 'aria-describedby': ariaDescribedByProp, ...restProps }: CheckboxListProps): import("react").JSX.Element;
126
137
  export declare namespace CheckboxList {
127
138
  var displayName: string;
128
139
  }
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxList.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,qBAAqB,CAAC;AAarD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,mBAAmB,CAAC,cAAc,CAAC,EACnC,UAAU,CACX;IACC,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,OAAoB,EACpB,WAAmB,EACnB,UAAkB,EAClB,eAAe,EACf,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,iBAAiB,EAAE,kBAAkB,EACrC,kBAAkB,EAAE,mBAAmB,EACvC,GAAG,SAAS,EACb,EAAE,iBAAiB,+BAwJnB;yBAlLe,YAAY"}
1
+ {"version":3,"file":"CheckboxList.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,qBAAqB,CAAC;AAcrD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,mBAAmB,CAAC,cAAc,CAAC,EACnC,UAAU,CACX;IACC,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;OASG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,OAAoB,EACpB,WAAmB,EACnB,UAAkB,EAClB,eAAe,EACf,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,iBAAiB,EAAE,kBAAkB,EACrC,kBAAkB,EAAE,mBAAmB,EACvC,GAAG,SAAS,EACb,EAAE,iBAAiB,+BA2KnB;yBAtMe,YAAY"}
@@ -4,7 +4,7 @@
4
4
 
5
5
  /**
6
6
  * @file CheckboxList.tsx
7
- * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext
7
+ * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext, requiredGroup
8
8
  * @output Exports CheckboxList component, CheckboxListProps
9
9
  * @position Core implementation; consumed by index.ts, tested by CheckboxList.test.tsx
10
10
  *
@@ -26,6 +26,7 @@ import { mergeProps } from "../utils/index.js";
26
26
  import { themeProps } from "../utils/themeProps.js";
27
27
  import { joinAriaIDs } from "../utils/inputAria.js";
28
28
  import { CheckboxListContext } from "./CheckboxListContext.js";
29
+ import { createRequiredGroup } from "./requiredGroup.js";
29
30
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
30
31
  const EMPTY_ARRAY = [];
31
32
  /**
@@ -51,6 +52,7 @@ export function CheckboxList({
51
52
  isLabelHidden = false,
52
53
  description,
53
54
  isOptional = false,
55
+ isRequired = false,
54
56
  status,
55
57
  value,
56
58
  onChange,
@@ -85,6 +87,8 @@ export function CheckboxList({
85
87
  const labelID = useId();
86
88
  const descriptionID = useId();
87
89
  const statusMessageID = useId();
90
+ const requiredGroup = useMemo(() => isRequired ? createRequiredGroup() : undefined, [isRequired]);
91
+ const observeRequiredGroup = useCallback(container => container != null && requiredGroup != null ? requiredGroup.observe(container) : undefined, [requiredGroup]);
88
92
  const [, startTransition] = useTransition();
89
93
  const isCollectionMode = value !== undefined;
90
94
  const effectiveValue = value ?? EMPTY_ARRAY;
@@ -128,8 +132,9 @@ export function CheckboxList({
128
132
  disabledMessageID: showsDisabledMessage ? disabledMessageTooltip.describedBy : undefined,
129
133
  isReadOnly,
130
134
  isInvalid: status?.type === 'error',
131
- loadingValues
132
- }), [isCollectionMode, optimisticValue, handleChange, isDisabled, showsDisabledMessage, disabledMessageTooltip.describedBy, isReadOnly, status?.type, loadingValues]);
135
+ loadingValues,
136
+ requiredGroup
137
+ }), [isCollectionMode, optimisticValue, handleChange, isDisabled, showsDisabledMessage, disabledMessageTooltip.describedBy, isReadOnly, status?.type, loadingValues, requiredGroup]);
133
138
  return /*#__PURE__*/_jsxs(Field, {
134
139
  label: label,
135
140
  isLabelHidden: isLabelHidden,
@@ -138,6 +143,7 @@ export function CheckboxList({
138
143
  labelID: labelID,
139
144
  isGroupLabel: true,
140
145
  isOptional: isOptional,
146
+ isRequired: isRequired,
141
147
  descriptionID: description ? descriptionID : undefined,
142
148
  isDisabled: isDisabled,
143
149
  status: status ? {
@@ -158,7 +164,7 @@ export function CheckboxList({
158
164
  ...rest,
159
165
  // The disabled-message tooltip anchors here; its handlers are gated
160
166
  // internally by isEnabled, so attaching unconditionally is safe.
161
- ref: useMergedRefs(ref, disabledMessageTooltip.ref),
167
+ ref: useMergedRefs(ref, disabledMessageTooltip.ref, observeRequiredGroup),
162
168
  ...mergeProps(stylex.props(controlXstyle), controlClassName, controlStyle),
163
169
  role: "group"
164
170
  // Screen readers announce the whole group as unavailable. Its dimmed
@@ -1,3 +1,4 @@
1
+ import type { RequiredGroup } from './requiredGroup.js';
1
2
  export interface CheckboxListContextValue {
2
3
  value?: string[];
3
4
  /**
@@ -36,6 +37,12 @@ export interface CheckboxListContextValue {
36
37
  * when idle.
37
38
  */
38
39
  loadingValues?: ReadonlyArray<string>;
40
+ /**
41
+ * Present when the list is `isRequired`. Each item registers its checkbox,
42
+ * so that while no box is checked the first enabled box carries native
43
+ * `required`.
44
+ */
45
+ requiredGroup?: RequiredGroup;
39
46
  }
40
47
  export declare const CheckboxListContext: import("react").Context<CheckboxListContextValue | null>;
41
48
  //# sourceMappingURL=CheckboxListContext.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxListContext.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListContext.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,wBAAwB;IACvC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7D,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;CACvC;AAED,eAAO,MAAM,mBAAmB,0DACiC,CAAC"}
1
+ {"version":3,"file":"CheckboxListContext.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListContext.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAEnD,MAAM,WAAW,wBAAwB;IACvC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7D,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,eAAO,MAAM,mBAAmB,0DACiC,CAAC"}
@@ -4,7 +4,8 @@
4
4
 
5
5
  /**
6
6
  * @file CheckboxListContext.tsx
7
- * @input Uses the private layer-scoped context factory
7
+ * @input Uses the private layer-scoped context factory and the RequiredGroup
8
+ * type
8
9
  * @output Exports CheckboxListContext for parent-child communication
9
10
  * @position Internal context; consumed by CheckboxList.tsx and CheckboxListItem.tsx
10
11
  */
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxListItem.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAIzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAuBvC,MAAM,WAAW,qBAAsB,SAAQ,SAAS,CAAC,aAAa,CAAC;IACrE;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;;;;OAaG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACtC;;;;OAIG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;CAChC;AAyCD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EACV,UAAU,EAAE,cAAsB,EAClC,SAAS,EAAE,aAAqB,EAChC,SAAS,EACT,OAAO,EACP,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,KAAK,EACL,GAAG,SAAS,EACb,EAAE,qBAAqB,+BA6IvB;yBA9Je,gBAAgB"}
1
+ {"version":3,"file":"CheckboxListItem.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAkC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAItE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAuBvC,MAAM,WAAW,qBAAsB,SAAQ,SAAS,CAAC,aAAa,CAAC;IACrE;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;;;;OAaG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACtC;;;;OAIG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;CAChC;AAyCD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EACV,UAAU,EAAE,cAAsB,EAClC,SAAS,EAAE,aAAqB,EAChC,SAAS,EACT,OAAO,EACP,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,KAAK,EACL,GAAG,SAAS,EACb,EAAE,qBAAqB,+BAiKvB;yBAlLe,gBAAgB"}
@@ -16,7 +16,7 @@
16
16
  * - /apps/storybook/stories/CheckboxList.stories.tsx
17
17
  * - /packages/cli/assets/templates/blocks/components/CheckboxList/ (showcase blocks)
18
18
  */
19
- import { use, useId, useRef } from 'react';
19
+ import { use, useCallback, useId, useRef } from 'react';
20
20
  import * as stylex from '@stylexjs/stylex';
21
21
  import "../theme/tokens.stylex.js";
22
22
  import { colorVars } from "../theme/tokens.stylex.js";
@@ -26,6 +26,7 @@ import { ListContext } from "../List/ListContext.js";
26
26
  import { CheckboxListContext } from "./CheckboxListContext.js";
27
27
  import { ItemDescriptionContext } from "../Item/ItemDescriptionContext.js";
28
28
  import { joinAriaIDs } from "../utils/inputAria.js";
29
+ import { useMergedRefs } from "../hooks/useMergedRefs.js";
29
30
  import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
30
31
  import english from "../i18n/generated-english/CheckboxList/CheckboxListItem.generated.js";
31
32
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -172,6 +173,17 @@ export function CheckboxListItem({
172
173
  const checkboxRef = useRef(null);
173
174
  const hasRowInteraction = isInteractive || onClickProp != null;
174
175
 
176
+ // A required group decides which box carries native `required` from the
177
+ // state of every box. A change to this box's state registers it again.
178
+ const requiredGroup = ctx?.requiredGroup;
179
+ const isBoxChecked = resolvedChecked === true;
180
+ const isBoxEnabled = !effectiveDisabled && !effectiveReadOnly;
181
+ const registerWithRequiredGroup = useCallback(input => input != null && requiredGroup != null ? requiredGroup.register(input, {
182
+ isChecked: isBoxChecked,
183
+ isEnabled: isBoxEnabled
184
+ }) : undefined, [requiredGroup, isBoxChecked, isBoxEnabled]);
185
+ const checkboxInputRef = useMergedRefs(checkboxRef, registerWithRequiredGroup);
186
+
175
187
  // A read-only checkbox carries aria-readonly, which the row's clickable
176
188
  // container treats as a non-interactive target, so a click on it would be
177
189
  // delegated straight back to the checkbox without end. Stop that click at
@@ -222,7 +234,7 @@ export function CheckboxListItem({
222
234
  className: className,
223
235
  style: style,
224
236
  startContent: /*#__PURE__*/_jsx(DescribedCheckboxInput, {
225
- ref: checkboxRef,
237
+ ref: checkboxInputRef,
226
238
  label: checkboxLabel,
227
239
  "aria-labelledby": namesFromVisibleLabel ? labelID : undefined,
228
240
  isLabelHidden: true,
@@ -0,0 +1,22 @@
1
+ /** The state of one box that decides which box carries `required`. */
2
+ export interface RequiredGroupBox {
3
+ isChecked: boolean;
4
+ /** False for a disabled or read-only box, which the user cannot check. */
5
+ isEnabled: boolean;
6
+ }
7
+ export interface RequiredGroup {
8
+ /**
9
+ * Adds a checkbox with its state and updates `required` on every box.
10
+ * Returns a function that removes the checkbox, clears its `required`, and
11
+ * updates the rest. An item registers again when its state changes.
12
+ */
13
+ register: (input: HTMLInputElement, box: RequiredGroupBox) => () => void;
14
+ /**
15
+ * Updates `required` when the group's options move, for example after a
16
+ * keyed reorder, which registers no box again. Returns a function that
17
+ * stops it.
18
+ */
19
+ observe: (container: HTMLElement) => () => void;
20
+ }
21
+ export declare function createRequiredGroup(): RequiredGroup;
22
+ //# sourceMappingURL=requiredGroup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"requiredGroup.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/requiredGroup.ts"],"names":[],"mappings":"AAkBA,sEAAsE;AACtE,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,gBAAgB,KAAK,MAAM,IAAI,CAAC;IACzE;;;;OAIG;IACH,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,MAAM,IAAI,CAAC;CACjD;AAUD,wBAAgB,mBAAmB,IAAI,aAAa,CA4BnD"}
@@ -0,0 +1,52 @@
1
+ // Copyright (c) Meta Platforms, Inc. and affiliates.
2
+
3
+ /**
4
+ * @file requiredGroup.ts
5
+ * @input The checkbox inputs of a required CheckboxList and each box's state;
6
+ * Core's shared mutation observer
7
+ * @output Exports createRequiredGroup, RequiredGroup, and RequiredGroupBox
8
+ * @position Internal to CheckboxList; CheckboxList creates one for an
9
+ * `isRequired` group and CheckboxListItem registers its checkbox with it
10
+ *
11
+ * The browser has no required state for a group of checkboxes. While no box
12
+ * is checked, the first enabled box carries native `required`. The browser
13
+ * then blocks submit and moves focus to that box with its own message. Once
14
+ * any box is checked, no box carries `required`.
15
+ */
16
+
17
+ import { observeMutations } from "../utils/sharedMutationObserver.js";
18
+
19
+ /** The state of one box that decides which box carries `required`. */
20
+
21
+ const MOVE_OPTIONS = {
22
+ childList: true,
23
+ subtree: true
24
+ };
25
+ function byDocumentOrder(a, b) {
26
+ return a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
27
+ }
28
+ export function createRequiredGroup() {
29
+ const boxes = new Map();
30
+ function update() {
31
+ const ordered = [...boxes.keys()].sort(byDocumentOrder);
32
+ const isEmpty = ![...boxes.values()].some(box => box.isChecked);
33
+ const target = isEmpty ? ordered.find(input => boxes.get(input)?.isEnabled === true) : undefined;
34
+ for (const input of ordered) {
35
+ input.required = input === target;
36
+ }
37
+ }
38
+ return {
39
+ register(input, box) {
40
+ boxes.set(input, box);
41
+ update();
42
+ return () => {
43
+ boxes.delete(input);
44
+ input.required = false;
45
+ update();
46
+ };
47
+ },
48
+ observe(container) {
49
+ return observeMutations(container, MOVE_OPTIONS, update);
50
+ }
51
+ };
52
+ }
@@ -12,7 +12,7 @@ import { type WheelProps } from './wheelOptions.js';
12
12
  * <PickerWheel label="Month" options={monthOptions} value={month} onChange={setMonth} />
13
13
  * ```
14
14
  */
15
- export declare function PickerWheel({ label, options, value, onChange, isActive, }: WheelProps): import("react").JSX.Element;
15
+ export declare function PickerWheel({ label, options, value, onChange, isActive, ref, }: WheelProps): import("react").JSX.Element;
16
16
  export declare namespace PickerWheel {
17
17
  var displayName: string;
18
18
  }
@@ -1 +1 @@
1
- {"version":3,"file":"PickerWheel.d.ts","sourceRoot":"","sources":["../../src/DateInput/PickerWheel.tsx"],"names":[],"mappings":"AAmDA,OAAO,EAKL,KAAK,UAAU,EAChB,MAAM,gBAAgB,CAAC;AA2HxB;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAe,GAChB,EAAE,UAAU,+BAghBZ;yBAthBe,WAAW"}
1
+ {"version":3,"file":"PickerWheel.d.ts","sourceRoot":"","sources":["../../src/DateInput/PickerWheel.tsx"],"names":[],"mappings":"AA2DA,OAAO,EAML,KAAK,UAAU,EAChB,MAAM,gBAAgB,CAAC;AA2HxB;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAe,EACf,GAAG,GACJ,EAAE,UAAU,+BAuiBZ;yBA9iBe,WAAW"}
@@ -4,7 +4,8 @@
4
4
 
5
5
  /**
6
6
  * @file PickerWheel.tsx
7
- * @input Wheel's props (wheelOptions.ts): options, value and change callback
7
+ * @input Wheel's props (wheelOptions.ts): options, value and change callback;
8
+ * optionally a ref for programmatic turns
8
9
  * @output PickerWheel: one picker column that moves like UIPickerView
9
10
  * @position Internal component; the Wheel under a finger (Wheel.tsx picks it)
10
11
  *
@@ -14,7 +15,7 @@
14
15
  * SYNC: When modified, update PickerWheel.test.tsx, Wheel.tsx,
15
16
  * DateInputTouch.test.tsx, DateInput.doc.mjs and TimeInput.doc.mjs.
16
17
  */
17
- import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
18
+ import { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
18
19
  import * as stylex from '@stylexjs/stylex';
19
20
  import { scrollTypeOf } from "../gestures/GestureHost.js";
20
21
  import { PanGestureRecognizer } from "../gestures/PanGestureRecognizer.js";
@@ -36,7 +37,7 @@ import { useOwnScrollGesture } from "./useOwnScrollGesture.js";
36
37
  import { useWheelListbox } from "./useWheelListbox.js";
37
38
  import { createWheelStrip } from "./wheelStrip.js";
38
39
  import { dragOffset, nearestIndex, offsetBounds, planRelease, spinCurve } from "./wheelPhysics.js";
39
- import { endIndex, nearestEnabledIndex, steppedIndex, WHEEL_ROW_HEIGHT } from "./wheelOptions.js";
40
+ import { canSpinTo, endIndex, nearestEnabledIndex, steppedIndex, WHEEL_ROW_HEIGHT } from "./wheelOptions.js";
40
41
 
41
42
  /** Row pitch, px: the touch column keeps the scrolling column's pitch. */
42
43
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -130,7 +131,8 @@ export function PickerWheel({
130
131
  options,
131
132
  value,
132
133
  onChange,
133
- isActive = true
134
+ isActive = true,
135
+ ref
134
136
  }) {
135
137
  const columnRef = useRef(null);
136
138
  const rowsRef = useRef(null);
@@ -469,8 +471,27 @@ export function PickerWheel({
469
471
  isPointerKept: true
470
472
  });
471
473
 
472
- // A key commits the row at `position` at once and turns the wheel there
473
- // from `offset`.
474
+ // A spin turns only onto an enabled row (canSpinTo). So its arrival commits
475
+ // that row, and nothing turns on past it. It reports the row it was asked
476
+ // for, as the scrolling column does.
477
+ const spinTo = useCallback(async index => new Promise(resolve => {
478
+ if (!canSpinTo(latestRef.current.options, index)) {
479
+ resolve(false);
480
+ return;
481
+ }
482
+ const offset = motion.offset();
483
+ move(turnCurve(columnRef.current, offset, index * ROW_HEIGHT), {
484
+ onEnd: (outcome, end) => {
485
+ if (outcome === 'arrived') {
486
+ arrive(end);
487
+ }
488
+ resolve(outcome === 'arrived');
489
+ }
490
+ });
491
+ }), [motion, move, arrive]);
492
+ useImperativeHandle(ref, () => ({
493
+ spinTo
494
+ }), [spinTo]);
474
495
  const turnToPosition = useCallback((position, offset) => {
475
496
  const current = latestRef.current;
476
497
  const option = current.options[position];
@@ -1,5 +1,5 @@
1
1
  import { type WheelProps } from './wheelOptions.js';
2
- export { nearestEnabledIndex, type WheelOption, type WheelProps, } from './wheelOptions.js';
2
+ export { nearestEnabledIndex, type WheelHandle, type WheelOption, type WheelProps, } from './wheelOptions.js';
3
3
  /**
4
4
  * One picker column: UIPickerView's motion with flat rows under a finger, the
5
5
  * snap-scrolling column under a fine pointer.
@@ -31,7 +31,7 @@ export declare namespace Wheel {
31
31
  * />
32
32
  * ```
33
33
  */
34
- export declare function ScrollWheel({ label, options, value, onChange, isActive, }: WheelProps): import("react").JSX.Element;
34
+ export declare function ScrollWheel({ label, options, value, onChange, isActive, ref, }: WheelProps): import("react").JSX.Element;
35
35
  export declare namespace ScrollWheel {
36
36
  var displayName: string;
37
37
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Wheel.d.ts","sourceRoot":"","sources":["../../src/DateInput/Wheel.tsx"],"names":[],"mappings":"AAoDA,OAAO,EAIL,KAAK,UAAU,EAChB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EACL,mBAAmB,EACnB,KAAK,WAAW,EAChB,KAAK,UAAU,GAChB,MAAM,gBAAgB,CAAC;AAoMxB;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,+BAKtC;yBALe,KAAK;;;AASrB;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAe,GAChB,EAAE,UAAU,+BAoUZ;yBA1Ue,WAAW"}
1
+ {"version":3,"file":"Wheel.d.ts","sourceRoot":"","sources":["../../src/DateInput/Wheel.tsx"],"names":[],"mappings":"AA2DA,OAAO,EAKL,KAAK,UAAU,EAChB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EACL,mBAAmB,EACnB,KAAK,WAAW,EAChB,KAAK,WAAW,EAChB,KAAK,UAAU,GAChB,MAAM,gBAAgB,CAAC;AAoMxB;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,+BAKtC;yBALe,KAAK;;;AASrB;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAe,EACf,GAAG,GACJ,EAAE,UAAU,+BAqVZ;yBA5Ve,WAAW"}