pixelize-native-library 1.0.6

package/lib/typescript/modules/radio-group/RadioGroup.variants.d.ts

@@ -0,0 +1,142 @@
+/**
+ * RadioGroup's style + behaviour resolution — pure, React/lucide-free, same split as Button:
+ *  - STRUCTURE (rowGap, row/ring/dot sizing, border WIDTH) lives in `createThemedVariants` /
+ *    `createVariants` below, registered once per (theme, size) — never rebuilt per render.
+ *  - COLOUR is resolved from the theme's ROLE colours (`resolveRadioGroupColors`), never a raw hex:
+ *    the outer ring is always `border.interactive`, the selected dot is always `accent.solid`.
+ *  - `resolveRadioRowAccessibility` derives the per-row a11y surface purely, so the
+ *    "selected"/"disabled" contract is unit-testable without rendering React Native.
+ */
+import type { RoleColors, Theme } from "../../theme";
+export type RadioGroupSize = "sm" | "md";
+/** Same floor as Button — Apple HIG minimum and WCAG 2.5.5 (AAA). */
+export declare const MIN_TOUCH_TARGET = 44;
+export interface RadioGroupSizeSpec {
+    /** Visual row height in dp. */
+    readonly rowMinHeight: number;
+    /** Outer ring diameter in dp. */
+    readonly ringSize: number;
+    /** Inner selected-dot diameter in dp. */
+    readonly dotSize: number;
+    /** Label size, on the theme's `fontSizes` scale. */
+    readonly fontSize: number;
+    /** Symmetric touch expansion so `rowMinHeight + 2·hitSlop ≥ 44`. */
+    readonly hitSlop: number;
+}
+/**
+ * RadioGroup-specific dimensions. Kept a plain constant — no theme dependency — so the hit-target
+ * test can assert `rowMinHeight + 2·hitSlop ≥ 44` without a provider, same as `BUTTON_SIZES`.
+ */
+export declare const RADIO_GROUP_SIZES: {
+    readonly sm: {
+        readonly rowMinHeight: 36;
+        readonly ringSize: 18;
+        readonly dotSize: 8;
+        readonly fontSize: 14;
+        readonly hitSlop: number;
+    };
+    readonly md: {
+        readonly rowMinHeight: 44;
+        readonly ringSize: 20;
+        readonly dotSize: 10;
+        readonly fontSize: 16;
+        readonly hitSlop: number;
+    };
+};
+export interface RadioGroupColors {
+    /** Outer ring boundary — every row, selected or not (WCAG 1.4.11 ≥ 3:1 on every brand). */
+    readonly ring: string;
+    /** Inner filled dot, rendered only when the row is selected. */
+    readonly dot: string;
+    /** Option label, read on the canvas. */
+    readonly label: string;
+    /** Row background while pressed (never applied when disabled). */
+    readonly pressedRow: string;
+}
+/**
+ * Maps the theme's role colours onto the group's fixed visual roles. There is no per-row tone —
+ * every ring is the same neutral interactive outline, and the selected dot is always the accent —
+ * so, unlike Button, this has no closed union to resolve; it is pure indirection into the roles.
+ */
+export declare function resolveRadioGroupColors(colors: RoleColors): RadioGroupColors;
+export interface RadioRowAccessibilityInput {
+    readonly selected: boolean;
+    readonly disabled: boolean;
+}
+export interface RadioRowAccessibilityProps {
+    readonly accessibilityRole: "radio";
+    readonly accessibilityState: {
+        readonly checked: boolean;
+        readonly disabled: boolean;
+    };
+    /** The `Pressable` disabled prop — blocks touches without relying on `onPress` gating alone. */
+    readonly disabled: boolean;
+}
+/**
+ * Derives one row's accessibility surface purely, mirroring `resolveButtonAccessibility`. Reports
+ * `accessibilityState.checked` — not `.selected` (that key is for role="tab"/"option"; a radio's
+ * checked state is `checked`, same as this repo's Checkbox/Switch) — so the rendered `disabled`
+ * prop and the announced `accessibilityState.disabled` always agree, so a screen reader never
+ * hears a state the touch handling contradicts.
+ */
+export declare function resolveRadioRowAccessibility(input: RadioRowAccessibilityInput): RadioRowAccessibilityProps;
+/** Gap between rows. Structural, theme-scaled, registered once per (theme, size). */
+export declare const radioGroupStructure: import("../../core/style").ThemedVariantResolver<Theme, {
+    size: {
+        sm: {
+            rowGap: 4;
+        };
+        md: {
+            rowGap: 8;
+        };
+    };
+}, import("react-native").ViewStyle>;
+/**
+ * One row's layout — height, gap to the label, inset padding, and the corner radius the pressed
+ * background rounds to. Colour (the pressed fill) is resolved and applied inline over this.
+ */
+export declare const radioRowStructure: import("../../core/style").ThemedVariantResolver<Theme, {
+    size: {
+        sm: {
+            minHeight: 36;
+            columnGap: 8;
+            paddingHorizontal: 8;
+        };
+        md: {
+            minHeight: 44;
+            columnGap: 12;
+            paddingHorizontal: 8;
+        };
+    };
+}, import("react-native").ViewStyle>;
+/** The outer ring. Border WIDTH is theme-scaled; the diameter is the component's own constant. */
+export declare const radioRingStructure: import("../../core/style").ThemedVariantResolver<Theme, {
+    size: {
+        sm: {
+            width: 18;
+            height: 18;
+            borderRadius: number;
+        };
+        md: {
+            width: 20;
+            height: 20;
+            borderRadius: number;
+        };
+    };
+}, import("react-native").ViewStyle>;
+/** The inner selected dot. No theme dependency at all, so it uses the untethemed resolver. */
+export declare const radioDotStructure: import("../../core/style").VariantResolver<{
+    size: {
+        sm: {
+            width: 8;
+            height: 8;
+            borderRadius: number;
+        };
+        md: {
+            width: 10;
+            height: 10;
+            borderRadius: number;
+        };
+    };
+}, import("react-native").ViewStyle>;
+//# sourceMappingURL=RadioGroup.variants.d.ts.map

package/lib/typescript/modules/radio-group/RadioGroup.variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.variants.d.ts","sourceRoot":"","sources":["../../../../src/modules/radio-group/RadioGroup.variants.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGrD,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzC,qEAAqE;AACrE,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAInC,MAAM,WAAW,kBAAkB;IACjC,+BAA+B;IAC/B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,iCAAiC;IACjC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,yCAAyC;IACzC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,oDAAoD;IACpD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;CAGiC,CAAC;AAEhE,MAAM,WAAW,gBAAgB;IAC/B,2FAA2F;IAC3F,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,gEAAgE;IAChE,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,kEAAkE;IAClE,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;CAC7B;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,UAAU,GAAG,gBAAgB,CAU5E;AAED,MAAM,WAAW,0BAA0B;IACzC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,0BAA0B;IACzC,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAC;IACpC,QAAQ,CAAC,kBAAkB,EAAE;QAAE,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC;IACvF,gGAAgG;IAChG,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;GAMG;AACH,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,0BAA0B,GAAG,0BAA0B,CAM1G;AAED,qFAAqF;AACrF,eAAO,MAAM,mBAAmB;;;;;;;;;oCAQ7B,CAAC;AAEJ;;;GAGG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;oCAqB3B,CAAC;AAEJ,kGAAkG;AAClG,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;oCAqB5B,CAAC;AAEJ,8FAA8F;AAC9F,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;oCAgB5B,CAAC"}

package/lib/typescript/modules/radio-group/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Public surface of `pixelize-native-library/radio-group`. Value exports and type exports are split for
+ * `verbatimModuleSyntax`. The visual/behaviour resolvers (`resolveRadioGroupColors`,
+ * `RADIO_GROUP_SIZES`, …) stay internal — a consumer configures a RadioGroup through its props,
+ * never by importing its internals.
+ */
+export { RadioGroup } from "./RadioGroup";
+export type { RadioGroupProps, RadioGroupOption } from "./RadioGroup";
+export type { RadioGroupSize } from "./RadioGroup.variants";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/modules/radio-group/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/modules/radio-group/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEtE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC"}

