@campxdev/react-native-blueprint 0.1.13 → 0.1.15

package/lib/typescript/module/src/lib/fonts.d.ts

@@ -1,16 +0,0 @@
-/**
- * Font configuration object
- * Returns font family names that work with system fonts by default
- *
- * If you've loaded custom fonts (Poppins/Heebo), the components will use them automatically
- * when you specify fontFamily in styles.
- */
-export declare const fonts: {
-    Poppins_400Regular: string;
-    Poppins_600SemiBold: string;
-    Poppins_800ExtraBold: string;
-    Heebo_400Regular: string;
-    Heebo_600SemiBold: string;
-};
-export type FontName = keyof typeof fonts;
-//# sourceMappingURL=fonts.d.ts.map

package/lib/typescript/module/src/lib/fonts.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../../../../src/lib/fonts.ts"],"names":[],"mappings":"AAiFA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;CAQjB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,KAAK,CAAC"}

package/lib/typescript/module/src/lib/slot-helpers.d.ts

@@ -1,32 +0,0 @@
-/**
- * Properly typed Slot component wrappers
- *
- * The @rn-primitives/slot package has complex type inference that doesn't
- * properly expose className props. These wrappers provide correct typing.
- */
-import type { PressableProps, ViewProps, TextProps, TextInputProps } from 'react-native';
-export declare const SlotView: React.ForwardRefExoticComponent<ViewProps & {
-    className?: string;
-    children?: React.ReactNode;
-    cssInterop?: boolean;
-}>;
-export declare const SlotPressable: React.ForwardRefExoticComponent<PressableProps & {
-    className?: string;
-    children?: React.ReactNode;
-    cssInterop?: boolean;
-}>;
-export declare const SlotText: React.ForwardRefExoticComponent<TextProps & {
-    className?: string;
-    children?: React.ReactNode;
-    cssInterop?: boolean;
-}>;
-export declare const SlotTextInput: React.ForwardRefExoticComponent<TextInputProps & {
-    className?: string;
-    children?: React.ReactNode;
-    cssInterop?: boolean;
-}>;
-export declare const Slot: React.ForwardRefExoticComponent<ViewProps & {
-    className?: string;
-    children?: React.ReactNode;
-}>;
-//# sourceMappingURL=slot-helpers.d.ts.map

package/lib/typescript/module/src/lib/slot-helpers.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"slot-helpers.d.ts","sourceRoot":"","sources":["../../../../../src/lib/slot-helpers.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAAK,EACV,cAAc,EACd,SAAS,EACT,SAAS,EACT,cAAc,EACf,MAAM,cAAc,CAAC;AAGtB,eAAO,MAAM,QAAQ,EAAyB,KAAK,CAAC,yBAAyB,CAC3E,SAAS,GAAG;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CACF,CAAC;AAEF,eAAO,MAAM,aAAa,EACG,KAAK,CAAC,yBAAyB,CACxD,cAAc,GAAG;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CACF,CAAC;AAEJ,eAAO,MAAM,QAAQ,EAAyB,KAAK,CAAC,yBAAyB,CAC3E,SAAS,GAAG;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CACF,CAAC;AAEF,eAAO,MAAM,aAAa,EACG,KAAK,CAAC,yBAAyB,CACxD,cAAc,GAAG;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CACF,CAAC;AAGJ,eAAO,MAAM,IAAI,EAAyB,KAAK,CAAC,yBAAyB,CACvE,SAAS,GAAG;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CACF,CAAC"}

package/lib/typescript/module/src/lib/theme.d.ts

@@ -1,87 +0,0 @@
-import { type Theme } from '@react-navigation/native';
-/**
- * Custom theme colors based on your Figma design tokens
- * Using your categorized color system:
- * 1. Surfaces - Page and card backgrounds
- * 2. Text - All text colors with opacity variants
- * 3. Primary - Main buttons and CTAs
- * 4. Secondary - Secondary buttons
- * 5. Tertiary/Accent - Highlights and selections
- * 6. Borders - All borders and dividers
- * 7. Highlights - Status/semantic colors
- * 8. Brand - Brand accent colors (use sparingly)
- */
-export declare const THEME: {
-    light: {
-        background: string;
-        card: string;
-        popover: string;
-        muted: string;
-        foreground: string;
-        cardForeground: string;
-        popoverForeground: string;
-        mutedForeground: string;
-        primary: string;
-        primaryForeground: string;
-        secondary: string;
-        secondaryForeground: string;
-        accent: string;
-        accentForeground: string;
-        border: string;
-        input: string;
-        ring: string;
-        destructive: string;
-        destructiveForeground: string;
-        success: string;
-        info: string;
-        warning: string;
-        brand1: string;
-        brand2: string;
-        brand3: string;
-        chart1: string;
-        chart2: string;
-        chart3: string;
-        chart4: string;
-        chart5: string;
-        radius: string;
-    };
-    dark: {
-        background: string;
-        card: string;
-        popover: string;
-        muted: string;
-        foreground: string;
-        cardForeground: string;
-        popoverForeground: string;
-        mutedForeground: string;
-        primary: string;
-        primaryForeground: string;
-        secondary: string;
-        secondaryForeground: string;
-        accent: string;
-        accentForeground: string;
-        border: string;
-        input: string;
-        ring: string;
-        destructive: string;
-        destructiveForeground: string;
-        success: string;
-        info: string;
-        warning: string;
-        brand1: string;
-        brand2: string;
-        brand3: string;
-        chart1: string;
-        chart2: string;
-        chart3: string;
-        chart4: string;
-        chart5: string;
-        radius: string;
-    };
-};
-/**
- * React Navigation theme configuration
- * Maps our custom theme to React Navigation's theme structure
- */
-export declare const NAV_THEME: Record<'light' | 'dark', Theme>;
-//# sourceMappingURL=theme.d.ts.map

