@campxdev/react-native-blueprint 0.1.0

package/lib/module/components/ui/Bottom-Sheet.js

@@ -0,0 +1,144 @@
+"use strict";
+
+import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef } from 'react';
+import { StyleSheet, View } from 'react-native';
+import BottomSheetPrimitive, { BottomSheetBackdrop, BottomSheetView } from '@gorhom/bottom-sheet';
+import { cn } from "../../lib/utils.js";
+import { useTheme } from "../../lib/ThemeProvider.js";
+import { hslToRgb } from "../theme-config.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const BottomSheet = /*#__PURE__*/forwardRef(({
+  children,
+  snapPoints: customSnapPoints,
+  initialSnapIndex = -1,
+  enablePanDownToClose = true,
+  enableDynamicSizing = false,
+  backdropOpacity = 0.5,
+  enableBackdropDismiss = true,
+  handleIndicatorStyle,
+  backgroundStyle,
+  className,
+  containerClassName,
+  onChange,
+  onClose
+}, ref) => {
+  const bottomSheetRef = useRef(null);
+  const {
+    colors
+  } = useTheme();
+
+  // Default snap points if not provided
+  const snapPoints = useMemo(() => customSnapPoints ?? ['25%', '50%', '90%'], [customSnapPoints]);
+
+  // Expose methods via ref (similar to Flutter's showModalBottomSheet)
+  useImperativeHandle(ref, () => ({
+    open: () => bottomSheetRef.current?.expand(),
+    close: () => bottomSheetRef.current?.close(),
+    expand: () => bottomSheetRef.current?.expand(),
+    collapse: () => bottomSheetRef.current?.collapse(),
+    snapToIndex: index => bottomSheetRef.current?.snapToIndex(index)
+  }));
+
+  // Custom backdrop component
+  const renderBackdrop = useCallback(props => /*#__PURE__*/_jsx(BottomSheetBackdrop, {
+    ...props,
+    opacity: backdropOpacity,
+    appearsOnIndex: 0,
+    disappearsOnIndex: -1,
+    pressBehavior: enableBackdropDismiss ? 'close' : 'none'
+  }), [backdropOpacity, enableBackdropDismiss]);
+
+  // Handle sheet changes
+  const handleSheetChanges = useCallback(index => {
+    onChange?.(index);
+    if (index === -1) {
+      onClose?.();
+    }
+  }, [onChange, onClose]);
+
+  // Theme-aware background style - convert HSL to RGB for React Native
+  const themedBackgroundStyle = useMemo(() => [styles.background, {
+    backgroundColor: hslToRgb(colors.card)
+  }, backgroundStyle], [colors.card, backgroundStyle]);
+
+  // Theme-aware handle indicator style - convert HSL to RGB for React Native
+  const themedHandleStyle = useMemo(() => [styles.handleIndicator, {
+    backgroundColor: hslToRgb(colors.border)
+  }, handleIndicatorStyle], [colors.border, handleIndicatorStyle]);
+  return /*#__PURE__*/_jsx(BottomSheetPrimitive, {
+    ref: bottomSheetRef,
+    index: initialSnapIndex,
+    snapPoints: snapPoints,
+    enablePanDownToClose: enablePanDownToClose,
+    enableDynamicSizing: enableDynamicSizing,
+    backdropComponent: renderBackdrop,
+    onChange: handleSheetChanges,
+    handleIndicatorStyle: themedHandleStyle,
+    backgroundStyle: themedBackgroundStyle,
+    style: styles.container,
+    animateOnMount: false,
+    children: /*#__PURE__*/_jsx(BottomSheetView, {
+      style: [styles.contentContainer],
+      className: cn('flex-1 bg-card', containerClassName),
+      children: /*#__PURE__*/_jsx(View, {
+        className: cn('flex-1', className),
+        children: children
+      })
+    })
+  });
+});
+BottomSheet.displayName = 'BottomSheet';
+const styles = StyleSheet.create({
+  container: {
+    zIndex: 9999
+  },
+  contentContainer: {
+    flex: 1
+  },
+  background: {
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20
+  },
+  handleIndicator: {
+    width: 40,
+    height: 4
+  }
+});
+
+// Helper component for bottom sheet header
+
+const BottomSheetHeader = ({
+  children,
+  className
+}) => {
+  return /*#__PURE__*/_jsx(View, {
+    className: cn('border-b border-border px-4 py-3 web:px-6', className),
+    children: children
+  });
+};
+
+// Helper component for bottom sheet content
+
+const BottomSheetContent = ({
+  children,
+  className
+}) => {
+  return /*#__PURE__*/_jsx(View, {
+    className: cn('flex-1 px-4 py-4 web:px-6', className),
+    children: children
+  });
+};
+
+// Helper component for bottom sheet footer
+
+const BottomSheetFooter = ({
+  children,
+  className
+}) => {
+  return /*#__PURE__*/_jsx(View, {
+    className: cn('border-t border-border px-4 py-3 web:px-6', className),
+    children: children
+  });
+};
+export { BottomSheet, BottomSheetHeader, BottomSheetContent, BottomSheetFooter };
+//# sourceMappingURL=Bottom-Sheet.js.map

