@umituz/react-native-design-system 4.25.90 → 4.25.91

package/dist/atoms/button/styles/buttonStyles.d.ts

@@ -1,33 +0,0 @@
-/**
- * Button Base Styles
- */
-export declare const buttonStyles: {
-    button: {
-        alignItems: "center";
-        justifyContent: "flex-start";
-        flexDirection: "row";
-    };
-    content: {
-        flexDirection: "row";
-        alignItems: "center";
-        justifyContent: "flex-start";
-    };
-    rowReverse: {
-        flexDirection: "row-reverse";
-    };
-    fullWidth: {
-        width: "100%";
-    };
-    disabled: {
-        opacity: number;
-    };
-    disabledText: {
-        opacity: number;
-    };
-    iconLeft: {
-        marginRight: number;
-    };
-    iconRight: {
-        marginLeft: number;
-    };
-};

package/dist/atoms/button/styles/buttonVariantStyles.d.ts

@@ -1,6 +0,0 @@
-/**
- * Button Variant Styles
- */
-import type { DesignTokens } from '../../../theme';
-import type { ButtonVariant, ButtonVariantStyles } from '../types';
-export declare const getVariantStyles: (variant: ButtonVariant, tokens: DesignTokens) => ButtonVariantStyles;

package/dist/atoms/button/types/index.d.ts

@@ -1,38 +0,0 @@
-/**
- * AtomicButton Type Definitions
- */
-import type { StyleProp } from 'react-native';
-import type { TextStyle, ViewStyle } from 'react-native';
-import type { IconName } from '../../icon';
-export type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'text' | 'danger';
-export type ButtonSize = 'sm' | 'md' | 'lg';
-export interface AtomicButtonProps {
-    readonly title?: string;
-    readonly children?: React.ReactNode;
-    readonly onPress: () => void;
-    readonly variant?: ButtonVariant;
-    readonly size?: ButtonSize;
-    readonly disabled?: boolean;
-    readonly loading?: boolean;
-    readonly icon?: IconName;
-    readonly iconPosition?: 'left' | 'right';
-    readonly fullWidth?: boolean;
-    readonly style?: StyleProp<ViewStyle>;
-    readonly textStyle?: StyleProp<TextStyle>;
-    readonly activeOpacity?: number;
-    readonly testID?: string;
-    readonly accessibilityLabel?: string;
-    readonly accessibilityHint?: string;
-    readonly accessibilityRole?: 'button' | 'link';
-}
-export interface ButtonSizeConfig {
-    readonly paddingVertical: number;
-    readonly paddingHorizontal: number;
-    readonly fontSize: number;
-    readonly iconSize: number;
-    readonly minHeight: number;
-}
-export interface ButtonVariantStyles {
-    readonly container: ViewStyle;
-    readonly text: TextStyle;
-}

package/dist/atoms/card/AtomicCard.d.ts

@@ -1,9 +0,0 @@
-/**
- * AtomicCard
- *
- * Unified card component that handles base card states, media, info, and glowing effects.
- * Replaces InfoCard, MediaCard, and GlowingCard molecules.
- */
-import React from 'react';
-import type { AtomicCardProps } from './types';
-export declare const AtomicCard: React.NamedExoticComponent<AtomicCardProps>;

package/dist/atoms/card/configs/cardPaddingConfig.d.ts

@@ -1,6 +0,0 @@
-/**
- * Card Padding Configurations
- */
-import type { DesignTokens } from '../../../theme';
-import type { CardPadding } from '../types';
-export declare const getCardPadding: (padding: CardPadding, tokens: DesignTokens) => number;

package/dist/atoms/card/styles/cardStyles.d.ts

@@ -1,58 +0,0 @@
-/**
- * Card Component Styles
- */
-import { ViewStyle } from 'react-native';
-import type { DesignTokens } from '../../../theme';
-import type { CardVariant } from '../types';
-export declare const getCardVariantStyles: (variant: CardVariant, tokens: DesignTokens) => {
-    container: ViewStyle;
-};
-export declare const cardStyles: {
-    container: {
-        overflow: "hidden";
-        width: "100%";
-    };
-    header: {
-        flexDirection: "row";
-        alignItems: "center";
-        marginBottom: number;
-    };
-    titleContainer: {
-        flex: number;
-    };
-    title: {
-        fontWeight: "700";
-    };
-    subtitle: {
-        marginTop: number;
-    };
-    description: {
-        marginTop: number;
-    };
-    image: {
-        width: "100%";
-    };
-    overlay: {
-        position: "absolute";
-        bottom: number;
-        left: number;
-        right: number;
-        backgroundColor: string;
-        padding: number;
-    };
-    badge: {
-        position: "absolute";
-        top: number;
-        right: number;
-        paddingHorizontal: number;
-        paddingVertical: number;
-        borderRadius: number;
-        zIndex: number;
-    };
-    selectedOverlay: {
-        position: "absolute";
-        top: number;
-        right: number;
-        zIndex: number;
-    };
-};