package/lib/typescript/module/src/lib/theme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../../src/lib/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAE/E;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyGjB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,OAAO,GAAG,MAAM,EAAE,KAAK,CAyBrD,CAAC"}

package/lib/typescript/module/src/lib/utils.d.ts

@@ -1,111 +0,0 @@
-import { type ClassValue } from 'clsx';
-/**
- * Utility function to merge Tailwind CSS classes with proper precedence
- *
- * Combines clsx (for conditional classes) and tailwind-merge (for deduplication)
- * to create a single, optimized class string. Later classes override earlier ones.
- *
- * @param {...ClassValue[]} inputs - Class values to merge (strings, objects, arrays)
- * @returns {string} Merged and deduplicated class string
- *
- * @example
- * ```tsx
- * // Basic usage
- * cn('px-2 py-1', 'px-4') // => 'py-1 px-4'
- *
- * // With conditionals
- * cn('text-base', isDark && 'text-white', 'font-bold')
- * // => 'text-base text-white font-bold' (if isDark is true)
- *
- * // With objects
- * cn({
- *   'bg-primary': isPrimary,
- *   'bg-secondary': !isPrimary
- * })
- *
- * // Common component pattern
- * cn('base-classes', variant === 'large' && 'large-classes', className)
- * ```
- */
-export declare function cn(...inputs: ClassValue[]): string;
-/**
- * Applies dark mode classes with optional runtime control
- *
- * Provides three modes of operation:
- * 1. Static mode (darkMode undefined): Returns classes with `dark:` prefix for automatic switching
- * 2. Dark mode (darkMode true): Strips `dark:` prefix and returns only dark classes
- * 3. Light mode (darkMode false): Returns only base classes
- *
- * This function is useful when you need to programmatically control dark mode
- * instead of relying on Tailwind's automatic dark mode detection.
- *
- * @param {string} baseClasses - Classes to apply in light mode
- * @param {string} darkClasses - Classes to apply in dark mode (with or without `dark:` prefix)
- * @param {boolean} [darkMode] - Optional dark mode override (true/false/undefined)
- * @returns {string} Merged class string based on mode
- *
- * @example
- * ```tsx
- * // Static mode - use Tailwind's automatic detection
- * cnWithDark('bg-white', 'dark:bg-black')
- * // => 'bg-white dark:bg-black'
- *
- * // Programmatic dark mode
- * const { isDark } = useTheme();
- * cnWithDark('bg-white', 'dark:bg-black', isDark)
- * // => 'bg-black' (if isDark is true)
- * // => 'bg-white' (if isDark is false)
- *
- * // With multiple classes
- * cnWithDark(
- *   'bg-white text-black border-gray-200',
- *   'dark:bg-black dark:text-white dark:border-gray-800',
- *   isDark
- * )
- * ```
- *
- * @see {@link cn} for basic class merging
- * @see {@link useTheme} for accessing theme state
- */
-export declare function cnWithDark(baseClasses: string, darkClasses: string, darkMode?: boolean): string;
-/**
- * Get color value based on theme mode
- *
- * Simple utility to select between light and dark color values based on the
- * current theme. Primarily used for native platforms where Tailwind CSS
- * classes don't work with inline styles.
- *
- * @param {string} lightColor - Color value for light mode (CSS color, HSL, RGB, hex)
- * @param {string} darkColor - Color value for dark mode (CSS color, HSL, RGB, hex)
- * @param {boolean} [darkMode] - Whether dark mode is active (defaults to light if undefined)
- * @returns {string} The appropriate color value for the current mode
- *
- * @example
- * ```tsx
- * import { useTheme } from './ThemeProvider';
- *
- * function MyComponent() {
- *   const { isDark } = useTheme();
- *
- *   // Get color for inline styles
- *   const textColor = getThemeColor('#000000', '#ffffff', isDark);
- *   const bgColor = getThemeColor('hsl(0, 0%, 100%)', 'hsl(0, 0%, 10%)', isDark);
- *
- *   return (
- *     <View style={{ backgroundColor: bgColor }}>
- *       <NativeText style={{ color: textColor }}>
- *         Theme-aware text
- *       </NativeText>
- *     </View>
- *   );
- * }
- *
- * // Without theme context (defaults to light)
- * const color = getThemeColor('#000', '#fff'); // => '#000'
- * ```
- *
- * @see {@link useTheme} for accessing theme state
- * @see {@link getThemeColorValue} from theme-config for more advanced usage
- */
-export declare function getThemeColor(lightColor: string, darkColor: string, darkMode?: boolean): string;
-//# sourceMappingURL=utils.d.ts.map