package/lib/module/components/ui/Bottom-Sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","forwardRef","useCallback","useImperativeHandle","useMemo","useRef","StyleSheet","View","BottomSheetPrimitive","BottomSheetBackdrop","BottomSheetView","cn","useTheme","hslToRgb","jsx","_jsx","BottomSheet","children","snapPoints","customSnapPoints","initialSnapIndex","enablePanDownToClose","enableDynamicSizing","backdropOpacity","enableBackdropDismiss","handleIndicatorStyle","backgroundStyle","className","containerClassName","onChange","onClose","ref","bottomSheetRef","colors","open","current","expand","close","collapse","snapToIndex","index","renderBackdrop","props","opacity","appearsOnIndex","disappearsOnIndex","pressBehavior","handleSheetChanges","themedBackgroundStyle","styles","background","backgroundColor","card","themedHandleStyle","handleIndicator","border","backdropComponent","style","container","animateOnMount","contentContainer","displayName","create","zIndex","flex","borderTopLeftRadius","borderTopRightRadius","width","height","BottomSheetHeader","BottomSheetContent","BottomSheetFooter"],"sourceRoot":"../../../../src","sources":["components/ui/Bottom-Sheet.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ui/Button.js

@@ -0,0 +1,88 @@
+"use strict";
+
+import * as Slot from '@rn-primitives/slot';
+import { cva } from 'class-variance-authority';
+import { cssInterop } from 'nativewind';
+import * as React from 'react';
+import { Pressable } from 'react-native';
+import { cn } from "../../lib/utils.js";
+import { TextClassContext } from "./Text.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+cssInterop(Pressable, {
+  className: 'style'
+});
+cssInterop(Slot.Pressable, {
+  className: 'style'
+});
+const buttonVariants = cva('group flex items-center justify-center rounded-4 web:ring-offset-background web:transition-colors web:focus-visible:outline-none web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2', {
+  variants: {
+    variant: {
+      default: 'bg-primary active:opacity-20',
+      destructive: 'bg-destructive active:opacity-90',
+      outline: 'border border-input bg-background active:bg-accent',
+      secondary: 'bg-secondary active:opacity-80',
+      ghost: 'active:bg-accent',
+      link: 'web:underline-offset-4'
+    },
+    size: {
+      default: 'h-10 px-button-x py-button-y native:h-12 native:px-button-x native:py-button-y',
+      sm: 'h-9 px-3',
+      lg: 'h-11 px-8 native:h-14',
+      icon: 'h-10 w-10'
+    }
+  },
+  defaultVariants: {
+    variant: 'default',
+    size: 'default'
+  }
+});
+const buttonTextVariants = cva('web:whitespace-nowrap text-sm native:text-base font-medium web:transition-colors', {
+  variants: {
+    variant: {
+      default: 'text-primary-foreground',
+      destructive: 'text-destructive-foreground',
+      outline: 'text-foreground group-active:text-accent-foreground',
+      secondary: 'text-secondary-foreground group-active:text-secondary-foreground',
+      ghost: 'text-foreground group-active:text-accent-foreground',
+      link: 'text-primary group-active:underline'
+    },
+    size: {
+      default: '',
+      sm: '',
+      lg: 'native:text-lg',
+      icon: ''
+    }
+  },
+  defaultVariants: {
+    variant: 'default',
+    size: 'default'
+  }
+});
+const Button = /*#__PURE__*/React.forwardRef(({
+  className,
+  variant,
+  size,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.Pressable : Pressable;
+  return /*#__PURE__*/_jsx(TextClassContext.Provider, {
+    value: cn(buttonTextVariants({
+      variant,
+      size
+    })),
+    children: /*#__PURE__*/_jsx(Component, {
+      ref: ref,
+      role: "button",
+      className: cn(buttonVariants({
+        variant,
+        size,
+        className
+      }), props.disabled && 'opacity-50 web:pointer-events-none'),
+      ...props
+    })
+  });
+});
+Button.displayName = 'Button';
+export { Button, buttonTextVariants, buttonVariants };
+//# sourceMappingURL=Button.js.map

package/lib/module/components/ui/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Slot","cva","cssInterop","React","Pressable","cn","TextClassContext","jsx","_jsx","className","buttonVariants","variants","variant","default","destructive","outline","secondary","ghost","link","size","sm","lg","icon","defaultVariants","buttonTextVariants","Button","forwardRef","asChild","props","ref","Component","Provider","value","children","role","disabled","displayName"],"sourceRoot":"../../../../src","sources":["components/ui/Button.tsx"],"mappings":";;AAAA,OAAO,KAAKA,IAAI,MAAM,qBAAqB;AAK3C,SAASC,GAAG,QAA2B,0BAA0B;AACjE,SAASC,UAAU,QAAQ,YAAY;AACvC,OAAO,KAAKC,KAAK,MAAM,OAAO;AAC9B,SAASC,SAAS,QAAQ,cAAc;AACxC,SAASC,EAAE,QAAQ,oBAAiB;AACpC,SAASC,gBAAgB,QAAQ,WAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE1CN,UAAU,CAACE,SAAS,EAAE;EAAEK,SAAS,EAAE;AAAQ,CAAC,CAAC;AAC7CP,UAAU,CAACF,IAAI,CAACI,SAAS,EAAE;EAAEK,SAAS,EAAE;AAAQ,CAAC,CAAC;AAElD,MAAMC,cAAc,GAAGT,GAAG,CACxB,uNAAuN,EACvN;EACEU,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE,8BAA8B;MACvCC,WAAW,EAAE,kCAAkC;MAC/CC,OAAO,EAAE,oDAAoD;MAC7DC,SAAS,EAAE,gCAAgC;MAC3CC,KAAK,EAAE,kBAAkB;MACzBC,IAAI,EAAE;IACR,CAAC;IACDC,IAAI,EAAE;MACJN,OAAO,EACL,gFAAgF;MAClFO,EAAE,EAAE,UAAU;MACdC,EAAE,EAAE,uBAAuB;MAC3BC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfX,OAAO,EAAE,SAAS;IAClBO,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,MAAMK,kBAAkB,GAAGvB,GAAG,CAC5B,kFAAkF,EAClF;EACEU,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE,yBAAyB;MAClCC,WAAW,EAAE,6BAA6B;MAC1CC,OAAO,EAAE,qDAAqD;MAC9DC,SAAS,EACP,kEAAkE;MACpEC,KAAK,EAAE,qDAAqD;MAC5DC,IAAI,EAAE;IACR,CAAC;IACDC,IAAI,EAAE;MACJN,OAAO,EAAE,EAAE;MACXO,EAAE,EAAE,EAAE;MACNC,EAAE,EAAE,gBAAgB;MACpBC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfX,OAAO,EAAE,SAAS;IAClBO,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAOD,MAAMM,MAAM,gBAAGtB,KAAK,CAACuB,UAAU,CAC7B,CAAC;EAAEjB,SAAS;EAAEG,OAAO;EAAEO,IAAI;EAAEQ,OAAO,GAAG,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAChE,MAAMC,SAAS,GAAGH,OAAO,GAAG3B,IAAI,CAACI,SAAS,GAAGA,SAAS;EAEtD,oBACEI,IAAA,CAACF,gBAAgB,CAACyB,QAAQ;IACxBC,KAAK,EAAE3B,EAAE,CAACmB,kBAAkB,CAAC;MAAEZ,OAAO;MAAEO;IAAK,CAAC,CAAC,CAAE;IAAAc,QAAA,eAEjDzB,IAAA,CAACsB,SAAS;MACRD,GAAG,EAAEA,GAAI;MACTK,IAAI,EAAC,QAAQ;MACbzB,SAAS,EAAEJ,EAAE,CACXK,cAAc,CAAC;QAAEE,OAAO;QAAEO,IAAI;QAAEV;MAAU,CAAC,CAAC,EAC5CmB,KAAK,CAACO,QAAQ,IAAI,oCACpB,CAAE;MAAA,GACEP;IAAK,CACV;EAAC,CACuB,CAAC;AAEhC,CACF,CAAC;AAEDH,MAAM,CAACW,WAAW,GAAG,QAAQ;AAE7B,SAASX,MAAM,EAAED,kBAAkB,EAAEd,cAAc","ignoreList":[]}

package/lib/module/components/ui/Card.js

@@ -0,0 +1,176 @@
+"use strict";
+
+import * as Slot from '@rn-primitives/slot';
+import { cssInterop } from 'nativewind';
+import * as React from 'react';
+import { View } from 'react-native';
+import { cn } from "../../lib/utils.js";
+import { TextClassContext } from "./Text.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+cssInterop(View, {
+  className: 'style'
+});
+cssInterop(Slot.View, {
+  className: 'style'
+});
+
+/**
+ * Card container component - Main wrapper for card content
+ *
+ * Provides elevated container with border, rounded corners, and shadow.
+ * Use with CardHeader, CardTitle, CardDescription, CardContent, and CardFooter
+ * for a complete card structure.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <Card>
+ *   <CardHeader>
+ *     <CardTitle><Text>Title</Text></CardTitle>
+ *     <CardDescription><Text>Description</Text></CardDescription>
+ *   </CardHeader>
+ *   <CardContent>
+ *     <Text>Card content goes here</Text>
+ *   </CardContent>
+ *   <CardFooter>
+ *     <Button>Action</Button>
+ *   </CardFooter>
+ * </Card>
+ * ```
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes
+ */
+const Card = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(Component, {
+    className: cn('rounded-lg border border-border dark:border-border bg-card dark:bg-card p-6 shadow-sm shadow-foreground/10 dark:shadow-white/10', className),
+    ref: ref,
+    ...props
+  });
+});
+Card.displayName = 'Card';
+
+/**
+ * CardHeader - Container for card title and description
+ *
+ * Provides proper spacing for title and description elements at the top of a card.
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes
+ */
+const CardHeader = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(Component, {
+    className: cn('flex flex-col gap-1.5 p-6', className),
+    ref: ref,
+    ...props
+  });
+});
+CardHeader.displayName = 'CardHeader';
+
+/**
+ * CardTitle - Main title text for the card
+ *
+ * Automatically styles child Text components with large, semibold typography.
+ * Uses TextClassContext to apply consistent styling to nested Text elements.
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes for text styling
+ */
+const CardTitle = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(TextClassContext.Provider, {
+    value: cn('text-2xl font-semibold leading-none tracking-tight text-card-foreground dark:text-card-foreground', className),
+    children: /*#__PURE__*/_jsx(Component, {
+      ref: ref,
+      ...props
+    })
+  });
+});
+CardTitle.displayName = 'CardTitle';
+
+/**
+ * CardDescription - Subtitle or description text for the card
+ *
+ * Automatically styles child Text components with muted, smaller typography.
+ * Uses TextClassContext to apply consistent styling to nested Text elements.
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes for text styling
+ */
+const CardDescription = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(TextClassContext.Provider, {
+    value: cn('text-sm text-muted-foreground dark:text-muted-foreground', className),
+    children: /*#__PURE__*/_jsx(Component, {
+      ref: ref,
+      ...props
+    })
+  });
+});
+CardDescription.displayName = 'CardDescription';
+
+/**
+ * CardContent - Main content area of the card
+ *
+ * Container for the primary card content with appropriate padding.
+ * Top padding is removed to flow naturally after CardHeader.
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes
+ */
+const CardContent = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(Component, {
+    className: cn('p-6 pt-0', className),
+    ref: ref,
+    ...props
+  });
+});
+CardContent.displayName = 'CardContent';
+
+/**
+ * CardFooter - Footer area for actions or additional info
+ *
+ * Typically contains buttons or other interactive elements.
+ * Arranged as a row with centered items.
+ *
+ * @property {boolean} [asChild] - When true, merges props into immediate child
+ * @property {string} [className] - Additional Tailwind classes
+ */
+const CardFooter = /*#__PURE__*/React.forwardRef(({
+  className,
+  asChild = false,
+  ...props
+}, ref) => {
+  const Component = asChild ? Slot.View : View;
+  return /*#__PURE__*/_jsx(Component, {
+    className: cn('flex flex-row items-center p-6 pt-0', className),
+    ref: ref,
+    ...props
+  });
+});
+CardFooter.displayName = 'CardFooter';
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
+//# sourceMappingURL=Card.js.map

