@memobit/libs 1.0.62 → 1.0.63

package/dist/index.d.ts

@@ -13,6 +13,7 @@ import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { ReactPortal } from 'react';
 import { RefAttributes } from 'react';
+import { TouchEvent as TouchEvent_2 } from 'react';
 
 export declare const Accordion: default_2.FC<AccordionProps>;
 
@@ -73,6 +74,32 @@ export declare interface AnalogClockProps {
     className?: string;
 }
 
+export declare const AngleSlider: FC<AngleSliderProps>;
+
+export declare interface AngleSliderProps {
+    disabled?: boolean;
+    /** Text under the dial. Replaced by the degree readout when `showValue` is on. */
+    label?: string;
+    /** Highest angle the dial accepts, in degrees. Defaults to a full turn. */
+    max?: number;
+    /** Lowest angle the dial accepts, in degrees. */
+    min?: number;
+    onChange: (value: number) => void;
+    /** Diameter in pixels. */
+    size?: number;
+    /** Rounding applied to every change, in degrees. */
+    step?: number;
+    /** Draws a tick every N degrees. `0` turns the ticks off. */
+    tickStep?: number;
+    /** Degrees moved per arrow key press. Defaults to `step`. */
+    keyboardStep?: number;
+    showValue?: boolean;
+    value: number;
+    variant?: AngleSliderVariant;
+}
+
+export declare type AngleSliderVariant = 'accent' | 'info' | 'success' | 'warning' | 'danger';
+
 export declare const APP_DATE_FORMAT = "DD MMM YYYY";
 
 export declare const APP_DATE_TIME_FORMAT = "DD MMM YYYY HH:mm";
