@astryxdesign/core 0.7.8-canary.f10bc91 → 0.7.8-canary.f5a3152

package/dist/CheckboxList/CheckboxList.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file CheckboxList.tsx
- * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext
+ * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext, requiredGroup
  * @output Exports CheckboxList component, CheckboxListProps
  * @position Core implementation; consumed by index.ts, tested by CheckboxList.test.tsx
  *
@@ -39,6 +39,17 @@ export interface CheckboxListProps extends Omit<FieldInputBaseProps<HTMLDivEleme
      * @default false
      */
     isOptional?: boolean;
+    /**
+     * Whether the group needs at least one checked box. Shows the required
+     * indicator after the group label by the same rules as every input field.
+     * While no box is checked, the browser blocks submit and moves focus to
+     * the first box that is neither disabled nor read-only. A disabled or
+     * read-only group requires nothing. Show your own error text through
+     * `status`.
+     * Mutually exclusive with isOptional.
+     * @default false
+     */
+    isRequired?: boolean;
     /**
      * Status indicator for the checkbox group.
      * When set with a message, displays a colored message box below the group.
@@ -122,7 +133,7 @@ export interface CheckboxListProps extends Omit<FieldInputBaseProps<HTMLDivEleme
  * </CheckboxList>
  * ```
  */
-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;
+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;
 export declare namespace CheckboxList {
     var displayName: string;
 }

package/dist/CheckboxList/CheckboxList.d.ts.map

@@ -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"}
+{"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"}

package/dist/CheckboxList/CheckboxList.js