package/dist/atoms/card/types.d.ts

@@ -1,53 +0,0 @@
-/**
- * AtomicCard Type Definitions
- */
-import type { ReactNode } from 'react';
-import type { StyleProp, ViewStyle, TextStyle, GestureResponderEvent, ImageSourcePropType } from 'react-native';
-export type CardVariant = 'elevated' | 'outlined' | 'filled' | 'glass' | 'glowing';
-export type CardPadding = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export interface AtomicCardProps {
-    /** Main content of the card */
-    readonly children?: ReactNode;
-    /** Visual variant of the card */
-    readonly variant?: CardVariant;
-    /** Padding inside the card */
-    readonly padding?: CardPadding;
-    /** Optional title text */
-    readonly title?: string;
-    /** Optional subtitle text */
-    readonly subtitle?: string;
-    /** Optional description/content text */
-    readonly description?: string;
-    /** Image source to display */
-    readonly image?: string | ImageSourcePropType;
-    /** Whether the text should overlay the image */
-    readonly imageOverlay?: boolean;
-    /** Aspect ratio for the image */
-    readonly imageAspectRatio?: number;
-    /** Optional badge text displayed on corner */
-    readonly badge?: string;
-    /** Icon name to display on the left of title */
-    readonly leftIcon?: string;
-    /** Icon name to display on the right of title */
-    readonly rightIcon?: string;
-    /** Whether the card is in a selected state */
-    readonly selected?: boolean;
-    /** Color for the glow effect if variant is 'glowing' */
-    readonly glowColor?: string;
-    /** Intensity of the glow effect (0 to 1) */
-    readonly glowIntensity?: number;
-    /** Press handler */
-    readonly onPress?: (event: GestureResponderEvent) => void;
-    /** Whether the card is disabled */
-    readonly disabled?: boolean;
-    /** Custom container style */
-    readonly style?: StyleProp<ViewStyle>;
-    /** Custom title style */
-    readonly titleStyle?: StyleProp<TextStyle>;
-    /** Custom subtitle style */
-    readonly subtitleStyle?: StyleProp<TextStyle>;
-    /** Custom description style */
-    readonly descriptionStyle?: StyleProp<TextStyle>;
-    /** Test ID */
-    readonly testID?: string;
-}

package/dist/atoms/chip/AtomicChip.d.ts

@@ -1,8 +0,0 @@
-/**
- * AtomicChip Component
- * Refactored: Extracted configs, styles, and types
- */
-import React from 'react';
-import type { AtomicChipProps } from './types';
-export declare const AtomicChip: React.FC<AtomicChipProps>;
-export type { AtomicChipProps, ChipVariant, ChipSize, ChipColor } from './types';

package/dist/atoms/chip/configs/chipColorConfig.d.ts

@@ -1,6 +0,0 @@
-/**
- * Chip Color Configuration
- */
-import type { DesignTokens } from '../../../theme';
-import type { ChipColor, ChipVariant, ChipColorConfig } from '../types';
-export declare const getChipColorConfig: (color: ChipColor, variant: ChipVariant, tokens: DesignTokens) => ChipColorConfig;

package/dist/atoms/chip/configs/chipSizeConfig.d.ts

@@ -1,6 +0,0 @@
-/**
- * Chip Size Configuration
- */
-import type { DesignTokens } from '../../../theme';
-import type { ChipSize, ChipSizeConfig } from '../types';
-export declare const getChipSizeConfig: (size: ChipSize, tokens: DesignTokens) => ChipSizeConfig;

package/dist/atoms/chip/styles/chipStyles.d.ts

@@ -1,16 +0,0 @@
-/**
- * Chip Styles
- */
-import type { DesignTokens } from '../../../theme';
-import type { ChipVariant } from '../types';
-export declare const getChipBorderStyle: (variant: ChipVariant, tokens: DesignTokens) => {
-    borderWidth: number;
-    borderRadius: number;
-};
-export declare const getChipSelectedStyle: (selected: boolean, tokens: DesignTokens) => {
-    borderWidth?: undefined;
-    borderColor?: undefined;
-} | {
-    borderWidth: number;
-    borderColor: string;
-};

