zero-to-app 3.2.1 → 3.2.2

package/dist/components/ui/collapsible.d.ts

@@ -0,0 +1,88 @@
+import React from 'react';
+import { View, type ViewProps } from 'react-native';
+import { type IconLibrary } from '../../icons';
+/**
+ * Props for the Collapsible component.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Collapsible title="More details">
+ *   <Typography>Hidden content that can be expanded</Typography>
+ * </Collapsible>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Controlled state
+ * const [open, setOpen] = useState(false);
+ * <Collapsible title="Settings" open={open} onToggle={setOpen}>
+ *   <Typography>Settings content</Typography>
+ * </Collapsible>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Custom styling
+ * <Collapsible
+ *   title="FAQ Item"
+ *   headerVariant="surfaceContainer"
+ *   contentVariant="surface"
+ * >
+ *   <Typography>Answer to the question</Typography>
+ * </Collapsible>
+ * ```
+ */
+export interface CollapsibleProps extends Omit<ViewProps, 'children'> {
+    /** Title text displayed in the header */
+    title: string;
+    /** Content to show when expanded */
+    children: React.ReactNode;
+    /**
+     * Controlled open state. If provided, component becomes controlled.
+     */
+    open?: boolean;
+    /**
+     * Whether the collapsible starts expanded (uncontrolled mode).
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * Callback when the open state changes.
+     */
+    onToggle?: (isOpen: boolean) => void;
+    /**
+     * ThemedView variant for the icon button background.
+     * @default 'surfaceContainer'
+     */
+    headerVariant?: 'surface' | 'surfaceContainer' | 'card' | 'primary';
+    /**
+     * ThemedView variant for the content area.
+     * @default 'surfaceContainer'
+     */
+    contentVariant?: 'surface' | 'surfaceContainer' | 'card';
+    /**
+     * Icon library to use for the chevron.
+     * @default 'Feather'
+     */
+    iconLibrary?: IconLibrary;
+    /**
+     * Custom icon name for the chevron.
+     * @default 'chevron-right'
+     */
+    iconName?: string;
+    /** Test ID for testing */
+    testID?: string;
+}
+/**
+ * Collapsible component for expandable/collapsible content sections.
+ *
+ * Features:
+ * - Animated expand/collapse with rotation and fade
+ * - Controlled and uncontrolled modes
+ * - Customizable header and content styling
+ * - Accessible with proper press states
+ */
+declare const Collapsible: React.ForwardRefExoticComponent<CollapsibleProps & React.RefAttributes<View>>;
+export { Collapsible };
+//# sourceMappingURL=collapsible.d.ts.map