package/lib/typescript/module/src/lib/utils.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAC;AAG7C;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,wBAAgB,UAAU,CACxB,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,MAAM,EACnB,QAAQ,CAAC,EAAE,OAAO,GACjB,MAAM,CAiBR;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,wBAAgB,aAAa,CAC3B,UAAU,EAAE,MAAM,EAClB,SAAS,EAAE,MAAM,EACjB,QAAQ,CAAC,EAAE,OAAO,GACjB,MAAM,CAKR"}

package/nativewind-env.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="nativewind/types" />
-
-/**
- * NativeWind type augmentations
- * This file ensures className prop is available on all React Native components
- * when using NativeWind with TypeScript
- */

package/src/components/ui/Accordion.tsx

@@ -1,255 +0,0 @@
-import * as AccordionPrimitive from '@rn-primitives/accordion';
-import { ChevronDown } from 'lucide-react-native';
-import { cssInterop } from 'nativewind';
-import { Platform, Pressable, View } from 'react-native';
-import Animated, {
-  FadeOutUp,
-  LayoutAnimationConfig,
-  LinearTransition,
-  useAnimatedStyle,
-  useDerivedValue,
-  withTiming,
-} from 'react-native-reanimated';
-import { cn } from '../../lib/utils';
-import { Icon } from './Icon';
-import { TextClassContext } from './Text';
-
-cssInterop(View, { className: 'style' });
-cssInterop(Pressable, { className: 'style' });
-
-/**
- * Root accordion container with smooth animations
- *
- * A vertically stacked set of interactive panels where only one or multiple panels can be expanded at a time.
- * Features smooth layout animations using Reanimated for a polished user experience.
- *
- * @component
- * @example
- * ```tsx
- * // Single selection
- * <Accordion type="single" collapsible defaultValue="item-1">
- *   <AccordionItem value="item-1">
- *     <AccordionTrigger>
- *       <Text>Question 1</Text>
- *     </AccordionTrigger>
- *     <AccordionContent>
- *       <Text>Answer 1</Text>
- *     </AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- *
- * // Multiple selection
- * <Accordion type="multiple">
- *   <AccordionItem value="item-1">
- *     <AccordionTrigger><Text>Section 1</Text></AccordionTrigger>
- *     <AccordionContent><Text>Content 1</Text></AccordionContent>
- *   </AccordionItem>
- *   <AccordionItem value="item-2">
- *     <AccordionTrigger><Text>Section 2</Text></AccordionTrigger>
- *     <AccordionContent><Text>Content 2</Text></AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
- *
- * @accessibility
- * - Implements WAI-ARIA accordion pattern
- * - Keyboard navigation with arrow keys and Enter/Space
- * - Proper ARIA attributes for expanded/collapsed states
- */
-function Accordion({
-  children,
-  ...props
-}: Omit<AccordionPrimitive.RootProps, 'asChild'> &
-  React.RefAttributes<AccordionPrimitive.RootRef>) {
-  return (
-    <LayoutAnimationConfig skipEntering>
-      <AccordionPrimitive.Root
-        {...(props as AccordionPrimitive.RootProps)}
-        asChild={Platform.OS !== 'web'}
-      >
-        <Animated.View layout={LinearTransition.duration(200)}>
-          {children}
-        </Animated.View>
-      </AccordionPrimitive.Root>
-    </LayoutAnimationConfig>
-  );
-}
-
-/**
- * Individual accordion item with border styling
- *
- * Contains a trigger and content section. Each item must have a unique value prop
- * for identification within the parent Accordion.
- *
- * @component
- * @example
- * ```tsx
- * <AccordionItem value="item-1">
- *   <AccordionTrigger>
- *     <Text>Click to expand</Text>
- *   </AccordionTrigger>
- *   <AccordionContent>
- *     <Text>Hidden content revealed on expansion</Text>
- *   </AccordionContent>
- * </AccordionItem>
- * ```
- */
-function AccordionItem({
-  children,
-  className,
-  value,
-  ...props
-}: AccordionPrimitive.ItemProps &
-  React.RefAttributes<AccordionPrimitive.ItemRef>) {
-  return (
-    <AccordionPrimitive.Item
-      className={cn(
-        'border-border border-b',
-        Platform.select({ web: 'last:border-b-0' }),
-        className
-      )}
-      value={value}
-      asChild
-      {...props}
-    >
-      <Animated.View
-        className="native:overflow-hidden"
-        layout={Platform.select({ native: LinearTransition.duration(200) })}
-      >
-        {children}
-      </Animated.View>
-    </AccordionPrimitive.Item>
-  );
-}
-
-const Trigger = (
-  Platform.OS === 'web' ? View : Pressable
-) as React.ComponentType<any>;
-
-/**
- * Clickable trigger button that toggles accordion item expansion
- *
- * Features an animated chevron icon that rotates based on expansion state.
- * Automatically manages focus states and hover effects on web.
- *
- * @component
- * @example
- * ```tsx
- * <AccordionTrigger>
- *   <Text>Click to toggle</Text>
- * </AccordionTrigger>
- * ```
- *
- * @accessibility
- * - Automatically includes chevron icon for visual expansion indicator
- * - Focus visible states for keyboard navigation on web
- * - Disabled state prevents interaction
- */
-function AccordionTrigger({
-  className,
-  children,
-  ...props
-}: AccordionPrimitive.TriggerProps & {
-  children?: React.ReactNode;
-} & React.RefAttributes<AccordionPrimitive.TriggerRef>) {
-  const { isExpanded } = AccordionPrimitive.useItemContext();
-
-  const progress = useDerivedValue(
-    () =>
-      isExpanded
-        ? withTiming(1, { duration: 250 })
-        : withTiming(0, { duration: 200 }),
-    [isExpanded]
-  );
-  const chevronStyle = useAnimatedStyle(
-    () => ({
-      transform: [{ rotate: `${progress.value * 180}deg` }],
-    }),
-    [progress]
-  );
-
-  return (
-    <TextClassContext.Provider
-      value={cn(
-        'text-foreground text-left text-sm font-medium',
-        Platform.select({ web: 'group-hover:underline' })
-      )}
-    >
-      <AccordionPrimitive.Header>
-        <AccordionPrimitive.Trigger {...props} asChild>
-          <Trigger
-            className={cn(
-              'flex-row items-start justify-between gap-4 rounded-md py-4 disabled:opacity-50',
-              Platform.select({
-                web: 'focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 outline-none transition-all hover:underline focus-visible:ring-[3px] disabled:pointer-events-none [&[data-state=open]>svg]:rotate-180',
-              }),
-              className
-            )}
-          >
-            <>{children}</>
-            <Animated.View style={chevronStyle}>
-              <Icon
-                as={ChevronDown}
-                size={16}
-                className={cn(
-                  'text-muted-foreground shrink-0',
-                  Platform.select({
-                    web: 'pointer-events-none translate-y-0.5 transition-transform duration-200',
-                  })
-                )}
-              />
-            </Animated.View>
-          </Trigger>
-        </AccordionPrimitive.Trigger>
-      </AccordionPrimitive.Header>
-    </TextClassContext.Provider>
-  );
-}
-
-/**
- * Collapsible content container with smooth animations
- *
- * Automatically animates height changes when expanding/collapsing. Uses platform-specific
- * animations (CSS transitions on web, Reanimated on native).
- *
- * @component
- * @example
- * ```tsx
- * <AccordionContent>
- *   <Text>This content slides in and out smoothly</Text>
- *   <View className="mt-2">
- *     <Text>Additional content here</Text>
- *   </View>
- * </AccordionContent>
- * ```
- */
-function AccordionContent({
-  className,
-  children,
-  ...props
-}: AccordionPrimitive.ContentProps &
-  React.RefAttributes<AccordionPrimitive.ContentRef>) {
-  const { isExpanded } = AccordionPrimitive.useItemContext();
-  return (
-    <TextClassContext.Provider value="text-foreground text-sm">
-      <AccordionPrimitive.Content
-        className={cn(
-          'overflow-hidden',
-          Platform.select({
-            web: isExpanded ? 'animate-accordion-down' : 'animate-accordion-up',
-          })
-        )}
-        {...props}
-      >
-        <Animated.View
-          exiting={Platform.select({ native: FadeOutUp.duration(200) })}
-          className={cn('pb-4', className)}
-        >
-          {children}
-        </Animated.View>
-      </AccordionPrimitive.Content>
-    </TextClassContext.Provider>
-  );
-}
-
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };