@astryxdesign/core 0.7.8-canary.ffd29c5 → 0.7.8

package/dist/TimeInput/TimeWheels.js

@@ -0,0 +1,144 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file TimeWheels.tsx
+ * @input A time of day, the hour format, the bounds and a commit callback
+ * @output Exports TimeWheels: UIDatePicker's `.time` wheels as one picker
+ * @position Internal component; the wheels under a finger in the TimeInput
+ *   sheet and DateTimeInput's time panel. timeWheelRules.ts holds the rules.
+ *
+ * A column that moves by itself turns on the Wheel's own spin (`spinTo`). The
+ * spin starts before the commit, so the new value finds the column moving.
+ *
+ * SYNC: When modified, update TimeWheels.test.tsx, timeWheelRules.ts,
+ * TimeInput.doc.mjs and DateTimeInput.doc.mjs.
+ */
+import { useMemo, useRef } from 'react';
+import { Wheel } from "../DateInput/Wheel.js";
+import { columnValue, columnsToTurn, displayedTime, restingTime, hourRows, meridiemOf, meridiemRows, minuteRows, secondRows, turnColumn, wheelBounds } from "./timeWheelRules.js";
+import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
+import english from "../i18n/generated-english/TimeInput/TimeWheels.generated.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+registerEnglishFallback(english);
+function sameTime(a, b) {
+  return a.hour === b.hour && a.minute === b.minute && a.second === b.second;
+}
+
+/**
+ * UIDatePicker's time wheels.
+ *
+ * @example
+ * ```
+ * <TimeWheels time={{hour: 11, minute: 58, second: 0}} hourFormat="12h"
+ *   hasSeconds={false} isActive onCommit={setTime} />
+ * ```
+ */
+export function TimeWheels({
+  time,
+  hourFormat,
+  hasSeconds,
+  min,
+  max,
+  isActive,
+  onCommit
+}) {
+  const t = useComponentTranslator();
+  const bounds = useMemo(() => wheelBounds(min, max), [min, max]);
+  const shown = displayedTime(time, hasSeconds);
+  const hourOptions = useMemo(() => hourRows(shown.hour, hourFormat, bounds), [shown.hour, hourFormat, bounds]);
+  const minuteOptions = useMemo(() => minuteRows(shown.hour, hasSeconds, bounds), [shown.hour, hasSeconds, bounds]);
+  const secondOptions = useMemo(() => secondRows(shown.hour, shown.minute, bounds), [shown.hour, shown.minute, bounds]);
+  const meridiemOptions = useMemo(() => meridiemRows({
+    am: t('@astryx.dateTimeInput.meridiemAM'),
+    pm: t('@astryx.dateTimeInput.meridiemPM')
+  }, bounds), [t, bounds]);
+  const hourRef = useRef(null);
+  const minuteRef = useRef(null);
+  const secondRef = useRef(null);
+  const meridiemRef = useRef(null);
+  const rows = {
+    hour: hourOptions,
+    minute: minuteOptions,
+    second: secondOptions,
+    meridiem: meridiemOptions
+  };
+  // The rows the columns turn onto by themselves (`spinTo`), each with the id of
+  // its turn. A turn's arrival is not a person's rest, so it commits nothing,
+  // even when the owner kept the old time.
+  const spinsRef = useRef({});
+  const nextSpinIdRef = useRef(0);
+  const restOn = column => value => {
+    if (spinsRef.current[column]?.value === value) {
+      return;
+    }
+    const from = shown;
+    // What commits is the row the wheels come to rest on: past a bound, the
+    // nearest time inside it that has a row (datePicker.wheels.restPastBound).
+    const next = restingTime(turnColumn(from, column, value, hourFormat), hasSeconds, bounds);
+    const handles = {
+      hour: hourRef.current,
+      minute: minuteRef.current,
+      second: secondRef.current,
+      meridiem: meridiemRef.current
+    };
+    // Turn the other columns first, so the commit's new value finds them
+    // already moving (a Wheel never parks a moving column).
+    for (const turn of columnsToTurn(from, column, value, next, {
+      hourFormat,
+      hasSeconds
+    })) {
+      const index = rows[turn.column].findIndex(row => row.value === turn.value);
+      const handle = handles[turn.column];
+      if (index >= 0 && handle != null) {
+        nextSpinIdRef.current += 1;
+        const id = nextSpinIdRef.current;
+        spinsRef.current[turn.column] = {
+          value: turn.value,
+          id
+        };
+        void handle.spinTo(index).finally(() => {
+          if (spinsRef.current[turn.column]?.id === id) {
+            spinsRef.current[turn.column] = undefined;
+          }
+        });
+      }
+    }
+    if (!sameTime(next, from)) {
+      onCommit(next);
+    }
+  };
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Wheel, {
+      ref: hourRef,
+      label: t('@astryx.dateTimeInput.hourWheel'),
+      options: hourOptions,
+      value: columnValue(shown, 'hour', hourFormat),
+      isActive: isActive,
+      onChange: restOn('hour')
+    }), /*#__PURE__*/_jsx(Wheel, {
+      ref: minuteRef,
+      label: t('@astryx.dateTimeInput.minuteWheel'),
+      options: minuteOptions,
+      value: shown.minute,
+      isActive: isActive,
+      onChange: restOn('minute')
+    }), hasSeconds && /*#__PURE__*/_jsx(Wheel, {
+      ref: secondRef,
+      label: t('@astryx.dateTimeInput.secondWheel'),
+      options: secondOptions,
+      value: shown.second,
+      isActive: isActive,
+      onChange: restOn('second')
+    }), hourFormat === '12h' && /*#__PURE__*/_jsx(Wheel, {
+      ref: meridiemRef,
+      label: t('@astryx.dateTimeInput.meridiemWheel'),
+      options: meridiemOptions,
+      value: meridiemOf(shown.hour),
+      isActive: isActive,
+      onChange: restOn('meridiem')
+    })]
+  });
+}
+TimeWheels.displayName = 'TimeWheels';

