@xaui/native 0.9.1-alpha.91 → 0.9.1-alpha.92

package/dist/components/pager/pager.type.d.cts

@@ -0,0 +1,108 @@
+import type { ReactNode } from 'react';
+import type { ScrollViewProps, StyleProp, ViewProps, ViewStyle } from 'react-native';
+import type Animated from 'react-native-reanimated';
+import type { AnimatedRef, SharedValue } from 'react-native-reanimated';
+import type { ViewStyleProps } from '../../system/style-props';
+import type { Size } from '../../theme/theme.type';
+export type PagerSlot = 'root' | 'content' | 'page' | 'indicator' | 'dot' | 'dotActive';
+/**
+ * Which way the pages travel. `horizontal` is the onboarding flow and the gallery;
+ * `vertical` is the full-screen feed.
+ *
+ * It is the axis rather than a direction, so it needs no RTL branch: a horizontal pager
+ * mirrors with its scroll view, which is React Native's own behaviour.
+ */
+export type PagerOrientation = 'horizontal' | 'vertical';
+/**
+ * Three, and none of them an intent — a pager reports nothing, it is a way of arranging
+ * what does. They name **which colour the current dot takes**, because the dots are the
+ * only thing this component paints:
+ *
+ * - `primary` — the accent. The onboarding flow's answer.
+ * - `secondary` — the neutral foreground, for a pager on a plain page.
+ * - `tertiary` — the raised surface, which on a light theme is white: the pager over a
+ *   photograph, where an accent dot disappears into whatever is behind it.
+ *
+ * `ghost` is absent rather than forgotten. A dot with no fill is not a dot, which is the
+ * reason `InputOTP` has no `ghost` either — a box that is not a box is not a box.
+ */
+export type PagerVariant = 'primary' | 'secondary' | 'tertiary';
+export type PagerSize = Size;
+type PagerOwnProps = {
+    variant?: PagerVariant;
+    /** The dots' diameter and the gap between them. Never a page's size. */
+    size?: PagerSize;
+    /** A raw value (R7) for the current dot. The pages are yours and it never reaches them. */
+    color?: string;
+    /** @default 'horizontal' */
+    orientation?: PagerOrientation;
+    /** Which page is shown. Present means controlled. */
+    index?: number;
+    /** Where it starts when uncontrolled. */
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    /** Locks the swipe and the dots. */
+    isDisabled?: boolean;
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/** R14 — the pager's own props, `View`'s, and every `ViewStyle` key neither claims. */
+export type PagerProps = PagerOwnProps & Omit<ViewProps, keyof PagerOwnProps | 'style'> & Omit<ViewStyleProps, keyof PagerOwnProps>;
+/** `ScrollView`'s own props win over the `ViewStyle` keys of the same name (R14). */
+export type PagerContentProps = Omit<ScrollViewProps, 'style' | 'children'> & Omit<ViewStyleProps, keyof ScrollViewProps> & {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/** `View`'s own props win over the `ViewStyle` keys of the same name (R14). */
+export type PagerViewSlotProps = Omit<ViewProps, 'style'> & Omit<ViewStyleProps, keyof ViewProps> & {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+export type PagerDotProps = PagerViewSlotProps & {
+    /** Which page this dot stands for. */
+    index: number;
+};
+/** The two colours a dot travels between, read as values because a worklet interpolates them. */
+export type PagerDotInk = {
+    rest: string;
+    active: string;
+};
+/** How big the track measured — a page is exactly this, on both axes. */
+export type PagerTrackSize = {
+    width: number;
+    height: number;
+};
+/** R5 — resolved styles and measured numbers, never a token for a slot to resolve again. */
+export type PagerContextValue = {
+    contentStyle: StyleProp<ViewStyle>;
+    pageStyle: StyleProp<ViewStyle>;
+    indicatorStyle: StyleProp<ViewStyle>;
+    dotStyle: StyleProp<ViewStyle>;
+    dotInk: PagerDotInk;
+    orientation: PagerOrientation;
+    /** The settled page. */
+    index: number;
+    /** How many pages the track was given, counted by the track itself. */
+    count: number;
+    setCount: (count: number) => void;
+    /**
+     * The track's own size, measured — **the track's, not the root's**. The indicator sits in
+     * the flow under the pages, so the root is taller than the box a page has to fill, and a
+     * page sized to the root would overflow it by exactly the dots.
+     *
+     * Zero until it has laid out, which is why the track draws nothing before then.
+     */
+    track: PagerTrackSize;
+    setTrack: (size: PagerTrackSize) => void;
+    /** How far one page travels — the track's size on the paging axis. */
+    step: number;
+    /** Where the track is, live, on the UI thread. */
+    offset: SharedValue<number>;
+    /** Moves the track and lets its own settle report back. */
+    goTo: (index: number) => void;
+    /** What the track calls when it crosses onto another page. */
+    onSettle: (index: number) => void;
+    trackRef: AnimatedRef<Animated.ScrollView>;
+    isDisabled: boolean;
+};
+export {};

package/dist/components/pager/pager.type.d.ts

@@ -0,0 +1,108 @@
+import type { ReactNode } from 'react';
+import type { ScrollViewProps, StyleProp, ViewProps, ViewStyle } from 'react-native';
+import type Animated from 'react-native-reanimated';
+import type { AnimatedRef, SharedValue } from 'react-native-reanimated';
+import type { ViewStyleProps } from '../../system/style-props';
+import type { Size } from '../../theme/theme.type';
+export type PagerSlot = 'root' | 'content' | 'page' | 'indicator' | 'dot' | 'dotActive';
+/**
+ * Which way the pages travel. `horizontal` is the onboarding flow and the gallery;
+ * `vertical` is the full-screen feed.
+ *
+ * It is the axis rather than a direction, so it needs no RTL branch: a horizontal pager
+ * mirrors with its scroll view, which is React Native's own behaviour.
+ */
+export type PagerOrientation = 'horizontal' | 'vertical';
+/**
+ * Three, and none of them an intent — a pager reports nothing, it is a way of arranging
+ * what does. They name **which colour the current dot takes**, because the dots are the
+ * only thing this component paints:
+ *
+ * - `primary` — the accent. The onboarding flow's answer.
+ * - `secondary` — the neutral foreground, for a pager on a plain page.
+ * - `tertiary` — the raised surface, which on a light theme is white: the pager over a
+ *   photograph, where an accent dot disappears into whatever is behind it.
+ *
+ * `ghost` is absent rather than forgotten. A dot with no fill is not a dot, which is the
+ * reason `InputOTP` has no `ghost` either — a box that is not a box is not a box.
+ */
+export type PagerVariant = 'primary' | 'secondary' | 'tertiary';
+export type PagerSize = Size;
+type PagerOwnProps = {
+    variant?: PagerVariant;
+    /** The dots' diameter and the gap between them. Never a page's size. */
+    size?: PagerSize;
+    /** A raw value (R7) for the current dot. The pages are yours and it never reaches them. */
+    color?: string;
+    /** @default 'horizontal' */
+    orientation?: PagerOrientation;
+    /** Which page is shown. Present means controlled. */
+    index?: number;
+    /** Where it starts when uncontrolled. */
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    /** Locks the swipe and the dots. */
+    isDisabled?: boolean;
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/** R14 — the pager's own props, `View`'s, and every `ViewStyle` key neither claims. */
+export type PagerProps = PagerOwnProps & Omit<ViewProps, keyof PagerOwnProps | 'style'> & Omit<ViewStyleProps, keyof PagerOwnProps>;
+/** `ScrollView`'s own props win over the `ViewStyle` keys of the same name (R14). */
+export type PagerContentProps = Omit<ScrollViewProps, 'style' | 'children'> & Omit<ViewStyleProps, keyof ScrollViewProps> & {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/** `View`'s own props win over the `ViewStyle` keys of the same name (R14). */
+export type PagerViewSlotProps = Omit<ViewProps, 'style'> & Omit<ViewStyleProps, keyof ViewProps> & {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+export type PagerDotProps = PagerViewSlotProps & {
+    /** Which page this dot stands for. */
+    index: number;
+};
+/** The two colours a dot travels between, read as values because a worklet interpolates them. */
+export type PagerDotInk = {
+    rest: string;
+    active: string;
+};
+/** How big the track measured — a page is exactly this, on both axes. */
+export type PagerTrackSize = {
+    width: number;
+    height: number;
+};
+/** R5 — resolved styles and measured numbers, never a token for a slot to resolve again. */
+export type PagerContextValue = {
+    contentStyle: StyleProp<ViewStyle>;
+    pageStyle: StyleProp<ViewStyle>;
+    indicatorStyle: StyleProp<ViewStyle>;
+    dotStyle: StyleProp<ViewStyle>;
+    dotInk: PagerDotInk;
+    orientation: PagerOrientation;
+    /** The settled page. */
+    index: number;
+    /** How many pages the track was given, counted by the track itself. */
+    count: number;
+    setCount: (count: number) => void;
+    /**
+     * The track's own size, measured — **the track's, not the root's**. The indicator sits in
+     * the flow under the pages, so the root is taller than the box a page has to fill, and a
+     * page sized to the root would overflow it by exactly the dots.
+     *
+     * Zero until it has laid out, which is why the track draws nothing before then.
+     */
+    track: PagerTrackSize;
+    setTrack: (size: PagerTrackSize) => void;
+    /** How far one page travels — the track's size on the paging axis. */
+    step: number;
+    /** Where the track is, live, on the UI thread. */
+    offset: SharedValue<number>;
+    /** Moves the track and lets its own settle report back. */
+    goTo: (index: number) => void;
+    /** What the track calls when it crosses onto another page. */
+    onSettle: (index: number) => void;
+    trackRef: AnimatedRef<Animated.ScrollView>;
+    isDisabled: boolean;
+};
+export {};

package/dist/components/rating/index.cjs

@@ -0,0 +1,30 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+
+
+
+var _chunkXWIPLZTDcjs = require('../../chunk-XWIPLZTD.cjs');
+require('../../chunk-7EIHHOHP.cjs');
+require('../../chunk-OW4N2C3M.cjs');
+require('../../chunk-7DPL3ZDS.cjs');
+require('../../chunk-GSZDN6EZ.cjs');
+require('../../chunk-FHNIGHN5.cjs');
+require('../../chunk-SL3V7R2Y.cjs');
+require('../../chunk-TVJXC4HY.cjs');
+require('../../chunk-CDRGTUYF.cjs');
+require('../../chunk-H4E4HDEP.cjs');
+require('../../chunk-EJQCQPET.cjs');
+require('../../chunk-IIAQISBG.cjs');
+require('../../chunk-TK44VBIE.cjs');
+
+
+
+
+
+
+
+
+exports.Rating = _chunkXWIPLZTDcjs.Rating; exports.RatingIcon = _chunkXWIPLZTDcjs.RatingIcon; exports.RatingItem = _chunkXWIPLZTDcjs.RatingItem; exports.RatingRoot = _chunkXWIPLZTDcjs.RatingRoot; exports.ratingRecipe = _chunkXWIPLZTDcjs.ratingRecipe; exports.useRating = _chunkXWIPLZTDcjs.useRating; exports.useRatingLayer = _chunkXWIPLZTDcjs.useRatingLayer;

package/dist/components/rating/index.d.cts

@@ -0,0 +1,41 @@
+import { RatingIcon } from './rating-icon';
+export declare const Rating: import("react").ForwardRefExoticComponent<{
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Item: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        index: number;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Icon: typeof RatingIcon;
+};
+export { RatingRoot } from './rating';
+export { RatingIcon } from './rating-icon';
+export { RatingItem } from './rating-item';
+export { useRating, useRatingLayer } from './rating.context';
+export { ratingRecipe } from './rating.recipe';
+export type { RatingContextValue, RatingIconProps, RatingItemProps, RatingLayerContextValue, RatingProps, RatingSize, RatingSlot, RatingTone, RatingVariant, } from './rating.type';

package/dist/components/rating/index.d.ts

@@ -0,0 +1,41 @@
+import { RatingIcon } from './rating-icon';
+export declare const Rating: import("react").ForwardRefExoticComponent<{
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Item: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        index: number;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Icon: typeof RatingIcon;
+};
+export { RatingRoot } from './rating';
+export { RatingIcon } from './rating-icon';
+export { RatingItem } from './rating-item';
+export { useRating, useRatingLayer } from './rating.context';
+export { ratingRecipe } from './rating.recipe';
+export type { RatingContextValue, RatingIconProps, RatingItemProps, RatingLayerContextValue, RatingProps, RatingSize, RatingSlot, RatingTone, RatingVariant, } from './rating.type';

package/dist/components/rating/index.js

@@ -0,0 +1,30 @@
+import {
+  Rating,
+  RatingIcon,
+  RatingItem,
+  RatingRoot,
+  ratingRecipe,
+  useRating,
+  useRatingLayer
+} from "../../chunk-7NQL5DXY.js";
+import "../../chunk-F6W3JQ7K.js";
+import "../../chunk-2AFA5HA2.js";
+import "../../chunk-423RQBOX.js";
+import "../../chunk-JN6IRT2M.js";
+import "../../chunk-WFZDAXDI.js";
+import "../../chunk-DKVXTMIJ.js";
+import "../../chunk-3Q42X6EQ.js";
+import "../../chunk-TTZOIXKE.js";
+import "../../chunk-36PRYGAM.js";
+import "../../chunk-EGLLDKN6.js";
+import "../../chunk-Z6JBWRPL.js";
+import "../../chunk-M63GFNKV.js";
+export {
+  Rating,
+  RatingIcon,
+  RatingItem,
+  RatingRoot,
+  ratingRecipe,
+  useRating,
+  useRatingLayer
+};

package/dist/components/rating/rating-icon.d.cts

@@ -0,0 +1,16 @@
+import type { RatingIconProps } from './rating.type';
+/**
+ * The mark, as a glyph of your own — a heart, a flame, a paw.
+ *
+ * Written **once** and drawn twice, because a mark is the same glyph in two layers: the
+ * neutral ground, and the filled colour clipped to the fraction given. Which of the two this
+ * instance is in comes from the layer rather than from a prop, so the caller never has to
+ * keep two copies in step.
+ *
+ * An explicit `color` wins, as it does everywhere `Icon` appears — which is also how a
+ * caller opts out of the two-layer colouring entirely.
+ */
+export declare function RatingIcon({ size, color, ...rest }: RatingIconProps): import("react").JSX.Element;
+export declare namespace RatingIcon {
+    var displayName: string;
+}

package/dist/components/rating/rating-icon.d.ts

@@ -0,0 +1,16 @@
+import type { RatingIconProps } from './rating.type';
+/**
+ * The mark, as a glyph of your own — a heart, a flame, a paw.
+ *
+ * Written **once** and drawn twice, because a mark is the same glyph in two layers: the
+ * neutral ground, and the filled colour clipped to the fraction given. Which of the two this
+ * instance is in comes from the layer rather than from a prop, so the caller never has to
+ * keep two copies in step.
+ *
+ * An explicit `color` wins, as it does everywhere `Icon` appears — which is also how a
+ * caller opts out of the two-layer colouring entirely.
+ */
+export declare function RatingIcon({ size, color, ...rest }: RatingIconProps): import("react").JSX.Element;
+export declare namespace RatingIcon {
+    var displayName: string;
+}

package/dist/components/rating/rating-item.d.cts

@@ -0,0 +1,23 @@
+import { View } from 'react-native';
+/**
+ * One mark.
+ *
+ * **It is the same glyph twice.** The neutral one sits in the flow and decides how wide the
+ * mark is; the filled one is pinned over it inside a clip whose width is the fraction given,
+ * so a value of 4.3 shows three tenths of the fifth mark. That fraction is what lets one
+ * component be both an input and a display of an average — a boolean per mark would have to
+ * round 4.3 to 4 and lose the thing the average was for.
+ *
+ * **The press reads where it landed.** `locationX` over the mark's width is the fraction the
+ * finger meant, and `snapValue` rounds it up to the nearest `precision` step: a tap anywhere
+ * in the first mark is one star rather than zero, and with `precision={0.5}` the left half of
+ * the third is 2.5 while the right half is 3.
+ *
+ * A mark owns its own press state, which is why the root publishes resolved styles and not
+ * the recipe (R5).
+ */
+export declare const RatingItem: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    index: number;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/rating/rating-item.d.ts

@@ -0,0 +1,23 @@
+import { View } from 'react-native';
+/**
+ * One mark.
+ *
+ * **It is the same glyph twice.** The neutral one sits in the flow and decides how wide the
+ * mark is; the filled one is pinned over it inside a clip whose width is the fraction given,
+ * so a value of 4.3 shows three tenths of the fifth mark. That fraction is what lets one
+ * component be both an input and a display of an average — a boolean per mark would have to
+ * round 4.3 to 4 and lose the thing the average was for.
+ *
+ * **The press reads where it landed.** `locationX` over the mark's width is the fraction the
+ * finger meant, and `snapValue` rounds it up to the nearest `precision` step: a tap anywhere
+ * in the first mark is one star rather than zero, and with `precision={0.5}` the left half of
+ * the third is 2.5 while the right half is 3.
+ *
+ * A mark owns its own press state, which is why the root publishes resolved styles and not
+ * the recipe (R5).
+ */
+export declare const RatingItem: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    index: number;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/rating/rating-star.d.cts

@@ -0,0 +1,19 @@
+/**
+ * The mark a `Rating` draws when the caller composes nothing.
+ *
+ * **`★` in both layers**, one in the neutral ground and one in the filled colour — never a
+ * hollow `☆` under a solid one. Two reasons, and the second is the load-bearing one: a solid
+ * pair is what every store's rating looks like, and `☆` (U+2606) is not in Android's system
+ * face, so the empty half of the row would render as a box on the platform where most of it
+ * is read. `★` (U+2605) is present on both.
+ *
+ * A character rather than an SVG, so the component needs no `react-native-svg` for the one
+ * glyph it draws itself. `Rating.Icon` replaces it with anything.
+ *
+ * **Internal** — the two layers are the `Rating.Item`'s arrangement, and a caller reaching
+ * for this directly would be reaching past the thing that positions it.
+ */
+export declare function RatingStar(): import("react").JSX.Element;
+export declare namespace RatingStar {
+    var displayName: string;
+}

package/dist/components/rating/rating-star.d.ts

@@ -0,0 +1,19 @@
+/**
+ * The mark a `Rating` draws when the caller composes nothing.
+ *
+ * **`★` in both layers**, one in the neutral ground and one in the filled colour — never a
+ * hollow `☆` under a solid one. Two reasons, and the second is the load-bearing one: a solid
+ * pair is what every store's rating looks like, and `☆` (U+2606) is not in Android's system
+ * face, so the empty half of the row would render as a box on the platform where most of it
+ * is read. `★` (U+2605) is present on both.
+ *
+ * A character rather than an SVG, so the component needs no `react-native-svg` for the one
+ * glyph it draws itself. `Rating.Icon` replaces it with anything.
+ *
+ * **Internal** — the two layers are the `Rating.Item`'s arrangement, and a caller reaching
+ * for this directly would be reaching past the thing that positions it.
+ */
+export declare function RatingStar(): import("react").JSX.Element;
+export declare namespace RatingStar {
+    var displayName: string;
+}

package/dist/components/rating/rating.context.d.cts

@@ -0,0 +1,16 @@
+import type { RatingContextValue, RatingLayerContextValue } from './rating.type';
+/**
+ * R10 — `useRating` is exported so a control beside the row can read or set the value, and
+ * so a caller can write their own mark against the same `select` the built-in ones call.
+ * Outside a `<Rating>` it throws by name.
+ */
+export declare const RatingProvider: import("react").Provider<RatingContextValue | null>, useRating: () => RatingContextValue;
+/**
+ * Which of a mark's two layers a glyph is drawn in.
+ *
+ * It exists so `Rating.Icon` needs no prop to know its colour: a mark is the same glyph
+ * twice, once in the neutral ground and once in the filled colour clipped to the fraction
+ * given, and the caller writes that glyph **once**. A `tone` prop would have made them write
+ * it twice and keep the two in step.
+ */
+export declare const RatingLayerProvider: import("react").Provider<RatingLayerContextValue | null>, useRatingLayer: () => RatingLayerContextValue;

package/dist/components/rating/rating.context.d.ts

@@ -0,0 +1,16 @@
+import type { RatingContextValue, RatingLayerContextValue } from './rating.type';
+/**
+ * R10 — `useRating` is exported so a control beside the row can read or set the value, and
+ * so a caller can write their own mark against the same `select` the built-in ones call.
+ * Outside a `<Rating>` it throws by name.
+ */
+export declare const RatingProvider: import("react").Provider<RatingContextValue | null>, useRating: () => RatingContextValue;
+/**
+ * Which of a mark's two layers a glyph is drawn in.
+ *
+ * It exists so `Rating.Icon` needs no prop to know its colour: a mark is the same glyph
+ * twice, once in the neutral ground and once in the filled colour clipped to the fraction
+ * given, and the caller writes that glyph **once**. A `tone` prop would have made them write
+ * it twice and keep the two in step.
+ */
+export declare const RatingLayerProvider: import("react").Provider<RatingLayerContextValue | null>, useRatingLayer: () => RatingLayerContextValue;

package/dist/components/rating/rating.d.cts

@@ -0,0 +1,59 @@
+import { View } from 'react-native';
+/**
+ * A row of marks, given or shown.
+ *
+ * ```tsx
+ * <Rating value={score} onValueChange={setScore} />
+ *
+ * <Rating value={4.3} isReadOnly />
+ *
+ * <Rating value={score} onValueChange={setScore} precision={0.5}>
+ *   <Rating.Icon as={HeartIcon} />
+ * </Rating>
+ * ```
+ *
+ * **One component for the input and the average.** The fill of each mark is a *fraction*,
+ * so 4.3 shows three tenths of the fifth mark — a boolean per mark would have had to round
+ * it, and rounding is exactly what an average must not do. `precision` governs input only.
+ *
+ * **The row is data, not markup.** `max` says how many marks there are, so the root renders
+ * them; five hand-written marks is a row that disagrees with the prop the moment either
+ * changes. `children` is therefore the **glyph**, written once and drawn once per mark.
+ *
+ * **There is no label.** A "4,3 sur 5" beside the row is a `Typography` in a `Row` — the
+ * screen's, not the rating's (R1), and the moment it were a slot it would need an alignment,
+ * a format and a language.
+ *
+ * **There is no `isClearable`**, deliberately. Tapping the mark you already chose to go back
+ * to nothing is a gesture half the world's rating inputs have and half do not, so it is not
+ * a default either way; a caller who wants it holds the value and compares
+ * (`onValueChange={next => setScore(next === score ? 0 : next)}`), which is three words and
+ * says which behaviour they picked.
+ */
+export declare const RatingRoot: import("react").ForwardRefExoticComponent<{
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<View>>;

package/dist/components/rating/rating.d.ts

@@ -0,0 +1,59 @@
+import { View } from 'react-native';
+/**
+ * A row of marks, given or shown.
+ *
+ * ```tsx
+ * <Rating value={score} onValueChange={setScore} />
+ *
+ * <Rating value={4.3} isReadOnly />
+ *
+ * <Rating value={score} onValueChange={setScore} precision={0.5}>
+ *   <Rating.Icon as={HeartIcon} />
+ * </Rating>
+ * ```
+ *
+ * **One component for the input and the average.** The fill of each mark is a *fraction*,
+ * so 4.3 shows three tenths of the fifth mark — a boolean per mark would have had to round
+ * it, and rounding is exactly what an average must not do. `precision` governs input only.
+ *
+ * **The row is data, not markup.** `max` says how many marks there are, so the root renders
+ * them; five hand-written marks is a row that disagrees with the prop the moment either
+ * changes. `children` is therefore the **glyph**, written once and drawn once per mark.
+ *
+ * **There is no label.** A "4,3 sur 5" beside the row is a `Typography` in a `Row` — the
+ * screen's, not the rating's (R1), and the moment it were a slot it would need an alignment,
+ * a format and a language.
+ *
+ * **There is no `isClearable`**, deliberately. Tapping the mark you already chose to go back
+ * to nothing is a gesture half the world's rating inputs have and half do not, so it is not
+ * a default either way; a caller who wants it holds the value and compares
+ * (`onValueChange={next => setScore(next === score ? 0 : next)}`), which is three words and
+ * says which behaviour they picked.
+ */
+export declare const RatingRoot: import("react").ForwardRefExoticComponent<{
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./rating.type").RatingVariant;
+    size?: import("./rating.type").RatingSize;
+    color?: string;
+    max?: number;
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (value: number) => void;
+    precision?: number;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<View>>;

package/dist/components/rating/rating.recipe.d.cts

@@ -0,0 +1,11 @@
+import type { SlotStyles } from '../../system/recipe';
+import type { XAUITheme } from '../../theme/theme.type';
+import type { RatingSlot, RatingVariant } from './rating.type';
+export declare const ratingRecipe: import("../..").Recipe<"root" | "glyph" | "item" | "glyphFill", RatingVariant, {
+    readonly size: {
+        readonly xs: (theme: XAUITheme) => SlotStyles<RatingSlot>;
+        readonly sm: (theme: XAUITheme) => SlotStyles<RatingSlot>;
+        readonly md: (theme: XAUITheme) => SlotStyles<RatingSlot>;
+        readonly lg: (theme: XAUITheme) => SlotStyles<RatingSlot>;
+    };
+}>;