@sudobility/components-rn 1.0.39 → 1.0.41

package/dist/ui/AppVersion/AppVersion.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+export interface AppVersionProps {
+    /** App display name */
+    appName: string;
+    /** Version string (e.g. from package.json) */
+    version: string;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * AppVersion Component
+ *
+ * Displays the app name and version in a muted text style.
+ * Reads the version from the consuming app's package.json.
+ *
+ * @example
+ * ```tsx
+ * import { version } from '../package.json';
+ * <AppVersion appName="MyApp" version={version} />
+ * // renders: "MyApp v1.0.0"
+ * ```
+ */
+export declare const AppVersion: React.FC<AppVersionProps>;
+//# sourceMappingURL=AppVersion.d.ts.map

package/dist/ui/AppVersion/AppVersion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppVersion.d.ts","sourceRoot":"","sources":["../../../src/ui/AppVersion/AppVersion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,eAAe;IAC9B,uBAAuB;IACvB,OAAO,EAAE,MAAM,CAAC;IAChB,8CAA8C;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAehD,CAAC"}

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

@@ -0,0 +1,3 @@
+export { AppVersion } from './AppVersion';
+export type { AppVersionProps } from './AppVersion';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/AppVersion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sudobility/components-rn",
-  "version": "1.0.39",
+  "version": "1.0.41",
   "description": "React Native UI components and design system - Ported from @sudobility/components",
   "type": "module",
   "main": "dist/index.esm.js",

package/src/__tests__/dialog.test.tsx

@@ -1,8 +1,16 @@
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react-native';
+import { render, screen, fireEvent, act } from '@testing-library/react-native';
 import { Text } from 'react-native';
 import { Dialog } from '../ui/Dialog';
 
+beforeEach(() => {
+  jest.useFakeTimers();
+});
+
+afterEach(() => {
+  jest.useRealTimers();
+});
+
 describe('Dialog', () => {
   const defaultProps = {
     isOpen: true,
@@ -16,11 +24,17 @@ describe('Dialog', () => {
 
   it('renders children when open', () => {
     render(<Dialog {...defaultProps} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Dialog content')).toBeTruthy();
   });
 
   it('renders close button by default when onClose is provided', () => {
     render(<Dialog {...defaultProps} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     const closeButton = screen.getByLabelText('Close dialog');
     expect(closeButton).toBeTruthy();
   });
@@ -32,12 +46,18 @@ describe('Dialog', () => {
         <Text>Content</Text>
       </Dialog>
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     fireEvent.press(screen.getByLabelText('Close dialog'));
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
   it('hides close button when showCloseButton is false', () => {
     render(<Dialog {...defaultProps} showCloseButton={false} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.queryByLabelText('Close dialog')).toBeNull();
   });
 
@@ -50,6 +70,9 @@ describe('Dialog', () => {
           <Text>{size}</Text>
         </Dialog>
       );
+      act(() => {
+        jest.runAllTimers();
+      });
       expect(screen.getByText(size)).toBeTruthy();
       unmount();
     });
@@ -61,6 +84,9 @@ describe('Dialog', () => {
         <Text>No close</Text>
       </Dialog>
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.queryByLabelText('Close dialog')).toBeNull();
   });
 
@@ -70,6 +96,9 @@ describe('Dialog', () => {
         <Text>No X button</Text>
       </Dialog>
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('No X button')).toBeTruthy();
     expect(screen.queryByLabelText('Close dialog')).toBeNull();
   });

package/src/__tests__/sheet.test.tsx

@@ -1,8 +1,16 @@
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react-native';
+import { render, screen, fireEvent, act } from '@testing-library/react-native';
 import { Text } from 'react-native';
 import { Sheet } from '../ui/Sheet';
 
+beforeEach(() => {
+  jest.useFakeTimers();
+});
+
+afterEach(() => {
+  jest.useRealTimers();
+});
+
 describe('Sheet', () => {
   const defaultProps = {
     isOpen: true,
@@ -16,11 +24,17 @@ describe('Sheet', () => {
 
   it('renders children when open', () => {
     render(<Sheet {...defaultProps} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Sheet content')).toBeTruthy();
   });
 
   it('renders title when provided', () => {
     render(<Sheet {...defaultProps} title='Sheet Title' />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Sheet Title')).toBeTruthy();
   });
 
@@ -28,11 +42,17 @@ describe('Sheet', () => {
     render(
       <Sheet {...defaultProps} title='Title' description='Sheet description' />
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Sheet description')).toBeTruthy();
   });
 
   it('renders close button by default', () => {
     render(<Sheet {...defaultProps} title='Title' />);
+    act(() => {
+      jest.runAllTimers();
+    });
     const closeButton = screen.getByLabelText('Close sheet');
     expect(closeButton).toBeTruthy();
   });
@@ -44,17 +64,26 @@ describe('Sheet', () => {
         <Text>Content</Text>
       </Sheet>
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     fireEvent.press(screen.getByLabelText('Close sheet'));
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
   it('hides close button when showCloseButton is false', () => {
     render(<Sheet {...defaultProps} title='Title' showCloseButton={false} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.queryByLabelText('Close sheet')).toBeNull();
   });
 
   it('renders footer when provided', () => {
     render(<Sheet {...defaultProps} footer={<Text>Footer area</Text>} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Footer area')).toBeTruthy();
   });
 
@@ -67,6 +96,9 @@ describe('Sheet', () => {
           <Text>Size {size}</Text>
         </Sheet>
       );
+      act(() => {
+        jest.runAllTimers();
+      });
       expect(screen.getByText(`Size ${size}`)).toBeTruthy();
       unmount();
     });
@@ -81,6 +113,9 @@ describe('Sheet', () => {
           <Text>Side {side}</Text>
         </Sheet>
       );
+      act(() => {
+        jest.runAllTimers();
+      });
       expect(screen.getByText(`Side ${side}`)).toBeTruthy();
       unmount();
     });
@@ -88,6 +123,9 @@ describe('Sheet', () => {
 
   it('renders without drag handle when showHandle is false', () => {
     const { toJSON } = render(<Sheet {...defaultProps} showHandle={false} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     // When showHandle is false, the drag handle View is not rendered
     expect(screen.getByText('Sheet content')).toBeTruthy();
     expect(toJSON()).toBeTruthy();
@@ -105,6 +143,9 @@ describe('Sheet', () => {
         <Text>Main content</Text>
       </Sheet>
     );
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Full Sheet')).toBeTruthy();
     expect(screen.getByText('A full sheet example')).toBeTruthy();
     expect(screen.getByText('Main content')).toBeTruthy();

package/src/__tests__/toast.test.tsx

@@ -4,6 +4,14 @@ import { Text, Pressable } from 'react-native';
 import { Toast, ToastProvider, useToast } from '../ui/Toast';
 import type { ToastMessage } from '../ui/Toast';
 
+beforeEach(() => {
+  jest.useFakeTimers();
+});
+
+afterEach(() => {
+  jest.useRealTimers();
+});
+
 describe('Toast', () => {
   const baseToast: ToastMessage = {
     id: 'test-1',
@@ -14,16 +22,25 @@ describe('Toast', () => {
 
   it('renders title', () => {
     render(<Toast toast={baseToast} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Test Toast')).toBeTruthy();
   });
 
   it('renders description', () => {
     render(<Toast toast={baseToast} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('This is a test toast')).toBeTruthy();
   });
 
   it('renders close button', () => {
     render(<Toast toast={baseToast} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     const closeButton = screen.getByLabelText('Close notification');
     expect(closeButton).toBeTruthy();
   });
@@ -31,6 +48,9 @@ describe('Toast', () => {
   it('calls onRemove when close button is pressed', () => {
     const onRemove = jest.fn();
     render(<Toast toast={baseToast} onRemove={onRemove} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     fireEvent.press(screen.getByLabelText('Close notification'));
     expect(onRemove).toHaveBeenCalledWith('test-1');
   });
@@ -42,6 +62,9 @@ describe('Toast', () => {
       action: { label: 'Undo', onPress: onAction },
     };
     render(<Toast toast={toastWithAction} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Undo')).toBeTruthy();
     fireEvent.press(screen.getByText('Undo'));
     expect(onAction).toHaveBeenCalledTimes(1);
@@ -59,6 +82,9 @@ describe('Toast', () => {
     variants.forEach(variant => {
       const toast: ToastMessage = { ...baseToast, variant, id: variant };
       const { unmount } = render(<Toast toast={toast} onRemove={jest.fn()} />);
+      act(() => {
+        jest.runAllTimers();
+      });
       expect(screen.getByText('Test Toast')).toBeTruthy();
       unmount();
     });
@@ -70,6 +96,9 @@ describe('Toast', () => {
       description: 'Description only',
     };
     render(<Toast toast={toast} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Description only')).toBeTruthy();
   });
 
@@ -79,6 +108,9 @@ describe('Toast', () => {
       title: 'Title only',
     };
     render(<Toast toast={toast} onRemove={jest.fn()} />);
+    act(() => {
+      jest.runAllTimers();
+    });
     expect(screen.getByText('Title only')).toBeTruthy();
   });
 });

package/src/index.ts

@@ -44,6 +44,7 @@ export * from './ui/Code';
 export * from './ui/TruncatedText';
 
 // UI Components - Display
+export * from './ui/AppVersion';
 export * from './ui/Badge';
 export * from './ui/Avatar';
 export * from './ui/Skeleton';

package/src/ui/AppVersion/AppVersion.tsx

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { Text } from 'react-native';
+import { cn } from '../../lib/utils';
+
+export interface AppVersionProps {
+  /** App display name */
+  appName: string;
+  /** Version string (e.g. from package.json) */
+  version: string;
+  /** Additional className */
+  className?: string;
+}
+
+/**
+ * AppVersion Component
+ *
+ * Displays the app name and version in a muted text style.
+ * Reads the version from the consuming app's package.json.
+ *
+ * @example
+ * ```tsx
+ * import { version } from '../package.json';
+ * <AppVersion appName="MyApp" version={version} />
+ * // renders: "MyApp v1.0.0"
+ * ```
+ */
+export const AppVersion: React.FC<AppVersionProps> = ({
+  appName,
+  version,
+  className,
+}) => {
+  return (
+    <Text
+      className={cn(
+        'text-sm text-gray-500 dark:text-gray-400 text-center',
+        className
+      )}
+    >
+      {appName} v{version}
+    </Text>
+  );
+};

package/src/ui/AppVersion/index.ts

@@ -0,0 +1,2 @@
+export { AppVersion } from './AppVersion';
+export type { AppVersionProps } from './AppVersion';