react-native-atomic-ui 1.0.2 → 1.0.4

package/README.md

@@ -51,9 +51,33 @@
 ### Basic Setup
 
 ```bash
-npm install react-native-atomic-ui react-native
+npm install react-native-atomic-ui
 # or
-yarn add react-native-atomic-ui react-native
+yarn add react-native-atomic-ui
+```
+
+**Note:** `react` and `react-native` are peer dependencies and should already be installed in your React Native project.
+
+### iOS Additional Setup
+
+After installation, if you're on iOS, install pods:
+
+```bash
+cd ios && pod install && cd ..
+```
+
+## 📱 Example App
+
+Want to see all components in action? Check out our comprehensive showcase app:
+
+👉 **[AtomicUIApp Example](examples/app/)** - A complete React Native app demonstrating all components, themes, and features.
+
+To run the example app:
+```bash
+cd examples/app
+npm install
+cd ios && pod install && cd ..
+npx react-native run-ios  # or run-android
 ```
 
 ### With Optional Components
@@ -78,9 +102,15 @@ npm install @react-native-community/netinfo
 
 ## 🔧 Quick Start
 
-### Setup Theme Provider
+### 1. Install the Package
+
+```bash
+npm install react-native-atomic-ui
+```
+
+### 2. Setup Theme Provider
 
-Wrap your app with `ThemeProvider` at the root level:
+Wrap your app with `ThemeProvider` at the root level (usually in `index.js` or `App.tsx`):
 
 ```typescript
 import React from 'react';
@@ -96,7 +126,7 @@ export function Root() {
 }
 ```
 