package/dist/components/ui/collapsible.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../../components/ui/collapsible.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAyB,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAW3E,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAI3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACnE,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,GAAG,kBAAkB,GAAG,MAAM,GAAG,SAAS,CAAC;IACpE;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,GAAG,kBAAkB,GAAG,MAAM,CAAC;IACzD;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAOD;;;;;;;;GAQG;AACH,QAAA,MAAM,WAAW,+EAgFhB,CAAC;AAuBF,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/components/ui/collapsible.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 1. IMPORTS
+import { forwardRef, useEffect, useState } from 'react';
+import { Pressable, StyleSheet, View } from 'react-native';
+import Animated, { FadeIn, FadeOut, useAnimatedStyle, useSharedValue, withTiming, } from 'react-native-reanimated';
+import { Typography } from './typography';
+import { ThemedView } from './themed-view';
+import { useTheme } from '../../theme';
+import { renderIcon } from '../../icons';
+// Icon button dimension — also used to indent the content panel beneath the text
+const ICON_BUTTON_SIZE = 32;
+// 3. COMPONENT
+/**
+ * Collapsible component for expandable/collapsible content sections.
+ *
+ * Features:
+ * - Animated expand/collapse with rotation and fade
+ * - Controlled and uncontrolled modes
+ * - Customizable header and content styling
+ * - Accessible with proper press states
+ */
+const Collapsible = forwardRef(({ title, children, open: controlledOpen, defaultOpen = false, onToggle, headerVariant = 'surfaceContainer', contentVariant = 'surfaceContainer', iconLibrary = 'Feather', iconName = 'chevron-right', testID, style, ...rest }, ref) => {
+    const theme = useTheme();
+    // Support both controlled and uncontrolled modes
+    const [internalOpen, setInternalOpen] = useState(defaultOpen);
+    const isControlled = controlledOpen !== undefined;
+    const isOpen = isControlled ? controlledOpen : internalOpen;
+    // Animation value for chevron rotation
+    const rotation = useSharedValue(isOpen ? 90 : 0);
+    // Sync rotation whenever isOpen changes (handles both controlled and uncontrolled modes)
+    useEffect(() => {
+        rotation.value = withTiming(isOpen ? 90 : 0, { duration: 200 });
+    }, [isOpen]);
+    const handlePress = () => {
+        const newState = !isOpen;
+        if (!isControlled) {
+            setInternalOpen(newState);
+        }
+        onToggle?.(newState);
+    };
+    const animatedIconStyle = useAnimatedStyle(() => ({
+        transform: [{ rotate: `${rotation.value}deg` }],
+    }));
+    return (_jsxs(View, { ref: ref, style: style, testID: testID, ...rest, children: [_jsxs(Pressable, { style: ({ pressed }) => [styles.heading, { gap: theme.spacing.sm }, pressed && styles.pressedHeading], onPress: handlePress, accessibilityRole: "button", accessibilityState: { expanded: isOpen }, accessibilityLabel: `${title}, ${isOpen ? 'expanded' : 'collapsed'}`, children: [_jsx(ThemedView, { variant: headerVariant, style: [styles.iconButton, { borderRadius: theme.shape.surfaceBorderRadius }], children: _jsx(Animated.View, { style: animatedIconStyle, children: renderIcon({ name: iconName }, iconLibrary, 14, theme.onSurface) }) }), _jsx(Typography, { variant: "labelLarge", children: title })] }), isOpen && (_jsx(Animated.View, { entering: FadeIn.duration(200), exiting: FadeOut.duration(150), children: _jsx(ThemedView, { variant: contentVariant, style: [styles.content, { marginTop: theme.spacing.md, marginLeft: ICON_BUTTON_SIZE, padding: theme.spacing.lg, borderRadius: theme.shape.surfaceBorderRadius }], children: children }) }))] }));
+});
+Collapsible.displayName = 'Collapsible';
+// 4. STYLES
+const styles = StyleSheet.create({
+    heading: {
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    pressedHeading: {
+        opacity: 0.7,
+    },
+    iconButton: {
+        width: ICON_BUTTON_SIZE,
+        height: ICON_BUTTON_SIZE,
+        justifyContent: 'center',
+        alignItems: 'center',
+    },
+    content: {},
+});
+// 5. EXPORTS
+export { Collapsible };
+//# sourceMappingURL=collapsible.js.map

package/dist/components/ui/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","sourceRoot":"","sources":["../../../components/ui/collapsible.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/container.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type ThemedViewProps } from './themed-view';
+export interface ContainerProps extends ThemedViewProps {
+    /** Maximum width in pixels. @default 1000 */
+    maxWidth?: number;
+}
+/**
+ * Container component that constrains content width for better readability on large screens.
+ * Centers content horizontally and applies consistent padding.
+ *
+ * Common for web layouts, marketing pages, and content-heavy screens.
+ *
+ * @example
+ * ```tsx
+ * <Screen scrollable>
+ *   <Container>
+ *     <Typography>Constrained content</Typography>
+ *   </Container>
+ * </Screen>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Custom max-width
+ * <Container maxWidth={800}>
+ *   <Typography>Narrower content</Typography>
+ * </Container>
+ * ```
+ */
+export declare const Container: React.FC<ContainerProps>;
+//# sourceMappingURL=container.d.ts.map

package/dist/components/ui/container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../components/ui/container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAGjE,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAwB9C,CAAC"}

