@react-native-reusables/cli 0.3.8 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/__generated/components/ui/accordion.tsx +53 -44
  2. package/__generated/components/ui/alert-dialog.tsx +96 -84
  3. package/__generated/components/ui/alert.tsx +33 -37
  4. package/__generated/components/ui/avatar.tsx +28 -22
  5. package/__generated/components/ui/badge.tsx +4 -3
  6. package/__generated/components/ui/button.tsx +18 -22
  7. package/__generated/components/ui/card.tsx +70 -43
  8. package/__generated/components/ui/checkbox.tsx +25 -24
  9. package/__generated/components/ui/context-menu.tsx +140 -121
  10. package/__generated/components/ui/dialog.tsx +74 -62
  11. package/__generated/components/ui/dropdown-menu.tsx +147 -126
  12. package/__generated/components/ui/hover-card.tsx +9 -7
  13. package/__generated/components/ui/input.tsx +19 -18
  14. package/__generated/components/ui/label.tsx +13 -6
  15. package/__generated/components/ui/menubar.tsx +164 -141
  16. package/__generated/components/ui/navigation-menu.tsx +68 -58
  17. package/__generated/components/ui/popover.tsx +11 -8
  18. package/__generated/components/ui/progress.tsx +10 -9
  19. package/__generated/components/ui/radio-group.tsx +29 -29
  20. package/__generated/components/ui/select.tsx +58 -40
  21. package/__generated/components/ui/separator.tsx +11 -6
  22. package/__generated/components/ui/switch.tsx +50 -47
  23. package/__generated/components/ui/table.tsx +66 -50
  24. package/__generated/components/ui/tabs.tsx +43 -36
  25. package/__generated/components/ui/text.tsx +17 -15
  26. package/__generated/components/ui/textarea.tsx +24 -21
  27. package/__generated/components/ui/toggle-group.tsx +32 -22
  28. package/__generated/components/ui/toggle.tsx +28 -23
  29. package/__generated/components/ui/tooltip.tsx +31 -26
  30. package/__generated/components/ui/typography.tsx +141 -198
  31. package/__generated/starter-base/app/_layout.tsx +24 -22
  32. package/__generated/starter-base/components/ThemeToggle.tsx +8 -16
  33. package/__generated/starter-base/components/ui/avatar.tsx +30 -28
  34. package/__generated/starter-base/components/ui/button.tsx +18 -25
  35. package/__generated/starter-base/components/ui/card.tsx +61 -36
  36. package/__generated/starter-base/components/ui/progress.tsx +11 -10
  37. package/__generated/starter-base/components/ui/text.tsx +17 -15
  38. package/__generated/starter-base/components/ui/tooltip.tsx +31 -26
  39. package/__generated/starter-base/package.json +10 -12
  40. package/dist/index.js +1 -1
  41. package/dist/index.js.map +1 -1
  42. package/package.json +3 -3
@@ -4,7 +4,7 @@ import { DarkTheme, DefaultTheme, Theme, ThemeProvider } from '@react-navigation
4
4
  import { Stack } from 'expo-router';
5
5
  import { StatusBar } from 'expo-status-bar';
6
6
  import * as React from 'react';
7
- import { Platform } from 'react-native';
7
+ import { Appearance, Platform, View } from 'react-native';
8
8
  import { NAV_THEME } from '~/lib/constants';
9
9
  import { useColorScheme } from '~/lib/useColorScheme';
10
10
  import { PortalHost } from '@rn-primitives/portal';
@@ -25,28 +25,15 @@ export {
25
25
  ErrorBoundary,
26
26
  } from 'expo-router';
27
27
 