@@ -4,7 +4,7 @@
 
 /**
  * @file CheckboxList.tsx
- * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext
+ * @input Uses React, useId, useOptimistic, useTransition, Field, List, CheckboxListContext, requiredGroup
  * @output Exports CheckboxList component, CheckboxListProps
  * @position Core implementation; consumed by index.ts, tested by CheckboxList.test.tsx
  *
@@ -26,6 +26,7 @@ import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
 import { joinAriaIDs } from "../utils/inputAria.js";
 import { CheckboxListContext } from "./CheckboxListContext.js";
+import { createRequiredGroup } from "./requiredGroup.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const EMPTY_ARRAY = [];
 /**
@@ -51,6 +52,7 @@ export function CheckboxList({
   isLabelHidden = false,
   description,
   isOptional = false,
+  isRequired = false,
   status,
   value,
   onChange,
@@ -85,6 +87,8 @@ export function CheckboxList({
   const labelID = useId();
   const descriptionID = useId();
   const statusMessageID = useId();
+  const requiredGroup = useMemo(() => isRequired ? createRequiredGroup() : undefined, [isRequired]);
+  const observeRequiredGroup = useCallback(container => container != null && requiredGroup != null ? requiredGroup.observe(container) : undefined, [requiredGroup]);
   const [, startTransition] = useTransition();
   const isCollectionMode = value !== undefined;
   const effectiveValue = value ?? EMPTY_ARRAY;
@@ -128,8 +132,9 @@ export function CheckboxList({
     disabledMessageID: showsDisabledMessage ? disabledMessageTooltip.describedBy : undefined,
     isReadOnly,
     isInvalid: status?.type === 'error',
-    loadingValues
-  }), [isCollectionMode, optimisticValue, handleChange, isDisabled, showsDisabledMessage, disabledMessageTooltip.describedBy, isReadOnly, status?.type, loadingValues]);
+    loadingValues,
+    requiredGroup
+  }), [isCollectionMode, optimisticValue, handleChange, isDisabled, showsDisabledMessage, disabledMessageTooltip.describedBy, isReadOnly, status?.type, loadingValues, requiredGroup]);
   return /*#__PURE__*/_jsxs(Field, {
     label: label,
     isLabelHidden: isLabelHidden,
@@ -138,6 +143,7 @@ export function CheckboxList({
     labelID: labelID,
     isGroupLabel: true,
     isOptional: isOptional,
+    isRequired: isRequired,
     descriptionID: description ? descriptionID : undefined,
     isDisabled: isDisabled,
     status: status ? {
@@ -158,7 +164,7 @@ export function CheckboxList({
         ...rest,
         // The disabled-message tooltip anchors here; its handlers are gated
         // internally by isEnabled, so attaching unconditionally is safe.
-        ref: useMergedRefs(ref, disabledMessageTooltip.ref),
+        ref: useMergedRefs(ref, disabledMessageTooltip.ref, observeRequiredGroup),
         ...mergeProps(stylex.props(controlXstyle), controlClassName, controlStyle),
         role: "group"
         // Screen readers announce the whole group as unavailable. Its dimmed

package/dist/CheckboxList/CheckboxListContext.d.ts

@@ -1,3 +1,4 @@
+import type { RequiredGroup } from './requiredGroup.js';
 export interface CheckboxListContextValue {
     value?: string[];
     /**
@@ -36,6 +37,12 @@ export interface CheckboxListContextValue {
      * when idle.
      */
     loadingValues?: ReadonlyArray<string>;
+    /**
+     * Present when the list is `isRequired`. Each item registers its checkbox,
+     * so that while no box is checked the first enabled box carries native
+     * `required`.
+     */
+    requiredGroup?: RequiredGroup;
 }
 export declare const CheckboxListContext: import("react").Context<CheckboxListContextValue | null>;
 //# sourceMappingURL=CheckboxListContext.d.ts.map

package/dist/CheckboxList/CheckboxListContext.d.ts.map

@@ -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"}
+{"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"}

package/dist/CheckboxList/CheckboxListContext.js

@@ -4,7 +4,8 @@
 
 /**
  * @file CheckboxListContext.tsx
- * @input Uses the private layer-scoped context factory
+ * @input Uses the private layer-scoped context factory and the RequiredGroup
+ *   type
  * @output Exports CheckboxListContext for parent-child communication
  * @position Internal context; consumed by CheckboxList.tsx and CheckboxListItem.tsx
  */

package/dist/CheckboxList/CheckboxListItem.d.ts.map

@@ -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"}
+{"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"}

package/dist/CheckboxList/CheckboxListItem.js

@@ -16,7 +16,7 @@
  * - /apps/storybook/stories/CheckboxList.stories.tsx
  * - /packages/cli/assets/templates/blocks/components/CheckboxList/ (showcase blocks)
  */
-import { use, useId, useRef } from 'react';
+import { use, useCallback, useId, useRef } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars } from "../theme/tokens.stylex.js";
@@ -26,6 +26,7 @@ import { ListContext } from "../List/ListContext.js";
 import { CheckboxListContext } from "./CheckboxListContext.js";
 import { ItemDescriptionContext } from "../Item/ItemDescriptionContext.js";
 import { joinAriaIDs } from "../utils/inputAria.js";
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
 import english from "../i18n/generated-english/CheckboxList/CheckboxListItem.generated.js";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -172,6 +173,17 @@ export function CheckboxListItem({
   const checkboxRef = useRef(null);
   const hasRowInteraction = isInteractive || onClickProp != null;
 
+  // A required group decides which box carries native `required` from the
+  // state of every box. A change to this box's state registers it again.
+  const requiredGroup = ctx?.requiredGroup;
+  const isBoxChecked = resolvedChecked === true;
+  const isBoxEnabled = !effectiveDisabled && !effectiveReadOnly;
+  const registerWithRequiredGroup = useCallback(input => input != null && requiredGroup != null ? requiredGroup.register(input, {
+    isChecked: isBoxChecked,
+    isEnabled: isBoxEnabled
+  }) : undefined, [requiredGroup, isBoxChecked, isBoxEnabled]);
+  const checkboxInputRef = useMergedRefs(checkboxRef, registerWithRequiredGroup);
+
   // A read-only checkbox carries aria-readonly, which the row's clickable
   // container treats as a non-interactive target, so a click on it would be
   // delegated straight back to the checkbox without end. Stop that click at
@@ -222,7 +234,7 @@ export function CheckboxListItem({
     className: className,
     style: style,
     startContent: /*#__PURE__*/_jsx(DescribedCheckboxInput, {
-      ref: checkboxRef,
+      ref: checkboxInputRef,
       label: checkboxLabel,
       "aria-labelledby": namesFromVisibleLabel ? labelID : undefined,
       isLabelHidden: true,

package/dist/CheckboxList/requiredGroup.d.ts

@@ -0,0 +1,22 @@
+/** The state of one box that decides which box carries `required`. */
+export interface RequiredGroupBox {
+    isChecked: boolean;
+    /** False for a disabled or read-only box, which the user cannot check. */
+    isEnabled: boolean;
+}
+export interface RequiredGroup {
+    /**
+     * Adds a checkbox with its state and updates `required` on every box.
+     * Returns a function that removes the checkbox, clears its `required`, and
+     * updates the rest. An item registers again when its state changes.
+     */
+    register: (input: HTMLInputElement, box: RequiredGroupBox) => () => void;
+    /**
+     * Updates `required` when the group's options move, for example after a
+     * keyed reorder, which registers no box again. Returns a function that
+     * stops it.
+     */
+    observe: (container: HTMLElement) => () => void;
+}
+export declare function createRequiredGroup(): RequiredGroup;
+//# sourceMappingURL=requiredGroup.d.ts.map

package/dist/CheckboxList/requiredGroup.d.ts.map

@@ -0,0 +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"}

package/dist/CheckboxList/requiredGroup.js

@@ -0,0 +1,52 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file requiredGroup.ts
+ * @input The checkbox inputs of a required CheckboxList and each box's state;
+ *   Core's shared mutation observer
+ * @output Exports createRequiredGroup, RequiredGroup, and RequiredGroupBox
+ * @position Internal to CheckboxList; CheckboxList creates one for an
+ *   `isRequired` group and CheckboxListItem registers its checkbox with it
+ *
+ * The browser has no required state for a group of checkboxes. While no box
+ * is checked, the first enabled box carries native `required`. The browser
+ * then blocks submit and moves focus to that box with its own message. Once
+ * any box is checked, no box carries `required`.
+ */
+
+import { observeMutations } from "../utils/sharedMutationObserver.js";
+
+/** The state of one box that decides which box carries `required`. */
+
+const MOVE_OPTIONS = {
+  childList: true,
+  subtree: true
+};
+function byDocumentOrder(a, b) {
+  return a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+}
+export function createRequiredGroup() {
+  const boxes = new Map();
+  function update() {
+    const ordered = [...boxes.keys()].sort(byDocumentOrder);
+    const isEmpty = ![...boxes.values()].some(box => box.isChecked);
+    const target = isEmpty ? ordered.find(input => boxes.get(input)?.isEnabled === true) : undefined;
+    for (const input of ordered) {
+      input.required = input === target;
+    }
+  }
+  return {
+    register(input, box) {
+      boxes.set(input, box);
+      update();
+      return () => {
+        boxes.delete(input);
+        input.required = false;
+        update();
+      };
+    },
+    observe(container) {
+      return observeMutations(container, MOVE_OPTIONS, update);
+    }
+  };
+}

package/dist/DateInput/PickerWheel.d.ts

@@ -12,7 +12,7 @@ import { type WheelProps } from './wheelOptions.js';
  * <PickerWheel label="Month" options={monthOptions} value={month} onChange={setMonth} />
  * ```
  */
-export declare function PickerWheel({ label, options, value, onChange, isActive, }: WheelProps): import("react").JSX.Element;
+export declare function PickerWheel({ label, options, value, onChange, isActive, ref, }: WheelProps): import("react").JSX.Element;
 export declare namespace PickerWheel {
     var displayName: string;
 }

package/dist/DateInput/PickerWheel.d.ts.map

@@ -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,+BA8gBZ;yBAphBe,WAAW"}
+{"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"}

package/dist/DateInput/PickerWheel.js

@@ -4,7 +4,8 @@
 
 /**
  * @file PickerWheel.tsx
- * @input Wheel's props (wheelOptions.ts): options, value and change callback
+ * @input Wheel's props (wheelOptions.ts): options, value and change callback;
+ *   optionally a ref for programmatic turns
  * @output PickerWheel: one picker column that moves like UIPickerView
  * @position Internal component; the Wheel under a finger (Wheel.tsx picks it)
  *
@@ -14,7 +15,7 @@
  * SYNC: When modified, update PickerWheel.test.tsx, Wheel.tsx,
  * DateInputTouch.test.tsx, DateInput.doc.mjs and TimeInput.doc.mjs.
  */
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import { scrollTypeOf } from "../gestures/GestureHost.js";
 import { PanGestureRecognizer } from "../gestures/PanGestureRecognizer.js";
@@ -36,7 +37,7 @@ import { useOwnScrollGesture } from "./useOwnScrollGesture.js";
 import { useWheelListbox } from "./useWheelListbox.js";
 import { createWheelStrip } from "./wheelStrip.js";
 import { dragOffset, nearestIndex, offsetBounds, planRelease, spinCurve } from "./wheelPhysics.js";
-import { endIndex, nearestEnabledIndex, steppedIndex, WHEEL_ROW_HEIGHT } from "./wheelOptions.js";
+import { canSpinTo, endIndex, nearestEnabledIndex, steppedIndex, WHEEL_ROW_HEIGHT } from "./wheelOptions.js";
 
 /** Row pitch, px: the touch column keeps the scrolling column's pitch. */
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -130,7 +131,8 @@ export function PickerWheel({
   options,
   value,
   onChange,
-  isActive = true
+  isActive = true,
+  ref
 }) {
   const columnRef = useRef(null);
   const rowsRef = useRef(null);
@@ -468,6 +470,28 @@ export function PickerWheel({
     isEnabled: isActive,
     isPointerKept: true
   });
+
+  // A spin turns only onto an enabled row (canSpinTo). So its arrival commits
+  // that row, and nothing turns on past it. It reports the row it was asked
+  // for, as the scrolling column does.
+  const spinTo = useCallback(async index => new Promise(resolve => {
+    if (!canSpinTo(latestRef.current.options, index)) {
+      resolve(false);
+      return;
+    }
+    const offset = motion.offset();
+    move(turnCurve(columnRef.current, offset, index * ROW_HEIGHT), {
+      onEnd: (outcome, end) => {
+        if (outcome === 'arrived') {
+          arrive(end);
+        }
+        resolve(outcome === 'arrived');
+      }
+    });
+  }), [motion, move, arrive]);
+  useImperativeHandle(ref, () => ({
+    spinTo
+  }), [spinTo]);
   const turnToPosition = useCallback((position, offset) => {
     const current = latestRef.current;
     const option = current.options[position];

package/dist/DateInput/Wheel.d.ts

@@ -1,5 +1,5 @@
 import { type WheelProps } from './wheelOptions.js';
-export { nearestEnabledIndex, type WheelOption, type WheelProps, } from './wheelOptions.js';
+export { nearestEnabledIndex, type WheelHandle, type WheelOption, type WheelProps, } from './wheelOptions.js';
 /**
  * One picker column: UIPickerView's motion with flat rows under a finger, the
  * snap-scrolling column under a fine pointer.
@@ -31,7 +31,7 @@ export declare namespace Wheel {
  * />
  * ```
  */
-export declare function ScrollWheel({ label, options, value, onChange, isActive, }: WheelProps): import("react").JSX.Element;
+export declare function ScrollWheel({ label, options, value, onChange, isActive, ref, }: WheelProps): import("react").JSX.Element;
 export declare namespace ScrollWheel {
     var displayName: string;
 }

package/dist/DateInput/Wheel.d.ts.map

@@ -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,+BAmUZ;yBAzUe,WAAW"}
+{"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"}

package/dist/DateInput/Wheel.js

@@ -4,7 +4,8 @@
 
 /**
  * @file Wheel.tsx
- * @input Option list, selected value and change callback
+ * @input Option list, selected value and change callback; a ref for
+ *   programmatic turns
  * @output Exports Wheel (one picker column), ScrollWheel (the scrolling
  *   column) and the shared types of wheelOptions.ts
  * @position Internal component; consumed by MonthYearWheels.tsx,
@@ -26,7 +27,7 @@
  * - /packages/core/src/DateInput/DateInput.doc.mjs
  * - /packages/core/src/DateInput/DateInputTouch.test.tsx
  */
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, radiusVars, fontWeightVars, typeScaleVars, spacingVars, durationVars } from "../theme/tokens.stylex.js";
@@ -40,7 +41,7 @@ import { useOwnScrollGesture } from "./useOwnScrollGesture.js";
 import { usePointerDragScroll } from "./usePointerDragScroll.js";
 import { useScrollSettle } from "./useScrollSettle.js";
 import { useWheelListbox } from "./useWheelListbox.js";
-import { endIndex, nearestEnabledIndex, steppedIndex } from "./wheelOptions.js";
+import { canSpinTo, endIndex, nearestEnabledIndex, steppedIndex } from "./wheelOptions.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export { nearestEnabledIndex } from "./wheelOptions.js";
 const ITEM_BLOCK_SIZE = dateInputTouchSizes.wheelItemSize;
@@ -130,8 +131,23 @@ export function ScrollWheel({
   options,
   value,
   onChange,
-  isActive = true
+  isActive = true,
+  ref
 }) {
+  // A spin commits the row at once. The new value then scrolls the column
+  // there, as any new value does.
+  useImperativeHandle(ref, () => ({
+    spinTo: async index => {
+      if (!canSpinTo(options, index)) {
+        return false;
+      }
+      const option = options[index];
+      if (option.value !== value) {
+        onChange(option.value);
+      }
+      return true;
+    }
+  }), [options, value, onChange]);
   const scrollerRef = useRef(null);
   const selectedIndex = Math.max(0, options.findIndex(option => option.value === value));
   // Which row is under the band right now. Tracks the finger during a scroll;

package/dist/DateInput/datePickerTouch.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @file datePickerTouch.ts
+ * @input The date and time pickers' touch-only pieces
+ * @output Re-exports what the date and time sheets use only under a finger:
+ *   TimeWheels
+ * @position The pickers' touch layer. The sheets import touch behaviour from
+ *   here only, so a desktop build can replace this one module.
+ *
+ * SYNC: When modified, update TouchTimeField.tsx and TouchDateTimeField.tsx.
+ */
+export { TimeWheels } from '../TimeInput/TimeWheels.js';
+export type { TimeWheelsProps } from '../TimeInput/TimeWheels.js';
+//# sourceMappingURL=datePickerTouch.d.ts.map

package/dist/DateInput/datePickerTouch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerTouch.d.ts","sourceRoot":"","sources":["../../src/DateInput/datePickerTouch.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,EAAC,UAAU,EAAC,MAAM,yBAAyB,CAAC;AACnD,YAAY,EAAC,eAAe,EAAC,MAAM,yBAAyB,CAAC"}

package/dist/DateInput/datePickerTouch.js

@@ -0,0 +1,14 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file datePickerTouch.ts
+ * @input The date and time pickers' touch-only pieces
+ * @output Re-exports what the date and time sheets use only under a finger:
+ *   TimeWheels
+ * @position The pickers' touch layer. The sheets import touch behaviour from
+ *   here only, so a desktop build can replace this one module.
+ *
+ * SYNC: When modified, update TouchTimeField.tsx and TouchDateTimeField.tsx.
+ */
+
+export { TimeWheels } from "../TimeInput/TimeWheels.js";

package/dist/DateInput/wheelOptions.d.ts

@@ -1,8 +1,8 @@
 /**
  * @file wheelOptions.ts
  * @input Nothing; types, the row height and pure functions
- * @output WheelOption, WheelProps, WHEEL_ROW_HEIGHT, nearestEnabledIndex,
- *   steppedIndex and endIndex: what both wheels share
+ * @output WheelOption, WheelProps, WheelHandle, WHEEL_ROW_HEIGHT, canSpinTo,
+ *   nearestEnabledIndex, steppedIndex and endIndex: what both wheels share
  * @position Internal; read by Wheel.tsx (which re-exports all of it) and
  *   PickerWheel.tsx
  *
@@ -10,6 +10,7 @@
  * - /packages/core/src/DateInput/Wheel.tsx
  * - /packages/core/src/DateInput/PickerWheel.tsx
  */
+import type { Ref } from 'react';
 /**
  * The row height, px (`dateInputTouchSizes.wheelItemSize`): the pitch of both
  * columns' rows, and the unit of the touch wheel's offset.
@@ -32,6 +33,18 @@ export interface WheelOption {
      */
     order?: number;
 }
+/** What a Wheel's `ref` exposes. */
+export interface WheelHandle {
+    /**
+     * Turn the wheel onto `index` (an index into `options`) on the tap spin, then
+     * commit it as a rest would. Resolves true once that row is the committed
+     * one, false if a finger or another turn interrupted it or the wheel went
+     * away first. An index outside `options` or a disabled row resolves false at
+     * once, and nothing turns. Under a fine pointer the row commits at once. The
+     * column then scrolls to it as for any new value, on the same rule.
+     */
+    spinTo(index: number): Promise<boolean>;
+}
 export interface WheelProps {
     /** Accessible name for the column, e.g. "Month". */
     label: string;
@@ -48,7 +61,14 @@ export interface WheelProps {
      * motion.
      */
     isActive?: boolean;
+    /** Programmatic turns: `spinTo(index)`. */
+    ref?: Ref<WheelHandle>;
 }
+/**
+ * Whether `spinTo(index)` may turn onto `index`: an enabled row of `options`.
+ * The touch wheel and the scrolling column answer a spin by the same rule.
+ */
+export declare function canSpinTo(options: ReadonlyArray<WheelOption>, index: number): boolean;
 /**
  * The enabled row nearest `index`: `index` itself when it is enabled,
  * otherwise the closest enabled row on either side. A tie goes to the side of

package/dist/DateInput/wheelOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wheelOptions.d.ts","sourceRoot":"","sources":["../../src/DateInput/wheelOptions.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH;;;GAGG;AACH,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAEnC,MAAM,WAAW,WAAW;IAC1B,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB;IAChB,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,UAAU;IACzB,oDAAoD;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B;IAC3B,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACpC,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,MAAM,GAClB,MAAM,CAsBR;AAaD;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,GACZ,MAAM,GAAG,IAAI,CAyBf;AAED,uFAAuF;AACvF,wBAAgB,QAAQ,CACtB,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,GAAG,EAAE,OAAO,GAAG,MAAM,GACpB,MAAM,GAAG,IAAI,CAKf"}
+{"version":3,"file":"wheelOptions.d.ts","sourceRoot":"","sources":["../../src/DateInput/wheelOptions.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE/B;;;GAGG;AACH,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAEnC,MAAM,WAAW,WAAW;IAC1B,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB;IAChB,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,oCAAoC;AACpC,MAAM,WAAW,WAAW;IAC1B;;;;;;;OAOG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;CACzC;AAED,MAAM,WAAW,UAAU;IACzB,oDAAoD;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B;IAC3B,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACpC,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED;;;GAGG;AACH,wBAAgB,SAAS,CACvB,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,KAAK,EAAE,MAAM,GACZ,OAAO,CAGT;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,MAAM,GAClB,MAAM,CAsBR;AAaD;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,GACZ,MAAM,GAAG,IAAI,CAyBf;AAED,uFAAuF;AACvF,wBAAgB,QAAQ,CACtB,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EACnC,GAAG,EAAE,OAAO,GAAG,MAAM,GACpB,MAAM,GAAG,IAAI,CAKf"}

package/dist/DateInput/wheelOptions.js

@@ -3,8 +3,8 @@
 /**
  * @file wheelOptions.ts
  * @input Nothing; types, the row height and pure functions
- * @output WheelOption, WheelProps, WHEEL_ROW_HEIGHT, nearestEnabledIndex,
- *   steppedIndex and endIndex: what both wheels share
+ * @output WheelOption, WheelProps, WheelHandle, WHEEL_ROW_HEIGHT, canSpinTo,
+ *   nearestEnabledIndex, steppedIndex and endIndex: what both wheels share
  * @position Internal; read by Wheel.tsx (which re-exports all of it) and
  *   PickerWheel.tsx
  *
@@ -18,6 +18,18 @@
  * columns' rows, and the unit of the touch wheel's offset.
  */
 export const WHEEL_ROW_HEIGHT = 28;
+
+/** What a Wheel's `ref` exposes. */
+
+/**
+ * Whether `spinTo(index)` may turn onto `index`: an enabled row of `options`.
+ * The touch wheel and the scrolling column answer a spin by the same rule.
+ */
+export function canSpinTo(options, index) {
+  const option = options[index];
+  return option != null && !option.isDisabled;
+}
+
 /**
  * The enabled row nearest `index`: `index` itself when it is enabled,
  * otherwise the closest enabled row on either side. A tie goes to the side of

package/dist/DateTimeInput/TouchDateTimeField.d.ts.map

@@ -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;AAoV3E,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,+BAy/BpB;yBAhiCe,kBAAkB"}
+{"version":3,"file":"TouchDateTimeField.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/TouchDateTimeField.tsx"],"names":[],"mappings":"AAuHA,OAAO,KAAK,EAAC,kBAAkB,EAAoB,MAAM,iBAAiB,CAAC;AA6S3E,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,+BAk8BpB;yBAz+Be,kBAAkB"}