package/dist/atoms/chip/types/index.d.ts

@@ -1,37 +0,0 @@
-/**
- * AtomicChip Type Definitions
- */
-import type { StyleProp, ViewStyle } from 'react-native';
-import type { IconSize } from '../../icon';
-export type ChipVariant = 'filled' | 'outlined' | 'soft';
-export type ChipSize = 'sm' | 'md' | 'lg';
-export type ChipColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
-export interface AtomicChipProps {
-    readonly children: React.ReactNode;
-    readonly variant?: ChipVariant;
-    readonly size?: ChipSize;
-    readonly color?: ChipColor;
-    readonly backgroundColor?: string;
-    readonly textColor?: string;
-    readonly borderColor?: string;
-    readonly leadingIcon?: string;
-    readonly trailingIcon?: string;
-    readonly clickable?: boolean;
-    readonly onPress?: () => void;
-    readonly selected?: boolean;
-    readonly disabled?: boolean;
-    readonly style?: StyleProp<ViewStyle>;
-    readonly testID?: string;
-    readonly activeOpacity?: number;
-}
-export interface ChipSizeConfig {
-    readonly paddingHorizontal: number;
-    readonly paddingVertical: number;
-    readonly fontSize: number;
-    readonly iconSize: IconSize;
-}
-export interface ChipColorConfig {
-    readonly bg: string | undefined;
-    readonly text: string;
-    readonly border: string | undefined;
-}

package/dist/atoms/datepicker/components/DatePickerButton.d.ts

@@ -1,17 +0,0 @@
-/**
- * DatePickerButton Component
- *
- * Button component that triggers the date picker modal.
- * Extracted from AtomicDatePicker for better separation of concerns.
- */
-import React from 'react';
-interface DatePickerButtonProps {
-    onPress: () => void;
-    disabled?: boolean;
-    displayText: string;
-    hasValue: boolean;
-    error?: boolean;
-    testID?: string;
-}
-export declare const DatePickerButton: React.FC<DatePickerButtonProps>;
-export {};

package/dist/atoms/datepicker/components/DatePickerModal.d.ts

@@ -1,33 +0,0 @@
-/**
- * DatePickerModal Component
- *
- * Modal component for iOS date picker with proper styling and behavior.
- * Uses lazy-loaded @react-native-community/datetimepicker (optional peer dependency).
- */
-import React from 'react';
-type DateTimePickerEvent = {
-    type: 'set' | 'dismissed' | 'neutralButtonPressed';
-    nativeEvent: {
-        timestamp: number;
-        utcOffset: number;
-    };
-};
-interface DatePickerModalProps {
-    visible: boolean;
-    onClose: () => void;
-    onDateChange: (event: DateTimePickerEvent, date?: Date) => void;
-    currentDate: Date;
-    mode?: 'date' | 'time' | 'datetime';
-    minimumDate?: Date;
-    maximumDate?: Date;
-    overlayOpacity?: number;
-    titleText?: {
-        date?: string;
-        time?: string;
-        datetime?: string;
-    };
-    doneButtonText?: string;
-    testID?: string;
-}
-export declare const DatePickerModal: React.FC<DatePickerModalProps>;
-export {};

package/dist/atoms/datepicker/hooks/useDatePickerText.d.ts

@@ -1,16 +0,0 @@
-/**
- * useDatePickerText Hook
- * Handles date formatting and display text for date picker
- */
-import type { DatepickerMode } from '../types';
-interface UseDatePickerTextProps {
-    value: Date | null;
-    placeholder: string;
-    mode: DatepickerMode;
-}
-interface UseDatePickerTextResult {
-    displayText: string;
-    formatDate: (date: Date) => string;
-}
-export declare const useDatePickerText: ({ value, placeholder, mode, }: UseDatePickerTextProps) => UseDatePickerTextResult;
-export {};

package/dist/atoms/datepicker/styles/datePickerStyles.d.ts

@@ -1,22 +0,0 @@
-/**
- * DatePicker Styles
- * StyleSheet generator for AtomicDatePicker component
- */
-import type { DesignTokens } from '../../../theme';
-export declare const getDatePickerStyles: (tokens: DesignTokens) => {
-    container: {
-        marginBottom: number;
-    };
-    label: {
-        fontSize: number;
-        fontWeight: "600";
-        color: string;
-        marginBottom: number;
-    };
-    errorText: {
-        fontSize: number;
-        color: string;
-        marginTop: number;
-        marginLeft: number;
-    };
-};

