@mrmeg/expo-ui 0.24.0 → 0.25.0

package/CHANGELOG.md

@@ -3,6 +3,32 @@
 All notable changes to `@mrmeg/expo-ui` are documented here. This project
 adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.25.0]
+
+### Added
+
+- **The build emits a design-system manifest.** `dist/design-system.json`
+  (`schemaVersion: 1`) carries the spacing, radius and icon scales, the palette,
+  the theme colors, the font variants, and every component's variant and size
+  values, exported as `@mrmeg/expo-ui/design-system.json`.
+  `@mrmeg/eslint-plugin-expo-ui` loads it when the design-system sources are not
+  on disk, so the design-system rules work against an installed release instead
+  of only inside the template repo. Adding an export means the next release is a
+  minor bump.
+
+### Changed
+
+- **Peer ranges include Expo SDK 58.** `expo`, `expo-font`, `expo-haptics` and
+  `@expo/ui` now accept `>=56 <59` (58 pre-releases included), `react-native`
+  accepts `>=0.85 <0.89` (0.88 release candidates included), and
+  `react-native-gesture-handler` accepts `>=2.30 <4`. SDK 56 and 57 apps stay
+  in range; nothing else about the install changes for them.
+- **`StatusBar` no longer sets an Android background color or translucency.**
+  React Native 0.88 removed `backgroundColor`, `translucent` and their setters.
+  Edge-to-edge has been mandatory since SDK 54, under which the bar was already
+  transparent and translucent, so this is a no-op on every supported SDK. The
+  component now only applies the theme-driven bar style.
+
 ## [0.24.0]
 
 ### Fixed

package/LLM_USAGE.md

@@ -24,7 +24,8 @@ Importable paths: root, `components`, `components/*`, `constants`,
 `constants/*`, `hooks`, `hooks/*`, `state`, `state/*`, `lib`. Never import from
 `@mrmeg/expo-ui/dist/*` or a source checkout path.
 
-Hosts: Expo 56–57, React 19.2, React Native 0.85–0.86, React Native Web 0.21.
+Hosts: Expo 56–58 (58 in beta), React 19.2, React Native 0.85–0.88, React
+Native Web 0.21.
 Install the peer versions recommended by the consuming app's Expo SDK.
 
 ## Required App Setup
@@ -184,6 +185,18 @@ faces through `expo-font` / `@expo-google-fonts`, `"numeric"` (default) for one
 multi-weight CSS family. `setShape({ button: { borderRadius?, withShadow? } })`
 re-shapes Buttons globally. Per-instance props and caller `style` always win.
 
+Enforce these rules mechanically with `@mrmeg/eslint-plugin-expo-ui`
+(`bun add -d @mrmeg/eslint-plugin-expo-ui`), which reports raw colors, off-scale
+spacing and radius, appearance overrides on package components, and raw
+primitives as ESLint diagnostics. It reads this package's
+`design-system.json` manifest out of `node_modules`, so the messages quote the
+tokens, presets and sizes of the installed release. The plugin's first npm release is
+still pending, and only `@mrmeg/expo-ui` releases built after the manifest was
+added ship one: the installed release has it when
+`node_modules/@mrmeg/expo-ui/dist/design-system.json` exists. Config block and
+settings:
+https://raw.githubusercontent.com/mrmeg/expo-template/main/packages/lint/README.md
+
 ## Component Use-Case Index
 
 Check this before creating a new app-local primitive. All components come from

package/README.md

@@ -9,13 +9,24 @@ Read `node_modules/@mrmeg/expo-ui/llms.txt` first, then `LLM_USAGE.md` (concise
 rules) or `llms-full.md` (expanded contract), before creating app-local UI
 primitives. All three ship in the npm tarball.
 