package/dist/components/ui/container.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StyleSheet } from 'react-native';
+import { ThemedView } from './themed-view';
+import { useTheme } from '../../theme';
+/**
+ * Container component that constrains content width for better readability on large screens.
+ * Centers content horizontally and applies consistent padding.
+ *
+ * Common for web layouts, marketing pages, and content-heavy screens.
+ *
+ * @example
+ * ```tsx
+ * <Screen scrollable>
+ *   <Container>
+ *     <Typography>Constrained content</Typography>
+ *   </Container>
+ * </Screen>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Custom max-width
+ * <Container maxWidth={800}>
+ *   <Typography>Narrower content</Typography>
+ * </Container>
+ * ```
+ */
+export const Container = ({ children, maxWidth = 1000, style, ...rest }) => {
+    const theme = useTheme();
+    return (_jsx(ThemedView, { style: [
+            styles.container,
+            {
+                maxWidth,
+                paddingHorizontal: theme.spacing.xl,
+            },
+            style,
+        ], rounded: false, ...rest, children: children }));
+};
+Container.displayName = 'Container';
+const styles = StyleSheet.create({
+    container: {
+        width: '100%',
+        alignSelf: 'center',
+    },
+});
+//# sourceMappingURL=container.js.map

package/dist/components/ui/container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../components/ui/container.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAwB,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAOvC;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAClD,QAAQ,EACR,QAAQ,GAAG,IAAI,EACf,KAAK,EACL,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE;YACL,MAAM,CAAC,SAAS;YAChB;gBACE,QAAQ;gBACR,iBAAiB,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;aACpC;YACD,KAAK;SACN,EACD,OAAO,EAAE,KAAK,KACV,IAAI,YAEP,QAAQ,GACE,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,QAAQ;KACpB;CACF,CAAC,CAAC"}

package/dist/components/ui/fab.d.ts

@@ -0,0 +1,51 @@
+import React from 'react';
+import { GestureResponderEvent, View } from 'react-native';
+import type { InteractiveComponentProps } from '../shared/types';
+import type { IconConfig } from './button';
+/** FAB variant controlling color scheme */
+export type FABVariant = 'primary' | 'secondary' | 'tertiary' | 'surface';
+/** FAB size controlling dimensions */
+export type FABSize = 'small' | 'medium' | 'large';
+/**
+ * Props for the FAB (Floating Action Button) component.
+ *
+ * @example
+ * ```tsx
+ * // Standard FAB
+ * <FAB icon={{ name: 'plus' }} onPress={() => {}} />
+ *
+ * // Extended FAB with label
+ * <FAB icon={{ name: 'edit-2' }} label="Compose" onPress={() => {}} />
+ *
+ * // Small surface FAB
+ * <FAB icon={{ name: 'arrow-up' }} variant="surface" size="small" onPress={() => {}} />
+ * ```
+ */
+export interface FABProps extends Omit<InteractiveComponentProps, 'onPress'> {
+    /** Required icon configuration */
+    icon: IconConfig;
+    /** Optional label for extended FAB */
+    label?: string;
+    /**
+     * Color variant following M3 FAB spec.
+     * @default 'primary'
+     */
+    variant?: FABVariant;
+    /**
+     * Size variant controlling dimensions and icon size.
+     * @default 'medium'
+     */
+    size?: FABSize;
+    /** Press handler */
+    onPress?: (event?: GestureResponderEvent) => void;
+}
+/**
+ * Material Design 3 Floating Action Button (FAB)
+ * https://m3.material.io/components/floating-action-button
+ *
+ * Supports four color variants and three sizes.
+ * When a `label` is provided, renders as an Extended FAB.
+ */
+declare const FAB: React.ForwardRefExoticComponent<FABProps & React.RefAttributes<View>>;
+export { FAB };
+//# sourceMappingURL=fab.d.ts.map