package/dist/atoms/datepicker/types.d.ts

@@ -1,5 +0,0 @@
-export type DatepickerMode = 'date' | 'time' | 'datetime';
-export interface DatePickerBaseProps {
-    testID?: string;
-    disabled?: boolean;
-}

package/dist/atoms/fab/styles/fabStyles.d.ts

@@ -1,46 +0,0 @@
-/**
- * FAB (Floating Action Button) Styles
- *
- * Material Design 3 compliant FAB sizing and styling
- * Used by AtomicFab component
- */
-import type { ViewStyle } from 'react-native';
-import type { FabSizeConfig, FabVariantConfig } from '../types';
-/**
- * FAB size configurations based on Material Design 3
- * - sm: Small FAB (40x40)
- * - md: Regular FAB (56x56) - Default
- * - lg: Large FAB (72x72)
- */
-export declare const FAB_SIZES: Record<'sm' | 'md' | 'lg', FabSizeConfig>;
-/**
- * Get FAB variant configurations based on design tokens
- * @param tokens - Design tokens from theme
- * @returns Variant configurations for primary, secondary, and surface
- */
-export declare function getFabVariants(tokens: {
-    colors: {
-        primary: string;
-        onPrimary: string;
-        secondary: string;
-        onSecondary: string;
-        surface: string;
-        onSurface: string;
-    };
-}): Record<'primary' | 'secondary' | 'surface', FabVariantConfig>;
-/**
- * Get icon size based on FAB size
- * @param size - FAB size variant
- * @returns Icon size in pixels
- */
-export declare function getFabIconSize(size: 'sm' | 'md' | 'lg'): number;
-/**
- * Get FAB border style for depth (no shadows per CLAUDE.md)
- * @param tokens - Design tokens from theme
- * @returns Border style object
- */
-export declare function getFabBorder(tokens: {
-    colors: {
-        border: string;
-    };
-}): ViewStyle;

package/dist/atoms/fab/types.d.ts

@@ -1,75 +0,0 @@
-import { StyleProp, ViewStyle } from 'react-native';
-/**
- * FAB (Floating Action Button) size variants
- * Based on Material Design 3 standards
- */
-export type FabSize = 'sm' | 'md' | 'lg';
-/**
- * FAB variant types
- * - primary: Main action (uses primary color)
- * - secondary: Secondary action (uses secondary color)
- * - surface: Neutral action (uses surface color with border)
- */
-export type FabVariant = 'primary' | 'secondary' | 'surface';
-/**
- * FAB configuration for variant styling
- */
-export interface FabVariantConfig {
-    backgroundColor: string;
-    iconColor: string;
-}
-/**
- * FAB configuration for size styling
- */
-export interface FabSizeConfig {
-    width: number;
-    height: number;
-    borderRadius: number;
-}
-/**
- * AtomicFab component props
- */
-export interface AtomicFabProps {
-    /**
-     * Icon name to display (required)
-     * Any MaterialIcons name (see https://fonts.google.com/icons)
-     * Examples: 'add', 'edit', 'camera', etc.
-     */
-    icon: string;
-    /**
-     * Callback when FAB is pressed
-     */
-    onPress: () => void;
-    /**
-     * Visual variant of the FAB
-     * @default 'primary'
-     */
-    variant?: FabVariant;
-    /**
-     * Size of the FAB
-     * @default 'md'
-     */
-    size?: FabSize;
-    /**
-     * Whether the FAB is disabled
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Custom style for the FAB container
-     */
-    style?: StyleProp<ViewStyle>;
-    /**
-     * Test ID for testing
-     */
-    testID?: string;
-    /**
-     * Accessibility label
-     */
-    accessibilityLabel?: string;
-    /**
-     * Active opacity for touch feedback
-     * @default 0.7
-     */
-    activeOpacity?: number;
-}

package/dist/atoms/icon/AtomicIcon.d.ts