package/lib/module/components/ui/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Slot","cssInterop","React","View","cn","TextClassContext","jsx","_jsx","className","Card","forwardRef","asChild","props","ref","Component","displayName","CardHeader","CardTitle","Provider","value","children","CardDescription","CardContent","CardFooter"],"sourceRoot":"../../../../src","sources":["components/ui/Card.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ui/Checkbox.js

@@ -0,0 +1,65 @@
+"use strict";
+
+import { Icon } from "./Icon.js";
+import { cn } from "../../lib/utils.js";
+import * as CheckboxPrimitive from '@rn-primitives/checkbox';
+import { Check } from 'lucide-react-native';
+import { Platform } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+const DEFAULT_HIT_SLOP = 24;
+
+/**
+ * Interactive checkbox for boolean selections
+ *
+ * A control that allows users to toggle between checked and unchecked states.
+ * Features a checkmark indicator, configurable styling, and accessible touch targets.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * // Basic checkbox
+ * <Checkbox checked={isChecked} onCheckedChange={setIsChecked} />
+ *
+ * // Checkbox with label
+ * <View className="flex-row items-center gap-2">
+ *   <Checkbox id="terms" checked={accepted} onCheckedChange={setAccepted} />
+ *   <Label htmlFor="terms">Accept terms and conditions</Label>
+ * </View>
+ *
+ * // Disabled checkbox
+ * <Checkbox checked={true} disabled />
+ * ```
+ *
+ * @accessibility
+ * - Uses 24px hit slop for easier touch interaction
+ * - Supports keyboard navigation on web
+ * - Proper ARIA attributes for screen readers
+ * - Visual focus indicators on web
+ */
+function Checkbox({
+  className,
+  checkedClassName,
+  indicatorClassName,
+  iconClassName,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx(CheckboxPrimitive.Root, {
+    className: cn('border-input dark:bg-input/30 size-4 shrink-0 rounded-[4px] border shadow-sm shadow-black/5', Platform.select({
+      web: 'focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive peer cursor-default outline-none transition-shadow focus-visible:ring-[3px] disabled:cursor-not-allowed',
+      native: 'overflow-hidden'
+    }), props.checked && cn('border-primary', checkedClassName), props.disabled && 'opacity-50', className),
+    hitSlop: DEFAULT_HIT_SLOP,
+    ...props,
+    children: /*#__PURE__*/_jsx(CheckboxPrimitive.Indicator, {
+      className: cn('bg-primary h-full w-full items-center justify-center', indicatorClassName),
+      children: /*#__PURE__*/_jsx(Icon, {
+        as: Check,
+        size: 12,
+        strokeWidth: Platform.OS === 'web' ? 2.5 : 3.5,
+        className: cn('text-primary-foreground', iconClassName)
+      })
+    })
+  });
+}
+export { Checkbox };
+//# sourceMappingURL=Checkbox.js.map

package/lib/module/components/ui/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Icon","cn","CheckboxPrimitive","Check","Platform","jsx","_jsx","DEFAULT_HIT_SLOP","Checkbox","className","checkedClassName","indicatorClassName","iconClassName","props","Root","select","web","native","checked","disabled","hitSlop","children","Indicator","as","size","strokeWidth","OS"],"sourceRoot":"../../../../src","sources":["components/ui/Checkbox.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,WAAQ;AAC7B,SAASC,EAAE,QAAQ,oBAAiB;AACpC,OAAO,KAAKC,iBAAiB,MAAM,yBAAyB;AAC5D,SAASC,KAAK,QAAQ,qBAAqB;AAC3C,SAASC,QAAQ,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAExC,MAAMC,gBAAgB,GAAG,EAAE;;AAE3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,QAAQA,CAAC;EAChBC,SAAS;EACTC,gBAAgB;EAChBC,kBAAkB;EAClBC,aAAa;EACb,GAAGC;AAMH,CAAC,EAAE;EACH,oBACEP,IAAA,CAACJ,iBAAiB,CAACY,IAAI;IACrBL,SAAS,EAAER,EAAE,CACX,6FAA6F,EAC7FG,QAAQ,CAACW,MAAM,CAAC;MACdC,GAAG,EAAE,qQAAqQ;MAC1QC,MAAM,EAAE;IACV,CAAC,CAAC,EACFJ,KAAK,CAACK,OAAO,IAAIjB,EAAE,CAAC,gBAAgB,EAAES,gBAAgB,CAAC,EACvDG,KAAK,CAACM,QAAQ,IAAI,YAAY,EAC9BV,SACF,CAAE;IACFW,OAAO,EAAEb,gBAAiB;IAAA,GACtBM,KAAK;IAAAQ,QAAA,eAETf,IAAA,CAACJ,iBAAiB,CAACoB,SAAS;MAC1Bb,SAAS,EAAER,EAAE,CACX,sDAAsD,EACtDU,kBACF,CAAE;MAAAU,QAAA,eAEFf,IAAA,CAACN,IAAI;QACHuB,EAAE,EAAEpB,KAAM;QACVqB,IAAI,EAAE,EAAG;QACTC,WAAW,EAAErB,QAAQ,CAACsB,EAAE,KAAK,KAAK,GAAG,GAAG,GAAG,GAAI;QAC/CjB,SAAS,EAAER,EAAE,CAAC,yBAAyB,EAAEW,aAAa;MAAE,CACzD;IAAC,CACyB;EAAC,CACR,CAAC;AAE7B;AAEA,SAASJ,QAAQ","ignoreList":[]}

package/lib/module/components/ui/Collapsible.js

@@ -0,0 +1,42 @@
+"use strict";
+
+import * as CollapsiblePrimitive from '@rn-primitives/collapsible';
+
+/**
+ * Root collapsible container
+ *
+ * An interactive component that can show and hide content. Unlike Accordion, it doesn't enforce
+ * any specific visual styling, making it more flexible for custom layouts.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <Collapsible open={isOpen} onOpenChange={setIsOpen}>
+ *   <CollapsibleTrigger asChild>
+ *     <Button variant="ghost"><Text>Toggle</Text></Button>
+ *   </CollapsibleTrigger>
+ *   <CollapsibleContent>
+ *     <Text>This content can be shown or hidden</Text>
+ *   </CollapsibleContent>
+ * </Collapsible>
+ * ```
+ */
+const Collapsible = CollapsiblePrimitive.Root;
+
+/**
+ * Trigger button that toggles collapsible content visibility
+ *
+ * @component
+ */
+const CollapsibleTrigger = CollapsiblePrimitive.Trigger;
+
+/**
+ * Collapsible content container
+ *
+ * Automatically animates height when expanding or collapsing.
+ *
+ * @component
+ */
+const CollapsibleContent = CollapsiblePrimitive.Content;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };
+//# sourceMappingURL=Collapsible.js.map

package/lib/module/components/ui/Collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CollapsiblePrimitive","Collapsible","Root","CollapsibleTrigger","Trigger","CollapsibleContent","Content"],"sourceRoot":"../../../../src","sources":["components/ui/Collapsible.tsx"],"mappings":";;AAAA,OAAO,KAAKA,oBAAoB,MAAM,4BAA4B;;AAElE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,WAAW,GAAGD,oBAAoB,CAACE,IAAI;;AAE7C;AACA;AACA;AACA;AACA;AACA,MAAMC,kBAAkB,GAAGH,oBAAoB,CAACI,OAAO;;AAEvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,kBAAkB,GAAGL,oBAAoB,CAACM,OAAO;AAEvD,SAASL,WAAW,EAAEE,kBAAkB,EAAEE,kBAAkB","ignoreList":[]}