package/dist/components/ui/fab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fab.d.ts","sourceRoot":"","sources":["../../../components/ui/fab.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EACL,qBAAqB,EAIrB,IAAI,EAIL,MAAM,cAAc,CAAC;AAItB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAI3C,2CAA2C;AAC3C,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,CAAC;AAE1E,sCAAsC;AACtC,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEnD;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,yBAAyB,EAAE,SAAS,CAAC;IAC1E,kCAAkC;IAClC,IAAI,EAAE,UAAU,CAAC;IACjB,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,oBAAoB;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACnD;AAWD;;;;;;GAMG;AACH,QAAA,MAAM,GAAG,uEAyJP,CAAC;AAqBH,OAAO,EAAE,GAAG,EAAE,CAAC"}

package/dist/components/ui/fab.js

@@ -0,0 +1,142 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 1. IMPORTS
+import { forwardRef, useEffect, useState } from 'react';
+import { Platform, Pressable, StyleSheet, View, } from 'react-native';
+import { Typography } from './typography';
+import { useTheme } from '../../theme';
+import { renderIcon } from '../../icons';
+import { blurOnWeb } from '../shared/utils';
+// Size configuration (borderRadius resolved from theme at render time)
+const SIZE_CONFIG = {
+    small: { dimension: 40, iconSize: 20, radiusKey: 'md' },
+    medium: { dimension: 56, iconSize: 24, radiusKey: 'lg' },
+    large: { dimension: 96, iconSize: 36, radiusKey: 'xl' },
+};
+// 3. COMPONENT
+/**
+ * Material Design 3 Floating Action Button (FAB)
+ * https://m3.material.io/components/floating-action-button
+ *
+ * Supports four color variants and three sizes.
+ * When a `label` is provided, renders as an Extended FAB.
+ */
+const FAB = forwardRef(({ icon, label, variant = 'primary', size = 'medium', disabled = false, onPress, style, testID, accessibilityLabel, accessibilityHint, }, ref) => {
+    const theme = useTheme();
+    const tokens = theme.tokens;
+    const [hovered, setHovered] = useState(false);
+    const [reduceMotionEnabled, setReduceMotionEnabled] = useState(false);
+    useEffect(() => {
+        let mounted = true;
+        try {
+            // eslint-disable-next-line @typescript-eslint/no-var-requires
+            const { AccessibilityInfo } = require('react-native');
+            AccessibilityInfo?.isReduceMotionEnabled?.().then((enabled) => {
+                if (mounted)
+                    setReduceMotionEnabled(!!enabled);
+            });
+        }
+        catch (e) {
+            // ignore if not available
+        }
+        return () => { mounted = false; };
+    }, []);
+    const sizeConfig = SIZE_CONFIG[size];
+    const isExtended = !!label;
+    // Color mapping per variant
+    const getColors = () => {
+        if (disabled) {
+            return {
+                bg: theme.onSurface + '1F', // 12% opacity
+                fg: theme.onSurface + '61', // 38% opacity
+            };
+        }
+        switch (variant) {
+            case 'primary':
+                return { bg: theme.primaryContainer, fg: theme.onPrimaryContainer };
+            case 'secondary':
+                return { bg: theme.secondaryContainer, fg: theme.onSecondaryContainer };
+            case 'tertiary':
+                return { bg: theme.tertiaryContainer, fg: theme.onTertiaryContainer };
+            case 'surface':
+                return { bg: theme.surface, fg: theme.primary };
+        }
+    };
+    const colors = getColors();
+    const getContainerStyle = ({ pressed }) => {
+        const elevation = pressed ? tokens.elevation.level1 : tokens.elevation.level3;
+        const baseStyle = [
+            styles.container,
+            {
+                backgroundColor: colors.bg,
+                borderRadius: theme.borderRadius[sizeConfig.radiusKey],
+            },
+        ];
+        if (isExtended) {
+            baseStyle.push({
+                height: sizeConfig.dimension,
+                paddingHorizontal: theme.spacing.lg,
+                minWidth: sizeConfig.dimension,
+            });
+        }
+        else {
+            baseStyle.push({
+                width: sizeConfig.dimension,
+                height: sizeConfig.dimension,
+            });
+        }
+        if (disabled) {
+            baseStyle.push(styles.disabled);
+        }
+        // Elevation shadow
+        if (!disabled && elevation > 0) {
+            baseStyle.push({
+                shadowColor: theme.shadow,
+                shadowOffset: { width: 0, height: Math.max(1, Math.floor(elevation / 2)) },
+                shadowOpacity: 0.08,
+                shadowRadius: Math.max(1, Math.floor(elevation / 2)),
+                elevation: elevation,
+            });
+        }
+        // Hover/press transforms
+        if (!reduceMotionEnabled) {
+            if (pressed) {
+                baseStyle.push({ transform: [{ scale: 0.997 }] });
+            }
+            else if (hovered && Platform.OS === 'web') {
+                baseStyle.push({ transform: [{ translateY: -1 }, { scale: 1.02 }] });
+            }
+        }
+        if (style) {
+            baseStyle.push(style);
+        }
+        return baseStyle;
+    };
+    const iconSize = icon.size || sizeConfig.iconSize;
+    const iconLibrary = icon.library || 'Feather';
+    const iconColor = icon.color || colors.fg;
+    return (_jsx(Pressable, { ref: ref, testID: testID, onPress: disabled ? undefined : (e) => {
+            blurOnWeb(e);
+            onPress?.(e);
+        }, disabled: disabled, style: getContainerStyle, onHoverIn: () => setHovered(true), onHoverOut: () => setHovered(false), accessibilityRole: "button", accessibilityLabel: accessibilityLabel ?? label ?? icon.name, accessibilityHint: accessibilityHint, accessibilityState: { disabled }, android_ripple: !disabled && Platform.OS === 'android'
+            ? { color: colors.fg + '40', borderless: false }
+            : undefined, children: _jsxs(View, { style: [styles.content, { gap: theme.spacing.sm }], children: [renderIcon(icon, iconLibrary, iconSize, iconColor), isExtended && (_jsx(Typography, { variant: "labelLarge", weight: "medium", color: colors.fg, numberOfLines: 1, children: label }))] }) }));
+});
+FAB.displayName = 'FAB';
+// 4. STYLES
+const styles = StyleSheet.create({
+    container: {
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    content: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    disabled: {
+        opacity: 0.38,
+    },
+});
+// 5. EXPORTS
+export { FAB };
+//# sourceMappingURL=fab.js.map

package/dist/components/ui/fab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../../components/ui/fab.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/index.d.ts

@@ -0,0 +1,23 @@
+export { Button } from './button';
+export type { ButtonProps, ButtonVariant, IconConfig } from './button';
+export { ButtonVariants } from './button';
+export { Chip } from './chip';
+export type { ChipProps, ChipVariant, ChipIconConfig } from './chip';
+export { ChipVariants } from './chip';
+export { FAB } from './fab';
+export type { FABProps, FABVariant, FABSize } from './fab';
+export { Collapsible } from './collapsible';
+export type { CollapsibleProps } from './collapsible';
+export { Typography } from './typography';
+export type { TypographyProps, TypographyVariant, TypographyWeight, TypographyAlign } from './typography';
+export { ThemedView } from './themed-view';
+export type { ThemedViewProps, ThemedViewVariant } from './themed-view';
+export { Screen } from './screen';
+export type { ScreenProps } from './screen';
+export { Container } from './container';
+export type { ContainerProps } from './container';
+export { ThemedImage } from './themed-image';
+export type { ThemedImageProps } from './themed-image';
+export { Slider } from './slider';
+export type { SliderProps } from './slider';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/ui/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAG1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAGtC,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAG3D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGtD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC1G,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGxE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAGlD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/ui/index.js

@@ -0,0 +1,22 @@
+// UI components
+export { Button } from './button';
+export { ButtonVariants } from './button';
+// Chip
+export { Chip } from './chip';
+export { ChipVariants } from './chip';
+// FAB
+export { FAB } from './fab';
+// Collapsible
+export { Collapsible } from './collapsible';
+// Typography
+export { Typography } from './typography';
+export { ThemedView } from './themed-view';
+// Screen
+export { Screen } from './screen';
+// Container
+export { Container } from './container';
+// ThemedImage
+export { ThemedImage } from './themed-image';
+// Slider
+export { Slider } from './slider';
+//# sourceMappingURL=index.js.map

package/dist/components/ui/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/ui/index.ts"],"names":[],"mappings":"AAAA,gBAAgB;AAChB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO;AACP,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEtC,MAAM;AACN,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5B,cAAc;AACd,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,aAAa;AACb,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAG3C,SAAS;AACT,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAGlC,YAAY;AACZ,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,cAAc;AACd,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,SAAS;AACT,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/ui/screen.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+import { type Edge } from 'react-native-safe-area-context';
+import { type ThemedViewVariant } from './themed-view';
+export interface ScreenProps {
+    /** Screen content */
+    children: React.ReactNode;
+    /** Whether to wrap content in ScrollView. @default false */
+    scrollable?: boolean;
+    /** Themed background variant. @default 'background' */
+    variant?: ThemedViewVariant;
+    /** Which safe area edges to respect. @default ['bottom'] */
+    edges?: Edge[];
+    /** Styles for the ScrollView content container (only applies if scrollable=true) */
+    contentContainerStyle?: StyleProp<ViewStyle>;
+    /** Styles for the outer container */
+    style?: StyleProp<ViewStyle>;
+    /** Test ID for testing */
+    testID?: string;
+    /** Whether to show vertical scroll indicator. @default true */
+    showsVerticalScrollIndicator?: boolean;
+    /**
+     * Whether to apply default top padding. @default true
+     * Set to false for full-bleed layouts (e.g. hero images at the top).
+     * Bottom padding is always applied when edges includes 'bottom'.
+     */
+    padded?: boolean;
+}
+/**
+ * Screen component providing consistent layout with safe areas and optional scrolling.
+ *
+ * @example
+ * ```tsx
+ * <Screen scrollable>
+ *   <Typography>Content</Typography>
+ * </Screen>
+ * ```
+ */
+export declare const Screen: React.FC<ScreenProps>;
+//# sourceMappingURL=screen.d.ts.map

package/dist/components/ui/screen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"screen.d.ts","sourceRoot":"","sources":["../../../components/ui/screen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA0B,KAAK,SAAS,EAAE,KAAK,SAAS,EAAY,MAAM,cAAc,CAAC;AAChG,OAAO,EAAgB,KAAK,IAAI,EAAqB,MAAM,gCAAgC,CAAC;AAC5F,OAAO,EAAc,KAAK,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGnE,MAAM,WAAW,WAAW;IAC1B,qBAAqB;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,4DAA4D;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uDAAuD;IACvD,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,4DAA4D;IAC5D,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,oFAAoF;IACpF,qBAAqB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7C,qCAAqC;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,0BAA0B;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+DAA+D;IAC/D,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAwDxC,CAAC"}

package/dist/components/ui/screen.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ScrollView, StyleSheet, Platform } from 'react-native';
+import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
+import { ThemedView } from './themed-view';
+import { useTheme } from '../../theme';
+/**
+ * Screen component providing consistent layout with safe areas and optional scrolling.
+ *
+ * @example
+ * ```tsx
+ * <Screen scrollable>
+ *   <Typography>Content</Typography>
+ * </Screen>
+ * ```
+ */
+export const Screen = ({ children, scrollable = false, variant = 'background', edges = ['bottom'], contentContainerStyle, style, testID, showsVerticalScrollIndicator = true, padded = true, }) => {
+    const insets = useSafeAreaInsets();
+    const theme = useTheme();
+    // Strip 'bottom' from SafeAreaView edges — we manage bottom padding directly.
+    // With NativeTabs on Android, insets.bottom inside a tab screen is 0 (the native tab bar
+    // already constrains the content frame), so SafeAreaView's 'bottom' edge would double-apply
+    // the nav bar inset. Stripping it and using 0 on Android fixes that bug.
+    // On iOS, insets.bottom does not reflect the tab bar height, so we use a fixed 80dp to clear
+    // the standard tab bar (~46dp) + home indicator (~34dp).
+    const safeAreaEdges = edges.filter((e) => e !== 'bottom');
+    const bottomPadding = edges.includes('bottom') ? (Platform.OS === 'ios' ? 100 : 24) : 0;
+    return (_jsx(ThemedView, { variant: variant, rounded: false, style: styles.container, children: _jsx(SafeAreaView, { style: styles.safeArea, edges: safeAreaEdges, testID: testID, children: scrollable ? (_jsx(ScrollView, { style: styles.scrollView, contentContainerStyle: [
+                    styles.scrollContent,
+                    padded && { paddingTop: theme.spacing.xxl },
+                    { paddingBottom: bottomPadding },
+                    contentContainerStyle,
+                ], showsVerticalScrollIndicator: showsVerticalScrollIndicator, children: children })) : (_jsx(ThemedView, { variant: variant, rounded: false, style: [
+                    styles.content,
+                    padded && { paddingTop: theme.spacing.xxl },
+                    { paddingBottom: bottomPadding },
+                    style,
+                ], children: children })) }) }));
+};
+Screen.displayName = 'Screen';
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    safeArea: {
+        flex: 1,
+    },
+    scrollView: {
+        flex: 1,
+    },
+    scrollContent: {
+        flexGrow: 1,
+    },
+    content: {
+        flex: 1,
+    },
+});
+//# sourceMappingURL=screen.js.map

