number-flow-react-native 0.1.0

package/lib/typescript/native/DigitSlot.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import { type TextStyle } from "react-native";
+import type { GlyphMetrics, TimingConfig, Trend } from "../core/types";
+interface DigitSlotProps {
+    metrics: GlyphMetrics;
+    digitValue: number;
+    targetX: number;
+    charWidth: number;
+    textStyle: TextStyle;
+    spinTiming: TimingConfig;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    trend: Trend;
+    entering: boolean;
+    exiting: boolean;
+    exitKey?: string;
+    onExitComplete?: (key: string) => void;
+    digitCount?: number;
+    continuousSpinGeneration?: number;
+    maskTop?: number;
+    maskBottom?: number;
+    superscript?: boolean;
+    digitStrings?: string[];
+}
+export declare const DigitSlot: React.MemoExoticComponent<({ metrics, digitValue, targetX, charWidth, textStyle, spinTiming, opacityTiming, transformTiming, trend, entering, exiting, exitKey, onExitComplete, digitCount, continuousSpinGeneration, maskTop, maskBottom, superscript, digitStrings, }: DigitSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=DigitSlot.d.ts.map

package/lib/typescript/native/DigitSlot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DigitSlot.d.ts","sourceRoot":"","sources":["../../../src/native/DigitSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAUhE,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AA0BvE,UAAU,cAAc;IACtB,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,SAAS,CAAC;IACrB,UAAU,EAAE,YAAY,CAAC;IACzB,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,2QAqBjB,cAAc,6CA6GlB,CAAC"}

package/lib/typescript/native/NumberFlow.d.ts

@@ -0,0 +1,3 @@
+import type { NumberFlowProps } from "./types";
+export declare const NumberFlow: ({ value, format, locales, style: nfStyle, textAlign, prefix, suffix, spinTiming, opacityTiming, transformTiming, trend, animated, respectMotionPreference, continuous, digits, onAnimationsStart, onAnimationsFinish, containerStyle, mask, }: NumberFlowProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NumberFlow.d.ts.map

package/lib/typescript/native/NumberFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberFlow.d.ts","sourceRoot":"","sources":["../../../src/native/NumberFlow.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG/C,eAAO,MAAM,UAAU,GAAI,+OAoBxB,eAAe,4CA4PjB,CAAC"}

package/lib/typescript/native/SymbolSlot.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { type TextStyle } from "react-native";
+import type { TimingConfig } from "../core/types";
+interface SymbolSlotProps {
+    char: string;
+    targetX: number;
+    lineHeight: number;
+    textStyle: TextStyle;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    entering: boolean;
+    exiting: boolean;
+    exitKey?: string;
+    onExitComplete?: (key: string) => void;
+    superscript?: boolean;
+}
+export declare const SymbolSlot: React.MemoExoticComponent<({ char, targetX, lineHeight, textStyle, opacityTiming, transformTiming, entering, exiting, exitKey, onExitComplete, superscript, }: SymbolSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=SymbolSlot.d.ts.map

package/lib/typescript/native/SymbolSlot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SymbolSlot.d.ts","sourceRoot":"","sources":["../../../src/native/SymbolSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAIpD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAIlD,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,UAAU,iKAalB,eAAe,6CA6BnB,CAAC"}

package/lib/typescript/native/TimeFlow.d.ts

@@ -0,0 +1,3 @@
+import type { TimeFlowProps } from "../core/timeTypes";
+export declare const TimeFlow: ({ hours, minutes, seconds, timestamp, timezoneOffset, is24Hour, padHours, style: nfStyle, textAlign, spinTiming, opacityTiming, transformTiming, trend, animated, respectMotionPreference, continuous, onAnimationsStart, onAnimationsFinish, containerStyle, mask, }: TimeFlowProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TimeFlow.d.ts.map

package/lib/typescript/native/TimeFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeFlow.d.ts","sourceRoot":"","sources":["../../../src/native/TimeFlow.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAQvD,eAAO,MAAM,QAAQ,GAAI,uQAqBtB,aAAa,4CA6Pf,CAAC"}

package/lib/typescript/native/index.d.ts

@@ -0,0 +1,3 @@
+export { NumberFlow } from "./NumberFlow";
+export { TimeFlow } from "./TimeFlow";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/native/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/native/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC"}

package/lib/typescript/native/renderSlots.d.ts

@@ -0,0 +1,31 @@
+import type { TextStyle } from "react-native";
+import type { CharLayout } from "../core/layout";
+import type { GlyphMetrics, TimingConfig, Trend } from "../core/types";
+interface RenderSlotsParams {
+    layout: CharLayout[];
+    exitingEntries: Map<string, CharLayout>;
+    prevMap: Map<string, CharLayout>;
+    isInitialRender: boolean;
+    onExitComplete: (key: string) => void;
+    metrics: GlyphMetrics;
+    textStyle: TextStyle;
+    resolvedTrend: Trend;
+    spinTiming: TimingConfig;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    spinGenerations: Map<string, number> | undefined;
+    digitCountResolver: (key: string) => number;
+    maskTop: number;
+    maskBottom: number;
+    digitStrings?: string[];
+}
+/**
+ * Renders the active and exiting digit/symbol slot tree.
+ *
+ * Shared between NumberFlow and TimeFlow — the only behavioral differences
+ * are abstracted via `digitCountResolver` (which digit-count lookup to use)
+ * and the optional `digitStrings` (locale-specific digit characters).
+ */
+export declare function renderSlots({ layout, exitingEntries, prevMap, isInitialRender, onExitComplete, metrics, textStyle, resolvedTrend, spinTiming, opacityTiming, transformTiming, spinGenerations, digitCountResolver, maskTop, maskBottom, digitStrings, }: RenderSlotsParams): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=renderSlots.d.ts.map

package/lib/typescript/native/renderSlots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderSlots.d.ts","sourceRoot":"","sources":["../../../src/native/renderSlots.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAIvE,UAAU,iBAAiB;IACzB,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACxC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACjC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,EAAE,SAAS,CAAC;IACrB,aAAa,EAAE,KAAK,CAAC;IACrB,UAAU,EAAE,YAAY,CAAC;IACzB,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,eAAe,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,kBAAkB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,cAAc,EACd,OAAO,EACP,eAAe,EACf,cAAc,EACd,OAAO,EACP,SAAS,EACT,aAAa,EACb,UAAU,EACV,aAAa,EACb,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,OAAO,EACP,UAAU,EACV,YAAY,GACb,EAAE,iBAAiB,2CAoGnB"}

package/lib/typescript/native/types.d.ts

@@ -0,0 +1,36 @@
+import type { TextStyle, ViewStyle } from "react-native";
+import type { AnimationBehaviorProps, DigitsProp, TextAlign } from "../core/types";
+/** Text style for NumberFlow/TimeFlow. Requires fontSize; fontFamily defaults to the system font when omitted. */
+export type NumberFlowStyle = TextStyle & {
+    fontSize: number;
+};
+interface NumberFlowValueProps {
+    /** Numeric value to display */
+    value: number;
+    /** Intl.NumberFormatOptions for value formatting */
+    format?: Intl.NumberFormatOptions;
+    /** Locale(s) for Intl.NumberFormat */
+    locales?: Intl.LocalesArgument;
+}
+interface NumberFlowBaseProps extends AnimationBehaviorProps {
+    /** Text styling. fontSize is required; fontFamily defaults to the platform system font. */
+    style: NumberFlowStyle;
+    /** Text alignment. Defaults to "left". */
+    textAlign?: TextAlign;
+    /** Static string prepended before the number */
+    prefix?: string;
+    /** Static string appended after the number */
+    suffix?: string;
+    /**
+     * Per-position digit constraints. Maps integer position (0=ones, 1=tens, ...)
+     * to { max: N } where N is the highest digit value (inclusive).
+     * Example: { 1: { max: 5 } } for a wheel where tens go 0-5.
+     */
+    digits?: DigitsProp;
+    /** Style applied to the outer container View */
+    containerStyle?: ViewStyle;
+}
+/** Props for NumberFlow. Accessibility is built-in: accessibilityRole="text" and accessibilityLabel are set automatically. */
+export type NumberFlowProps = NumberFlowBaseProps & NumberFlowValueProps;
+export {};
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/native/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/native/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,sBAAsB,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAEnF,kHAAkH;AAClH,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,UAAU,oBAAoB;IAC5B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,MAAM,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IAClC,sCAAsC;IACtC,OAAO,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC;CAChC;AAED,UAAU,mBAAoB,SAAQ,sBAAsB;IAC1D,2FAA2F;IAC3F,KAAK,EAAE,eAAe,CAAC;IACvB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,gDAAgD;IAChD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;OAIG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,gDAAgD;IAChD,cAAc,CAAC,EAAE,SAAS,CAAC;CAC5B;AAED,8HAA8H;AAC9H,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,oBAAoB,CAAC"}

package/lib/typescript/native/useMeasuredGlyphMetrics.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { GlyphMetrics } from "../core/types";
+import type { NumberFlowStyle } from "./types";
+export declare function useMeasuredGlyphMetrics(style: NumberFlowStyle, additionalChars?: string, localeDigitStrings?: string[]): {
+    metrics: GlyphMetrics | null;
+    MeasureElement: React.ReactElement | null;
+};
+//# sourceMappingURL=useMeasuredGlyphMetrics.d.ts.map

package/lib/typescript/native/useMeasuredGlyphMetrics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMeasuredGlyphMetrics.d.ts","sourceRoot":"","sources":["../../../src/native/useMeasuredGlyphMetrics.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAuJ/C,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,eAAe,EACtB,eAAe,CAAC,EAAE,MAAM,EACxB,kBAAkB,CAAC,EAAE,MAAM,EAAE,GAC5B;IACD,OAAO,EAAE,YAAY,GAAG,IAAI,CAAC;IAC7B,cAAc,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;CAC3C,CA0CA"}

package/lib/typescript/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/skia/DigitSlot.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+import { type SharedValue } from "react-native-reanimated";
+import type { GlyphMetrics, SkiaNumberFlowProps, TimingConfig, Trend } from "../core/types";
+interface DigitSlotProps {
+    metrics: GlyphMetrics;
+    digitValue: number;
+    targetX: number;
+    charWidth: number;
+    baseY: number;
+    color: string;
+    font: NonNullable<SkiaNumberFlowProps["font"]>;
+    spinTiming: TimingConfig;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    trend: Trend;
+    entering: boolean;
+    exiting: boolean;
+    exitKey?: string;
+    onExitComplete?: (key: string) => void;
+    workletDigitValue?: SharedValue<number>;
+    workletLayout?: SharedValue<{
+        x: number;
+        width: number;
+    }[]>;
+    slotIndex?: number;
+    digitCount?: number;
+    continuousSpinGeneration?: number;
+    maskTop?: number;
+    maskBottom?: number;
+    superscript?: boolean;
+    digitStrings?: string[];
+}
+export declare const DigitSlot: React.MemoExoticComponent<({ metrics, digitValue, targetX, charWidth, baseY, color, font, spinTiming, opacityTiming, transformTiming, trend, entering, exiting, exitKey, onExitComplete, workletDigitValue, workletLayout, slotIndex, digitCount, continuousSpinGeneration, maskTop, maskBottom, superscript, digitStrings, }: DigitSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=DigitSlot.d.ts.map

package/lib/typescript/skia/DigitSlot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DigitSlot.d.ts","sourceRoot":"","sources":["../../../src/skia/DigitSlot.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAEL,KAAK,WAAW,EAGjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,YAAY,EAAE,mBAAmB,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAK5F,UAAU,cAAc;IACtB,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,WAAW,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/C,UAAU,EAAE,YAAY,CAAC;IACzB,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,iBAAiB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACxC,aAAa,CAAC,EAAE,WAAW,CAAC;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC,CAAC;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,iUA0BjB,cAAc,6CAsJlB,CAAC"}

package/lib/typescript/skia/SkiaNumberFlow.d.ts

@@ -0,0 +1,3 @@
+import type { SkiaNumberFlowProps } from "../core/types";
+export declare const SkiaNumberFlow: ({ value, format, locales, sharedValue, font, color, x, y, width, textAlign, prefix, suffix, opacity, spinTiming, opacityTiming, transformTiming, trend, animated, respectMotionPreference, continuous, digits, scrubDigitWidthPercentile, onAnimationsStart, onAnimationsFinish, mask, }: SkiaNumberFlowProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SkiaNumberFlow.d.ts.map

package/lib/typescript/skia/SkiaNumberFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkiaNumberFlow.d.ts","sourceRoot":"","sources":["../../../src/skia/SkiaNumberFlow.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAA2B,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAsYlF,eAAO,MAAM,cAAc,GAAI,0RA0B5B,mBAAmB,4CAmFrB,CAAC"}

package/lib/typescript/skia/SkiaTimeFlow.d.ts

@@ -0,0 +1,3 @@
+import type { SkiaTimeFlowProps } from "../core/timeTypes";
+export declare const SkiaTimeFlow: ({ hours, minutes, seconds, timestamp, timezoneOffset, sharedValue, is24Hour, padHours, font, color, x, y, width, textAlign, opacity, spinTiming, opacityTiming, transformTiming, trend, animated, respectMotionPreference, continuous, mask, onAnimationsStart, onAnimationsFinish, }: SkiaTimeFlowProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SkiaTimeFlow.d.ts.map

package/lib/typescript/skia/SkiaTimeFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkiaTimeFlow.d.ts","sourceRoot":"","sources":["../../../src/skia/SkiaTimeFlow.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAU3D,eAAO,MAAM,YAAY,GAAI,uRA0B1B,iBAAiB,4CAuNnB,CAAC"}

package/lib/typescript/skia/SymbolSlot.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+import { type SharedValue } from "react-native-reanimated";
+import type { SkiaNumberFlowProps, TimingConfig } from "../core/types";
+interface SymbolSlotProps {
+    char: string;
+    targetX: number;
+    baseY: number;
+    ascent: number;
+    color: string;
+    font: NonNullable<SkiaNumberFlowProps["font"]>;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    entering: boolean;
+    exiting: boolean;
+    exitKey?: string;
+    onExitComplete?: (key: string) => void;
+    workletLayout?: SharedValue<{
+        x: number;
+        width: number;
+    }[]>;
+    slotIndex?: number;
+    superscript?: boolean;
+}
+export declare const SymbolSlot: React.MemoExoticComponent<({ char, targetX, baseY, ascent, color, font, opacityTiming, transformTiming, entering, exiting, exitKey, onExitComplete, workletLayout, slotIndex, superscript, }: SymbolSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=SymbolSlot.d.ts.map

package/lib/typescript/skia/SymbolSlot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SymbolSlot.d.ts","sourceRoot":"","sources":["../../../src/skia/SymbolSlot.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAGL,KAAK,WAAW,EAIjB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAOvE,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,WAAW,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/C,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,CAAC,EAAE,WAAW,CAAC;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC,CAAC;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,UAAU,gMAiBlB,eAAe,6CAgEnB,CAAC"}

package/lib/typescript/skia/index.d.ts

@@ -0,0 +1,6 @@
+export { SkiaNumberFlow } from "./SkiaNumberFlow";
+export { SkiaTimeFlow } from "./SkiaTimeFlow";
+export { useSkiaFont } from "./useSkiaFont";
+export type { SkiaNumberFlowProps } from "../core/types";
+export type { SkiaTimeFlowProps } from "../core/timeTypes";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/skia/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/skia/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AACzD,YAAY,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC"}

package/lib/typescript/skia/renderSlots.d.ts

@@ -0,0 +1,40 @@
+import type { SkFont } from "@shopify/react-native-skia";
+import type { SharedValue } from "react-native-reanimated";
+import type { CharLayout } from "../core/layout";
+import type { GlyphMetrics, TimingConfig, Trend } from "../core/types";
+interface RenderSlotsParams {
+    layout: CharLayout[];
+    exitingEntries: Map<string, CharLayout>;
+    prevMap: Map<string, CharLayout>;
+    isInitialRender: boolean;
+    onExitComplete: (key: string) => void;
+    metrics: GlyphMetrics;
+    font: SkFont;
+    color: string;
+    baseY: number;
+    resolvedTrend: Trend;
+    spinTiming: TimingConfig;
+    opacityTiming: TimingConfig;
+    transformTiming: TimingConfig;
+    spinGenerations: Map<string, number> | undefined;
+    digitCountResolver: (key: string) => number;
+    maskTop: number;
+    maskBottom: number;
+    digitStrings?: string[];
+    workletDigitValues?: SharedValue<number>[] | null;
+    workletLayout?: SharedValue<{
+        x: number;
+        width: number;
+    }[]>;
+}
+/**
+ * Renders the active and exiting digit/symbol slot tree for Skia.
+ *
+ * Shared between SkiaNumberFlow and SkiaTimeFlow. Behavioral differences:
+ * - `digitCountResolver`: NumberFlow uses getDigitCount, TimeFlow uses TIME_DIGIT_COUNTS
+ * - `digitStrings`: NumberFlow passes locale-specific digits, TimeFlow omits (Latin fallback)
+ * - `workletLayout`: NumberFlow passes for scrubbing positioning, TimeFlow omits
+ */
+export declare function renderSlots({ layout, exitingEntries, prevMap, isInitialRender, onExitComplete, metrics, font, color, baseY, resolvedTrend, spinTiming, opacityTiming, transformTiming, spinGenerations, digitCountResolver, maskTop, maskBottom, digitStrings, workletDigitValues, workletLayout, }: RenderSlotsParams): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=renderSlots.d.ts.map

package/lib/typescript/skia/renderSlots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderSlots.d.ts","sourceRoot":"","sources":["../../../src/skia/renderSlots.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAIvE,UAAU,iBAAiB;IACzB,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACxC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACjC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,YAAY,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,KAAK,CAAC;IACrB,UAAU,EAAE,YAAY,CAAC;IACzB,aAAa,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,YAAY,CAAC;IAC9B,eAAe,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,kBAAkB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,kBAAkB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EAAE,GAAG,IAAI,CAAC;IAClD,aAAa,CAAC,EAAE,WAAW,CAAC;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC,CAAC;CAC7D;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,cAAc,EACd,OAAO,EACP,eAAe,EACf,cAAc,EACd,OAAO,EACP,IAAI,EACJ,KAAK,EACL,KAAK,EACL,aAAa,EACb,UAAU,EACV,aAAa,EACb,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,OAAO,EACP,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,aAAa,GACd,EAAE,iBAAiB,2CAwHnB"}

package/lib/typescript/skia/useGlyphMetrics.d.ts

@@ -0,0 +1,16 @@
+import type { SkFont } from "@shopify/react-native-skia";
+import type { GlyphMetrics } from "../core/types";
+/**
+ * Pre-computes glyph width lookup table and line metrics from an SkFont.
+ * Runs once on font load. All measurements use advance widths (not bounding boxes)
+ * for correct text layout spacing.
+ *
+ * Digit slots use `maxDigitWidth` (the widest of 0-9) for the clip window
+ * so all 10 digit glyphs fit during rolling. Individual digit positions
+ * within the clip use proportional charWidths for natural spacing.
+ *
+ * @param font - The SkFont to measure
+ * @param additionalChars - Optional additional characters to measure (e.g., from prefix/suffix with diacritics)
+ */
+export declare function useGlyphMetrics(font: SkFont | null, additionalChars?: string, localeDigitStrings?: string[]): GlyphMetrics | null;
+//# sourceMappingURL=useGlyphMetrics.d.ts.map

package/lib/typescript/skia/useGlyphMetrics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGlyphMetrics.d.ts","sourceRoot":"","sources":["../../../src/skia/useGlyphMetrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAGzD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAElD;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAC7B,IAAI,EAAE,MAAM,GAAG,IAAI,EACnB,eAAe,CAAC,EAAE,MAAM,EACxB,kBAAkB,CAAC,EAAE,MAAM,EAAE,GAC5B,YAAY,GAAG,IAAI,CAyDrB"}

package/lib/typescript/skia/useScrubbing.d.ts

@@ -0,0 +1,59 @@
+import { type SharedValue } from "react-native-reanimated";
+import { type CharLayout } from "../core/layout";
+import type { GlyphMetrics, TextAlign } from "../core/types";
+interface UseScrubbingBridgeParams {
+    sharedValue: SharedValue<string> | undefined;
+    value: number | undefined;
+    prefix: string;
+    suffix: string;
+    zeroCodePoint: number;
+}
+interface UseScrubbingBridgeResult {
+    effectiveValue: number | undefined;
+}
+/**
+ * Digit-count bridging for worklet-driven scrubbing.
+ *
+ * When the worklet-driven sharedValue crosses a digit boundary (e.g.
+ * 99.9 → 100.0), the React-side layout must re-render with the correct
+ * number of digit slots. This hook watches the worklet's digit count and
+ * schedules a JS-side state update when it changes.
+ *
+ * Must be called **before** `useNumberFormatting` so the returned
+ * `effectiveValue` can feed into the formatter.
+ */
+export declare function useScrubbingBridge({ sharedValue, value, prefix, suffix, zeroCodePoint, }: UseScrubbingBridgeParams): UseScrubbingBridgeResult;
+interface UseScrubbingLayoutParams {
+    sharedValue: SharedValue<string> | undefined;
+    prefix: string;
+    suffix: string;
+    zeroCodePoint: number;
+    metrics: GlyphMetrics | null;
+    digitStringsArr: string[];
+    scrubDigitWidthPercentile: number;
+    layout: CharLayout[];
+    layoutDigitCount: number;
+    width: number;
+    textAlign: TextAlign;
+}
+interface UseScrubbingLayoutResult {
+    workletDigitValues: SharedValue<number>[] | null;
+    workletLayout: SharedValue<{
+        x: number;
+        width: number;
+    }[]>;
+}
+/**
+ * Worklet-driven layout and digit extraction for scrubbing mode.
+ *
+ * Encapsulates:
+ * - `useWorkletFormatting`: per-digit SharedValues from the sharedValue string
+ * - Tabular digit widths: fixed-width digits during scrubbing to prevent jitter
+ * - `useDebouncedWidths`: animated transition between tabular and proportional
+ * - `workletLayout`: UI-thread-computed per-slot x/width using debounced widths
+ *
+ * Must be called **after** the layout is computed from `computeKeyedLayout`.
+ */
+export declare function useScrubbingLayout({ sharedValue, prefix, suffix, zeroCodePoint, metrics, digitStringsArr, scrubDigitWidthPercentile, layout, layoutDigitCount, width, textAlign, }: UseScrubbingLayoutParams): UseScrubbingLayoutResult;
+export {};
+//# sourceMappingURL=useScrubbing.d.ts.map

package/lib/typescript/skia/useScrubbing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrubbing.d.ts","sourceRoot":"","sources":["../../../src/skia/useScrubbing.ts"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,WAAW,EAGjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAoB,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACnE,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAS7D,UAAU,wBAAwB;IAChC,WAAW,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IAC7C,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,wBAAwB;IAChC,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,WAAW,EACX,KAAK,EACL,MAAM,EACN,MAAM,EACN,aAAa,GACd,EAAE,wBAAwB,GAAG,wBAAwB,CA2CrD;AAMD,UAAU,wBAAwB;IAChC,WAAW,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IAC7C,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,YAAY,GAAG,IAAI,CAAC;IAC7B,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,yBAAyB,EAAE,MAAM,CAAC;IAClC,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,UAAU,wBAAwB;IAChC,kBAAkB,EAAE,WAAW,CAAC,MAAM,CAAC,EAAE,GAAG,IAAI,CAAC;IACjD,aAAa,EAAE,WAAW,CAAC;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC,CAAC;CAC5D;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,WAAW,EACX,MAAM,EACN,MAAM,EACN,aAAa,EACb,OAAO,EACP,eAAe,EACf,yBAAyB,EACzB,MAAM,EACN,gBAAgB,EAChB,KAAK,EACL,SAAS,GACV,EAAE,wBAAwB,GAAG,wBAAwB,CAoFrD"}

package/lib/typescript/skia/useSkiaFont.d.ts

@@ -0,0 +1,13 @@
+import type { DataSourceParam, SkFont } from "@shopify/react-native-skia";
+/**
+ * Loads a custom Skia font asynchronously while providing a synchronous
+ * system-font fallback via `matchFont`. This guarantees a non-null `SkFont`
+ * from the very first render, so components can run the full animated pipeline
+ * immediately instead of showing a blank canvas or static placeholder.
+ *
+ * Once the custom font finishes loading, the returned value swaps to the
+ * custom font — triggering a smooth animated transition in SkiaNumberFlow /
+ * SkiaTimeFlow (the value re-renders with new glyph metrics).
+ */
+export declare function useSkiaFont(source: DataSourceParam, size: number, onError?: (err: Error) => void): SkFont;
+//# sourceMappingURL=useSkiaFont.d.ts.map

package/lib/typescript/skia/useSkiaFont.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSkiaFont.d.ts","sourceRoot":"","sources":["../../../src/skia/useSkiaFont.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAG1E;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CACzB,MAAM,EAAE,eAAe,EACvB,IAAI,EAAE,MAAM,EACZ,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,GAC7B,MAAM,CAMR"}

package/package.json

@@ -0,0 +1,104 @@
+{
+  "name": "number-flow-react-native",
+  "version": "0.1.0",
+  "description": "Animated number transitions for React Native — View-based and Skia renderers",
+  "source": "./src/index.ts",
+  "main": "./lib/module/index.js",
+  "module": "./lib/module/index.js",
+  "react-native": "./src/index.ts",
+  "types": "./lib/typescript/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.ts",
+      "react-native": "./src/index.ts",
+      "types": "./lib/typescript/index.d.ts",
+      "default": "./lib/module/index.js"
+    },
+    "./skia": {
+      "source": "./src/skia/index.ts",
+      "react-native": "./src/skia/index.ts",
+      "types": "./lib/typescript/skia/index.d.ts",
+      "default": "./lib/module/skia/index.js"
+    },
+    "./native": {
+      "source": "./src/native/index.ts",
+      "react-native": "./src/native/index.ts",
+      "types": "./lib/typescript/native/index.d.ts",
+      "default": "./lib/module/native/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "src",
+    "lib"
+  ],
+  "sideEffects": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Rednegniw/number-flow-react-native.git",
+    "directory": "packages/number-flow-react-native"
+  },
+  "keywords": [
+    "react-native",
+    "animation",
+    "number",
+    "animated-numbers",
+    "reanimated",
+    "skia",
+    "number-flow",
+    "digit-animation"
+  ],
+  "author": "Antonin Wingender",
+  "license": "MIT",
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "prepare": "bob build",
+    "prepublishOnly": "tsc --noEmit && jest",
+    "check-types": "tsc --noEmit",
+    "test": "jest",
+    "lint": "biome check .",
+    "lint:fix": "biome check --write ."
+  },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-native": ">=0.73",
+    "react-native-reanimated": ">=3.0.0",
+    "@shopify/react-native-skia": ">=2.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@shopify/react-native-skia": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@rednegniw/masked-view": "^0.4.0"
+  },
+  "devDependencies": {
+    "@types/jest": "^30.0.0",
+    "@types/react": "~19.1.0",
+    "jest": "^30.0.0",
+    "react-native-builder-bob": "^0.40.18",
+    "ts-jest": "^29.4.6",
+    "typescript": "~5.9.2"
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  }
+}

package/src/core/constants.ts

@@ -0,0 +1,20 @@
+export const MAX_SLOTS = 20;
+
+export const DIGIT_COUNT = 10;
+
+// Fallback character set for glyph measurement when the actual format characters are unknown
+export const MEASURABLE_CHARS =
+  "0123456789.,%+-$/:! €£¥₩abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ~°";
+
+/**
+ * Horizontal mask fade width as a ratio of lineHeight.
+ * Matches web NumberFlow's --number-flow-mask-width: 0.5em
+ */
+export const MASK_WIDTH_RATIO = 0.5;
+
+/**
+ * Superscript exponent rendering scale derived from OpenType font metrics.
+ * Inter font OS/2 table: ySuperscriptYSize = 1229/2048 ≈ 0.60.
+ * Consistent with TeX (\defaultscriptratio=0.7) and general typography convention (60-70%).
+ */
+export const SUPERSCRIPT_SCALE = 0.6;