+The same rules are available as an ESLint plugin: `@mrmeg/eslint-plugin-expo-ui`
+turns the theme and text rules into diagnostics at the call site — raw colors,
+off-scale spacing and radius, appearance overrides on package components, and raw
+primitives that have a wrapper here. See [`../lint/README.md`](../lint/README.md)
+for the config block. It reads the design-system facts from
+`@mrmeg/expo-ui/design-system.json`, the manifest this package's build ships, so
+the diagnostics quote the tokens, presets and sizes of the installed release. The
+plugin's first npm release is still pending, and only `@mrmeg/expo-ui` releases
+built after the manifest was added ship it: the installed release has one when
+`node_modules/@mrmeg/expo-ui/dist/design-system.json` exists.
+
 ## Install
 
 ```sh
 bun add @mrmeg/expo-ui
 ```
 
-Tested hosts: Expo SDK 56–57, React 19.2, React Native 0.85–0.86, React Native
+Tested hosts: Expo SDK 56–58 (58 in beta), React 19.2, React Native 0.85–0.88, React Native
 Web 0.21. Install these peers at the versions your Expo SDK recommends: `expo`,
 `@expo/ui`, `expo-font`, `expo-haptics`, `react`, `react-native`,
 `react-native-web`, `react-native-gesture-handler`,
@@ -656,3 +667,18 @@ inspected before release. `ui:consumer-smoke` installs the packed tarball into
 a clean fixture, checks every documented export-map target resolves,
 type-checks all public entrypoints, and runs an iOS `expo export` against the
 packed package at the workspace's Expo version, without a custom Metro config.
+
+### Design-system manifest
+
+`ui:build` also writes `dist/design-system.json`
+([`scripts/build-design-system-manifest.mjs`](../../scripts/build-design-system-manifest.mjs)):
+the spacing, radius and icon scales, the palette, the light and dark themes, the
+font variants, and every component's variant and size values, serialized out of
+`src` by the same extractor the lint rules use. It is exported as
+`@mrmeg/expo-ui/design-system.json`, and `@mrmeg/eslint-plugin-expo-ui` reads it
+in projects that install this package instead of checking out its sources — which
+is what lets the design-system rules quote this release's presets and tokens.
+`ui:consumer-smoke` asserts the packed tarball carries it and that it parses at
+`schemaVersion: 1` with a non-empty component list. The build fails rather than
+writing an empty manifest, so a broken extractor cannot ship as "no rules to
+enforce".

package/dist/components/Avatar.js

@@ -81,12 +81,17 @@ export function getAvatarInitials(name) {
  * `{ bundle, name }`, a resolved asset object). Keying those as "no image"
  * silently degraded a perfectly good source to initials.
  */