28
- export default function RootLayout() {
29
- const hasMounted = React.useRef(false);
30
- const { colorScheme, isDarkColorScheme } = useColorScheme();
31
- const [isColorSchemeLoaded, setIsColorSchemeLoaded] = React.useState(false);
32
-
33
- useIsomorphicLayoutEffect(() => {
34
- if (hasMounted.current) {
35
- return;
36
- }
28
+ const usePlatformSpecificSetup = Platform.select({
29
+ web: useSetWebBackgroundClassName,
30
+ android: useSetAndroidNavigationBar,
31
+ default: noop,
32
+ });
37
33
 
38
- if (Platform.OS === 'web') {
39
- // Adds the background color to the html element to prevent white background on overscroll.
40
- document.documentElement.classList.add('bg-background');
41
- }
42
- setAndroidNavigationBar(colorScheme);
43
- setIsColorSchemeLoaded(true);
44
- hasMounted.current = true;
45
- }, []);
46
-
47
- if (!isColorSchemeLoaded) {
48
- return null;
49
- }
34
+ export default function RootLayout() {
35
+ usePlatformSpecificSetup();
36
+ const { isDarkColorScheme } = useColorScheme();
50
37
 
51
38
  return (
52
39
  <ThemeProvider value={isDarkColorScheme ? DARK_THEME : LIGHT_THEME}>
@@ -67,3 +54,18 @@ export default function RootLayout() {
67
54
 
68
55
  const useIsomorphicLayoutEffect =
69
56
  Platform.OS === 'web' && typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
57
+
58
+ function useSetWebBackgroundClassName() {
59
+ useIsomorphicLayoutEffect(() => {
60
+ // Adds the background color to the html element to prevent white background on overscroll.
61
+ document.documentElement.classList.add('bg-background');
62
+ }, []);
63
+ }
64
+
65
+ function useSetAndroidNavigationBar() {
66
+ React.useLayoutEffect(() => {
67
+ setAndroidNavigationBar(Appearance.getColorScheme() ?? 'light');
68
+ }, []);
69
+ }
70
+
71
+ function noop() {}
@@ -3,7 +3,6 @@ import { setAndroidNavigationBar } from '~/lib/android-navigation-bar';
3
3
  import { MoonStar } from '~/lib/icons/MoonStar';
4
4
  import { Sun } from '~/lib/icons/Sun';
5
5
  import { useColorScheme } from '~/lib/useColorScheme';
6
- import { cn } from '~/lib/utils';
7
6
 
8
7
  export function ThemeToggle() {
9
8
  const { isDarkColorScheme, setColorScheme } = useColorScheme();
@@ -17,22 +16,15 @@ export function ThemeToggle() {
17
16
  return (
18
17
  <Pressable
19
18
  onPress={toggleColorScheme}
20
- className='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'
19
+ className='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 active:opacity-70'
21
20
  >
22
- {({ pressed }) => (
23
- <View
24
- className={cn(
25
- 'flex-1 aspect-square pt-0.5 justify-center items-start web:px-5',
26
- pressed && 'opacity-70'
27
- )}
28
- >
29
- {isDarkColorScheme ? (
30
- <MoonStar className='text-foreground' size={23} strokeWidth={1.25} />
31
- ) : (
32
- <Sun className='text-foreground' size={24} strokeWidth={1.25} />
33
- )}
34
- </View>
35
- )}
21
+ <View className='flex-1 aspect-square pt-0.5 justify-center items-start web:px-5'>
22
+ {isDarkColorScheme ? (
23
+ <MoonStar className='text-foreground' size={23} strokeWidth={1.25} />
24
+ ) : (
25
+ <Sun className='text-foreground' size={24} strokeWidth={1.25} />
26
+ )}
27
+ </View>
36
28
  </Pressable>
37
29
  );
38
30
  }
@@ -2,44 +2,46 @@ import * as AvatarPrimitive from '@rn-primitives/avatar';
2
2
  import * as React from 'react';
3
3
  import { cn } from '~/lib/utils';
4
4
 
5
- const AvatarPrimitiveRoot = AvatarPrimitive.Root;
6
- const AvatarPrimitiveImage = AvatarPrimitive.Image;
7
- const AvatarPrimitiveFallback = AvatarPrimitive.Fallback;
8
-
9
- const Avatar = React.forwardRef<AvatarPrimitive.RootRef, AvatarPrimitive.RootProps>(
10
- ({ className, ...props }, ref) => (
11
- <AvatarPrimitiveRoot
12
- ref={ref}
5
+ function Avatar({
6
+ className,
7
+ ...props
8
+ }: AvatarPrimitive.RootProps & {
9
+ ref?: React.RefObject<AvatarPrimitive.RootRef>;
10
+ }) {
11
+ return (
12
+ <AvatarPrimitive.Root
13
13
  className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)}
14
14
  {...props}
15
15
  />
16
- )
17
- );
18
- Avatar.displayName = AvatarPrimitiveRoot.displayName;
16
+ );
17
+ }
19
18
 
20
- const AvatarImage = React.forwardRef<AvatarPrimitive.ImageRef, AvatarPrimitive.ImageProps>(
21
- ({ className, ...props }, ref) => (
22
- <AvatarPrimitiveImage
23
- ref={ref}
24
- className={cn('aspect-square h-full w-full', className)}
25
- {...props}
26
- />
27
- )
28
- );
29
- AvatarImage.displayName = AvatarPrimitiveImage.displayName;
19
+ function AvatarImage({
20
+ className,
21
+ ...props
22
+ }: AvatarPrimitive.ImageProps & {
23
+ ref?: React.RefObject<AvatarPrimitive.ImageRef>;
24
+ }) {
25
+ return (
26
+ <AvatarPrimitive.Image className={cn('aspect-square h-full w-full', className)} {...props} />
27
+ );
28
+ }
30
29
 
31
- const AvatarFallback = React.forwardRef<AvatarPrimitive.FallbackRef, AvatarPrimitive.FallbackProps>(
32
- ({ className, ...props }, ref) => (
33
- <AvatarPrimitiveFallback
34
- ref={ref}
30
+ function AvatarFallback({
31
+ className,
32
+ ...props
33
+ }: AvatarPrimitive.FallbackProps & {
34
+ ref?: React.RefObject<AvatarPrimitive.FallbackRef>;
35
+ }) {
36
+ return (
37
+ <AvatarPrimitive.Fallback
35
38
  className={cn(
36
39
  'flex h-full w-full items-center justify-center rounded-full bg-muted',
37
40
  className
38
41
  )}
39
42
  {...props}
40
43
  />
41
- )
42
- );
43
- AvatarFallback.displayName = AvatarPrimitiveFallback.displayName;
44
+ );
45
+ }
44
46
 
45
47
  export { Avatar, AvatarFallback, AvatarImage };
@@ -15,7 +15,7 @@ const buttonVariants = cva(
15
15
  'border border-input bg-background web:hover:bg-accent web:hover:text-accent-foreground active:bg-accent',
16
16
  secondary: 'bg-secondary web:hover:opacity-80 active:opacity-80',
17
17
  ghost: 'web:hover:bg-accent web:hover:text-accent-foreground active:bg-accent',
18
- link: 'web:underline-offset-4 web:hover:underline web:focus:underline ',
18
+ link: 'web:underline-offset-4 web:hover:underline web:focus:underline',
19
19
  },
20
20
  size: {
21
21
  default: 'h-10 px-4 py-2 native:h-12 native:px-5 native:py-3',
@@ -57,32 +57,25 @@ const buttonTextVariants = cva(
57
57
  }
58
58
  );
59
59
 
60
- type ButtonProps = React.ComponentPropsWithoutRef<typeof Pressable> &
61
- VariantProps<typeof buttonVariants>;
60
+ type ButtonProps = React.ComponentProps<typeof Pressable> & VariantProps<typeof buttonVariants>;
62
61
 
63
- const Button = React.forwardRef<React.ElementRef<typeof Pressable>, ButtonProps>(
64
- ({ className, variant, size, ...props }, ref) => {
65
- return (
66
- <TextClassContext.Provider
67
- value={cn(
68
- props.disabled && 'web:pointer-events-none',
69
- buttonTextVariants({ variant, size })
62
+ function Button({ ref, className, variant, size, ...props }: ButtonProps) {
63
+ return (
64
+ <TextClassContext.Provider
65
+ value={buttonTextVariants({ variant, size, className: 'web:pointer-events-none' })}
66
+ >
67
+ <Pressable
68
+ className={cn(
69
+ props.disabled && 'opacity-50 web:pointer-events-none',
70
+ buttonVariants({ variant, size, className })
70
71
  )}
71
- >
72
- <Pressable
73
- className={cn(
74
- props.disabled && 'opacity-50 web:pointer-events-none',
75
- buttonVariants({ variant, size, className })
76
- )}
77
- ref={ref}
78
- role='button'
79
- {...props}
80
- />
81
- </TextClassContext.Provider>
82
- );
83
- }
84
- );
85
- Button.displayName = 'Button';
72
+ ref={ref}
73
+ role='button'
74
+ {...props}
75
+ />
76
+ </TextClassContext.Provider>
77
+ );
78
+ }
86
79
 
87
80
  export { Button, buttonTextVariants, buttonVariants };
88
81
  export type { ButtonProps };
@@ -1,57 +1,82 @@
1
- import type { TextRef, ViewRef } from '@rn-primitives/types';
2
1
  import * as React from 'react';
3
2
  import { Text, TextProps, View, ViewProps } from 'react-native';
4
3
  import { TextClassContext } from '~/components/ui/text';
5
4
  import { cn } from '~/lib/utils';
6
5
 
7
- const Card = React.forwardRef<ViewRef, ViewProps>(({ className, ...props }, ref) => (
8
- <View
9
- ref={ref}
10
- className={cn(
11
- 'rounded-lg border border-border bg-card shadow-sm shadow-foreground/10',
12
- className
13
- )}
14
- {...props}
15
- />
16
- ));
17
- Card.displayName = 'Card';
6
+ function Card({
7
+ className,
8
+ ...props
9
+ }: ViewProps & {
10
+ ref?: React.RefObject<View>;
11
+ }) {
12
+ return (
13
+ <View
14
+ className={cn(
15
+ 'rounded-lg border border-border bg-card shadow-sm shadow-foreground/10',
16
+ className
17
+ )}
18
+ {...props}
19
+ />
20
+ );
21
+ }
18
22
 
19
- const CardHeader = React.forwardRef<ViewRef, ViewProps>(({ className, ...props }, ref) => (
20
- <View ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
21
- ));
22
- CardHeader.displayName = 'CardHeader';
23
+ function CardHeader({
24
+ className,
25
+ ...props
26
+ }: ViewProps & {
27
+ ref?: React.RefObject<View>;
28
+ }) {
29
+ return <View className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />;
30
+ }
23
31
 
24
- const CardTitle = React.forwardRef<TextRef, React.ComponentPropsWithoutRef<typeof Text>>(
25
- ({ className, ...props }, ref) => (
32
+ function CardTitle({
33
+ className,
34
+ ...props
35
+ }: TextProps & {
36
+ ref?: React.RefObject<Text>;
37
+ }) {
38
+ return (
26
39
  <Text
27
40
  role='heading'
28
41
  aria-level={3}
29
- ref={ref}
30
42
  className={cn(
31
43
  'text-2xl text-card-foreground font-semibold leading-none tracking-tight',
32
44
  className
33
45
  )}
34
46
  {...props}
35
47
  />
36
- )
37
- );
38
- CardTitle.displayName = 'CardTitle';
48
+ );
49
+ }
39
50
 
40
- const CardDescription = React.forwardRef<TextRef, TextProps>(({ className, ...props }, ref) => (
41
- <Text ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
42
- ));
43
- CardDescription.displayName = 'CardDescription';
51
+ function CardDescription({
52
+ className,
53
+ ...props
54
+ }: TextProps & {
55
+ ref?: React.RefObject<Text>;
56
+ }) {
57
+ return <Text className={cn('text-sm text-muted-foreground', className)} {...props} />;
58
+ }
44
59
 
45
- const CardContent = React.forwardRef<ViewRef, ViewProps>(({ className, ...props }, ref) => (
46
- <TextClassContext.Provider value='text-card-foreground'>
47
- <View ref={ref} className={cn('p-6 pt-0', className)} {...props} />
48
- </TextClassContext.Provider>
49
- ));
50
- CardContent.displayName = 'CardContent';
60
+ function CardContent({
61
+ className,
62
+ ...props
63
+ }: ViewProps & {
64
+ ref?: React.RefObject<View>;
65
+ }) {
66
+ return (
67
+ <TextClassContext.Provider value='text-card-foreground'>
68
+ <View className={cn('p-6 pt-0', className)} {...props} />
69
+ </TextClassContext.Provider>
70
+ );
71
+ }
51
72
 
52
- const CardFooter = React.forwardRef<ViewRef, ViewProps>(({ className, ...props }, ref) => (
53
- <View ref={ref} className={cn('flex flex-row items-center p-6 pt-0', className)} {...props} />
54
- ));
55
- CardFooter.displayName = 'CardFooter';
73
+ function CardFooter({
74
+ className,
75
+ ...props
76
+ }: ViewProps & {
77
+ ref?: React.RefObject<View>;
78
+ }) {
79
+ return <View className={cn('flex flex-row items-center p-6 pt-0', className)} {...props} />;
80
+ }
56
81
 
57
82
  export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
@@ -10,23 +10,24 @@ import Animated, {
10
10
  } from 'react-native-reanimated';
11
11
  import { cn } from '~/lib/utils';
12
12
 
13
- const Progress = React.forwardRef<
14
- ProgressPrimitive.RootRef,
15
- ProgressPrimitive.RootProps & {
16
- indicatorClassName?: string;
17
- }
18
- >(({ className, value, indicatorClassName, ...props }, ref) => {
13
+ function Progress({
14
+ className,
15
+ value,
16
+ indicatorClassName,
17
+ ...props
18
+ }: ProgressPrimitive.RootProps & {
19
+ ref?: React.RefObject<ProgressPrimitive.RootRef>;
20
+ indicatorClassName?: string;
21
+ }) {
19
22
  return (
20
23
  <ProgressPrimitive.Root
21
- ref={ref}
22
24
  className={cn('relative h-4 w-full overflow-hidden rounded-full bg-secondary', className)}
23
25
  {...props}
24
26
  >
25
27
  <Indicator value={value} className={indicatorClassName} />
26
28
  </ProgressPrimitive.Root>
27
29
  );
28
- });
29
- Progress.displayName = ProgressPrimitive.Root.displayName;
30
+ }
30
31
 
31
32
  export { Progress };
32
33
 
@@ -48,7 +49,7 @@ function Indicator({ value, className }: { value: number | undefined | null; cla
48
49
  className={cn('h-full w-full flex-1 bg-primary web:transition-all', className)}
49
50
  style={{ transform: `translateX(-${100 - (value ?? 0)}%)` }}
50
51
  >
51
- <ProgressPrimitive.Indicator className={cn('h-full w-full ', className)} />
52
+ <ProgressPrimitive.Indicator className={cn('h-full w-full', className)} />
52
53
  </View>
53
54
  );
54
55
  }
@@ -1,24 +1,26 @@
1
1
  import * as Slot from '@rn-primitives/slot';
2
- import type { SlottableTextProps, TextRef } from '@rn-primitives/types';
3
2
  import * as React from 'react';
4
3
  import { Text as RNText } from 'react-native';
5
4
  import { cn } from '~/lib/utils';
6
5
 
7
6
  const TextClassContext = React.createContext<string | undefined>(undefined);
8
7
 
9
- const Text = React.forwardRef<TextRef, SlottableTextProps>(
10
- ({ className, asChild = false, ...props }, ref) => {
11
- const textClass = React.useContext(TextClassContext);
12
- const Component = asChild ? Slot.Text : RNText;
13
- return (
14
- <Component
15
- className={cn('text-base text-foreground web:select-text', textClass, className)}
16
- ref={ref}
17
- {...props}
18
- />
19
- );
20
- }
21
- );
22
- Text.displayName = 'Text';
8
+ function Text({
9
+ className,
10
+ asChild = false,
11
+ ...props
12
+ }: React.ComponentProps<typeof RNText> & {
13
+ ref?: React.RefObject<RNText>;
14
+ asChild?: boolean;
15
+ }) {
16
+ const textClass = React.useContext(TextClassContext);
17
+ const Component = asChild ? Slot.Text : RNText;
18
+ return (
19
+ <Component
20
+ className={cn('text-base text-foreground web:select-text', textClass, className)}
21
+ {...props}
22
+ />
23
+ );
24
+ }
23
25
 
24
26
  export { Text, TextClassContext };
@@ -9,31 +9,36 @@ const Tooltip = TooltipPrimitive.Root;
9
9
 
10
10
  const TooltipTrigger = TooltipPrimitive.Trigger;
11
11
 
12
- const TooltipContent = React.forwardRef<
13
- TooltipPrimitive.ContentRef,
14
- TooltipPrimitive.ContentProps & { portalHost?: string }
15
- >(({ className, sideOffset = 4, portalHost, ...props }, ref) => (
16
- <TooltipPrimitive.Portal hostName={portalHost}>
17
- <TooltipPrimitive.Overlay style={Platform.OS !== 'web' ? StyleSheet.absoluteFill : undefined}>
18
- <Animated.View
19
- entering={Platform.select({ web: undefined, default: FadeIn })}
20
- exiting={Platform.select({ web: undefined, default: FadeOut })}
21
- >
22
- <TextClassContext.Provider value='text-sm native:text-base text-popover-foreground'>
23
- <TooltipPrimitive.Content
24
- ref={ref}
25
- sideOffset={sideOffset}
26
- className={cn(
27
- 'z-50 overflow-hidden rounded-md border border-border bg-popover px-3 py-1.5 shadow-md shadow-foreground/5 web:animate-in web:fade-in-0 web:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
28
- className
29
- )}
30
- {...props}
31
- />
32
- </TextClassContext.Provider>
33
- </Animated.View>
34
- </TooltipPrimitive.Overlay>
35
- </TooltipPrimitive.Portal>
36
- ));
37
- TooltipContent.displayName = TooltipPrimitive.Content.displayName;
12
+ function TooltipContent({
13
+ className,
14
+ sideOffset = 4,
15
+ portalHost,
16
+ ...props
17
+ }: TooltipPrimitive.ContentProps & {
18
+ ref?: React.RefObject<TooltipPrimitive.ContentRef>;
19
+ portalHost?: string;
20
+ }) {
21
+ return (
22
+ <TooltipPrimitive.Portal hostName={portalHost}>
23
+ <TooltipPrimitive.Overlay style={Platform.OS !== 'web' ? StyleSheet.absoluteFill : undefined}>
24
+ <Animated.View
25
+ entering={Platform.select({ web: undefined, default: FadeIn })}
26
+ exiting={Platform.select({ web: undefined, default: FadeOut })}
27
+ >
28
+ <TextClassContext.Provider value='text-sm native:text-base text-popover-foreground'>
29
+ <TooltipPrimitive.Content
30
+ sideOffset={sideOffset}
31
+ className={cn(
32
+ 'z-50 overflow-hidden rounded-md border border-border bg-popover px-3 py-1.5 shadow-md shadow-foreground/5 web:animate-in web:fade-in-0 web:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
33
+ className
34
+ )}
35
+ {...props}
36
+ />
37
+ </TextClassContext.Provider>
38
+ </Animated.View>
39
+ </TooltipPrimitive.Overlay>
40
+ </TooltipPrimitive.Portal>
41
+ );
42
+ }
38
43
 
39
44
  export { Tooltip, TooltipContent, TooltipTrigger };
@@ -14,22 +14,21 @@
14
14
  },
15
15
  "dependencies": {
16
16
  "@react-navigation/native": "^7.0.0",
17
- "@rn-primitives/avatar": "~1.1.0",
18
- "@rn-primitives/portal": "~1.2.0",
19
- "@rn-primitives/progress": "~1.1.0",
20
- "@rn-primitives/slot": "~1.1.0",
21
- "@rn-primitives/tooltip": "~1.1.0",
22
- "@rn-primitives/types": "~1.1.0",
17
+ "@rn-primitives/avatar": "~1.2.0",
18
+ "@rn-primitives/portal": "~1.3.0",
19
+ "@rn-primitives/progress": "~1.2.0",
20
+ "@rn-primitives/slot": "~1.2.0",
21
+ "@rn-primitives/tooltip": "~1.2.0",
23
22
  "class-variance-authority": "^0.7.0",
24
23
  "clsx": "^2.1.0",
25
- "expo": "^53.0.7",
26
- "expo-linking": "~7.1.4",
24
+ "expo": "^53.0.9",
25
+ "expo-linking": "~7.1.5",
27
26
  "expo-navigation-bar": "~4.2.4",
28
- "expo-router": "~5.0.5",
27
+ "expo-router": "~5.0.7",
29
28
  "expo-splash-screen": "~0.30.8",
30
29
  "expo-status-bar": "~2.2.3",
31
30
  "expo-system-ui": "~5.0.7",
32
- "lucide-react-native": "^0.507.0",
31
+ "lucide-react-native": "^0.511.0",
33
32
  "nativewind": "^4.1.23",
34
33
  "react": "19.0.0",
35
34
  "react-dom": "19.0.0",
@@ -41,8 +40,7 @@
41
40
  "react-native-web": "~0.20.0",
42
41
  "tailwind-merge": "^2.2.1",
43
42
  "tailwindcss": "3.3.5",
44
- "tailwindcss-animate": "^1.0.7",
45
- "zustand": "^4.4.7"
43
+ "tailwindcss-animate": "^1.0.7"
46
44
  },
47
45
  "devDependencies": {
48
46
  "@babel/core": "^7.26.0",
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  #!/usr/bin/env node
2
- import{createMatchPath as Y}from"tsconfig-paths";async function I(e,o){return Y(o.absoluteBaseUrl,o.paths)(e,void 0,()=>!0,[".ts",".tsx"])}import{cosmiconfig as Z}from"cosmiconfig";import{loadConfig as ee}from"tsconfig-paths";import{z as f}from"zod";var $="~/components",E="~/lib",oe=Z("components",{searchPlaces:["components.json"]}),C=f.object({aliases:f.object({components:f.string(),lib:f.string()})}),te=C.extend({resolvedPaths:f.object({lib:f.string(),components:f.string()})});async function M(e){let o=await ne(e);return o?await S(e,o):null}async function S(e,o){let t=await ee(e);if(t.resultType==="failed")throw new Error(`Failed to load tsconfig.json. ${t.message??""}`.trim());return te.parse({...o,resolvedPaths:{lib:await I(o.aliases.lib,t),components:await I(o.aliases.components,t)}})}async function ne(e){try{let o=await oe.search(e);return o?C.parse(o.config):null}catch{throw new Error(`Invalid configuration found in ${e}/components.json.`)}}import{detect as re}from"@antfu/ni";async function L(e){let o=await re({programmatic:!0,cwd:e});return o==="yarn@berry"?"yarn":o==="pnpm@6"?"pnpm":o??"npm"}import P from"chalk";var a={error(...e){console.log(P.red(...e))},warn(...e){console.log(P.yellow(...e))},info(...e){console.log(P.cyan(...e))},success(...e){console.log(P.green(...e))},break(){console.log("")}};function d(e){typeof e=="string"&&(a.error(e),process.exit(1)),e instanceof Error&&(a.error(e.message),process.exit(1)),a.error("Something went wrong. Please try again."),process.exit(1)}import ie from"chalk";import{promises as se}from"fs";import ae from"ora";import ce from"path";import W from"prompts";async function z(e){let o=n=>ie.cyan(n),t=await W([{type:"text",name:"components",message:`Configure the import alias for ${o("components")}:`,initial:$},{type:"text",name:"lib",message:`Configure the import alias for ${o("lib")}:`,initial:E}]),r=C.parse({aliases:{lib:t.lib||$,components:t.components||E}}),{proceed:i}=await W({type:"confirm",name:"proceed",message:`Write configuration to ${o("components.json")}. Proceed?`,initial:!0});if(i){a.info("");let n=ae("Writing components.json...").start(),s=ce.resolve(e,"components.json");await se.writeFile(s,JSON.stringify(r,null,2),"utf8"),n.succeed()}return await S(e,r)}import h from"chalk";import{Command as pe}from"commander";import{execa as me}from"execa";import{existsSync as y,promises as x}from"fs";import le from"ora";import p from"path";import O from"prompts";import{fileURLToPath as de}from"url";import{z as w}from"zod";var u=[{name:"accordion",dependencies:["text"],icons:["ChevronDown"],npmPackages:["@rn-primitives/accordion"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/accordion.tsx",to:{folder:"ui",file:"accordion.tsx"}}]},{name:"alert",dependencies:["text"],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/alert.tsx",to:{folder:"ui",file:"alert.tsx"}}]},{name:"alert-dialog",dependencies:["button","text"],icons:[],npmPackages:["@rn-primitives/alert-dialog"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/alert-dialog.tsx",to:{folder:"ui",file:"alert-dialog.tsx"}}]},{name:"aspect-ratio",dependencies:[],icons:[],npmPackages:["@rn-primitives/aspect-ratio"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/aspect-ratio.tsx",to:{folder:"ui",file:"aspect-ratio.tsx"}}]},{name:"avatar",dependencies:[],icons:[],npmPackages:["@rn-primitives/avatar"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/avatar.tsx",to:{folder:"ui",file:"avatar.tsx"}}]},{name:"badge",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot","@rn-primitives/types"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/badge.tsx",to:{folder:"ui",file:"badge.tsx"}}]},{name:"button",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/types"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/button.tsx",to:{folder:"ui",file:"button.tsx"}}]},{name:"card",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/types"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/card.tsx",to:{folder:"ui",file:"card.tsx"}}]},{name:"checkbox",dependencies:[],icons:["Check"],npmPackages:["@rn-primitives/checkbox"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/checkbox.tsx",to:{folder:"ui",file:"checkbox.tsx"}}]},{name:"collapsible",dependencies:[],icons:[],npmPackages:["@rn-primitives/collapsible"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/collapsible.tsx",to:{folder:"ui",file:"collapsible.tsx"}}]},{name:"context-menu",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/context-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/context-menu.tsx",to:{folder:"ui",file:"context-menu.tsx"}}]},{name:"dialog",dependencies:[],icons:["X"],npmPackages:["@rn-primitives/dialog"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/dialog.tsx",to:{folder:"ui",file:"dialog.tsx"}}]},{name:"dropdown-menu",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/dropdown-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/dropdown-menu.tsx",to:{folder:"ui",file:"dropdown-menu.tsx"}}]},{name:"hover-card",dependencies:[],icons:[],npmPackages:["@rn-primitives/hover-card"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/hover-card.tsx",to:{folder:"ui",file:"hover-card.tsx"}}]},{name:"input",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/input.tsx",to:{folder:"ui",file:"input.tsx"}}]},{name:"label",dependencies:[],icons:[],npmPackages:["@rn-primitives/label"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/label.tsx",to:{folder:"ui",file:"label.tsx"}}]},{name:"menubar",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/menubar"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/menubar.tsx",to:{folder:"ui",file:"menubar.tsx"}}]},{name:"navigation-menu",dependencies:[],icons:["ChevronDown"],npmPackages:["@rn-primitives/navigation-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/navigation-menu.tsx",to:{folder:"ui",file:"navigation-menu.tsx"}}]},{name:"popover",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/popover"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/popover.tsx",to:{folder:"ui",file:"popover.tsx"}}]},{name:"progress",dependencies:[],icons:[],npmPackages:["@rn-primitives/progress"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/progress.tsx",to:{folder:"ui",file:"progress.tsx"}}]},{name:"radio-group",dependencies:[],icons:[],npmPackages:["@rn-primitives/radio-group"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/radio-group.tsx",to:{folder:"ui",file:"radio-group.tsx"}}]},{name:"select",dependencies:[],icons:["Check","ChevronDown","ChevronUp"],npmPackages:["@rn-primitives/select"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/select.tsx",to:{folder:"ui",file:"select.tsx"}}]},{name:"separator",dependencies:[],icons:[],npmPackages:["@rn-primitives/separator"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/separator.tsx",to:{folder:"ui",file:"separator.tsx"}}]},{name:"skeleton",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/skeleton.tsx",to:{folder:"ui",file:"skeleton.tsx"}}]},{name:"switch",dependencies:[],icons:[],npmPackages:["@rn-primitives/switch"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/switch.tsx",to:{folder:"ui",file:"switch.tsx"}}]},{name:"table",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/table"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/table.tsx",to:{folder:"ui",file:"table.tsx"}}]},{name:"tabs",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/tabs"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/tabs.tsx",to:{folder:"ui",file:"tabs.tsx"}}]},{name:"text",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot","@rn-primitives/types"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/text.tsx",to:{folder:"ui",file:"text.tsx"}}]},{name:"textarea",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/textarea.tsx",to:{folder:"ui",file:"textarea.tsx"}}]},{name:"toggle",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/toggle"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/toggle.tsx",to:{folder:"ui",file:"toggle.tsx"}}]},{name:"toggle-group",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/toggle-group"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/toggle-group.tsx",to:{folder:"ui",file:"toggle-group.tsx"}}]},{name:"tooltip",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/tooltip"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/tooltip.tsx",to:{folder:"ui",file:"tooltip.tsx"}}]},{name:"typography",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot","@rn-primitives/types"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/typography.tsx",to:{folder:"ui",file:"typography.tsx"}}]}];function U(e,o=new Set){let t=u.find(i=>i.name===e);if(!t)return[];o.add(e);let r=t.dependencies.slice();return t.dependencies.forEach(i=>{if(!o.has(i)){let n=U(i,o);r=r.concat(n)}}),r}var j="invalid component";function G(e){let o=new Set;if(e.some(t=>!u.find(r=>r.name===t)))throw new Error(j);return e.forEach(t=>{let r=U(t);r.unshift(t),r.forEach(i=>{o.add(i)})}),Array.from(o).map(t=>{let r=u.find(i=>i.name===t);if(!r)throw new Error(j);return r})}var fe=de(import.meta.url),V=p.dirname(fe),ue=w.object({components:w.array(w.string()).optional(),overwrite:w.boolean(),cwd:w.string(),path:w.string().optional()}),B=new pe().name("add").description("add components to your project").argument("[components...]","the components to add").option("-o, --overwrite","overwrite existing files.",!1).option("-c, --cwd <cwd>","the working directory. defaults to the current directory.",process.cwd()).action(async(e,o)=>{try{let t=ue.parse({components:e,...o}),r=p.resolve(t.cwd);y(r)||(a.error(`The path ${r} does not exist. Please try again.`),process.exit(1));let i=await M(r);i||(i=await z(r));let n=t.components??[];if(!n?.length){let{components:l}=await O({type:"multiselect",name:"components",message:"Which components would you like to add?",hint:"Space to select. A to toggle all. Enter to submit.",instructions:!1,choices:u.map(k=>({title:k.name,value:k.name,selected:!1}))});n=l}n?.length||(a.warn("No components selected. Exiting."),process.exit(0));let s=le("Installing components...").start(),m=[];try{m=G(n)}catch(l){l instanceof Error&&l.message===j&&(a.error(`Invalid component(s): ${n.filter(k=>!u.find(Q=>Q.name===k)).join(", ")}`),process.exit(1)),a.error(l)}let c=[];for(let l of m)s.text=`Installing ${l.name}...`,await ge(l,l.paths,i,s,t.overwrite),c.push(...l.npmPackages);let b=await L(r),T=Array.from(new Set(c));T.length&&(s.text=`Installing ${T.join(", ")}...`,await me(b,[b==="npm"?"install":"add",...T],{cwd:r})),s.succeed("Done.")}catch(t){d(t)}});async function ge(e,o,t,r,i){for(let n of o){let s=p.join(t.resolvedPaths.components,n.to.folder);if(y(s)||await x.mkdir(s,{recursive:!0}),r.stop(),y(p.join(s,n.to.file))){let c=[n.to.folder,n.to.file].join("/");if(!i){a.info(`File already exists: ${h.bgCyan(c)} was skipped. To overwrite, run with the ${h.green("--overwrite")} flag.`);continue}let{overwrite:b}=await O({type:"confirm",name:"overwrite",message:`File already exists: ${h.yellow(c)}. Would you like to overwrite?`,initial:!1});if(!b){a.info("Skipped");continue}}r.start(`Installing ${e.name}...`);let m=n.distFrom?p.join(V,"../__generated/components",n.distFrom):p.join(V,"../__generated/components",n.to.folder,n.to.file);try{let c=await x.readFile(p.resolve(m),"utf8");await x.writeFile(p.join(s,n.to.file),he(c,t.aliases.components,t.aliases.lib))}catch(c){d(c)}}for(let n of e.icons??[]){let s=p.resolve(t.resolvedPaths.lib,"icons");if(!y(s)){await x.mkdir(s,{recursive:!0});try{await x.writeFile(p.join(s,"iconWithClassName.ts"),`import type { LucideIcon } from 'lucide-react-native';
2
+ import{createMatchPath as Y}from"tsconfig-paths";async function I(e,o){return Y(o.absoluteBaseUrl,o.paths)(e,void 0,()=>!0,[".ts",".tsx"])}import{cosmiconfig as Z}from"cosmiconfig";import{loadConfig as ee}from"tsconfig-paths";import{z as f}from"zod";var $="~/components",E="~/lib",oe=Z("components",{searchPlaces:["components.json"]}),C=f.object({aliases:f.object({components:f.string(),lib:f.string()})}),te=C.extend({resolvedPaths:f.object({lib:f.string(),components:f.string()})});async function M(e){let o=await ne(e);return o?await S(e,o):null}async function S(e,o){let t=await ee(e);if(t.resultType==="failed")throw new Error(`Failed to load tsconfig.json. ${t.message??""}`.trim());return te.parse({...o,resolvedPaths:{lib:await I(o.aliases.lib,t),components:await I(o.aliases.components,t)}})}async function ne(e){try{let o=await oe.search(e);return o?C.parse(o.config):null}catch{throw new Error(`Invalid configuration found in ${e}/components.json.`)}}import{detect as re}from"@antfu/ni";async function L(e){let o=await re({programmatic:!0,cwd:e});return o==="yarn@berry"?"yarn":o==="pnpm@6"?"pnpm":o??"npm"}import P from"chalk";var a={error(...e){console.log(P.red(...e))},warn(...e){console.log(P.yellow(...e))},info(...e){console.log(P.cyan(...e))},success(...e){console.log(P.green(...e))},break(){console.log("")}};function d(e){typeof e=="string"&&(a.error(e),process.exit(1)),e instanceof Error&&(a.error(e.message),process.exit(1)),a.error("Something went wrong. Please try again."),process.exit(1)}import ie from"chalk";import{promises as se}from"fs";import ae from"ora";import ce from"path";import W from"prompts";async function z(e){let o=n=>ie.cyan(n),t=await W([{type:"text",name:"components",message:`Configure the import alias for ${o("components")}:`,initial:$},{type:"text",name:"lib",message:`Configure the import alias for ${o("lib")}:`,initial:E}]),r=C.parse({aliases:{lib:t.lib||$,components:t.components||E}}),{proceed:i}=await W({type:"confirm",name:"proceed",message:`Write configuration to ${o("components.json")}. Proceed?`,initial:!0});if(i){a.info("");let n=ae("Writing components.json...").start(),s=ce.resolve(e,"components.json");await se.writeFile(s,JSON.stringify(r,null,2),"utf8"),n.succeed()}return await S(e,r)}import h from"chalk";import{Command as pe}from"commander";import{execa as me}from"execa";import{existsSync as y,promises as x}from"fs";import le from"ora";import p from"path";import O from"prompts";import{fileURLToPath as de}from"url";import{z as w}from"zod";var u=[{name:"accordion",dependencies:["text"],icons:["ChevronDown"],npmPackages:["@rn-primitives/accordion"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/accordion.tsx",to:{folder:"ui",file:"accordion.tsx"}}]},{name:"alert",dependencies:["text"],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/alert.tsx",to:{folder:"ui",file:"alert.tsx"}}]},{name:"alert-dialog",dependencies:["button","text"],icons:[],npmPackages:["@rn-primitives/alert-dialog"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/alert-dialog.tsx",to:{folder:"ui",file:"alert-dialog.tsx"}}]},{name:"aspect-ratio",dependencies:[],icons:[],npmPackages:["@rn-primitives/aspect-ratio"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/aspect-ratio.tsx",to:{folder:"ui",file:"aspect-ratio.tsx"}}]},{name:"avatar",dependencies:[],icons:[],npmPackages:["@rn-primitives/avatar"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/avatar.tsx",to:{folder:"ui",file:"avatar.tsx"}}]},{name:"badge",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/badge.tsx",to:{folder:"ui",file:"badge.tsx"}}]},{name:"button",dependencies:["text"],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/button.tsx",to:{folder:"ui",file:"button.tsx"}}]},{name:"card",dependencies:["text"],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/card.tsx",to:{folder:"ui",file:"card.tsx"}}]},{name:"checkbox",dependencies:[],icons:["Check"],npmPackages:["@rn-primitives/checkbox"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/checkbox.tsx",to:{folder:"ui",file:"checkbox.tsx"}}]},{name:"collapsible",dependencies:[],icons:[],npmPackages:["@rn-primitives/collapsible"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/collapsible.tsx",to:{folder:"ui",file:"collapsible.tsx"}}]},{name:"context-menu",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/context-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/context-menu.tsx",to:{folder:"ui",file:"context-menu.tsx"}}]},{name:"dialog",dependencies:[],icons:["X"],npmPackages:["@rn-primitives/dialog"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/dialog.tsx",to:{folder:"ui",file:"dialog.tsx"}}]},{name:"dropdown-menu",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/dropdown-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/dropdown-menu.tsx",to:{folder:"ui",file:"dropdown-menu.tsx"}}]},{name:"hover-card",dependencies:[],icons:[],npmPackages:["@rn-primitives/hover-card"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/hover-card.tsx",to:{folder:"ui",file:"hover-card.tsx"}}]},{name:"input",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/input.tsx",to:{folder:"ui",file:"input.tsx"}}]},{name:"label",dependencies:[],icons:[],npmPackages:["@rn-primitives/label"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/label.tsx",to:{folder:"ui",file:"label.tsx"}}]},{name:"menubar",dependencies:["text"],icons:["Check","ChevronDown","ChevronRight","ChevronUp"],npmPackages:["@rn-primitives/menubar"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/menubar.tsx",to:{folder:"ui",file:"menubar.tsx"}}]},{name:"navigation-menu",dependencies:[],icons:["ChevronDown"],npmPackages:["@rn-primitives/navigation-menu"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/navigation-menu.tsx",to:{folder:"ui",file:"navigation-menu.tsx"}}]},{name:"popover",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/popover"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/popover.tsx",to:{folder:"ui",file:"popover.tsx"}}]},{name:"progress",dependencies:[],icons:[],npmPackages:["@rn-primitives/progress"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/progress.tsx",to:{folder:"ui",file:"progress.tsx"}}]},{name:"radio-group",dependencies:[],icons:[],npmPackages:["@rn-primitives/radio-group"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/radio-group.tsx",to:{folder:"ui",file:"radio-group.tsx"}}]},{name:"select",dependencies:[],icons:["Check","ChevronDown","ChevronUp"],npmPackages:["@rn-primitives/select"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/select.tsx",to:{folder:"ui",file:"select.tsx"}}]},{name:"separator",dependencies:[],icons:[],npmPackages:["@rn-primitives/separator"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/separator.tsx",to:{folder:"ui",file:"separator.tsx"}}]},{name:"skeleton",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/skeleton.tsx",to:{folder:"ui",file:"skeleton.tsx"}}]},{name:"switch",dependencies:[],icons:[],npmPackages:["@rn-primitives/switch"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/switch.tsx",to:{folder:"ui",file:"switch.tsx"}}]},{name:"table",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/table"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/table.tsx",to:{folder:"ui",file:"table.tsx"}}]},{name:"tabs",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/tabs"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/tabs.tsx",to:{folder:"ui",file:"tabs.tsx"}}]},{name:"text",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/text.tsx",to:{folder:"ui",file:"text.tsx"}}]},{name:"textarea",dependencies:[],icons:[],npmPackages:[],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/textarea.tsx",to:{folder:"ui",file:"textarea.tsx"}}]},{name:"toggle",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/toggle"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/toggle.tsx",to:{folder:"ui",file:"toggle.tsx"}}]},{name:"toggle-group",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/toggle-group"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/toggle-group.tsx",to:{folder:"ui",file:"toggle-group.tsx"}}]},{name:"tooltip",dependencies:["text"],icons:[],npmPackages:["@rn-primitives/tooltip"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/tooltip.tsx",to:{folder:"ui",file:"tooltip.tsx"}}]},{name:"typography",dependencies:[],icons:[],npmPackages:["@rn-primitives/slot"],paths:[{from:"./node_modules/@rnr/reusables/src/components/ui/typography.tsx",to:{folder:"ui",file:"typography.tsx"}}]}];function U(e,o=new Set){let t=u.find(i=>i.name===e);if(!t)return[];o.add(e);let r=t.dependencies.slice();return t.dependencies.forEach(i=>{if(!o.has(i)){let n=U(i,o);r=r.concat(n)}}),r}var j="invalid component";function G(e){let o=new Set;if(e.some(t=>!u.find(r=>r.name===t)))throw new Error(j);return e.forEach(t=>{let r=U(t);r.unshift(t),r.forEach(i=>{o.add(i)})}),Array.from(o).map(t=>{let r=u.find(i=>i.name===t);if(!r)throw new Error(j);return r})}var fe=de(import.meta.url),V=p.dirname(fe),ue=w.object({components:w.array(w.string()).optional(),overwrite:w.boolean(),cwd:w.string(),path:w.string().optional()}),B=new pe().name("add").description("add components to your project").argument("[components...]","the components to add").option("-o, --overwrite","overwrite existing files.",!1).option("-c, --cwd <cwd>","the working directory. defaults to the current directory.",process.cwd()).action(async(e,o)=>{try{let t=ue.parse({components:e,...o}),r=p.resolve(t.cwd);y(r)||(a.error(`The path ${r} does not exist. Please try again.`),process.exit(1));let i=await M(r);i||(i=await z(r));let n=t.components??[];if(!n?.length){let{components:l}=await O({type:"multiselect",name:"components",message:"Which components would you like to add?",hint:"Space to select. A to toggle all. Enter to submit.",instructions:!1,choices:u.map(k=>({title:k.name,value:k.name,selected:!1}))});n=l}n?.length||(a.warn("No components selected. Exiting."),process.exit(0));let s=le("Installing components...").start(),m=[];try{m=G(n)}catch(l){l instanceof Error&&l.message===j&&(a.error(`Invalid component(s): ${n.filter(k=>!u.find(Q=>Q.name===k)).join(", ")}`),process.exit(1)),a.error(l)}let c=[];for(let l of m)s.text=`Installing ${l.name}...`,await ge(l,l.paths,i,s,t.overwrite),c.push(...l.npmPackages);let b=await L(r),T=Array.from(new Set(c));T.length&&(s.text=`Installing ${T.join(", ")}...`,await me(b,[b==="npm"?"install":"add",...T],{cwd:r})),s.succeed("Done.")}catch(t){d(t)}});async function ge(e,o,t,r,i){for(let n of o){let s=p.join(t.resolvedPaths.components,n.to.folder);if(y(s)||await x.mkdir(s,{recursive:!0}),r.stop(),y(p.join(s,n.to.file))){let c=[n.to.folder,n.to.file].join("/");if(!i){a.info(`File already exists: ${h.bgCyan(c)} was skipped. To overwrite, run with the ${h.green("--overwrite")} flag.`);continue}let{overwrite:b}=await O({type:"confirm",name:"overwrite",message:`File already exists: ${h.yellow(c)}. Would you like to overwrite?`,initial:!1});if(!b){a.info("Skipped");continue}}r.start(`Installing ${e.name}...`);let m=n.distFrom?p.join(V,"../__generated/components",n.distFrom):p.join(V,"../__generated/components",n.to.folder,n.to.file);try{let c=await x.readFile(p.resolve(m),"utf8");await x.writeFile(p.join(s,n.to.file),he(c,t.aliases.components,t.aliases.lib))}catch(c){d(c)}}for(let n of e.icons??[]){let s=p.resolve(t.resolvedPaths.lib,"icons");if(!y(s)){await x.mkdir(s,{recursive:!0});try{await x.writeFile(p.join(s,"iconWithClassName.ts"),`import type { LucideIcon } from 'lucide-react-native';
3
3
  import { cssInterop } from 'nativewind';
4
4
 
5
5
  export function iconWithClassName(icon: LucideIcon) {