package/lib/typescript/modules/reorder/Reorder.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Reorder — a drag-to-reorder list built on plain `PanResponder` + `Animated` (Wave 3: no new
+ * dependency). Each row's drag handle is a hand-built three-bar "grip" glyph (no `IconName` in the
+ * closed 22-name set represents a drag handle, and that set is never extended for one component) —
+ * the `PanResponder` lives on the grip ONLY, not the whole row, so the label text never fights the
+ * gesture.
+ *
+ * The list is FULLY CONTROLLED: `items`/`onReorder` are the only source of truth. While a drag is
+ * live, the component tracks purely EPHEMERAL state — which row grabbed the gesture (`startIndex`)
+ * and which slot it is over now (`targetIndex`), both cleared on release — and previews the reorder
+ * by shifting the OTHER rows out of the way with `resolveRowShift` (see `Reorder.variants.ts`); the
+ * underlying `items` array is never mutated mid-drag, only on release, via `onReorder`. Because the
+ * shift preview and the final `moveItem` commit share the exact same splice semantics, the row that
+ * was being dragged lands in the same visual slot its shifted neighbours already vacated — no jump.
+ *
+ * WCAG 2.5.7 (Dragging Movements) requires a non-dragging way to perform the same function: every
+ * row also renders two `Button` icon-only presses ("Move X up" / "Move X down", reusing the shipped
+ * `chevron-up`/`chevron-down` names), disabled at the list's own start/end via
+ * `resolveReorderMoveState`. This is the REQUIRED accessible path, not optional polish — it is a
+ * real `accessibilityRole="button"` each (Button's own contract), fully operable without any touch
+ * gesture, and it shares `moveItem` with the drag path so both always agree.
+ *
+ * The grip itself carries no accessible action of its own — `PanResponder` gestures are invisible to
+ * assistive tech, and exposing it as a fake, non-operable "button" would be misleading — so it is
+ * hidden from the accessibility tree (`accessibilityElementsHidden` + `no-hide-descendants`, the same
+ * pairing `Timeline`'s decorative connector uses), leaving the up/down `Button`s as the one real
+ * accessible affordance for reordering.
+ */
+import type { LayoutStyle } from "../../core/style";
+export interface ReorderItem {
+    readonly id: string;
+    readonly label: string;
+}
+export interface ReorderProps {
+    items: ReorderItem[];
+    onReorder: (next: ReorderItem[]) => void;
+    disabled?: boolean;
+    /** Layout-only, outermost, applied exactly once as the LAST entry in the root style array. */
+    style?: LayoutStyle;
+    testID?: string;
+}
+export declare const Reorder: import("react").NamedExoticComponent<ReorderProps>;
+//# sourceMappingURL=Reorder.d.ts.map

package/lib/typescript/modules/reorder/Reorder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reorder.d.ts","sourceRoot":"","sources":["../../../../src/modules/reorder/Reorder.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAOH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAqBpD,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,SAAS,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8FAA8F;IAC9F,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AASD,eAAO,MAAM,OAAO,oDAyIlB,CAAC"}

package/lib/typescript/modules/reorder/Reorder.variants.d.ts

@@ -0,0 +1,116 @@
+/**
+ * Reorder's style + behaviour resolution — the pure functions the component (and its tests) depend
+ * on, plus the themed structural variant resolvers. Same split as `Button.variants.ts`:
+ *  - STRUCTURE (row height, grip bar size, radius, spacing) lives in the `createThemedVariants`
+ *    resolvers below, registered once per theme identity.
+ *  - COLOUR is resolved from the theme's ROLE colours (`resolveReorderColors`), never a raw ramp.
+ *  - The drag MATH (`resolveDragTargetIndex`, `resolveRowShift`) and the array mutation
+ *    (`moveItem`) are pure and shared by BOTH interaction paths — the live drag gesture and the
+ *    WCAG 2.5.7 accessible up/down alternative — so the two paths are guaranteed to agree.
+ *  - `resolveReorderMoveState` gates that alternative: the first row can't move up, the last can't
+ *    move down, and the whole pair is gated by the list's own `disabled` prop.
+ *
+ * Free of React and of any lucide import, so the WCAG + behaviour tests import it directly (mocking
+ * only `react-native`'s `StyleSheet`, as `core/style` and every sibling module's tests do).
+ */
+import type { RoleColors, Theme } from "../../theme";
+/**
+ * Fixed row height, in dp. A fixed height — rather than per-row `onLayout` measurement — is what
+ * lets the drag math below be a closed-form `dy ÷ rowHeight`, never an async-measured guess (the
+ * build brief's own preference: "a fixed height is simpler and more robust here").
+ */
+export declare const REORDER_ROW_HEIGHT = 56;
+/** The 44dp floor every touch target holds itself to (WCAG 2.5.5 AAA; comfortably clears 2.5.8). */
+export declare const MIN_TOUCH_TARGET = 44;
+/** Grip bar glyph — three of these stacked make the drag-handle affordance. No `IconName` in the
+ *  closed 22-name set represents a drag handle, and that set is never extended for one component
+ *  (per the build brief), so the grip is hand-built from plain themed bars instead. */
+export declare const GRIP_BAR_WIDTH = 20;
+export declare const GRIP_BAR_HEIGHT = 3;
+export declare const GRIP_BAR_GAP = 4;
+/** The grip's visual footprint: three bars plus the two gaps between them. */
+export declare const GRIP_BOX: {
+    readonly width: 20;
+    readonly height: number;
+};
+/** Symmetric touch expansion on both axes so the grip reaches 44dp without growing the glyph —
+ *  same discipline as `Button`'s `hitSlop`, just computed on two axes instead of one. */
+export declare const GRIP_HIT_SLOP: {
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+};
+export interface ReorderColors {
+    /** Resting row fill. */
+    readonly rowBackground: string;
+    /** Fill for the row currently being dragged — a raised surface, paired with `elevation.md`. */
+    readonly draggingRowBackground: string;
+    /** The item label, read on either background above. */
+    readonly label: string;
+    /** The grip glyph — a graphical UI affordance (WCAG 1.4.11), read on either background above. */
+    readonly grip: string;
+    /** Grip glyph when the list is `disabled`. Not contrast-gated: a disabled control is exempt from
+     *  the minimum (same reasoning `Button`'s `dimmed` documents for its own disabled state). */
+    readonly gripDisabled: string;
+}
+/**
+ * Maps Reorder's fixed visual roles onto ROLE colours — never a hardcoded hex. There is no
+ * `tone`/`variant` prop to widen: every row reads identically, so every colour Reorder can show is
+ * one of these role lookups, guaranteed legible in both modes (same reasoning `resolveTimelineColors`
+ * documents for its own tone-less component).
+ */
+export declare function resolveReorderColors(colors: RoleColors): ReorderColors;
+export interface ReorderMoveState {
+    readonly upDisabled: boolean;
+    readonly downDisabled: boolean;
+}
+/**
+ * Gates the accessible up/down alternative (WCAG 2.5.7 — Dragging Movements REQUIRES a non-dragging
+ * way to perform the same function): the first row can't move up, the last can't move down, and the
+ * list's own `disabled` prop gates every row regardless of position.
+ */
+export declare function resolveReorderMoveState(index: number, count: number, disabled: boolean): ReorderMoveState;
+/**
+ * Pure array move: `fromIndex` → `toIndex` (clamped into range). Used by BOTH the drag gesture and
+ * the accessible up/down buttons, so both interaction paths are guaranteed to produce the same
+ * result for the same intent. Out-of-range `fromIndex` returns an unmodified shallow copy.
+ */
+export declare function moveItem<T>(items: readonly T[], fromIndex: number, toIndex: number): T[];
+/**
+ * The REAL on-screen distance between two rows' tops: the row's own height plus the `rowGap` the
+ * list container applies between rows (the same `theme.space[2]` `reorderListStructure` uses below)
+ * — NOT `REORDER_ROW_HEIGHT` alone, which is how tall a row is, not how far apart two rows sit.
+ * `resolveDragTargetIndex`/`resolveRowShift` must be given THIS distance (call with
+ * `theme.space[2]`, never a hardcoded gap), or the target-row flip fires one `rowGap` early and the
+ * preview shift undershoots the vacated slot by `rowGap` per row, compounding on multi-row shifts.
+ */
+export declare function resolveRowPitch(rowGap: number): number;
+/**
+ * The row a drag gesture is over right now, from the accumulated `dy` since the gesture grabbed
+ * `startIndex` — a closed-form step count against the REAL row pitch (see `resolveRowPitch`),
+ * clamped into the list's bounds. Rounds to the nearest row, so a drag must cross half a row's
+ * PITCH to advance a step.
+ */
+export declare function resolveDragTargetIndex(startIndex: number, dy: number, rowPitch: number, itemCount: number): number;
+/**
+ * The vertical offset a NON-dragged row animates to, to open the gap the dragged row is passing
+ * over — `-rowPitch` (slides up) for rows between `startIndex` (exclusive) and `targetIndex`
+ * (inclusive) when the drag is moving down, `+rowPitch` (slides down) for the mirrored case moving
+ * up, `0` otherwise. `rowPitch` must be the REAL on-screen distance between row tops (see
+ * `resolveRowPitch`) — row height alone undershoots by `rowGap` per row. Symmetric with `moveItem`'s
+ * splice semantics: on drop, the dragged row's array position becomes `targetIndex` and every
+ * shifted row's array position is unchanged — only its on-screen slot moved — so this is exactly the
+ * visual preview of what `moveItem` will commit.
+ */
+export declare function resolveRowShift(rowIndex: number, startIndex: number, targetIndex: number, rowPitch: number): number;
+/** The list container: rows are laid out as plain flex children, spaced by `rowGap`. */
+export declare const reorderListStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+/** The whole row: fixed height (see `REORDER_ROW_HEIGHT`), grip/label/buttons spaced by `columnGap`. */
+export declare const reorderRowStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+/** The grip's touch box — no theme dependency (a fixed design constant, same reasoning `BUTTON_SIZES`
+ *  documents for its own plain-constant sizing), so this uses the untethered `createVariants`. */
+export declare const reorderGripStructure: import("../../core/style").VariantResolver<import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+/** One grip bar — pill-shaped via the theme's `radii.full`, so this needs the themed resolver. */
+export declare const reorderGripBarStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+//# sourceMappingURL=Reorder.variants.d.ts.map

package/lib/typescript/modules/reorder/Reorder.variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reorder.variants.d.ts","sourceRoot":"","sources":["../../../../src/modules/reorder/Reorder.variants.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGrD;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,oGAAoG;AACpG,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAInC;;uFAEuF;AACvF,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,YAAY,IAAI,CAAC;AAE9B,8EAA8E;AAC9E,eAAO,MAAM,QAAQ;;;CAGX,CAAC;AAEX;yFACyF;AACzF,eAAO,MAAM,aAAa;;;;;CAKzB,CAAC;AAEF,MAAM,WAAW,aAAa;IAC5B,wBAAwB;IACxB,QAAQ,CAAC,aAAa,EAAE,MAAM,CAAC;IAC/B,+FAA+F;IAC/F,QAAQ,CAAC,qBAAqB,EAAE,MAAM,CAAC;IACvC,uDAAuD;IACvD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,iGAAiG;IACjG,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB;iGAC6F;IAC7F,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;CAC/B;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,UAAU,GAAG,aAAa,CAQtE;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,YAAY,EAAE,OAAO,CAAC;CAChC;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,gBAAgB,CAKzG;AAED;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC,EAAE,CAOxF;AAED;;;;;;;GAOG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEtD;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CACpC,UAAU,EAAE,MAAM,EAClB,EAAE,EAAE,MAAM,EACV,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,MAAM,GAChB,MAAM,CAGR;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,MAAM,GACf,MAAM,CAKR;AAED,wFAAwF;AACxF,eAAO,MAAM,oBAAoB,uKAI9B,CAAC;AAEJ,wGAAwG;AACxG,eAAO,MAAM,mBAAmB,uKAS7B,CAAC;AAEJ;kGACkG;AAClG,eAAO,MAAM,oBAAoB,0JAO/B,CAAC;AAEH,kGAAkG;AAClG,eAAO,MAAM,uBAAuB,uKAMjC,CAAC"}

package/lib/typescript/modules/reorder/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Public surface of `pixelize-native-library/reorder`. Value exports and type exports are split for
+ * `verbatimModuleSyntax`. The drag/shift math (`moveItem`, `resolveDragTargetIndex`, …) and the
+ * colour/structure resolvers stay internal — a consumer configures a Reorder through its props,
+ * never by importing its internals.
+ */
+export { Reorder } from "./Reorder";
+export type { ReorderProps, ReorderItem } from "./Reorder";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/modules/reorder/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/modules/reorder/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC"}

package/lib/typescript/modules/select/Select.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Select — a trigger styled like an Input box (same size/border/focus-ring conventions) that opens
+ * an option list in React Native's OWN `Modal`. Imported directly from `"react-native"` here on
+ * purpose: this module must never depend on the library's own `Modal` COMPONENT (its rendered
+ * output/behaviour) — Select still owns its option list's markup outright.
+ *
+ * The one deliberate exception is the web portal mechanism: `ModalPortalContext`/`renderWebPortal`
+ * are a plain context + a stateless helper with no React-tree footprint of their own (not the
+ * `Modal` component), so Select reads the same ones `Modal.tsx` reads to stay consistent once a
+ * consumer opts in via `ModalPortalProvider` — see `../modal/ModalPortalContext.ts`.
+ */
+import type { LayoutStyle } from "../../core/style";
+import type { SelectSize } from "./Select.variants";
+export interface SelectOption {
+    readonly label: string;
+    readonly value: string;
+}
+export interface SelectProps {
+    options: SelectOption[];
+    value?: string;
+    onValueChange: (value: string) => void;
+    placeholder?: string;
+    label?: string;
+    disabled?: boolean;
+    size?: SelectSize;
+    /** Layout-only, outermost, applied exactly once as the LAST entry in the root style array. */
+    containerStyle?: LayoutStyle;
+    testID?: string;
+}
+export declare const Select: import("react").NamedExoticComponent<SelectProps>;
+//# sourceMappingURL=Select.d.ts.map

package/lib/typescript/modules/select/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/modules/select/Select.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAOH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAgBpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,8FAA8F;IAC9F,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAOD,eAAO,MAAM,MAAM,mDAuJjB,CAAC"}

package/lib/typescript/modules/select/Select.variants.d.ts

@@ -0,0 +1,127 @@
+/**
+ * Select's style + behaviour resolution — mirrors `Button.variants.ts`'s split:
+ *  - STRUCTURE (sizing/spacing off the theme scale) lives in the `createThemedVariants` resolvers
+ *    below — static per (brand, mode), registered once.
+ *  - COLOUR is resolved from the theme's ROLE colours (never a raw ramp, never a hardcoded hex) by
+ *    `resolveSelectTriggerColors` / `resolveSelectRowColors`.
+ *  - ACCESSIBILITY prop derivation is `resolveSelectAccessibility`, kept pure so the "disabled blocks
+ *    opening / expanded tracks the menu" contract is unit-testable without rendering React Native.
+ *
+ * Free of React and of any `Modal`/`Pressable` import, so the WCAG + behaviour tests import it
+ * directly (mocking only `react-native`'s `StyleSheet`, as `core/style` does).
+ */
+import type { RoleColors, Theme } from "../../theme";
+export type SelectSize = "sm" | "md" | "lg";
+/** Same touch-target floor as Button (44dp — Apple HIG minimum, WCAG 2.5.5 AAA). */
+export declare const MIN_TOUCH_TARGET = 44;
+export interface SelectSizeSpec {
+    /** Visual trigger height in dp. */
+    readonly height: number;
+    /** Displayed value / placeholder text size, on the theme's `fontSizes` scale. */
+    readonly fontSize: number;
+    /** Chevron glyph size in dp. */
+    readonly iconSize: number;
+    /** Symmetric touch expansion so `height + 2·hitSlop ≥ 44`. */
+    readonly hitSlop: number;
+}
+export declare const SELECT_SIZES: {
+    readonly sm: {
+        readonly height: 32;
+        readonly fontSize: 14;
+        readonly iconSize: 16;
+        readonly hitSlop: number;
+    };
+    readonly md: {
+        readonly height: 40;
+        readonly fontSize: 16;
+        readonly iconSize: 18;
+        readonly hitSlop: number;
+    };
+    readonly lg: {
+        readonly height: 48;
+        readonly fontSize: 18;
+        readonly iconSize: 20;
+        readonly hitSlop: number;
+    };
+};
+/** Minimum height for an option row — a list item is still an interactive target (WCAG 2.5.8). */
+export declare const SELECT_ROW_MIN_HEIGHT = 44;
+/** The "check" glyph beside the active row. Fixed — independent of the trigger's own `size`. */
+export declare const SELECT_ROW_ICON_SIZE = 18;
+export interface SelectTriggerColors {
+    /** Trigger fill — the same surface an Input's box sits on. */
+    readonly background: string;
+    /** Boundary colour: the neutral interactive outline at rest, `border.focus` while focused/open. */
+    readonly border: string;
+    /** Colour for the selected option's label. */
+    readonly text: string;
+    /** Colour for the placeholder (no value selected yet). */
+    readonly placeholder: string;
+    /** Chevron colour. */
+    readonly icon: string;
+}
+/**
+ * Maps trigger state onto role colours — the reason `size`/no free-form colour prop keeps this
+ * closed. `focused` covers both keyboard/AT focus and the menu being open (visually the same cue).
+ * Disabled is NOT a separate colour branch: like Button, a disabled control is exempt from the
+ * contrast minimum (WCAG 1.4.3) and is signalled by a uniform opacity dim instead.
+ */
+export declare function resolveSelectTriggerColors(colors: RoleColors, focused: boolean): SelectTriggerColors;
+export interface SelectRowColors {
+    /** Row fill — the sheet's own surface. Kept constant across selection: `bg.selected` is not
+     *  proven ≥ 4.5:1 against `fg.default` on every brand (measured: fails on radiant/rosewood
+     *  light), and the role table doesn't derive a text colour guaranteed readable on it. Selection
+     *  is conveyed by the "check" glyph + `accessibilityState.selected`, never by a background tint. */
+    readonly background: string;
+    /** Option label colour. */
+    readonly text: string;
+    /** "check" glyph colour, only rendered when `selected`. Same value as `text`: if the label
+     *  already clears the stricter 4.5:1 text minimum on `background`, it clears the icon's 3:1 too. */
+    readonly icon: string;
+}
+export declare function resolveSelectRowColors(colors: RoleColors): SelectRowColors;
+export interface SelectAccessibilityInput {
+    readonly disabled?: boolean | undefined;
+    readonly open: boolean;
+}
+export interface SelectAccessibilityProps {
+    readonly accessibilityRole: "button";
+    readonly accessibilityState: {
+        readonly disabled: boolean;
+        readonly expanded: boolean;
+    };
+    /** The `Pressable disabled` prop — blocks opening the menu while disabled. */
+    readonly disabled: boolean;
+}
+/**
+ * Derives the trigger's accessibility surface once, purely: `expanded` tracks whether the option
+ * list is showing (WCAG 4.1.2 — a collapsible control must expose its expanded/collapsed state),
+ * and `disabled` blocks the menu from opening at all.
+ */
+export declare function resolveSelectAccessibility(input: SelectAccessibilityInput): SelectAccessibilityProps;
+/**
+ * Structural styles only — layout, height, padding, radius, border WIDTH. No colours (tone-driven,
+ * applied inline over this), so this compiles once per theme identity via the themed resolver.
+ */
+export declare const selectTriggerStructure: import("../../core/style").ThemedVariantResolver<Theme, {
+    size: {
+        sm: {
+            height: 32;
+            paddingHorizontal: 12;
+        };
+        md: {
+            height: 40;
+            paddingHorizontal: 16;
+        };
+        lg: {
+            height: 48;
+            paddingHorizontal: 24;
+        };
+    };
+}, import("react-native").ViewStyle>;
+/** The full-screen overlay the sheet centers in. `box-none` (applied by the component) lets a tap
+ *  on its empty padding fall through to the backdrop press underneath. */
+export declare const selectOverlayStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+export declare const selectSheetStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+export declare const selectRowStructure: import("../../core/style").ThemedVariantResolver<Theme, import("../../core/style").VariantGroups<import("react-native").ViewStyle>, import("react-native").ViewStyle>;
+//# sourceMappingURL=Select.variants.d.ts.map

package/lib/typescript/modules/select/Select.variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.variants.d.ts","sourceRoot":"","sources":["../../../../src/modules/select/Select.variants.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGrD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,oFAAoF;AACpF,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAInC,MAAM,WAAW,cAAc;IAC7B,mCAAmC;IACnC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,iFAAiF;IACjF,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,gCAAgC;IAChC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,8DAA8D;IAC9D,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;CAI8B,CAAC;AAExD,kGAAkG;AAClG,eAAO,MAAM,qBAAqB,KAAK,CAAC;AAExC,gGAAgG;AAChG,eAAO,MAAM,oBAAoB,KAAK,CAAC;AAEvC,MAAM,WAAW,mBAAmB;IAClC,8DAA8D;IAC9D,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,mGAAmG;IACnG,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,8CAA8C;IAC9C,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,sBAAsB;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,wBAAgB,0BAA0B,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,mBAAmB,CAQpG;AAED,MAAM,WAAW,eAAe;IAC9B;;;wGAGoG;IACpG,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,2BAA2B;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB;wGACoG;IACpG,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,UAAU,GAAG,eAAe,CAM1E;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACxC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,iBAAiB,EAAE,QAAQ,CAAC;IACrC,QAAQ,CAAC,kBAAkB,EAAE;QAAE,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC;IACxF,8EAA8E;IAC9E,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;CAC5B;AAED;;;;GAIG;AACH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,wBAAwB,GAAG,wBAAwB,CAOpG;AAED;;;GAGG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;oCAiBhC,CAAC;AAEJ;0EAC0E;AAC1E,eAAO,MAAM,sBAAsB,uKAMhC,CAAC;AAEJ,eAAO,MAAM,oBAAoB,uKAO9B,CAAC;AAEJ,eAAO,MAAM,kBAAkB,uKAS5B,CAAC"}

package/lib/typescript/modules/select/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Public surface of `pixelize-native-library/select`. Value exports and type exports are split for
+ * `verbatimModuleSyntax`. The resolvers (`resolveSelectTriggerColors`, `SELECT_SIZES`, …) stay
+ * internal — a consumer configures a Select through its props, never by importing its internals.
+ */
+export { Select } from "./Select";
+export type { SelectProps, SelectOption } from "./Select";
+export type { SelectSize } from "./Select.variants";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/modules/select/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/modules/select/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE1D,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC"}

package/lib/typescript/modules/skeleton/Skeleton.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Skeleton — a loading placeholder box that shimmers while the real content it stands in for is
+ * still on its way. It is its own size (`width`/`height` are component-owned props, not
+ * `LayoutStyle` — sizing IS the point of this component) and has exactly one neutral appearance:
+ * a resting `bg.sunken` fill cross-faded with a fixed-alpha `fg.default` overlay composited over it
+ * (see `resolveSkeletonColors`), pulsing on an `Animated` opacity loop. Purely decorative by default
+ * (see `Skeleton.variants.ts` →
+ * `resolveSkeletonAccessibility`, the same "decorative unless labelled" contract as `Avatar`).
+ */
+import type { LayoutStyle } from "../../core/style";
+import type { SkeletonShape } from "./Skeleton.variants";
+export interface SkeletonProps {
+    shape?: SkeletonShape;
+    /** Component-owned sizing, in dp — not `LayoutStyle`. Falls back to a per-shape default. */
+    width?: number;
+    height?: number;
+    /**
+     * Decorative by default — hidden from assistive tech (`Avatar`'s optional-label contract).
+     * Pass a label (e.g. `"Loading"`) to instead expose this as one `progressbar`-role element.
+     */
+    accessibilityLabel?: string;
+    /** Layout-only, outermost, applied exactly once as the LAST entry in the root style array. */
+    style?: LayoutStyle;
+    testID?: string;
+}
+export declare const Skeleton: import("react").NamedExoticComponent<SkeletonProps>;
+//# sourceMappingURL=Skeleton.d.ts.map

package/lib/typescript/modules/skeleton/Skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/modules/skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAMH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AASpD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,4FAA4F;IAC5F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8FAA8F;IAC9F,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,eAAO,MAAM,QAAQ,qDAsDnB,CAAC"}