@@ -1,59 +0,0 @@
-/**
- * AtomicIcon - Agnostic Icon Component
- *
- * This component is completely icon-library agnostic.
- * Apps MUST provide their own icon renderer via DesignSystemProvider.
- *
- * @example
- * // In your app, provide an icon renderer:
- * import { MaterialIcons } from '@expo/vector-icons';
- *
- * <DesignSystemProvider
- *   iconRenderer={({ name, size, color }) => (
- *     <MaterialIcons name={name} size={size} color={color} />
- *   )}
- * >
- *   <App />
- * </DesignSystemProvider>
- *
- * // Then use AtomicIcon anywhere:
- * <AtomicIcon name="favorite" size="md" color="primary" />
- */
-import React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-import { type IconSize as BaseIconSize, type IconColor } from './AtomicIcon.types';
-export type IconSize = BaseIconSize;
-export type IconName = string;
-export type { IconColor };
-export interface AtomicIconProps {
-    /** Icon name - interpreted by the app's icon renderer */
-    name?: string;
-    /** Semantic size preset */
-    size?: IconSize;
-    /** Custom size in pixels (overrides size) */
-    customSize?: number;
-    /** Semantic color from theme */
-    color?: IconColor;
-    /** Custom color (overrides color) */
-    customColor?: string;
-    /** Custom SVG path for inline SVG icons */
-    svgPath?: string;
-    /** ViewBox for custom SVG (default: 0 0 24 24) */
-    svgViewBox?: string;
-    /** Add circular background */
-    withBackground?: boolean;
-    /** Background color */
-    backgroundColor?: string;
-    /** Accessibility label */
-    accessibilityLabel?: string;
-    /** Accessibility role */
-    accessibilityRole?: import('react-native').AccessibilityRole;
-    /** Test ID */
-    testID?: string;
-    /** Additional styles */
-    style?: StyleProp<ViewStyle>;
-}
-/**
- * Agnostic icon component - requires iconRenderer in DesignSystemProvider
- */
-export declare const AtomicIcon: React.FC<AtomicIconProps>;

package/dist/atoms/icon/AtomicIcon.types.d.ts

@@ -1,32 +0,0 @@
-/**
- * Icon Type Definitions
- * Agnostic icon types - no dependency on any icon library
- */
-/**
- * Icon name - just a string, interpreted by app's icon renderer
- */
-export type IconName = string;
-/**
- * Semantic icon size presets
- */
-export type IconSizePreset = "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
-/**
- * Icon size - preset name or custom number in pixels
- */
-export type IconSize = IconSizePreset | number;
-/**
- * Semantic color names that map to theme tokens
- */
-export type IconColor = "primary" | "secondary" | "success" | "warning" | "error" | "info" | "onSurface" | "surfaceVariant" | "onPrimary" | "onSecondary" | "textInverse" | "textPrimary" | "textSecondary" | "textTertiary" | "onSurfaceVariant";
-/**
- * Icon size mapping to pixels
- */
-export declare const ICON_SIZES: Record<IconSizePreset, number>;
-/**
- * Get icon size in pixels
- */
-export declare function getIconSize(size: IconSize): number;
-/**
- * Check if size is a preset
- */
-export declare function isIconSizePreset(size: IconSize): size is IconSizePreset;

package/dist/atoms/icon/components/iconRenderer.d.ts

@@ -1,43 +0,0 @@
-/**
- * Icon Renderer Components
- * SVG rendering and background rendering logic
- */
-import React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-import type { IconRenderProps } from '../iconStore';
-/**
- * Renders an SVG icon from path data
- *
- * @param svgPath - SVG path string
- * @param svgViewBox - SVG viewBox attribute
- * @param size - Icon size in pixels
- * @param color - Icon color
- * @param testID - Test ID for testing
- * @param accessibilityLabel - Accessibility label
- * @returns SVG element
- */
-export declare function renderSvgIcon(svgPath: string, svgViewBox: string, size: number, color: string, testID?: string, accessibilityLabel?: string, accessibilityRole?: import('react-native').AccessibilityRole): React.ReactElement;
-/**
- * Renders an icon with a circular background
- *
- * @param iconElement - Icon element to wrap
- * @param size - Icon size in pixels
- * @param backgroundColor - Background color
- * @param style - Additional styles
- * @param testID - Test ID for testing
- * @param accessibilityLabel - Accessibility label
- * @returns Wrapped icon with background
- */
-export declare function renderWithBackground(iconElement: React.ReactNode, size: number, backgroundColor: string, style?: StyleProp<ViewStyle>, testID?: string, accessibilityLabel?: string, accessibilityRole?: import('react-native').AccessibilityRole): React.ReactElement;
-/**
- * Builds render props for custom icon renderer
- *
- * @param name - Icon name
- * @param size - Icon size in pixels
- * @param color - Icon color
- * @param style - Additional styles
- * @param testID - Test ID
- * @param accessibilityLabel - Accessibility label
- * @returns Icon render props
- */
-export declare function buildIconRenderProps(name: string, size: number, color: string, style?: StyleProp<ViewStyle>, testID?: string, accessibilityLabel?: string, accessibilityRole?: import('react-native').AccessibilityRole): IconRenderProps;