@@ -187,6 +214,35 @@ export declare interface BannerProps {
 
 export declare type BannerVariant = 'default' | 'success' | 'info' | 'warning' | 'danger';
 
+export declare const Blockquote: FC<BlockquoteProps>;
+
+export declare type BlockquoteAppearance = 'bar' | 'card' | 'plain' | 'pull';
+
+export declare interface BlockquoteProps {
+    /** Centres a `pull` quote; the other appearances read better left-aligned. */
+    align?: 'left' | 'center';
+    /** How the quote is framed: a left rule, a filled card, bare text, or a large pull quote. */
+    appearance?: BlockquoteAppearance;
+    /** Who said it. */
+    author?: string;
+    children: ReactNode;
+    className?: string;
+    /** Turns the source into a link. */
+    href?: string;
+    /** Small icon before the quote — handy for flagging a note or a warning. */
+    icon?: IconName;
+    /** Draws a large decorative quote glyph behind the text. */
+    showQuoteMark?: boolean;
+    size?: BlockquoteSize;
+    /** Where it came from: a book, an article, a ticket. Shown after the author. */
+    source?: string;
+    variant?: BlockquoteVariant;
+}
+
+export declare type BlockquoteSize = 'sm' | 'md' | 'lg';
+
+export declare type BlockquoteVariant = 'default' | 'accent' | 'info' | 'success' | 'warning' | 'danger';
+
 export declare const BMI: default_2.FC<BMIProps>;
 
 declare interface BMIProps {
@@ -304,6 +360,12 @@ export declare const calculateTimelineMarkers: <T extends TimelineMarkersItem>(i
 
 export declare const Calendar: default_2.FC<CalendarProps>;
 
+/** Half-open [start, end): with start 9 and end 18, 17:00 is active and 18:00 is not. */
+export declare interface CalendarActiveHours {
+    start: number;
+    end: number;
+}
+
 export declare interface CalendarDateRange {
     start: Date;
     end: Date;
@@ -439,6 +501,8 @@ export declare type ChipSize = 'xsmall' | 'small' | 'medium' | 'large';
 
 export declare type ChipVariant = 'plain' | 'default' | 'success' | 'info' | 'warning' | 'danger';
 
+export declare const Col: FC<ColProps>;
+
 export declare const CollapsibleSection: default_2.FC<CollapsibleSectionProps>;
 
 declare interface CollapsibleSectionProps {
@@ -468,6 +532,20 @@ export declare interface ColorPickerProps {
     onChange?: (hex: string) => void;
 }
 
+export declare interface ColProps {
+    children: ReactNode;
+    className?: string;
+    /** Column count this cell occupies on desktop. */
+    span?: ColSpan;
+    /** Column count on mobile (<= 768px). Defaults to filling the row. */
+    spanMobile?: ColSpan;
+    /** Column count on tablet (769px - 1024px). Defaults to `span`, clamped by the parent. */
+    spanTablet?: ColSpan;
+    style?: CSSProperties;
+}
+
+export declare type ColSpan = GridColumns;
+
 export declare interface CommandItem {
     id: string;
     label: string;
@@ -1088,14 +1166,17 @@ export declare interface DateRangePreset {
 }
 
 /**
- * A single day's events, listed in a modal. The month grid can only show a chip or
- * three per cell before it starts hiding them behind "+N more", and the chips are too
- * small to aim at on a phone — this is the way into a busy day.
+ * One day laid out against the clock, in a modal.
+ *
+ * A month cell can only carry a chip or three before the rest hide behind "+N more", and
+ * those chips are too small to aim at on a phone. This is the way into a busy day: events
+ * sit at the hour they actually happen, overlapping ones split into lanes, and the empty
+ * stretches are themselves the target for adding something at that time.
  */
-export declare function DayAgenda<T>({ addLabel, className, date, defaultDurationMinutes, emptyLabel, events, isOpen, onAdd, onClose, onEventClick, renderEvent, }: DayAgendaProps<T>): JSX.Element;
+export declare function DayAgenda<T>({ activeHours, addLabel, className, date, dayEndHour, dayStartHour, defaultDurationMinutes, emptyLabel, events, hourHeight, isOpen, onAdd, onClose, onDateChange, onEventClick, renderEvent, }: DayAgendaProps<T>): JSX.Element;
 
 export declare interface DayAgendaProps<T = unknown> {
-    /** The day to list. Only the date part is read. */
+    /** The day to lay out. Only the date part is read. */
     date: Date;
     /**
      * The same array the calendar is given — the day's events are picked out here, so the
@@ -1104,14 +1185,35 @@ export declare interface DayAgendaProps<T = unknown> {
     events: CalendarEvent<T>[];
     isOpen: boolean;
     onClose: () => void;
+    /**
+     * Enables swiping the grid left or right to step a day. Without it the modal shows
+     * only the day it was opened on — which is fine for a one-off, but on a phone the
+     * neighbouring day is usually the next thing wanted.
+     */
+    onDateChange?: (date: Date) => void;
     onEventClick?: (event: CalendarEvent<T>) => void;
-    /** Adds a footer button that hands back the day being listed. */
+    /**
+     * Fires with the hour slot that was clicked, so something added from an empty stretch
+     * starts at the time pointed at rather than at midnight. Also backs the footer button,
+     * which passes the day itself for an entry with no particular time.
+     */
     onAdd?: (date: Date) => void;
     addLabel?: string;
-    /** Replaces the title of a row. The time column and colour bar stay. */
+    /** Replaces a chip's contents. */
     renderEvent?: (event: CalendarEvent<T>) => ReactNode;
     emptyLabel?: string;
-    /** Assumed length of a timed event with no `end`, used for the row's time range. */
+    /** First and last hour rendered. */
+    dayStartHour?: number;
+    dayEndHour?: number;
+    /**
+     * The hours that matter — working hours, opening hours. Everything outside the band
+     * recedes, so the part of the day worth reading is found without counting rows. It
+     * trims nothing, unlike `dayStartHour`/`dayEndHour`.
+     */
+    activeHours?: CalendarActiveHours;
+    /** Height of one hour row, in pixels. */
+    hourHeight?: number;
+    /** Assumed length of a timed event with no `end`. */
     defaultDurationMinutes?: number;
     className?: string;
 }
@@ -1298,7 +1400,7 @@ declare interface ErrorBoundaryState {
     error: Error | null;
 }
 
-export declare function EventCalendar<T>({ className, date, dayAgenda, dayEndHour, dayStartHour, defaultDurationMinutes, emptyLabel, events, firstDayOfWeek, headerExtra, hourHeight, maxEventsPerDay, onDateChange, onDayClick, onEventClick, onEventDrop, onViewChange, renderEvent, showHeader, showWeekNumbers, view, }: EventCalendarProps<T>): JSX.Element;
+export declare function EventCalendar<T>({ activeHours, className, date, dayAgenda, dayEndHour, dayStartHour, defaultDurationMinutes, emptyLabel, events, firstDayOfWeek, headerExtra, hourHeight, maxEventsPerDay, onDateChange, onDayClick, onEventClick, onEventDrop, onViewChange, renderEvent, showHeader, showWeekNumbers, swipeNavigation, view, }: EventCalendarProps<T>): JSX.Element;
 
 export declare interface EventCalendarProps<T = unknown> {
     events: CalendarEvent<T>[];
@@ -1309,8 +1411,14 @@ export declare interface EventCalendarProps<T = unknown> {
     date?: Date;
     onDateChange?: (date: Date) => void;
     firstDayOfWeek?: 0 | 1;
-    /** Adds the ISO week number: a leading column in month view, a suffix on the week title. */
+    /** Adds a leading ISO week-number column to the month grid. The week view names its own period, so it needs none. */
     showWeekNumbers?: boolean;
+    /**
+     * Swiping the grid left or right pages to the next or previous period — the month in
+     * month view, the week in week view. Touch only, so it costs a desktop nothing. Set
+     * false where a horizontal drag already means something else.
+     */
+    swipeNavigation?: boolean;
     onEventClick?: (event: CalendarEvent<T>) => void;
     /** Fires on the empty part of a day cell (month) or an hour slot (week). */
     onDayClick?: (date: Date) => void;
@@ -1335,6 +1443,13 @@ export declare interface EventCalendarProps<T = unknown> {
     /** First and last hour rendered by the week view. */
     dayStartHour?: number;
     dayEndHour?: number;
+    /**
+     * The hours that matter — working hours, opening hours. Everything outside the band
+     * recedes, so the part of the day worth reading is found without counting rows. Unlike
+     * `dayStartHour`/`dayEndHour` this trims nothing: a 21:00 event still shows, just
+     * against a quieter background. Omit to treat every hour alike.
+     */
+    activeHours?: CalendarActiveHours;
     /** Height of one hour row in the week view, in pixels. */
     hourHeight?: number;
     /** Assumed length of a timed event with no `end`. */
@@ -1382,6 +1497,46 @@ declare interface FloatButtonProps {
     actions: FloatButtonAction[];
 }
 
+export declare const FloatingWindow: FC<FloatingWindowProps>;
+
+export declare interface FloatingWindowPosition {
+    x: number;
+    y: number;
+}
+
+export declare interface FloatingWindowProps {
+    children: ReactNode;
+    className?: string;
+    /** Escape closes the window. Off by default — a floating window is not modal. */
+    closeOnEscape?: boolean;
+    /** Opening position in viewport pixels. Centred on the viewport when omitted. */
+    defaultPosition?: FloatingWindowPosition;
+    defaultSize?: FloatingWindowSize;
+    /** Pinned strip along the bottom of the window. */
+    footer?: ReactNode;
+    isOpen: boolean;
+    /** Shows the collapse control. */
+    minimizable?: boolean;
+    minHeight?: number;
+    minWidth?: number;
+    onClose: () => void;
+    /** Reports every settled move and resize, for callers that persist the geometry. */
+    onGeometryChange?: (geometry: FloatingWindowPosition & FloatingWindowSize) => void;
+    /** Shows the maximize control and the edge handles. */
+    resizable?: boolean;
+    title?: string;
+    titleIcon?: IconName;
+    usePortal?: boolean;
+    zIndex?: number;
+}
+
+export declare type FloatingWindowResizeDirection = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw';
+
+export declare interface FloatingWindowSize {
+    height: number;
+    width: number;
+}
+
 export declare const foldDiacritics: (input: string) => string;
 
 export declare interface FolderBrowserEntry {
@@ -1488,6 +1643,41 @@ export declare const getThemeConfig: (themeValue: string) => ThemeConfig | undef
 
 export declare const getTodayDateString: () => string;
 
+export declare const Grid: FC<GridProps>;
+
+export declare type GridAlign = 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+
+export declare type GridColumns = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
+
+export declare type GridGap = '0' | '2' | '4' | '6' | '8' | '12' | '16' | '20' | '24' | '32' | '40' | '48';
+
+export declare type GridJustify = 'start' | 'center' | 'end' | 'space-between' | 'space-around';
+
+export declare interface GridProps {
+    /** Vertical alignment of the items inside each row. */
+    align?: GridAlign;
+    children: ReactNode;
+    className?: string;
+    /** Columns from the desktop breakpoint up (> 1024px). */
+    cols?: GridColumns;
+    /** Columns on mobile (<= 768px). Defaults to 1 so content stacks. */
+    colsMobile?: GridColumns;
+    /** Columns on tablet (769px - 1024px). Defaults to `cols` capped at 2. */
+    colsTablet?: GridColumns;
+    /** Spacing token used between columns, and between rows unless `rowGap` overrides it. */
+    gap?: GridGap;
+    /** Horizontal distribution of a partially filled row. */
+    justify?: GridJustify;
+    /**
+     * Switches to a fluid track: every child takes at least this many pixels and rows wrap on
+     * their own. `cols` and the responsive overrides are ignored while this is set.
+     */
+    minColWidth?: number;
+    /** Row spacing token, when rows should breathe differently from columns. */
+    rowGap?: GridGap;
+    style?: CSSProperties;
+}
+
 export declare function highlightText(text: string, searchTerm: string): ReactNode;
 
 /**
@@ -1742,6 +1932,32 @@ declare interface InputPhoneProps {
     value?: string;
 }
 
+export declare const InputPIN: FC<InputPINProps>;
+
+export declare interface InputPINProps {
+    autoFocus?: boolean;
+    disabled?: boolean;
+    error?: string;
+    id?: string;
+    label?: string;
+    /** Number of cells. */
+    length?: number;
+    /** Renders a gap after this many cells, the way grouped codes are printed. */
+    groupSize?: number;
+    /** Fired on every edit with the code so far, shorter than `length` while incomplete. */
+    onChange: (value: string) => void;
+    /** Fired once the last cell is filled, with the finished code. */
+    onComplete?: (value: string) => void;
+    /** Masks the characters, for a PIN rather than a one-time code. */
+    secret?: boolean;
+    success?: string;
+    /** `numeric` accepts digits only and asks phones for the number pad. */
+    type?: InputPINType;
+    value: string;
+}
+
+export declare type InputPINType = 'numeric' | 'alphanumeric';
+
 export declare const InputSearch: ForwardRefExoticComponent<InputSearchProps & RefAttributes<HTMLInputElement>>;
 
 export declare interface InputSearchProps {
@@ -2323,12 +2539,49 @@ export declare interface RadioProps {
     className?: string;
 }
 
+export declare const RangeSlider: FC<RangeSliderProps>;
+
+export declare interface RangeSliderProps {
+    disabled?: boolean;
+    /** Renders each readout and tick label — money, units, dates, whatever the range means. */
+    formatValue?: (value: number) => string;
+    label?: string;
+    max?: number;
+    min?: number;
+    /** Smallest gap the two thumbs may be pushed to. Defaults to one `step`. */
+    minDistance?: number;
+    onChange: (value: RangeSliderValue) => void;
+    /** Fired once when a drag or key press settles — the place to kick off a query. */
+    onChangeEnd?: (value: RangeSliderValue) => void;
+    showValues?: boolean;
+    step?: number;
+    /** Renders a thinner track and smaller thumbs. */
+    thin?: boolean;
+    /** Draws a labelled tick every N units. `0` turns the ticks off. */
+    tickStep?: number;
+    value: RangeSliderValue;
+    variant?: RangeSliderVariant;
+}
+
+export declare type RangeSliderValue = [number, number];
+
+export declare type RangeSliderVariant = 'accent' | 'info' | 'success' | 'warning' | 'danger';
+
 export declare const Rating: FC<RatingProps>;
 
-declare type RatingIconType = 'star' | 'bullet' | 'bar';
+export declare type RatingFilled = 'full' | 'half' | 'empty';
+
+export declare type RatingIconType = 'star' | 'bullet' | 'bar' | 'emoji';
 
 declare interface RatingProps {
     align?: 'left' | 'right' | 'space-between';
+    /**
+     * Emoji only: tint the chosen face by where it sits on the scale — red at the sad end,
+     * amber in the middle, green at the happy end — instead of using `variant` throughout.
+     */
+    emojiColorByMood?: boolean;
+    /** Emoji only: pixel size of each face. Faces need more room than a star to stay readable. */
+    emojiSize?: number;
     icon?: RatingIconType;
     maxRate?: number;
     onHover?: (value: number) => void;
@@ -2341,7 +2594,7 @@ declare interface RatingProps {
     variant?: RatingVariant;
 }
 
-declare type RatingVariant = 'success' | 'info' | 'warning' | 'danger';
+export declare type RatingVariant = 'success' | 'info' | 'warning' | 'danger';
 
 export declare const RichTextEditor: ({ advanced, error, format, id, label, onBlur, onChange, placeholder, required, value, }: RichTextEditorProps) => JSX.Element;
 
@@ -2358,6 +2611,33 @@ declare interface RichTextEditorProps {
     value?: string;
 }
 
+export declare const RollingNumber: FC<RollingNumberProps>;
+
+export declare type RollingNumberDirection = 'up' | 'down' | 'none';
+
+export declare interface RollingNumberProps {
+    className?: string;
+    /** Tint the readout green when the value rose and red when it fell, overriding `variant`. */
+    colorByDirection?: boolean;
+    decimals?: number;
+    decimalSeparator?: string;
+    /** Roll duration in milliseconds. */
+    duration?: number;
+    /** Thousands separator. Pass an empty string to switch grouping off. */
+    groupSeparator?: string;
+    prefix?: string;
+    size?: RollingNumberSize;
+    /** Delay added per digit so the columns land one after another, in milliseconds. */
+    stagger?: number;
+    suffix?: string;
+    value: number;
+    variant?: RollingNumberVariant;
+}
+
+export declare type RollingNumberSize = 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
+
+export declare type RollingNumberVariant = 'default' | 'accent' | 'info' | 'success' | 'warning' | 'danger';
+
 export declare interface ScrollInfo {
     scrollTop: number;
     scrollHeight: number;
@@ -2533,6 +2813,37 @@ declare interface SplitPanelProps {
     className?: string;
 }
 
+export declare const Splitter: FC<SplitterProps>;
+
+export declare type SplitterOrientation = 'horizontal' | 'vertical';
+
+export declare interface SplitterPane {
+    content: ReactNode;
+    /** Stable identity for the pane — also used as the React key. */
+    id: string;
+    /** Smallest share this pane may be dragged to, in percent. Defaults to 10. */
+    minSize?: number;
+    /** Starting share of the container, in percent. Omitted panes split what is left evenly. */
+    size?: number;
+}
+
+export declare interface SplitterProps {
+    className?: string;
+    /** Dragging a pane below half its minimum snaps it shut instead of stopping at the minimum. */
+    collapsible?: boolean;
+    /** Thickness of the drag handles in pixels. */
+    gutterSize?: number;
+    /** Percent moved per arrow key press on a focused gutter. */
+    keyboardStep?: number;
+    /** Fired with the full list of pane sizes (percent) whenever a drag or key press settles. */
+    onResize?: (sizes: number[]) => void;
+    /** `horizontal` lays the panes out side by side; `vertical` stacks them. */
+    orientation?: SplitterOrientation;
+    panes: SplitterPane[];
+    /** Double-clicking a gutter restores the sizes the Splitter started with. */
+    resetOnDoubleClick?: boolean;
+}
+
 export declare const StackedBar: ({ animated, height, normalize, orientation, segments, separators, showLabels, showPercentage, thin, width, }: StackedBarProps) => JSX.Element;
 
 export declare type StackedBarOrientation = 'horizontal' | 'vertical';
@@ -2634,6 +2945,12 @@ declare interface SuggestionsListProps {
     onRowClick?: (item: SuggestionsListElement) => void;
 }
 
+export declare interface SwipeHandlers {
+    onTouchStart: (event: TouchEvent_2) => void;
+    onTouchEnd: (event: TouchEvent_2) => void;
+    onTouchCancel: () => void;
+}
+
 export declare type Theme = 'amber-meridian' | 'archive-indigo' | 'arctic-blue' | 'asphalt-code' | 'atelier-media' | 'audit-ember' | 'azure-night' | 'blossom-meadow' | 'blueprint-clay' | 'blush-market' | 'brass-chronicle' | 'carbon-velocity' | 'chalk-circuit' | 'chrono-atlas' | 'clinical-aqua' | 'cobalt-pulse' | 'citrus-vital' | 'command-slate' | 'crawler-dusk' | 'crimson-dusk' | 'cyber-forest' | 'dashdarkx' | 'ember-night' | 'emerald-ledger' | 'frost-petal' | 'garden-harvest' | 'gilded-bear' | 'graphite-shell' | 'horizon-amber' | 'horizon-drift' | 'ivory-serif' | 'lavender-mist' | 'light-blue' | 'lumen' | 'luna' | 'mesh-circuit' | 'midnight-atlas' | 'midnight-amber' | 'midnight-folio' | 'mint-meadow' | 'mintone' | 'neon-tokyo' | 'noir-marquee' | 'ocean-breeze' | 'ocean-depths' | 'orbital-night' | 'sandstone' | 'sandy-parchment' | 'screening-room' | 'signal-burst' | 'signal-clarity' | 'slate-focus' | 'slate-bazaar' | 'spectrum-vault' | 'tailwind-vue-dark' | 'terminal-phosphor' | 'terracotta-kitchen' | 'twilight-pulse' | 'vault-guard' | 'velvet-reel' | 'velvet-tome' | 'verdant-pulse' | 'vital-aurora' | 'vital-signal';
 
 export declare const THEME_CONFIGS: ThemeConfig[];
@@ -2983,6 +3300,35 @@ export declare interface TourHudProps {
     className?: string;
 }
 
+export declare const Transition: FC<TransitionProps>;
+
+export declare interface TransitionProps {
+    /** Play the enter animation on the very first render too. */
+    appear?: boolean;
+    /** Element rendered around the children. */
+    as?: TransitionTag;
+    children: ReactNode;
+    className?: string;
+    /** Delay before the enter animation starts, in milliseconds. */
+    delay?: number;
+    /** Animation length in milliseconds. Also how long the exit is held before unmounting. */
+    duration?: number;
+    easing?: string;
+    /** Keep the element mounted but hidden instead of removing it once the exit finishes. */
+    keepMounted?: boolean;
+    onEntered?: () => void;
+    onExited?: () => void;
+    /** `true` plays the enter animation; `false` plays the exit animation, then unmounts. */
+    show: boolean;
+    type?: TransitionType;
+}
+
+export declare type TransitionStatus = 'unmounted' | 'entering' | 'entered' | 'exiting';
+
+export declare type TransitionTag = 'div' | 'span' | 'section' | 'li';
+
+export declare type TransitionType = 'fade' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'scale' | 'collapse';
+
 export declare const Tree: default_2.FC<TreeProps>;
 
 export declare interface TreeNode {
@@ -3071,6 +3417,40 @@ export declare interface User {
 
 export declare const useSidebar: () => SidebarContextValue;
 
+/**
+ * Turns a touch drag into a direction.
+ *
+ * Touch only, deliberately: a mouse drag on the same element usually already means
+ * something (selecting text, dragging an item), and a phone is where a swipe is the
+ * natural gesture. Nothing is ever `preventDefault`ed, so the element keeps scrolling
+ * normally and a swipe that fails the threshold costs the user nothing.
+ *
+ * Spread the returned handlers onto the element that should respond:
+ *
+ *     const swipe = useSwipe({ onSwipeLeft: next, onSwipeRight: previous });
+ *     return <div {...swipe}>…</div>;
+ */
+export declare const useSwipe: ({ enabled, maxDurationMs, onSwipeDown, onSwipeLeft, onSwipeRight, onSwipeUp, restraint, threshold, }: UseSwipeOptions) => SwipeHandlers;
+
+export declare interface UseSwipeOptions {
+    onSwipeLeft?: () => void;
+    onSwipeRight?: () => void;
+    onSwipeUp?: () => void;
+    onSwipeDown?: () => void;
+    /** Distance along the swipe axis, in px, before it counts as one. */
+    threshold?: number;
+    /**
+     * Allowed drift across the swipe axis, in px. This is what keeps a vertical scroll
+     * inside a calendar grid from registering as a horizontal page turn, so it matters
+     * most when the swiped element scrolls the other way.
+     */
+    restraint?: number;
+    /** A drag slower than this is someone reading, not swiping. */
+    maxDurationMs?: number;
+    /** Set false to detach without changing where the hook is called. */
+    enabled?: boolean;
+}
+
 export declare const useTheme: () => ThemeContextType;
 
 export declare const useToast: () => ToastContextValue;