@campxdev/react-native-blueprint 0.1.17 → 0.1.19

package/lib/typescript/src/components/ui/Native-Only-Animated-View.d.ts

@@ -0,0 +1,28 @@
+import Animated from 'react-native-reanimated';
+/**
+ * Platform-conditional animated view component
+ *
+ * Renders an Animated.View on native platforms (iOS/Android) and a React Fragment
+ * on web. This utility helps maintain consistent animation APIs across platforms
+ * while avoiding web-incompatible animations.
+ *
+ * Used internally by other components like Dialog, Popover, Tooltip, etc. to provide
+ * smooth entrance/exit animations on native while gracefully degrading to no animation
+ * on web where certain Reanimated features are not supported.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <NativeOnlyAnimatedView entering={FadeIn} exiting={FadeOut}>
+ *   <View><Text>Animated content on native, static on web</Text></View>
+ * </NativeOnlyAnimatedView>
+ * ```
+ *
+ * @platform iOS, Android - Full animation support
+ * @platform web - Renders as Fragment without animations
+ */
+declare function NativeOnlyAnimatedView(props: React.ComponentPropsWithRef<typeof Animated.View> & {
+    children?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export { NativeOnlyAnimatedView };
+//# sourceMappingURL=Native-Only-Animated-View.d.ts.map

package/lib/typescript/src/components/ui/Native-Only-Animated-View.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Native-Only-Animated-View.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Native-Only-Animated-View.tsx"],"names":[],"mappings":"AACA,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAE/C;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,iBAAS,sBAAsB,CAC7B,KAAK,EAAE,KAAK,CAAC,qBAAqB,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,GAAG;IACzD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,2CAOF;AAED,OAAO,EAAE,sBAAsB,EAAE,CAAC"}

package/lib/typescript/src/components/ui/SizedBox.d.ts

@@ -0,0 +1,79 @@
+import * as React from 'react';
+import { type ViewStyle } from 'react-native';
+interface SizedBoxProps {
+    /**
+     * The width of the box
+     */
+    width?: number;
+    /**
+     * The height of the box
+     */
+    height?: number;
+    /**
+     * Optional child element to render inside the box
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional styles to apply
+     */
+    style?: ViewStyle;
+}
+/**
+ * A box with a specified size.
+ *
+ * If a child is provided, this widget forces its child to have a specific width and/or height.
+ * If either the width or height is not specified, this widget will size itself to match the child's size in that dimension.
+ *
+ * If no child is provided, this widget will size itself to the specified width and height,
+ * treating null values as zero.
+ *
+ * This is similar to Flutter's SizedBox widget and is useful for:
+ * - Adding fixed spacing between widgets
+ * - Constraining child widget dimensions
+ * - Creating empty space
+ *
+ * @example
+ * // Create spacing
+ * <SizedBox height={16} />
+ *
+ * @example
+ * // Constrain child size
+ * <SizedBox width={100} height={100}>
+ *   <Image source={...} />
+ * </SizedBox>
+ *
+ * @example
+ * // Create horizontal spacing
+ * <View style={{ flexDirection: 'row' }}>
+ *   <Button />
+ *   <SizedBox width={12} />
+ *   <Button />
+ * </View>
+ */
+export declare function SizedBox({ width, height, children, style }: SizedBoxProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace SizedBox {
+    /**
+     * Creates a square SizedBox with equal width and height
+     */
+    function Square({ size, children, style, }: {
+        size: number;
+        children?: React.ReactNode;
+        style?: ViewStyle;
+    }): import("react/jsx-runtime").JSX.Element;
+    /**
+     * Creates a SizedBox that expands to fill available space
+     */
+    function Expand({ children, style, }: {
+        children?: React.ReactNode;
+        style?: ViewStyle;
+    }): import("react/jsx-runtime").JSX.Element;
+    /**
+     * Creates a SizedBox that shrinks to fit its content
+     */
+    function Shrink({ children, style, }: {
+        children?: React.ReactNode;
+        style?: ViewStyle;
+    }): import("react/jsx-runtime").JSX.Element;
+}
+export {};
+//# sourceMappingURL=SizedBox.d.ts.map

package/lib/typescript/src/components/ui/SizedBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SizedBox.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/SizedBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,UAAU,aAAa;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,aAAa,2CAQzE;AAGD,yBAAiB,QAAQ,CAAC;IACxB;;OAEG;IACH,SAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,QAAQ,EACR,KAAK,GACN,EAAE;QACD,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,2CAMA;IAED;;OAEG;IACH,SAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,KAAK,GACN,EAAE;QACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,2CAGA;IAED;;OAEG;IACH,SAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,KAAK,GACN,EAAE;QACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,2CAGA;CACF"}

package/lib/typescript/src/components/ui/Slider.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { ViewProps } from 'react-native';
+/**
+ * Props for the Slider component
+ *
+ * @property {number} value - Current slider value
+ * @property {function} onValueChange - Callback when value changes
+ * @property {number} min - Minimum value (default: 0)
+ * @property {number} max - Maximum value (default: 100)
+ * @property {number} step - Step increment (default: 1)
+ * @property {boolean} disabled - Whether the slider is disabled
+ */
+export interface SliderProps extends Omit<ViewProps, 'children'> {
+    value: number;
+    onValueChange?: (value: number[]) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    className?: string;
+}
+/**
+ * Ref interface for Slider component
+ *
+ * @property {function} reset - Resets slider to minimum value
+ */
+export interface SliderRef {
+    reset: () => void;
+}
+/**
+ * Interactive slider component for selecting numeric values
+ *
+ * Provides smooth gesture-based interaction with spring animations.
+ * Supports min/max ranges, step increments, and tap-to-select.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <Slider
+ *   value={volume}
+ *   onValueChange={(values) => setVolume(values[0])}
+ *   min={0}
+ *   max={100}
+ *   step={5}
+ * />
+ * ```
+ *
+ * @accessibility
+ * - Disabled state prevents interaction
+ * - Focus visible states on web
+ * - Value changes are announced by screen readers
+ */
+declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<SliderRef>>;
+export { Slider };
+//# sourceMappingURL=Slider.d.ts.map

package/lib/typescript/src/components/ui/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Slider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAkB,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzD;;;;;;;;;GASG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,QAAA,MAAM,MAAM,+EA0JX,CAAC;AAIF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/lib/typescript/src/components/ui/Table.d.ts

@@ -0,0 +1,70 @@
+import { Text } from '../Input/Text/Text';
+import { View } from 'react-native';
+import * as React from 'react';
+/**
+ * Root table container component
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <Table>
+ *   <TableHeader>
+ *     <TableRow>
+ *       <TableHead><Text>Name</Text></TableHead>
+ *       <TableHead><Text>Email</Text></TableHead>
+ *     </TableRow>
+ *   </TableHeader>
+ *   <TableBody>
+ *     <TableRow>
+ *       <TableCell><Text>John Doe</Text></TableCell>
+ *       <TableCell><Text>john@example.com</Text></TableCell>
+ *     </TableRow>
+ *   </TableBody>
+ * </Table>
+ * ```
+ */
+declare function Table({ className, ...props }: React.ComponentProps<typeof View> & React.RefAttributes<View>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table header container
+ *
+ * @component
+ */
+declare function TableHeader({ className, ...props }: React.ComponentProps<typeof View> & React.RefAttributes<View>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table body container for data rows
+ *
+ * @component
+ */
+declare function TableBody({ className, ...props }: React.ComponentProps<typeof View> & React.RefAttributes<View>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table footer container
+ *
+ * @component
+ */
+declare function TableFooter({ className, ...props }: React.ComponentProps<typeof View> & React.RefAttributes<View>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table row component
+ *
+ * @component
+ */
+declare function TableRow({ className, ...props }: React.ComponentProps<typeof View> & React.RefAttributes<View>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table header cell component
+ *
+ * @component
+ */
+declare function TableHead({ className, ...props }: React.ComponentProps<typeof Text> & React.RefAttributes<Text>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table data cell component
+ *
+ * @component
+ */
+declare function TableCell({ className, ...props }: React.ComponentProps<typeof Text> & React.RefAttributes<Text>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Table caption for describing the table
+ *
+ * @component
+ */
+declare function TableCaption({ className, ...props }: React.ComponentProps<typeof Text> & React.RefAttributes<Text>): import("react/jsx-runtime").JSX.Element;
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, };
+//# sourceMappingURL=Table.d.ts.map

package/lib/typescript/src/components/ui/Table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAE/D;AAED;;;;GAIG;AACH,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAO/D;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAE/D;AAED;;;;GAIG;AACH,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAU/D;AAED;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAO/D;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAU/D;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAO/D;AAED;;;;GAIG;AACH,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAU/D;AAED,OAAO,EACL,KAAK,EACL,SAAS,EACT,YAAY,EACZ,SAAS,EACT,WAAW,EACX,SAAS,EACT,WAAW,EACX,QAAQ,GACT,CAAC"}

package/lib/typescript/src/components/ui/Toast.d.ts

@@ -0,0 +1,55 @@
+import { Text } from '../Input/Text/Text';
+import type { LucideIcon } from 'lucide-react-native';
+import * as React from 'react';
+import { View, type ViewProps } from 'react-native';
+/**
+ * Toast notification component
+ *
+ * Displays temporary messages or notifications with optional icons.
+ * Supports default and destructive variants for different message types.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <Toast icon={CheckCircle}>
+ *   <ToastTitle>
+ *     <Text>Success</Text>
+ *   </ToastTitle>
+ *   <ToastDescription>
+ *     <Text>Your changes have been saved</Text>
+ *   </ToastDescription>
+ * </Toast>
+ *
+ * <Toast variant="destructive" icon={AlertCircle}>
+ *   <ToastTitle>
+ *     <Text>Error</Text>
+ *   </ToastTitle>
+ *   <ToastDescription>
+ *     <Text>Failed to save changes</Text>
+ *   </ToastDescription>
+ * </Toast>
+ * ```
+ *
+ * @accessibility
+ * - Announces messages to screen readers
+ * - Proper role for notifications
+ */
+declare function Toast({ className, variant, children, icon, iconClassName, ...props }: ViewProps & React.RefAttributes<View> & {
+    icon?: LucideIcon;
+    variant?: 'default' | 'destructive';
+    iconClassName?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Toast title component
+ *
+ * @component
+ */
+declare function ToastTitle({ className, ...props }: React.ComponentProps<typeof Text> & React.RefAttributes<Text>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Toast description component
+ *
+ * @component
+ */
+declare function ToastDescription({ className, ...props }: React.ComponentProps<typeof Text> & React.RefAttributes<Text>): import("react/jsx-runtime").JSX.Element;
+export { Toast, ToastDescription, ToastTitle };
+//# sourceMappingURL=Toast.d.ts.map

package/lib/typescript/src/components/ui/Toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAoB,MAAM,oBAAoB,CAAC;AAE5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAKpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,QAAQ,EACR,IAAI,EACJ,aAAa,EACb,GAAG,KAAK,EACT,EAAE,SAAS,GACV,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG;IAC1B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,2CA+BF;AAED;;;;GAIG;AACH,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAO/D;AAED;;;;GAIG;AACH,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,2CAY/D;AAED,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,CAAC"}

package/lib/typescript/src/components/ui/index.d.ts

@@ -0,0 +1,61 @@
+export * from '../DataDisplay/Accordion/Accordion';
+export * from '../DataDisplay/AccordionItem/AccordionItem';
+export * from '../Feedback/Alert/Alert';
+export * from '../Feedback/AlertDialog/Alert-Dialog';
+export * from '../Feedback/InfoBar/InfoBar';
+export * from '../Navigation/Appbar/AppBar';
+export * from '../Layout/AspectRatio/Aspect-Ratio';
+export * from '../DataDisplay/Avatar/Avatar';
+export * from '../DataDisplay/Badge/Badge';
+export * from '../DataDisplay/Banner/Banner';
+export * from '../DataDisplay/Chips/Chips';
+export * from '../DataDisplay/ChipsRow/ChipsRow';
+export * from '../DataDisplay/BannerRow/BannerRow';
+export * from '../Layout/PageLayoutShell/PageLayoutShell';
+export * from '../Layout/PageLayoutFocused/PageLayoutFocused';
+export * from '../Layout/PageContent/PageContent';
+export * from '../Layout/Bottomsheet/Bottom-Sheet';
+export * from '../Input/Button/Button';
+export * from '../DataDisplay/Card/Card';
+export * from '../DataDisplay/CalendarItem/CalendarItem';
+export * from '../DataDisplay/FeedCard/FeedCard';
+export * from '../DataDisplay/Greeting/Greeting';
+export * from '../DataDisplay/MonthCalendar/MonthCalendar';
+export * from '../DataDisplay/DataCard/DataCard';
+export * from '../Input/Checkbox/Checkbox';
+export * from './Collapsible';
+export * from '../Navigation/ContextMenu/Context-Menu';
+export * from './Custom-Card';
+export * from '../Navigation/Dialog/Dialog';
+export * from './Dropdown-Menu';
+export * from '../Navigation/FloatingAction/Floating-Action';
+export * from './Hover-Card';
+export * from './Icon';
+export * from './Input';
+export * from './Label';
+export * from './Menubar';
+export * from '../Navigation/Navbar/NavBar';
+export * from '../Navigation/Popover/Popover';
+export * from '../Layout/PopoverContainer/Popover-Container';
+export * from '../Feedback/ProgressLinear/Progress-linear';
+export * from '../Feedback/ProgressCircular/Progress-circular';
+export * from '../Feedback/Stepper/Stepper';
+export * from '../Input/RadioGroup/Radio-Group';
+export * from '../Input/Select/Select';
+export * from '../DataDisplay/Separator/Separator';
+export * from './SizedBox';
+export * from '../DataDisplay/Skeleton/Skeleton';
+export * from './Slider';
+export * from '../Input/switch/Switch';
+export * from './Table';
+export * from '../Layout/Tabs/Tabs';
+export * from '../Input/Text/Text';
+export * from '../Input/TextField/Textfield';
+export * from '../Navigation/Themetoggle/Theme-Toggle';
+export * from './Toast';
+export * from '../Input/Toggle/Toggle';
+export * from '../Input/ToggleGroup/Toggle-Group';
+export * from '../DataDisplay/Tooltip/Tooltip';
+export * from '../DataDisplay/DataListItem/DataListItem';
+export * from '../DataDisplay/Datalist/Datalist';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/ui/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/index.ts"],"names":[],"mappings":"AACA,cAAc,oCAAoC,CAAC;AACnD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,yBAAyB,CAAC;AACxC,cAAc,sCAAsC,CAAC;AACrD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AACnD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC;AACnD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0CAA0C,CAAC;AACzD,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AACjD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,eAAe,CAAC;AAC9B,cAAc,wCAAwC,CAAC;AACvD,cAAc,eAAe,CAAC;AAC9B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,8CAA8C,CAAC;AAE7D,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8CAA8C,CAAC;AAC7D,cAAc,4CAA4C,CAAC;AAC3D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,wBAAwB,CAAC;AACvC,cAAc,oCAAoC,CAAC;AACnD,cAAc,YAAY,CAAC;AAC3B,cAAc,kCAAkC,CAAC;AACjD,cAAc,UAAU,CAAC;AACzB,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wCAAwC,CAAC;AACvD,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,mCAAmC,CAAC;AAClD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0CAA0C,CAAC;AACzD,cAAc,kCAAkC,CAAC"}

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

@@ -0,0 +1,10 @@
+export * from './components/ui';
+export * from './patterns/pattern-components';
+export { default as RootLayout } from './app/_layout';
+export { cn } from './lib/utils';
+export { THEME, NAV_THEME } from './lib/theme';
+export { ThemeProvider, useTheme } from './lib/ThemeProvider';
+export { getRadiusForHeight, getRadiusForDimensions, getCustomRadius, RADIUS, RADIUS_PRESET, CORNER_SMOOTHING, } from './lib/cornerRadius';
+export { fonts } from './lib/fonts';
+export type { FontName } from './lib/fonts';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AACA,cAAc,iBAAiB,CAAC;AAGhC,cAAc,+BAA+B,CAAC;AAG9C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAC;AAGtD,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG9D,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,eAAe,EACf,MAAM,EACN,aAAa,EACb,gBAAgB,GACjB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,YAAY,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

package/lib/typescript/src/lib/ThemeProvider.d.ts

@@ -0,0 +1,137 @@
+import * as React from 'react';
+/**
+ * Available theme modes for the application
+ * @typedef {'light' | 'dark' | 'system'} ThemeMode
+ * - `light`: Force light theme regardless of system preference
+ * - `dark`: Force dark theme regardless of system preference
+ * - `system`: Automatically follow device system theme preference (default)
+ */
+export type ThemeMode = 'light' | 'dark' | 'system';
+/**
+ * Context type for theme management
+ * @internal
+ */
+type ThemeContextType = {
+    /** Current theme mode setting */
+    mode: ThemeMode;
+    /** Whether dark mode is currently active (computed from mode and system preference) */
+    isDark: boolean;
+    /** Function to change the theme mode */
+    setMode: (mode: ThemeMode) => void;
+    /** Theme color tokens for the current mode */
+    colors: typeof import('./theme').THEME.light;
+};
+/**
+ * Props for ThemeProvider component
+ */
+type ThemeProviderProps = {
+    /** Application content to provide theme context to */
+    children: React.ReactNode;
+    /**
+     * Initial theme mode
+     * @default 'system'
+     */
+    defaultMode?: ThemeMode;
+    /**
+     * Storage key for persisting theme preference (not yet implemented)
+     * @deprecated Currently not used - will be implemented in future version
+     */
+    storageKey?: string;
+};
+/**
+ * Theme Provider component that manages application theme state
+ *
+ * Provides theme context to all child components, enabling dark mode support
+ * throughout the application. Automatically responds to system theme changes
+ * when mode is set to 'system'.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * // Basic usage with system theme
+ * function App() {
+ *   return (
+ *     <ThemeProvider>
+ *       <YourApp />
+ *     </ThemeProvider>
+ *   );
+ * }
+ *
+ * // Start with dark mode
+ * function App() {
+ *   return (
+ *     <ThemeProvider defaultMode="dark">
+ *       <YourApp />
+ *     </ThemeProvider>
+ *   );
+ * }
+ * ```
+ *
+ * @param {ThemeProviderProps} props - Component props
+ * @returns {JSX.Element} Provider component wrapping children with theme context
+ *
+ * @see {@link useTheme} for accessing theme in child components
+ * @see {@link useThemeMode} for optional theme access without error
+ */
+export declare function ThemeProvider({ children, defaultMode, }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook to access theme context and controls
+ *
+ * Provides access to the current theme state and methods to change the theme.
+ * Must be used within a ThemeProvider component tree.
+ *
+ * @returns {ThemeContextType} Theme context object
+ * @throws {Error} If used outside of ThemeProvider
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { mode, isDark, setMode, colors } = useTheme();
+ *
+ *   return (
+ *     <View style={{ backgroundColor: colors.background }}>
+ *       <Text style={{ color: colors.foreground }}>
+ *         Current mode: {mode} (Dark: {isDark ? 'Yes' : 'No'})
+ *       </Text>
+ *       <Button onPress={() => setMode(isDark ? 'light' : 'dark')}>
+ *         <Text>Toggle Theme</Text>
+ *       </Button>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link ThemeProvider} for setup
+ * @see {@link useThemeMode} for optional access without error throwing
+ */
+export declare function useTheme(): ThemeContextType;
+/**
+ * Optional hook to get current dark mode state
+ *
+ * Similar to useTheme but only returns the isDark boolean and doesn't throw
+ * an error if used outside ThemeProvider. Useful for components that want
+ * to adapt to theme but don't require it.
+ *
+ * @returns {boolean | undefined} Whether dark mode is active, or undefined if no provider
+ *
+ * @example
+ * ```tsx
+ * function OptionalThemedComponent() {
+ *   const isDark = useThemeMode();
+ *
+ *   // Component works with or without ThemeProvider
+ *   const backgroundColor = isDark ? '#000' : '#fff';
+ *
+ *   return (
+ *     <View style={{ backgroundColor }}>
+ *       <Text>This component adapts if theme is available</Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link useTheme} for full theme access (requires provider)
+ */
+export declare function useThemeMode(): boolean | undefined;
+export {};
+//# sourceMappingURL=ThemeProvider.d.ts.map

package/lib/typescript/src/lib/ThemeProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../../src/lib/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B;;;;;;GAMG;AACH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAEpD;;;GAGG;AACH,KAAK,gBAAgB,GAAG;IACtB,iCAAiC;IACjC,IAAI,EAAE,SAAS,CAAC;IAChB,uFAAuF;IACvF,MAAM,EAAE,OAAO,CAAC;IAChB,wCAAwC;IACxC,OAAO,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;IACnC,8CAA8C;IAC9C,MAAM,EAAE,cAAc,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC;CAC9C,CAAC;AAMF;;GAEG;AACH,KAAK,kBAAkB,GAAG;IACxB,sDAAsD;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,WAAsB,GACvB,EAAE,kBAAkB,2CA6CpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,QAAQ,qBAMvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,YAAY,IAAI,OAAO,GAAG,SAAS,CAGlD"}

package/lib/typescript/src/lib/cornerRadius.d.ts

@@ -0,0 +1,112 @@
+/**
+ * Corner Radius System
+ *
+ * Automatically calculates the appropriate corner radius based on element dimensions.
+ *
+ * Design Rule:
+ * - Elements < 80px height → 12px radius
+ * - Elements ≥ 80px height → 20px radius
+ * - All corners use 100% smoothing (Apple-style squircles)
+ *
+ * Examples:
+ * - Button (50px height) → 12px
+ * - Chip (24px height) → 12px
+ * - Checkbox (16px height) → 4px (special case for very small)
+ * - Small card (60px height) → 12px
+ * - Large card (200px height) → 20px
+ * - Dialog (400px height) → 20px
+ */
+/**
+ * Primitive radius values from your design system
+ * Your exact values: 0, 2, 4, 8, 12, 20, 24, 32, 48
+ */
+export declare const RADIUS: {
+    readonly R0: 0;
+    readonly R1: 2;
+    readonly R2: 4;
+    readonly R3: 8;
+    readonly R4: 12;
+    readonly R5: 20;
+    readonly R6: 24;
+    readonly R7: 32;
+    readonly R8: 48;
+};
+/**
+ * Calculate corner radius based on element height
+ *
+ * @param height - Element height in pixels
+ * @returns Corner radius in pixels
+ *
+ * @example
+ * ```tsx
+ * // Button (50px height)
+ * const radius = getRadiusForHeight(50); // Returns 12
+ *
+ * // Checkbox (16px height)
+ * const radius = getRadiusForHeight(16); // Returns 4
+ *
+ * // Card (160px height)
+ * const radius = getRadiusForHeight(160); // Returns 20
+ * ```
+ */
+export declare function getRadiusForHeight(height: number): number;
+/**
+ * Calculate corner radius based on smallest dimension (width or height)
+ * Useful for square or nearly-square elements
+ *
+ * @param width - Element width in pixels
+ * @param height - Element height in pixels
+ * @returns Corner radius in pixels
+ *
+ * @example
+ * ```tsx
+ * // Square checkbox (16×16)
+ * const radius = getRadiusForDimensions(16, 16); // Returns 4
+ *
+ * // Wide button (200×50)
+ * const radius = getRadiusForDimensions(200, 50); // Returns 12 (based on height)
+ *
+ * // Tall card (300×200)
+ * const radius = getRadiusForDimensions(300, 200); // Returns 20 (based on width)
+ * ```
+ */
+export declare function getRadiusForDimensions(width: number, height: number): number;
+/**
+ * Get corner radius with custom thresholds
+ * Advanced usage when you need different breakpoints
+ *
+ * @param height - Element height in pixels
+ * @param options - Custom threshold options
+ * @returns Corner radius in pixels
+ *
+ * @example
+ * ```tsx
+ * // Use 20px radius for elements ≥ 100px instead of 80px
+ * const radius = getCustomRadius(90, { largeThreshold: 100 });
+ * ```
+ */
+export declare function getCustomRadius(height: number, options?: {
+    tinyThreshold?: number;
+    smallThreshold?: number;
+    tinyRadius?: number;
+    smallRadius?: number;
+    largeRadius?: number;
+}): number;
+/**
+ * Corner smoothing value (0-1)
+ * 1.0 = 100% smoothing (Apple-style squircles)
+ */
+export declare const CORNER_SMOOTHING = 1;
+/**
+ * Preset radius values for common use cases
+ * Use these when you know the exact size you want
+ */
+export declare const RADIUS_PRESET: {
+    readonly none: 0;
+    readonly tiny: 4;
+    readonly small: 12;
+    readonly large: 20;
+    readonly pill: 24;
+    readonly circle: 9999;
+};
+//# sourceMappingURL=cornerRadius.d.ts.map

package/lib/typescript/src/lib/cornerRadius.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cornerRadius.d.ts","sourceRoot":"","sources":["../../../../src/lib/cornerRadius.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH;;;GAGG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;CAUT,CAAC;AAWX;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAUzD;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAG5E;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,eAAe,CAC7B,MAAM,EAAE,MAAM,EACd,OAAO,CAAC,EAAE;IACR,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GACA,MAAM,CAkBR;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,IAAM,CAAC;AAEpC;;;GAGG;AACH,eAAO,MAAM,aAAa;;;;;;;CAOhB,CAAC"}