-### Using Components
+### 3. Start Using Components
 
 ```typescript
 import React from 'react';
@@ -220,9 +250,11 @@ export function TypographyExample() {
 
 ## 📚 Component API Reference
 
-### Box
+### Layout Components
+
+#### Box
 
-Flexible container component for layout.
+Flexible container component for layout with theme-aware spacing.
 
 ```typescript
 interface BoxProps {
@@ -236,14 +268,71 @@ interface BoxProps {
   gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
   backgroundColor?: string;
   borderRadius?: 'xs' | 'sm' | 'md' | 'lg' | 'full';
+  flex?: number;
+  flexDirection?: 'row' | 'column' | 'row-reverse' | 'column-reverse';
+  alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
+  justifyContent?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
+  flexWrap?: 'wrap' | 'nowrap' | 'wrap-reverse';
+  width?: number | string;
+  height?: number | string;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<Box padding={'lg'} backgroundColor={theme.colors.surface} borderRadius={'md'}>
+  <Text>Content</Text>
+</Box>
+```
+
+#### Row & Column
+
+Flex container components for horizontal and vertical layouts.
+
+```typescript
+// Row = Box with flexDirection='row' and alignItems='center' by default
+<Row gap={'md'} padding={'lg'}>
+  {/* Horizontal layout */}
+</Row>
+
+// Column = Box with flexDirection='column'
+<Column gap={'md'} padding={'lg'}>
+  {/* Vertical layout */}
+</Column>
+```
+
+Both components accept all `BoxProps`.
+
+#### Collapsible
+
+Expandable/collapsible section with animated transitions.
+
+```typescript
+interface CollapsibleProps {
+  title: string;
+  children: React.ReactNode;
+  initiallyExpanded?: boolean;
   style?: any;
   testID?: string;
 }
 ```
 
-### Button
+**Example:**
+```typescript
+<Collapsible title={'Advanced Settings'} initiallyExpanded={false}>
+  <Text>Hidden content that can be toggled</Text>
+</Collapsible>
+```
+
+---
+
+### Input Components
 
-Interactive button component with multiple variants.
+#### Button
+
+Interactive button component with multiple variants and sizes.
 
 ```typescript
 interface ButtonProps {
@@ -270,14 +359,222 @@ interface ButtonProps {
 - `medium` - 48px height (default)
 - `large` - 56px height
 
-### Text
+**Example:**
+```typescript
+<Button
+  label={'Submit'}
+  onPress={handleSubmit}
+  variant={'primary'}
+  size={'large'}
+  icon={<Icon name="check" />}
+/>
+```
+
+#### Input
+
+Text input component with label and error support.
+
+```typescript
+interface InputProps {
+  value: string;
+  onChangeText: (text: string) => void;
+  placeholder?: string;
+  label?: string;
+  error?: string;
+  editable?: boolean;
+  secureTextEntry?: boolean;
+  keyboardType?: 'default' | 'numeric' | 'email-address' | 'phone-pad';
+  multiline?: boolean;
+  numberOfLines?: number;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<Input
+  label={'Email'}
+  value={email}
+  onChangeText={setEmail}
+  placeholder={'Enter your email'}
+  keyboardType={'email-address'}
+  error={emailError}
+/>
+```
+
+#### CheckBox
+
+Checkbox component for boolean selections.
+
+```typescript
+interface CheckBoxProps {
+  value: boolean;
+  onValueChange: (value: boolean) => void;
+  label?: string;
+  disabled?: boolean;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<CheckBox
+  value={isChecked}
+  onValueChange={setIsChecked}
+  label={'I agree to the terms'}
+/>
+```
+
+#### RadioButton
 
-Base text component with theme-aware typography.
+Radio button for single selection from a group.
+
+```typescript
+interface RadioButtonProps {
+  value: string;
+  selected: string;
+  onSelect: (value: string) => void;
+  label?: string;
+  disabled?: boolean;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<Column gap={'sm'}>
+  <RadioButton
+    value={'option1'}
+    selected={selectedOption}
+    onSelect={setSelectedOption}
+    label={'Option 1'}
+  />
+  <RadioButton
+    value={'option2'}
+    selected={selectedOption}
+    onSelect={setSelectedOption}
+    label={'Option 2'}
+  />
+</Column>
+```
+
+#### Switch
+
+Toggle switch for boolean values.
+
+```typescript
+interface SwitchProps {
+  value: boolean;
+  onValueChange: (value: boolean) => void;
+  disabled?: boolean;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<Switch
+  value={isEnabled}
+  onValueChange={setIsEnabled}
+/>
+```
+
+---
+
+### Display Components
+
+#### ProgressBar
+
+Horizontal progress indicator.
+
+```typescript
+interface ProgressBarProps {
+  progress: number; // 0-1 range
+  height?: number;
+  color?: string;
+  backgroundColor?: string;
+  borderRadius?: 'xs' | 'sm' | 'md' | 'lg' | 'full';
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<ProgressBar
+  progress={0.65}
+  height={8}
+  color={theme.colors.primary}
+  borderRadius={'full'}
+/>
+```
+
+#### Badge
+
+Small status badge for labels and notifications.
+
+```typescript
+interface BadgeProps {
+  children: React.ReactNode;
+  variant?: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info';
+  size?: 'small' | 'medium' | 'large';
+  style?: any;
+  testID?: string;
+}
+```
+
+**Variants:**
+- `primary` - Blue badge
+- `secondary` - Gray badge
+- `success` - Green badge
+- `error` - Red badge
+- `warning` - Orange badge
+- `info` - Light blue badge
+
+**Example:**
+```typescript
+<Badge variant={'success'} size={'small'}>
+  Active
+</Badge>
+```
+
+#### Divider
+
+Visual separator line (horizontal or vertical).
+
+```typescript
+interface DividerProps {
+  orientation?: 'horizontal' | 'vertical';
+  thickness?: number;
+  color?: string;
+  style?: any;
+  testID?: string;
+}
+```
+
+**Example:**
+```typescript
+<Divider orientation={'horizontal'} thickness={1} />
+```
+
+---
+
+### Typography Components
+
+#### Text
+
+Base text component with theme-aware typography variants.
 
 ```typescript
 interface TextProps {
   children?: React.ReactNode;
-  variant?: 'h1' | 'h2' | ... | 'body1' | 'body2' | ... | 'caption' | 'overline';
+  variant?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 
+            'body1' | 'body2' | 'body3' | 'body4' | 'body5' | 'body6' |
+            'subtitle1' | 'subtitle2' | 'caption' | 'overline';
   color?: string;
   textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify';
   style?: any;
@@ -285,20 +582,35 @@ interface TextProps {
 }
 ```
 
-### Row & Column
+**Typography Hierarchy:**
+- **Headings**: `H1` (48px), `H2` (40px), `H3` (32px), `H4` (28px), `H5` (24px), `H6` (20px)
+- **Body**: `Body1`-`Body6` (16px-11px)
+- **Subtitles**: `SubTitle1` (18px), `SubTitle2` (16px)
+- **Small**: `Caption` (12px), `Overline` (10px)
 
-Flex container components for layout.
+**Example:**
+```typescript
+<Column gap={'sm'}>
+  <H1>Main Heading</H1>
+  <Body1>Regular body text</Body1>
+  <Caption>Small caption text</Caption>
+  <Text variant={'body2'} color={theme.colors.error}>
+    Custom colored text
+  </Text>
+</Column>
+```
+
+**Convenience Components:**
+
+All heading and body variants are exported as standalone components:
 
 ```typescript
-// Row = flexDirection: 'row' with centered items
-<Row gap="md" padding="lg">
-  {/* Horizontal layout */}
-</Row>
+import { H1, H2, H3, Body1, Body2, SubTitle1, Caption, Overline } from 'react-native-atomic-ui';
 
-// Column = flexDirection: 'column'
-<Column gap="md" padding="lg">
-  {/* Vertical layout */}
-</Column>
+// Use directly without variant prop
+<H1>Heading</H1>
+<Body1>Body text</Body1>
+<Caption>Caption</Caption>
 ```
 
 ## 🔗 Advanced Components
@@ -450,17 +762,7 @@ If custom fonts aren't loading, ensure they're linked in Info.plist:
 </array>
 ```
 
-## 🆙 Upgrading
-
-### From 0.x to 1.0
-
-Version 1.0 introduces breaking changes:
-
-- Theme structure updated with new color names
-- `useThemeWithRedux` hook removed (use `useTheme` with Redux context)
-- Component prop names standardized
 
-See [CHANGELOG.md](./CHANGELOG.md) for details.
 
 ## 📄 License
 
@@ -480,6 +782,6 @@ Contributions are welcome! Please see [CONTRIBUTING.md](./CONTRIBUTING.md) for g
 
 ## 🔗 Links
 
-- [GitHub Repository](https://github.com/your-org/react-native-atomic-ui)
+- [GitHub Repository](https://github.com/tanmoythander/react-native-atomic-ui)
 - [npm Package](https://www.npmjs.com/package/react-native-atomic-ui)
-- [Issue Tracker](https://github.com/your-org/react-native-atomic-ui/issues)
+- [Issue Tracker](https://github.com/tanmoythander/react-native-atomic-ui/issues)

package/dist/advanced/date-picker/index.d.ts

@@ -1,3 +1,4 @@
+import type { ViewStyle, StyleProp } from 'react-native';
 /**
  * DatePickerInput - Advanced component for date selection
  * Requires peer dependency: @react-native-community/datetimepicker
@@ -15,7 +16,7 @@ export interface DatePickerInputProps {
     format?: string;
     placeholder?: string;
     disabled?: boolean;
-    style?: any;
+    style?: StyleProp<ViewStyle>;
     testID?: string;
 }
 export declare function DatePickerInput(): void;

package/dist/advanced/date-picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/date-picker/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,IAAI,CAAC;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,eAAe,SAK9B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/date-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;;;;GASG;AAEH,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,IAAI,CAAC;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,eAAe,SAK9B"}

package/dist/advanced/date-picker/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/date-picker/index.ts"],
-  "sourcesContent": ["/**\n * DatePickerInput - Advanced component for date selection\n * Requires peer dependency: @react-native-community/datetimepicker\n *\n * Installation:\n * npm install @react-native-community/datetimepicker\n *\n * Usage:\n * import { DatePickerInput } from 'react-native-atomic-ui/date-picker';\n */\n\nexport interface DatePickerInputProps {\n  value: Date;\n  onChange: (date: Date) => void;\n  label?: string;\n  format?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function DatePickerInput() {\n  throw new Error(\n    'DatePickerInput requires peer dependency: @react-native-community/datetimepicker\\n' +\n    'Install it with: npm install @react-native-community/datetimepicker'\n  );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBO,SAAS,kBAAkB;AAChC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * DatePickerInput - Advanced component for date selection\n * Requires peer dependency: @react-native-community/datetimepicker\n *\n * Installation:\n * npm install @react-native-community/datetimepicker\n *\n * Usage:\n * import { DatePickerInput } from 'react-native-atomic-ui/date-picker';\n */\n\nexport interface DatePickerInputProps {\n  value: Date;\n  onChange: (date: Date) => void;\n  label?: string;\n  format?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function DatePickerInput() {\n  throw new Error(\n    'DatePickerInput requires peer dependency: @react-native-community/datetimepicker\\n' +\n      'Install it with: npm install @react-native-community/datetimepicker'\n  );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BO,SAAS,kBAAkB;AAChC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/date-picker/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/date-picker/index.ts"],
-  "sourcesContent": ["/**\n * DatePickerInput - Advanced component for date selection\n * Requires peer dependency: @react-native-community/datetimepicker\n *\n * Installation:\n * npm install @react-native-community/datetimepicker\n *\n * Usage:\n * import { DatePickerInput } from 'react-native-atomic-ui/date-picker';\n */\n\nexport interface DatePickerInputProps {\n  value: Date;\n  onChange: (date: Date) => void;\n  label?: string;\n  format?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function DatePickerInput() {\n  throw new Error(\n    'DatePickerInput requires peer dependency: @react-native-community/datetimepicker\\n' +\n    'Install it with: npm install @react-native-community/datetimepicker'\n  );\n}\n"],
-  "mappings": ";AAwBO,SAAS,kBAAkB;AAChC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * DatePickerInput - Advanced component for date selection\n * Requires peer dependency: @react-native-community/datetimepicker\n *\n * Installation:\n * npm install @react-native-community/datetimepicker\n *\n * Usage:\n * import { DatePickerInput } from 'react-native-atomic-ui/date-picker';\n */\n\nexport interface DatePickerInputProps {\n  value: Date;\n  onChange: (date: Date) => void;\n  label?: string;\n  format?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function DatePickerInput() {\n  throw new Error(\n    'DatePickerInput requires peer dependency: @react-native-community/datetimepicker\\n' +\n      'Install it with: npm install @react-native-community/datetimepicker'\n  );\n}\n"],
+  "mappings": ";AA0BO,SAAS,kBAAkB;AAChC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/file-picker/index.d.ts

@@ -1,3 +1,4 @@
+import type { ViewStyle, StyleProp } from 'react-native';
 /**
  * FilePicker - Advanced component for file selection
  * Requires peer dependency: @react-native-documents/picker
@@ -8,13 +9,19 @@
  * Usage:
  * import { FilePicker } from 'react-native-atomic-ui/file-picker';
  */
+export interface SelectedFile {
+    uri: string;
+    name: string;
+    type: string;
+    size: number;
+}
 export interface FilePickerProps {
-    onFileSelected: (file: any) => void;
+    onFileSelected: (file: SelectedFile) => void;
     multiple?: boolean;
     type?: string;
     label?: string;
     disabled?: boolean;
-    style?: any;
+    style?: StyleProp<ViewStyle>;
     testID?: string;
 }
 export declare function FilePicker(): void;

package/dist/advanced/file-picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/file-picker/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,MAAM,WAAW,eAAe;IAC9B,cAAc,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,UAAU,SAKzB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/file-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;;;;GASG;AAEH,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,eAAe;IAC9B,cAAc,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,UAAU,SAKzB"}

package/dist/advanced/file-picker/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/file-picker/index.ts"],
-  "sourcesContent": ["/**\n * FilePicker - Advanced component for file selection\n * Requires peer dependency: @react-native-documents/picker\n *\n * Installation:\n * npm install @react-native-documents/picker\n *\n * Usage:\n * import { FilePicker } from 'react-native-atomic-ui/file-picker';\n */\n\nexport interface FilePickerProps {\n  onFileSelected: (file: any) => void;\n  multiple?: boolean;\n  type?: string;\n  label?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function FilePicker() {\n  throw new Error(\n    'FilePicker requires peer dependency: @react-native-documents/picker\\n' +\n    'Install it with: npm install @react-native-documents/picker'\n  );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBO,SAAS,aAAa;AAC3B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * FilePicker - Advanced component for file selection\n * Requires peer dependency: @react-native-documents/picker\n *\n * Installation:\n * npm install @react-native-documents/picker\n *\n * Usage:\n * import { FilePicker } from 'react-native-atomic-ui/file-picker';\n */\n\nexport interface SelectedFile {\n  uri: string;\n  name: string;\n  type: string;\n  size: number;\n}\n\nexport interface FilePickerProps {\n  onFileSelected: (file: SelectedFile) => void;\n  multiple?: boolean;\n  type?: string;\n  label?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function FilePicker() {\n  throw new Error(\n    'FilePicker requires peer dependency: @react-native-documents/picker\\n' +\n      'Install it with: npm install @react-native-documents/picker'\n  );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgCO,SAAS,aAAa;AAC3B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/file-picker/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/file-picker/index.ts"],
-  "sourcesContent": ["/**\n * FilePicker - Advanced component for file selection\n * Requires peer dependency: @react-native-documents/picker\n *\n * Installation:\n * npm install @react-native-documents/picker\n *\n * Usage:\n * import { FilePicker } from 'react-native-atomic-ui/file-picker';\n */\n\nexport interface FilePickerProps {\n  onFileSelected: (file: any) => void;\n  multiple?: boolean;\n  type?: string;\n  label?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function FilePicker() {\n  throw new Error(\n    'FilePicker requires peer dependency: @react-native-documents/picker\\n' +\n    'Install it with: npm install @react-native-documents/picker'\n  );\n}\n"],
-  "mappings": ";AAuBO,SAAS,aAAa;AAC3B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * FilePicker - Advanced component for file selection\n * Requires peer dependency: @react-native-documents/picker\n *\n * Installation:\n * npm install @react-native-documents/picker\n *\n * Usage:\n * import { FilePicker } from 'react-native-atomic-ui/file-picker';\n */\n\nexport interface SelectedFile {\n  uri: string;\n  name: string;\n  type: string;\n  size: number;\n}\n\nexport interface FilePickerProps {\n  onFileSelected: (file: SelectedFile) => void;\n  multiple?: boolean;\n  type?: string;\n  label?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementation would go here\n// This is a placeholder for library structure\nexport function FilePicker() {\n  throw new Error(\n    'FilePicker requires peer dependency: @react-native-documents/picker\\n' +\n      'Install it with: npm install @react-native-documents/picker'\n  );\n}\n"],
+  "mappings": ";AAgCO,SAAS,aAAa;AAC3B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/picker/index.d.ts

@@ -1,3 +1,4 @@
+import type { ViewStyle, StyleProp } from 'react-native';
 /**
  * Picker Components - Advanced dropdowns and selection
  * Requires peer dependency: react-native-picker-select
@@ -19,7 +20,7 @@ export interface PickerInputProps {
     label?: string;
     placeholder?: string;
     disabled?: boolean;
-    style?: any;
+    style?: StyleProp<ViewStyle>;
     testID?: string;
 }
 export declare function BorderedPickerInput(): void;

package/dist/advanced/picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/picker/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,mBAAmB,SAKlC;AAED,wBAAgB,WAAW,SAK1B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;;;;GASG;AAEH,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,mBAAmB,SAKlC;AAED,wBAAgB,WAAW,SAK1B"}

package/dist/advanced/picker/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/picker/index.ts"],
-  "sourcesContent": ["/**\n * Picker Components - Advanced dropdowns and selection\n * Requires peer dependency: react-native-picker-select\n *\n * Installation:\n * npm install react-native-picker-select\n *\n * Usage:\n * import { BorderedPickerInput } from 'react-native-atomic-ui/picker';\n */\n\nexport interface PickerOption {\n  label: string;\n  value: string | number;\n}\n\nexport interface PickerInputProps {\n  value: string | number | undefined;\n  onValueChange: (value: string | number) => void;\n  items: PickerOption[];\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function BorderedPickerInput() {\n  throw new Error(\n    'BorderedPickerInput requires peer dependency: react-native-picker-select\\n' +\n    'Install it with: npm install react-native-picker-select'\n  );\n}\n\nexport function PickerModal() {\n  throw new Error(\n    'PickerModal requires peer dependency: react-native-picker-select\\n' +\n    'Install it with: npm install react-native-picker-select'\n  );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BO,SAAS,sBAAsB;AACpC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,cAAc;AAC5B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * Picker Components - Advanced dropdowns and selection\n * Requires peer dependency: react-native-picker-select\n *\n * Installation:\n * npm install react-native-picker-select\n *\n * Usage:\n * import { BorderedPickerInput } from 'react-native-atomic-ui/picker';\n */\n\nexport interface PickerOption {\n  label: string;\n  value: string | number;\n}\n\nexport interface PickerInputProps {\n  value: string | number | undefined;\n  onValueChange: (value: string | number) => void;\n  items: PickerOption[];\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function BorderedPickerInput() {\n  throw new Error(\n    'BorderedPickerInput requires peer dependency: react-native-picker-select\\n' +\n      'Install it with: npm install react-native-picker-select'\n  );\n}\n\nexport function PickerModal() {\n  throw new Error(\n    'PickerModal requires peer dependency: react-native-picker-select\\n' +\n      'Install it with: npm install react-native-picker-select'\n  );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BO,SAAS,sBAAsB;AACpC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,cAAc;AAC5B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/picker/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/picker/index.ts"],
-  "sourcesContent": ["/**\n * Picker Components - Advanced dropdowns and selection\n * Requires peer dependency: react-native-picker-select\n *\n * Installation:\n * npm install react-native-picker-select\n *\n * Usage:\n * import { BorderedPickerInput } from 'react-native-atomic-ui/picker';\n */\n\nexport interface PickerOption {\n  label: string;\n  value: string | number;\n}\n\nexport interface PickerInputProps {\n  value: string | number | undefined;\n  onValueChange: (value: string | number) => void;\n  items: PickerOption[];\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function BorderedPickerInput() {\n  throw new Error(\n    'BorderedPickerInput requires peer dependency: react-native-picker-select\\n' +\n    'Install it with: npm install react-native-picker-select'\n  );\n}\n\nexport function PickerModal() {\n  throw new Error(\n    'PickerModal requires peer dependency: react-native-picker-select\\n' +\n    'Install it with: npm install react-native-picker-select'\n  );\n}\n"],
-  "mappings": ";AA6BO,SAAS,sBAAsB;AACpC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,cAAc;AAC5B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * Picker Components - Advanced dropdowns and selection\n * Requires peer dependency: react-native-picker-select\n *\n * Installation:\n * npm install react-native-picker-select\n *\n * Usage:\n * import { BorderedPickerInput } from 'react-native-atomic-ui/picker';\n */\n\nexport interface PickerOption {\n  label: string;\n  value: string | number;\n}\n\nexport interface PickerInputProps {\n  value: string | number | undefined;\n  onValueChange: (value: string | number) => void;\n  items: PickerOption[];\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function BorderedPickerInput() {\n  throw new Error(\n    'BorderedPickerInput requires peer dependency: react-native-picker-select\\n' +\n      'Install it with: npm install react-native-picker-select'\n  );\n}\n\nexport function PickerModal() {\n  throw new Error(\n    'PickerModal requires peer dependency: react-native-picker-select\\n' +\n      'Install it with: npm install react-native-picker-select'\n  );\n}\n"],
+  "mappings": ";AA+BO,SAAS,sBAAsB;AACpC,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,cAAc;AAC5B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/advanced/rich-text/index.d.ts

@@ -1,3 +1,4 @@
+import type { ViewStyle, StyleProp } from 'react-native';
 /**
  * Rich Text Components - Advanced text display and editing
  * Requires peer dependencies:
@@ -14,14 +15,14 @@
 export interface RichTextProps {
     html: string;
     onLinkPress?: (url: string) => void;
-    style?: any;
+    style?: StyleProp<ViewStyle>;
     testID?: string;
 }
 export interface RichTextInputProps {
     value: string;
     onChange: (html: string) => void;
     placeholder?: string;
-    style?: any;
+    style?: StyleProp<ViewStyle>;
     testID?: string;
 }
 export declare function RichText(): void;

package/dist/advanced/rich-text/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/rich-text/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,QAAQ,SAKvB;AAED,wBAAgB,aAAa,SAK5B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/advanced/rich-text/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;;;;;;;GAYG;AAEH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAID,wBAAgB,QAAQ,SAKvB;AAED,wBAAgB,aAAa,SAK5B"}

package/dist/advanced/rich-text/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/advanced/rich-text/index.ts"],
-  "sourcesContent": ["/**\n * Rich Text Components - Advanced text display and editing\n * Requires peer dependencies:\n * - react-native-webview (for RichText display)\n * - @10play/tentap-editor (for RichTextInput, custom fork)\n *\n * Installation:\n * npm install react-native-webview\n * npm install github:starburst997/10tap-editor#jd\n *\n * Usage:\n * import { RichText, RichTextInput } from 'react-native-atomic-ui/rich-text';\n */\n\nexport interface RichTextProps {\n  html: string;\n  onLinkPress?: (url: string) => void;\n  style?: any;\n  testID?: string;\n}\n\nexport interface RichTextInputProps {\n  value: string;\n  onChange: (html: string) => void;\n  placeholder?: string;\n  style?: any;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function RichText() {\n  throw new Error(\n    'RichText requires peer dependency: react-native-webview\\n' +\n    'Install it with: npm install react-native-webview'\n  );\n}\n\nexport function RichTextInput() {\n  throw new Error(\n    'RichTextInput requires peer dependency: @10play/tentap-editor\\n' +\n    'Install it with: npm install github:starburst997/10tap-editor#jd'\n  );\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BO,SAAS,WAAW;AACzB,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,gBAAgB;AAC9B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
+  "sourcesContent": ["import type { ViewStyle, StyleProp } from 'react-native';\n\n/**\n * Rich Text Components - Advanced text display and editing\n * Requires peer dependencies:\n * - react-native-webview (for RichText display)\n * - @10play/tentap-editor (for RichTextInput, custom fork)\n *\n * Installation:\n * npm install react-native-webview\n * npm install github:starburst997/10tap-editor#jd\n *\n * Usage:\n * import { RichText, RichTextInput } from 'react-native-atomic-ui/rich-text';\n */\n\nexport interface RichTextProps {\n  html: string;\n  onLinkPress?: (url: string) => void;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\nexport interface RichTextInputProps {\n  value: string;\n  onChange: (html: string) => void;\n  placeholder?: string;\n  style?: StyleProp<ViewStyle>;\n  testID?: string;\n}\n\n// Component implementations would go here\n// These are placeholders for library structure\nexport function RichText() {\n  throw new Error(\n    'RichText requires peer dependency: react-native-webview\\n' +\n      'Install it with: npm install react-native-webview'\n  );\n}\n\nexport function RichTextInput() {\n  throw new Error(\n    'RichTextInput requires peer dependency: @10play/tentap-editor\\n' +\n      'Install it with: npm install github:starburst997/10tap-editor#jd'\n  );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCO,SAAS,WAAW;AACzB,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;AAEO,SAAS,gBAAgB;AAC9B,QAAM,IAAI;AAAA,IACR;AAAA,EAEF;AACF;",
   "names": []
 }