package/dist/TimeInput/TouchTimeField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TouchTimeField.d.ts","sourceRoot":"","sources":["../../src/TimeInput/TouchTimeField.tsx"],"names":[],"mappings":"AAqEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAiHhD;;;;GAIG;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,UAAkB,EAClB,QAAgB,EAChB,UAAkB,EAGlB,SAAS,EAAE,UAAU,EACrB,YAAY,EAAE,aAAa,EAC3B,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BA4ZhB;yBA/be,cAAc"}
+{"version":3,"file":"TouchTimeField.d.ts","sourceRoot":"","sources":["../../src/TimeInput/TouchTimeField.tsx"],"names":[],"mappings":"AAsEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAoFhD;;;;GAIG;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,UAAkB,EAClB,QAAgB,EAChB,UAAkB,EAGlB,SAAS,EAAE,UAAU,EACrB,YAAY,EAAE,aAAa,EAC3B,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAwXhB;yBA3Ze,cAAc"}

package/dist/TimeInput/TouchTimeField.js

@@ -4,11 +4,11 @@
 
 /**
  * @file TouchTimeField.tsx
- * @input Uses React, Field, BottomSheet, Wheel, DateInput touch geometry
- *   tokens, and shared time utilities
+ * @input Uses React, Field, BottomSheet, the wheels (TimeWheels under a finger,
+ *   Wheel with a mouse), DateInput touch geometry tokens and time utilities
  * @output Exports TouchTimeField — the bottom-sheet surface behind TimeInput
  * @position Internal component; consumed by TimeInput.tsx for `presentation`
- *   sheet surfaces (`spec:AST-043` DEC-3: the time half of DateTimeInput's sheet)
+ *   sheet surfaces
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/TimeInput/TimeInput.tsx
@@ -38,15 +38,18 @@ import { useSize } from "../SizeContext/SizeContext.js";
 import { Spinner } from "../Spinner/index.js";
 import { useTooltip } from "../Tooltip/index.js";
 import { Wheel } from "../DateInput/Wheel.js";
+import { useTouchPresentation } from "../utils/touchPresentation.js";
 import "../DateInput/tokens.stylex.js";
 import { dateInputTouchGeometry } from "../DateInput/tokens.stylex.js";
 import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
 import { themeProps } from "../utils/themeProps.js";
 import { clampTime, formatISOTime, getInputARIA, isTimeInRange, mergeProps, parseISOTime } from "../utils/index.js";
 import { chainEventHandlers } from "../utils/chainEventHandlers.js";
+import { TimeWheels } from "../DateInput/datePickerTouch.js";
+import { hour12From24, hour24From12, hourRowsInHalf, meridiemRows, minuteRows, secondRows, wheelBounds } from "./timeWheelRules.js";
 import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
 import english from "../i18n/generated-english/TimeInput/TouchTimeField.generated.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 registerEnglishFallback(english);
 const sizeStyles = {
   sm: {
@@ -80,30 +83,6 @@ const styles = {
     $$css: true
   }
 };
-function twoDigits(value) {
-  return String(value).padStart(2, '0');
-}
-function hour12From24(hour) {
-  return hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
-}
-function hour24From12(hour, meridiem) {
-  if (meridiem === 0) {
-    return hour === 12 ? 0 : hour;
-  }
-  return hour === 12 ? 12 : hour + 12;
-}
-function timeToSeconds(time) {
-  if (time == null) {
-    return null;
-  }
-  const parsed = parseISOTime(time);
-  return parsed == null ? null : parsed.hour * 3600 + parsed.minute * 60 + parsed.second;
-}
-function rangeOverlaps(startSecond, endSecond, min, max) {
-  const minSecond = timeToSeconds(min);
-  const maxSecond = timeToSeconds(max);
-  return (minSecond == null || endSecond >= minSecond) && (maxSecond == null || startSecond <= maxSecond);
-}
 
 /**
  * The Astryx bottom-sheet time surface: a read-only closed field that opens
@@ -179,6 +158,9 @@ export function TouchTimeField({
   const mergedInputRef = useMergedRefs(ref, inputRef);
   const inputGroup = useInputGroup();
   const [isSheetOpen, setIsSheetOpen] = useState(false);
+  const {
+    isTouch
+  } = useTouchPresentation();
   const [, startTransition] = useTransition();
   const [optimisticValue, setOptimisticValue] = useOptimistic(value);
   const isBusy = isLoading || optimisticValue !== value;
@@ -254,61 +236,14 @@ export function TouchTimeField({
       fireChange(next);
     }
   }, [fireChange, hasSeconds, max, min, optimisticValue]);
-  const hourOptions = useMemo(() => {
-    if (hourFormat === '24h') {
-      return Array.from({
-        length: 24
-      }, (_, hour) => ({
-        value: hour,
-        label: twoDigits(hour),
-        isDisabled: !rangeOverlaps(hour * 3600, hour * 3600 + 3599, min, max)
-      }));
-    }
-    const meridiem = parsedWheelTime.hour < 12 ? 0 : 1;
-    return Array.from({
-      length: 12
-    }, (_, index) => {
-      const hour = index + 1;
-      const hour24 = hour24From12(hour, meridiem);
-      return {
-        value: hour,
-        label: String(hour),
-        // Keys step in time order: 12 PM comes before 1 PM.
-        order: hour24,
-        isDisabled: !rangeOverlaps(hour24 * 3600, hour24 * 3600 + 3599, min, max)
-      };
-    });
-  }, [hourFormat, max, min, parsedWheelTime.hour]);
-  const minuteOptions = useMemo(() => Array.from({
-    length: 60
-  }, (_, minute) => {
-    const start = parsedWheelTime.hour * 3600 + minute * 60;
-    return {
-      value: minute,
-      label: twoDigits(minute),
-      isDisabled: !rangeOverlaps(start, start + (hasSeconds ? 59 : 0), min, max)
-    };
-  }), [hasSeconds, max, min, parsedWheelTime.hour]);
-  const secondOptions = useMemo(() => Array.from({
-    length: 60
-  }, (_, second) => ({
-    value: second,
-    label: twoDigits(second),
-    isDisabled: !isTimeInRange(formatISOTime({
-      hour: parsedWheelTime.hour,
-      minute: parsedWheelTime.minute,
-      second
-    }, true), min, max)
-  })), [max, min, parsedWheelTime.hour, parsedWheelTime.minute]);
-  const meridiemOptions = useMemo(() => [{
-    value: 0,
-    label: t('@astryx.dateTimeInput.meridiemAM'),
-    isDisabled: !rangeOverlaps(0, 11 * 3600 + 3599, min, max)
-  }, {
-    value: 1,
-    label: t('@astryx.dateTimeInput.meridiemPM'),
-    isDisabled: !rangeOverlaps(12 * 3600, 23 * 3600 + 3599, min, max)
-  }], [max, min, t]);
+  const bounds = useMemo(() => wheelBounds(min, max), [min, max]);
+  const hourOptions = useMemo(() => hourRowsInHalf(parsedWheelTime.hour, hourFormat, bounds), [bounds, hourFormat, parsedWheelTime.hour]);
+  const minuteOptions = useMemo(() => minuteRows(parsedWheelTime.hour, hasSeconds, bounds), [bounds, hasSeconds, parsedWheelTime.hour]);
+  const secondOptions = useMemo(() => secondRows(parsedWheelTime.hour, parsedWheelTime.minute, bounds), [bounds, parsedWheelTime.hour, parsedWheelTime.minute]);
+  const meridiemOptions = useMemo(() => meridiemRows({
+    am: t('@astryx.dateTimeInput.meridiemAM'),
+    pm: t('@astryx.dateTimeInput.meridiemPM')
+  }, bounds), [bounds, t]);
   const openSheet = useCallback(() => {
     if (!isEffectivelyDisabled) {
       setIsSheetOpen(true);
@@ -391,45 +326,55 @@ export function TouchTimeField({
         ...{
           className: "x9f619 x78zum5 xdt5ytf xh8yej3 xeuugli x1txdalj x1pzlopt x1adxfkp x1awphl8"
         },
-        children: [/*#__PURE__*/_jsxs("div", {
+        children: [/*#__PURE__*/_jsx("div", {
           ...{
             className: "x78zum5 xh8yej3 xeuugli xm8gem x1txdalj"
           },
-          children: [/*#__PURE__*/_jsx(Wheel, {
-            label: t('@astryx.dateTimeInput.hourWheel'),
-            options: hourOptions,
-            value: hourFormat === '24h' ? parsedWheelTime.hour : hour12From24(parsedWheelTime.hour),
-            isActive: isSheetOpen,
-            onChange: hour => commitWheelTime(hourFormat === '24h' ? composeWheelTime({
-              hour24: hour
-            }) : composeWheelTime({
-              hour12: hour
-            }))
-          }), /*#__PURE__*/_jsx(Wheel, {
-            label: t('@astryx.dateTimeInput.minuteWheel'),
-            options: minuteOptions,
-            value: parsedWheelTime.minute,
+          children: isTouch ? /*#__PURE__*/_jsx(TimeWheels, {
+            time: parsedWheelTime,
+            hourFormat: hourFormat,
+            hasSeconds: hasSeconds,
+            min: min,
+            max: max,
             isActive: isSheetOpen,
-            onChange: minute => commitWheelTime(composeWheelTime({
-              minute
-            }))
-          }), hasSeconds && /*#__PURE__*/_jsx(Wheel, {
-            label: t('@astryx.dateTimeInput.secondWheel'),
-            options: secondOptions,
-            value: parsedWheelTime.second,
-            isActive: isSheetOpen,
-            onChange: second => commitWheelTime(composeWheelTime({
-              second
-            }))
-          }), hourFormat === '12h' && /*#__PURE__*/_jsx(Wheel, {
-            label: t('@astryx.dateTimeInput.meridiemWheel'),
-            options: meridiemOptions,
-            value: parsedWheelTime.hour < 12 ? 0 : 1,
-            isActive: isSheetOpen,
-            onChange: meridiem => commitWheelTime(composeWheelTime({
-              meridiem
-            }))
-          })]
+            onCommit: time => commitWheelTime(formatISOTime(time, hasSeconds))
+          }) : /*#__PURE__*/_jsxs(_Fragment, {
+            children: [/*#__PURE__*/_jsx(Wheel, {
+              label: t('@astryx.dateTimeInput.hourWheel'),
+              options: hourOptions,
+              value: hourFormat === '24h' ? parsedWheelTime.hour : hour12From24(parsedWheelTime.hour),
+              isActive: isSheetOpen,
+              onChange: hour => commitWheelTime(hourFormat === '24h' ? composeWheelTime({
+                hour24: hour
+              }) : composeWheelTime({
+                hour12: hour
+              }))
+            }), /*#__PURE__*/_jsx(Wheel, {
+              label: t('@astryx.dateTimeInput.minuteWheel'),
+              options: minuteOptions,
+              value: parsedWheelTime.minute,
+              isActive: isSheetOpen,
+              onChange: minute => commitWheelTime(composeWheelTime({
+                minute
+              }))
+            }), hasSeconds && /*#__PURE__*/_jsx(Wheel, {
+              label: t('@astryx.dateTimeInput.secondWheel'),
+              options: secondOptions,
+              value: parsedWheelTime.second,
+              isActive: isSheetOpen,
+              onChange: second => commitWheelTime(composeWheelTime({
+                second
+              }))
+            }), hourFormat === '12h' && /*#__PURE__*/_jsx(Wheel, {
+              label: t('@astryx.dateTimeInput.meridiemWheel'),
+              options: meridiemOptions,
+              value: parsedWheelTime.hour < 12 ? 0 : 1,
+              isActive: isSheetOpen,
+              onChange: meridiem => commitWheelTime(composeWheelTime({
+                meridiem
+              }))
+            })]
+          })
         }), /*#__PURE__*/_jsx("div", {
           ...{
             className: "x78zum5 xr1yuqi xfsso4q"

package/dist/TimeInput/timeWheelRules.d.ts

@@ -0,0 +1,124 @@
+/**
+ * @file timeWheelRules.ts
+ * @input A time of day, the hour format and the bounds
+ * @output Pure rules of UIDatePicker's time wheels: the columns' rows, the
+ *   time a turned column makes, and which other columns turn with it
+ * @position Internal helper of the TimeInput and DateTimeInput sheets: the
+ *   rows of both their finger and their mouse wheels
+ *
+ * The columns do not loop. Each rule follows a leaf of motion/uikit/
+ * datePicker.ts `wheels`. Pure functions keep the rules testable without a
+ * layout engine.
+ *
+ * SYNC: When modified, update timeWheelRules.test.ts and TimeWheels.tsx.
+ */
+import { type ISOTimeString } from '../utils/timeParser.js';
+/** A time of day, 24-hour. */
+export interface TimeParts {
+    hour: number;
+    minute: number;
+    second: number;
+}
+/** A time wheel column. */
+export type TimeColumn = 'hour' | 'minute' | 'second' | 'meridiem';
+/** One row of a column: the value it stands for and its label. */
+export interface TimeRow {
+    value: number;
+    label: string;
+    isDisabled: boolean;
+    /**
+     * Where the row falls when a key steps the column. An hour row holds the hour
+     * it stands for, so a key follows the full time: 12 PM comes before 1 PM.
+     */
+    order?: number;
+}
+/** Inclusive bounds in seconds since midnight; `null` is unbounded. */
+export interface TimeBounds {
+    min: number | null;
+    max: number | null;
+}
+/** The bounds of a field's `min` and `max` times. */
+export declare function wheelBounds(min: ISOTimeString | undefined, max: ISOTimeString | undefined): TimeBounds;
+/** Whether the hour falls in the PM half (1) or the AM half (0). */
+export declare function meridiemOf(hour: number): 0 | 1;
+/** The 12-hour clock's label for a 24-hour hour: 0 → 12, 13 → 1. */
+export declare function hour12From24(hour: number): number;
+/** The 24-hour hour for a 12-hour hour in a half of the day: 12 AM → 0. */
+export declare function hour24From12(hour: number, meridiem: number): number;
+/**
+ * The time the wheels show for `time`: its seconds kept when the picker has a
+ * seconds column and dropped when it has none. A time outside the bounds is
+ * shown as it is, on its disabled rows: opening the sheet never moves an
+ * untouched value.
+ */
+export declare function displayedTime(time: TimeParts, hasSeconds: boolean): TimeParts;
+/**
+ * The time a column's rest commits when it would make `time`: the nearest
+ * time inside the bounds that the columns have a row for. Past a bound, that
+ * is the bound itself, or, with no seconds column, the nearest whole minute
+ * inside it (a 16:55:30 maximum: 16:55). Inside the bounds, `time` itself.
+ */
+export declare function restingTime(time: TimeParts, hasSeconds: boolean, bounds: TimeBounds): TimeParts;
+/**
+ * The hour the hour column makes when it comes to rest on `row` from the row
+ * that showed `from` (24-hour). In 24-hour time the row is the hour. In 12-hour
+ * time the half of the day changes only when the move passes between 11 and 12.
+ * The column (1 … 12) does not loop, so 12 counts as next to 1. A move between
+ * 12 and 1 to 6 keeps the half of the day. A move between 12 and 7 to 11
+ * changes it.
+ *
+ * @example
+ * ```
+ * hourAfterTurn(11, 12, '12h'); // 12: 11 AM → 12 PM
+ * hourAfterTurn(12, 1, '12h'); // 13: 12 PM → 1 PM
+ * hourAfterTurn(13, 9, '12h'); // 21: 1 PM → 9 PM
+ * ```
+ */
+export declare function hourAfterTurn(from: number, row: number, hourFormat: '12h' | '24h'): number;
+/**
+ * The hour column under a finger. In 24-hour time its rows are 00 … 23. In
+ * 12-hour time they are 1 … 12, each row standing for the hour a turn onto it
+ * from `from` makes (`hourAfterTurn`). A row is disabled when no minute of that
+ * hour is inside the bounds.
+ */
+export declare function hourRows(from: number, hourFormat: '12h' | '24h', bounds: TimeBounds): TimeRow[];
+/**
+ * The hour column under a mouse, whose columns turn one at a time. A 12-hour
+ * row stands for its hour in the half of the day that `from` is in.
+ */
+export declare function hourRowsInHalf(from: number, hourFormat: '12h' | '24h', bounds: TimeBounds): TimeRow[];
+/**
+ * The minute column for `hour`: every minute. A row is disabled when it is
+ * outside the bounds (its whole minute, when the picker shows seconds).
+ */
+export declare function minuteRows(hour: number, hasSeconds: boolean, bounds: TimeBounds): TimeRow[];
+/** The second column for `hour`:`minute`. */
+export declare function secondRows(hour: number, minute: number, bounds: TimeBounds): TimeRow[];
+/** The AM/PM column: a half is disabled when none of its hours is in bounds. */
+export declare function meridiemRows(labels: {
+    am: string;
+    pm: string;
+}, bounds: TimeBounds): TimeRow[];
+/**
+ * The time made by turning `column` to `value` (its row's value) from `from`
+ * (the time the wheels show). Only that column changes, and the AM/PM column
+ * moves the hour by twelve.
+ */
+export declare function turnColumn(from: TimeParts, column: TimeColumn, value: number, hourFormat: '12h' | '24h'): TimeParts;
+/** What a column shows for a time: its row's value. */
+export declare function columnValue(time: TimeParts, column: TimeColumn, hourFormat: '12h' | '24h'): number;
+/**
+ * The columns that must turn after `column` came to rest on `value`. That is
+ * every column whose row for the committed time differs from the row it shows
+ * now. The column that moved shows `value`; the others show `from`. An hour
+ * that crossed 11 ↔ 12 turns the AM/PM column; a time brought back onto a bound
+ * turns every column whose row changed.
+ */
+export declare function columnsToTurn(from: TimeParts, column: TimeColumn, value: number, committed: TimeParts, options: {
+    hourFormat: '12h' | '24h';
+    hasSeconds: boolean;
+}): {
+    column: TimeColumn;
+    value: number;
+}[];
+//# sourceMappingURL=timeWheelRules.d.ts.map

package/dist/TimeInput/timeWheelRules.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeWheelRules.d.ts","sourceRoot":"","sources":["../../src/TimeInput/timeWheelRules.ts"],"names":[],"mappings":"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"}