+// `Array.isArray` narrows to `any[]`, which cannot subtract the readonly array
+// arm of the source union, so the predicate spells the arm out.
+function isSourceList(source) {
+    return Array.isArray(source);
+}
 function getSourceKey(source) {
     if (source == null)
         return null;
     if (typeof source === "number")
         return `asset:${source}`;
-    if (Array.isArray(source)) {
+    if (isSourceList(source)) {
         // An empty array carries no image; anything else does.
         const keys = source.map((entry) => getSourceKey(entry) ?? "").filter(Boolean);
         return keys.length > 0 ? keys.join("|") : null;

package/dist/components/Button.d.ts

@@ -40,7 +40,7 @@ export interface ButtonProps extends PressableProps {
      */
     txOptions?: TextProps["txOptions"];
     /**
-     * An optional style override useful for padding & margin.
+     * An optional style override useful for margin and layout.
      */
     style?: StyleProp<ViewStyle>;
     /**

package/dist/components/Carousel.js

@@ -94,6 +94,8 @@ export function Carousel({ children, itemWidth = 0.85, gap = spacing.md, content
     // state: web's throttled ticks report the same page many times over, and
     // onIndexChange must fire once per page.
     const activeIndexRef = useRef(activeIndex);
+    // `ComponentRef<typeof ScrollView>` rather than RN 0.88's `ScrollViewInstance`,
+    // which RN 0.85/0.86 typings do not export.
     const scrollRef = useRef(null);
     const hasScrolledToInitial = useRef(false);
     const commitIndex = useCallback((next) => {

package/dist/components/Dialog.d.ts

@@ -1,25 +1,9 @@
 import * as React from "react";
-import { View, ViewProps } from "react-native";
+import { ViewProps } from "react-native";
 import * as DialogPrimitive from "@rn-primitives/dialog";
 import * as AlertDialogPrimitive from "@rn-primitives/alert-dialog";
-declare const DialogTrigger: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
-declare const DialogClose: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
+declare const DialogTrigger: typeof DialogPrimitive.Trigger;
+declare const DialogClose: typeof DialogPrimitive.Close;
 interface DialogProps extends DialogPrimitive.RootProps {
     children: React.ReactNode;
 }
@@ -36,58 +20,19 @@ declare function DialogTitle({ children, style, ...props }: DialogPrimitive.Titl
 declare function DialogDescription({ children, style, ...props }: DialogPrimitive.DescriptionProps & {
     children: React.ReactNode;
 }): React.JSX.Element;
-declare const Dialog: typeof DialogRoot & {
-    Trigger: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<View>): React.JSX.Element;
-        displayName: string;
-    };
+type DialogComponent = typeof DialogRoot & {
+    Trigger: typeof DialogTrigger;
     Content: typeof DialogContent;
     Header: typeof DialogHeader;
     Footer: typeof DialogFooter;
     Title: typeof DialogTitle;
     Description: typeof DialogDescription;
-    Close: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<View>): React.JSX.Element;
-        displayName: string;
-    };
-};
-declare const AlertDialogTrigger: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
-declare const AlertDialogAction: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
-declare const AlertDialogCancel: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
+    Close: typeof DialogClose;
 };
+declare const Dialog: DialogComponent;
+declare const AlertDialogTrigger: typeof AlertDialogPrimitive.Trigger;
+declare const AlertDialogAction: typeof AlertDialogPrimitive.Action;
+declare const AlertDialogCancel: typeof AlertDialogPrimitive.Cancel;
 interface AlertDialogProps extends AlertDialogPrimitive.RootProps {
     children: React.ReactNode;
 }
@@ -102,39 +47,16 @@ declare function AlertDialogTitle({ children, style, ...props }: AlertDialogPrim
 declare function AlertDialogDescription({ children, style, ...props }: AlertDialogPrimitive.DescriptionProps & {
     children: React.ReactNode;
 }): React.JSX.Element;
-declare const AlertDialog: typeof AlertDialogRoot & {
-    Trigger: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<View>): React.JSX.Element;
-        displayName: string;
-    };
+type AlertDialogComponent = typeof AlertDialogRoot & {
+    Trigger: typeof AlertDialogTrigger;
     Content: typeof AlertDialogContent;
     Header: typeof DialogHeader;
     Footer: typeof DialogFooter;
     Title: typeof AlertDialogTitle;
     Description: typeof AlertDialogDescription;
-    Action: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<View>): React.JSX.Element;
-        displayName: string;
-    };
-    Cancel: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<View>): React.JSX.Element;
-        displayName: string;
-    };
+    Action: typeof AlertDialogAction;
+    Cancel: typeof AlertDialogCancel;
 };
+declare const AlertDialog: AlertDialogComponent;
 export { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, DialogClose, AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };
 export type { DialogProps, DialogContentProps, AlertDialogProps, AlertDialogContentProps, };

package/dist/components/Dialog.js

@@ -14,6 +14,11 @@ const FullWindowOverlay = Platform.OS === "ios" ? RNFullWindowOverlay : React.Fr
 // ============================================================================
 // Dialog
 // ============================================================================
+// These re-exports and the compound components below carry explicit type
+// annotations because React Native 0.88 resolves primitive ref types through
+// its private `ReactNativeElement`, which declaration emit cannot name
+// portably (TS2883). Annotating with `typeof <primitive>` keeps the emitted
+// .d.ts pointing at the primitive's own public types instead.
 const DialogTrigger = DialogPrimitive.Trigger;
 const DialogClose = DialogPrimitive.Close;
 function DialogRoot({ children, ...props }) {

package/dist/components/DropdownMenu.d.ts

@@ -1,40 +1,11 @@
 import * as React from "react";
-import { type TextStyle, View } from "react-native";
+import { type TextStyle } from "react-native";
 import * as DropdownMenuPrimitive from "@rn-primitives/dropdown-menu";
-declare const DropdownMenu: {
-    ({ asChild, onOpenChange: onOpenChangeProp, ref, ...viewProps }: import("react-native").ViewProps & {
-        asChild?: boolean;
-    } & {
-        onOpenChange?: (open: boolean) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
-declare const DropdownMenuGroup: {
-    ({ asChild, ref, ...props }: import("react-native").ViewProps & {
-        asChild?: boolean;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
+declare const DropdownMenu: typeof DropdownMenuPrimitive.Root;
+declare const DropdownMenuGroup: typeof DropdownMenuPrimitive.Group;
 declare const DropdownMenuPortal: typeof DropdownMenuPrimitive.Portal;
-declare const DropdownMenuSub: {
-    ({ asChild, defaultOpen, open: openProp, onOpenChange: onOpenChangeProp, ref, ...props }: import("react-native").ViewProps & {
-        asChild?: boolean;
-    } & {
-        defaultOpen?: boolean;
-        open?: boolean;
-        onOpenChange?: (value: boolean) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
-declare const DropdownMenuRadioGroup: {
-    ({ asChild, value, onValueChange, ref, ...props }: import("react-native").ViewProps & {
-        asChild?: boolean;
-    } & {
-        value: string | undefined;
-        onValueChange: (value: string) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-};
+declare const DropdownMenuSub: typeof DropdownMenuPrimitive.Sub;
+declare const DropdownMenuRadioGroup: typeof DropdownMenuPrimitive.RadioGroup;
 /**
  * DropdownMenuTrigger Component
  * Wraps the primitive Trigger to default `accessibilityRole="button"`.

package/dist/components/DropdownMenu.js

@@ -10,7 +10,8 @@ import { useScalePress } from "../hooks/useScalePress.js";
 import * as DropdownMenuPrimitive from "@rn-primitives/dropdown-menu";
 import { FullWindowOverlay as RNFullWindowOverlay } from "react-native-screens";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-// Re-export primitives that don't need styling
+// Re-export primitives that don't need styling. Annotated with `typeof` for
+// portable declaration emit — see the note in Dialog.tsx (TS2883).
 const DropdownMenu = DropdownMenuPrimitive.Root;
 const DropdownMenuGroup = DropdownMenuPrimitive.Group;
 const DropdownMenuPortal = DropdownMenuPrimitive.Portal;

package/dist/components/InputOTP.js

@@ -27,6 +27,8 @@ const BULLET = "\u2022";
  */
 function InputOTP({ length = 6, value = "", onChangeText, onComplete, error = false, errorText, disabled = false, autoFocus = false, secureTextEntry = false, inputMode = "numeric", style: styleOverride, }) {
     const { theme } = useTheme();
+    // `ComponentRef<typeof RNTextInput>` rather than RN 0.88's `TextInputInstance`,
+    // which RN 0.85/0.86 typings do not export.
     const inputRef = useRef(null);
     const [focused, setFocused] = useState(false);
     const styles = themedStyles(theme);

package/dist/components/Popover.d.ts

@@ -1,6 +1,6 @@
 import * as PopoverPrimitive from "@rn-primitives/popover";
 import * as React from "react";
-import { View, ViewProps } from "react-native";
+import { ViewProps } from "react-native";
 /**
  * Popover Trigger Component
  * The element that triggers the popover to open/close
@@ -44,21 +44,21 @@ interface PopoverFooterProps extends ViewProps {
 }
 declare function PopoverFooter({ children, style, ...props }: PopoverFooterProps): React.JSX.Element;
 /**
- * Popover Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Popover.Trigger)
+ * Popover Root Component
+ * Manages popover state and provides context for trigger and content
  */
-declare const Popover: {
-    ({ asChild, onOpenChange: onOpenChangeProp, ref, ...viewProps }: ViewProps & {
-        asChild?: boolean;
-    } & {
-        onOpenChange?: (open: boolean) => void;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-} & {
+declare const PopoverRoot: typeof PopoverPrimitive.Root;
+type PopoverComponent = typeof PopoverRoot & {
     Trigger: typeof PopoverTrigger;
     Content: typeof PopoverContent;
     Header: typeof PopoverHeader;
     Body: typeof PopoverBody;
     Footer: typeof PopoverFooter;
 };
+/**
+ * Popover Component with Sub-components
+ * Properly typed interface for dot notation access (e.g., Popover.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
+ */
+declare const Popover: PopoverComponent;
 export { Popover, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, PopoverFooter, };

package/dist/components/Popover.js

@@ -40,7 +40,7 @@ function PopoverContent({ side, align = "center", sideOffset = 4, portalHost, ..
             padding: spacing.xs,
             ...getShadowStyle("soft"),
         },
-    ]);
+    ]) ?? undefined;
     return (_jsx(PopoverPrimitive.Portal, { hostName: portalHost, children: _jsx(FullWindowOverlay, { children: _jsx(PopoverPrimitive.Overlay, { style: Platform.select({ native: StyleSheet.absoluteFill }), children: _jsx(AnimatedView, { type: "fade", enterDuration: 200, children: _jsx(TextColorContext.Provider, { value: textColor, children: _jsx(TextClassContext.Provider, { value: "", children: _jsx(PopoverPrimitive.Content, { side: side, align: align, sideOffset: sideOffset, style: contentStyle, ...props }) }) }) }) }) }) }));
 }
 function PopoverHeader({ children, style, ...props }) {
@@ -83,7 +83,8 @@ function PopoverFooter({ children, style, ...props }) {
 const PopoverRoot = PopoverPrimitive.Root;
 /**
  * Popover Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Popover.Trigger)
+ * Properly typed interface for dot notation access (e.g., Popover.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
  */
 const Popover = Object.assign(PopoverRoot, {
     Trigger: PopoverTrigger,

package/dist/components/Select.d.ts

@@ -1,6 +1,10 @@
 import * as React from "react";
-import { View } from "react-native";
 import * as SelectPrimitive from "@rn-primitives/select";
+/**
+ * SelectRoot Component
+ * Manages select state and provides context for trigger and content
+ */
+declare const SelectRoot: typeof SelectPrimitive.Root;
 /**
  * Size variants for SelectTrigger
  */
@@ -57,25 +61,7 @@ declare function SelectLabel({ style: styleOverride, ...props }: SelectLabelProp
  */
 type SelectSeparatorProps = SelectPrimitive.SeparatorProps;
 declare function SelectSeparator({ style: styleOverride, ...props }: SelectSeparatorProps): React.JSX.Element;
-/**
- * Select Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Select.Trigger)
- */
-declare const Select: {
-    ({ asChild, value: valueProp, defaultValue, onValueChange: onValueChangeProp, onOpenChange: onOpenChangeProp, disabled, ref, ...viewProps }: import("react-native").ViewProps & {
-        asChild?: boolean;
-    } & {
-        value?: import("@rn-primitives/select").Option;
-        defaultValue?: import("@rn-primitives/select").Option;
-        onValueChange?: (option: import("@rn-primitives/select").Option) => void;
-        onOpenChange?: (open: boolean) => void;
-        disabled?: boolean;
-        dir?: "ltr" | "rtl";
-        name?: string;
-        required?: boolean;
-    } & React.RefAttributes<View>): React.JSX.Element;
-    displayName: string;
-} & {
+type SelectComponent = typeof SelectRoot & {
     Trigger: typeof SelectTrigger;
     Value: typeof SelectValue;
     Content: typeof SelectContent;
@@ -84,5 +70,11 @@ declare const Select: {
     Label: typeof SelectLabel;
     Separator: typeof SelectSeparator;
 };
+/**
+ * Select Component with Sub-components
+ * Properly typed interface for dot notation access (e.g., Select.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
+ */
+declare const Select: SelectComponent;
 export { Select, SelectTrigger, SelectValue, SelectContent, SelectItem, SelectGroup, SelectLabel, SelectSeparator, };
 export type { SelectSize, SelectTriggerProps, SelectValueProps, SelectContentProps, SelectItemProps, SelectGroupProps, SelectLabelProps, SelectSeparatorProps, };

package/dist/components/Select.js

@@ -210,7 +210,8 @@ const styles = StyleSheet.create({
 });
 /**
  * Select Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Select.Trigger)
+ * Properly typed interface for dot notation access (e.g., Select.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
  */
 const Select = Object.assign(SelectRoot, {
     Trigger: SelectTrigger,

package/dist/components/StatusBar.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { useTheme } from "../hooks/useTheme.js";
-import { StatusBar as RNStatusBar, Platform } from "react-native";
+import { StatusBar as RNStatusBar } from "react-native";
 export const StatusBar = () => {
     const { scheme, theme } = useTheme();
     const barStyle = scheme === "dark" ? "light-content" : "dark-content";
@@ -10,10 +10,6 @@ export const StatusBar = () => {
      */
     useEffect(() => {
         RNStatusBar.setBarStyle(barStyle, true);
-        if (Platform.OS === "android") {
-            RNStatusBar.setBackgroundColor("transparent", true);
-            RNStatusBar.setTranslucent(true);
-        }
     }, [barStyle]);
-    return (_jsx(RNStatusBar, { barStyle: barStyle, backgroundColor: Platform.OS === "android" ? "transparent" : undefined, translucent: true }));
+    return _jsx(RNStatusBar, { barStyle: barStyle });
 };

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

@@ -2,5 +2,5 @@ import React from "react";
 import type { StyleProp, TextStyle } from "react-native";
 export declare const TextClassContext: React.Context<string | undefined>;
 export declare const TextColorContext: React.Context<string | undefined>;
-export declare const TextStyleContext: React.Context<StyleProp<TextStyle>>;
+export declare const TextStyleContext: React.Context<StyleProp<TextStyle> | undefined>;
 export declare const TextSelectabilityContext: React.Context<boolean | undefined>;

package/dist/components/StyledText.d.ts

@@ -1,4 +1,4 @@
-import { type Ref } from "react";
+import { type ComponentRef, type Ref } from "react";
 import { Text as RNText, TextProps as RNTextProps } from "react-native";
 import { type FontVariant } from "../constants/fonts";
 /**
@@ -55,8 +55,12 @@ export type TextProps = RNTextProps & {
     txOptions?: object;
     /**
      * Forwarded ref to the underlying RNText element.
+     *
+     * Written as `ComponentRef<typeof RNText>` rather than RN 0.88's `TextInstance`
+     * alias so the emitted declarations stay valid on RN 0.85/0.86, whose typings
+     * do not export that name.
      */
-    ref?: Ref<RNText>;
+    ref?: Ref<ComponentRef<typeof RNText>>;
 };
 /**
  * Base Text component with theme and variant support

package/dist/components/TextInput.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode, type Ref } from "react";
+import { type ComponentRef, type ReactNode, type Ref } from "react";
 import { TextInput as RNTextInput, ViewStyle, TextStyle, TextInputProps, StyleProp } from "react-native";
 /**
  * Size variants for TextInput
@@ -11,8 +11,12 @@ export type TextInputVariant = "outline" | "filled" | "underlined";
 interface TextInputCustomProps extends TextInputProps {
     /**
      * Forwarded ref to the underlying RNTextInput element.
+     *
+     * Written as `ComponentRef<typeof RNTextInput>` rather than RN 0.88's
+     * `TextInputInstance` alias so the emitted declarations stay valid on
+     * RN 0.85/0.86, whose typings do not export that name.
      */
-    ref?: Ref<RNTextInput>;
+    ref?: Ref<ComponentRef<typeof RNTextInput>>;
     /**
      * Visual variant
      * @default "outline"

package/dist/components/Tooltip.d.ts

@@ -1,19 +1,11 @@
 import * as React from "react";
-import { View, ViewProps } from "react-native";
+import { ViewProps } from "react-native";
 import * as TooltipPrimitive from "@rn-primitives/tooltip";
 /**
  * Tooltip Trigger Component
  * The element that triggers the tooltip to appear on hover (web) or press (native)
  */
-declare const TooltipTrigger: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<import("@rn-primitives/tooltip").TriggerRef>): React.JSX.Element;
-    displayName: string;
-};
+declare const TooltipTrigger: typeof TooltipPrimitive.Trigger;
 /**
  * Tooltip variant styles
  */
@@ -100,22 +92,16 @@ interface TooltipProps extends TooltipPrimitive.RootProps {
  * ```
  */
 declare function Tooltip({ delayDuration, skipDelayDuration, ...props }: TooltipProps): React.JSX.Element;
-/**
- * Tooltip Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Tooltip.Trigger)
- */
-declare const TooltipComponent: typeof Tooltip & {
-    Trigger: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<import("@rn-primitives/tooltip").TriggerRef>): React.JSX.Element;
-        displayName: string;
-    };
+type TooltipCompound = typeof Tooltip & {
+    Trigger: typeof TooltipTrigger;
     Content: typeof TooltipContent;
     Body: typeof TooltipBody;
 };
+/**
+ * Tooltip Component with Sub-components
+ * Properly typed interface for dot notation access (e.g., Tooltip.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
+ */
+declare const TooltipComponent: TooltipCompound;
 export { TooltipComponent as Tooltip, TooltipTrigger, TooltipContent, TooltipBody, };
 export type { TooltipContentProps, TooltipBodyProps, TooltipProps, };

package/dist/components/Tooltip.js

@@ -12,6 +12,8 @@ import { palette } from "../constants/colors.js";
  * Tooltip Trigger Component
  * The element that triggers the tooltip to appear on hover (web) or press (native)
  */
+// Annotated with `typeof` for portable declaration emit — see the note in
+// Dialog.tsx (TS2883). Without it the .d.ts inlines RN 0.88's `PressableInstance`.
 const TooltipTrigger = TooltipPrimitive.Trigger;
 /**
  * FullWindowOverlay wrapper - uses native overlay on iOS for proper z-index handling
@@ -68,7 +70,7 @@ function TooltipContent({ side = "top", align = "center", sideOffset = 4, portal
             maxWidth: 250,
             ...getShadowStyle("soft"),
         },
-    ]);
+    ]) ?? undefined;
     return (_jsx(TooltipPrimitive.Portal, { hostName: portalHost, children: _jsx(FullWindowOverlay, { children: _jsx(TooltipPrimitive.Overlay, { style: Platform.select({ native: StyleSheet.absoluteFill }), children: _jsx(AnimatedView, { type: "fade", enterDuration: 150, children: _jsx(TextColorContext.Provider, { value: colors.text, children: _jsx(TextClassContext.Provider, { value: "", children: _jsx(TextSelectabilityContext.Provider, { value: false, children: _jsx(TooltipPrimitive.Content, { side: side, align: align, sideOffset: sideOffset, style: contentStyle, ...props }) }) }) }) }) }) }) }));
 }
 function TooltipBody({ children, style, ...props }) {
@@ -122,7 +124,8 @@ function Tooltip({ delayDuration = 700, skipDelayDuration = 300, ...props }) {
 }
 /**
  * Tooltip Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Tooltip.Trigger)
+ * Properly typed interface for dot notation access (e.g., Tooltip.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
  */
 const TooltipComponent = Object.assign(Tooltip, {
     Trigger: TooltipTrigger,