package/dist/components/ui/screen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"screen.js","sourceRoot":"","sources":["../../../components/ui/screen.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAkC,QAAQ,EAAE,MAAM,cAAc,CAAC;AAChG,OAAO,EAAE,YAAY,EAAa,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,OAAO,EAAE,UAAU,EAA0B,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AA2BvC;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,MAAM,GAA0B,CAAC,EAC5C,QAAQ,EACR,UAAU,GAAG,KAAK,EAClB,OAAO,GAAG,YAAY,EACtB,KAAK,GAAG,CAAC,QAAQ,CAAC,EAClB,qBAAqB,EACrB,KAAK,EACL,MAAM,EACN,4BAA4B,GAAG,IAAI,EACnC,MAAM,GAAG,IAAI,GACd,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,iBAAiB,EAAE,CAAC;IACnC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,8EAA8E;IAC9E,yFAAyF;IACzF,4FAA4F;IAC5F,yEAAyE;IACzE,6FAA6F;IAC7F,yDAAyD;IACzD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAa,EAAE,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC;IACrE,MAAM,aAAa,GAAG,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC;IAEzF,OAAO,CACL,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,SAAS,YACnE,KAAC,YAAY,IAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,YACvE,UAAU,CAAC,CAAC,CAAC,CACZ,KAAC,UAAU,IACT,KAAK,EAAE,MAAM,CAAC,UAAU,EACxB,qBAAqB,EAAE;oBACrB,MAAM,CAAC,aAAa;oBACpB,MAAM,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;oBAC3C,EAAE,aAAa,EAAE,aAAa,EAAE;oBAChC,qBAAqB;iBACtB,EACD,4BAA4B,EAAE,4BAA4B,YAEzD,QAAQ,GACE,CACd,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,KAAK,EACd,KAAK,EAAE;oBACL,MAAM,CAAC,OAAO;oBACd,MAAM,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;oBAC3C,EAAE,aAAa,EAAE,aAAa,EAAE;oBAChC,KAAK;iBACN,YAEA,QAAQ,GACE,CACd,GACY,GACJ,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAE9B,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,IAAI,EAAE,CAAC;KACR;IACD,QAAQ,EAAE;QACR,IAAI,EAAE,CAAC;KACR;IACD,UAAU,EAAE;QACV,IAAI,EAAE,CAAC;KACR;IACD,aAAa,EAAE;QACb,QAAQ,EAAE,CAAC;KACZ;IACD,OAAO,EAAE;QACP,IAAI,EAAE,CAAC;KACR;CACF,CAAC,CAAC"}