@situaction/traquiste-mobile 1.0.0 → 1.2.0

package/README.md

@@ -1,13 +1,14 @@
-
 # @situaction/traquiste-mobile
 
 React Native UI component library for Traquiste — built with Expo + TypeScript strict + native StyleSheet.
 
 ## Requirements
 
-- Node.js >= 18
-- Xcode (iOS)
-- CocoaPods
+Your project must target:
+
+- Expo >= 50
+- React >= 18
+- React Native >= 0.74
 
 ## Installation
 
@@ -15,109 +16,79 @@ React Native UI component library for Traquiste — built with Expo + TypeScript
 npm install @situaction/traquiste-mobile
 ```
 
-Peer dependencies required in your project:
-
-```sh
-npm install expo react react-native
-```
+### Peer dependencies
 
----
-
-## Development
-
-### 1. Clone and install
+Install the following packages in your app if not already present:
 
 ```sh
-git clone git@bitbucket.org:situaction/traquiste-mobile.git
-cd traquiste-mobile
-npm install
-cd example && npm install --legacy-peer-deps && cd ..
-```
-
-### 2. Build the library
-
-```sh
-npm run build
-```
-
-### 3. First time — build the native binary
-
-The `example/ios/` directory is not committed and must be generated locally.
-
-```sh
-cd example
-
-# iOS simulator
-npx expo run:ios
-
-# iOS device (connect via USB)
-npx expo run:ios --device
+npm install expo react react-native \
+  @gorhom/bottom-sheet \
+  react-native-reanimated \
+  react-native-gesture-handler \
+  react-native-safe-area-context \
+  phosphor-react-native
 ```
 
-> Rebuild required each time a native dependency is added.
+> `@gorhom/bottom-sheet` requires additional setup — follow the [official guide](https://ui.gorhom.dev/components/bottom-sheet/installation).
 
-### 4. Run tests
+## Setup
 
-```sh
-npm test
-```
+Wrap your app with `ThemeProvider` at the root:
 
-Tests run with Jest + `@testing-library/react-native`. Use `--watchAll=false` for a single run (e.g. in CI):
+```tsx
+import { ThemeProvider } from '@situaction/traquiste-mobile';
 
-```sh
-npm test -- --watchAll=false
+export default function App() {
+  return (
+    <ThemeProvider>
+      {/* your app */}
+    </ThemeProvider>
+  );
+}
 ```
 
-Test files live in `src/` alongside their components: `ComponentName.test.tsx`.
-
-### 5. Run Storybook
+### Custom theme
 
-```sh
-npm run storybook
+```tsx
+<ThemeProvider
+  light={myLightTokens}   // override default light tokens
+  dark={myDarkTokens}     // override default dark tokens
+  colorScheme="dark"      // force a color scheme (default: system)
+  fontFamily="Inter"      // override font family (default: 'Urbanist')
+>
 ```
 
-Storybook runs directly on the simulator/device — not in a browser. Open the `TraquisteMobileExample` app on your device to see the Storybook UI.
-
-Any change in `src/` is reflected instantly via hot reload.
-
-> If port 8081 is already in use, Metro will prompt to use another port. Update the bundle location in the app dev menu (shake device → **Change Bundle Location**).
-
----
-
-## Scripts
-
-| Command | Description |
-| -------- | ----------- |
-| `npm run build` | Compile TypeScript to `build/` |
-| `npm run lint` | Type-check without emitting |
-| `npm test` | Run Jest tests |
-| `npm run storybook` | Start Storybook on simulator/device |
-
-## Versioning
-
-Releases are automated via [semantic-release](https://semantic-release.gitbook.io/) on push to `master` and `develop`.
-
-Commit convention:
-
-| Prefix | Effect |
-| ------ | ------- |
-| `feat:` | Minor release (1.x.0) |
-| `fix:` | Patch release (1.0.x) |
-| `feat!:` / `BREAKING CHANGE` | Major release (x.0.0) |
-| `chore:` / `docs:` / `test:` | No release |
-
-Branches:
-
-- `master` → published as `latest` on npm
-- `develop` → published as `next` on npm (prerelease)
+## Components
+
+| Component | Description |
+|-----------|-------------|
+| `Button` | Primary, ghost, tertiary, destructive variants |
+| `ButtonAction` | Icon-only action button |
+| `ButtonMap` | Floating map action button |
+| `ButtonMenu` | Tab bar menu button with badge |
+| `Card` / `CardEquip` / `CardProfile` | Equipment and profile cards |
+| `FilterChip` / `FilterNav` | Filter chips and filter bar |
+| `Input` | Text field with label, icons, helper text |
+| `ListItem` | Flexible list row with leading/trailing/primaryLabel slots |
+| `ListGroup` | Selectable list group with section title and check icon |
+| `MapPin` / `Cluster` | Map markers for react-native-maps |
+| `Tag` / `AssociationTag` | Labels and MAC address badges |
+| `Calendar` | Date picker with range selection |
+| `MediaPicker` | Photo and file upload cards |
+| `BottomSheet` | Controlled bottom sheet with theming |
+| `SearchBar` | Search input with clear button |
+| `Checkbox` / `RadioButton` / `Switch` | Form controls |
+| `Spinner` / `ProgressStep` / `Stepper` | Progress indicators |
+| `GeneralNav` / `PageNav` | Navigation headers |
+| `Tab` / `TabBar` | Tab navigation — line & button variants, showContainerBorder |
+| `ColorPicker` / `ColorSwatch` | Color selection |
 
 ## Stack
 
-- Expo SDK 55 / React Native 0.83.6 / React 19.2
-- TypeScript strict
-- Storybook React Native v10
-- semantic-release + Bitbucket Pipelines
-- Zero external styling libraries
+- Expo SDK 55 / React Native 0.83 / React 19
+- TypeScript strict — zero `any`
+- Native `StyleSheet` only — no external styling library
+- `phosphor-react-native` for icons
 
 ## License
 

package/build/components/AssociationTag/AssociationTag.d.ts

@@ -0,0 +1,19 @@
+/**
+ * AssociationTag — compact rectangular badge with text and optional left/right icons.
+ * Used to display beacon/tracker MAC addresses in CardEquip; reusable elsewhere.
+ */
+import React from 'react';
+export interface AssociationTagProps {
+    /** Label text */
+    text: string;
+    /** Icon displayed on the left */
+    iconLeft?: React.ReactNode;
+    /** Icon displayed on the right */
+    iconRight?: React.ReactNode;
+    /** Background color override */
+    backgroundColor?: string;
+    /** Text and icon color override */
+    textColor?: string;
+}
+export declare function AssociationTag({ text, iconLeft, iconRight, backgroundColor, textColor, }: AssociationTagProps): React.JSX.Element;
+//# sourceMappingURL=AssociationTag.d.ts.map

package/build/components/AssociationTag/AssociationTag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssociationTag.d.ts","sourceRoot":"","sources":["../../../src/components/AssociationTag/AssociationTag.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,WAAW,mBAAmB;IAClC,iBAAiB;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kCAAkC;IAClC,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,gCAAgC;IAChC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,eAAe,EACf,SAAS,GACV,EAAE,mBAAmB,qBA2BrB"}

package/build/components/AssociationTag/AssociationTag.js

@@ -0,0 +1,29 @@
+/**
+ * AssociationTag — compact rectangular badge with text and optional left/right icons.
+ * Used to display beacon/tracker MAC addresses in CardEquip; reusable elsewhere.
+ */
+import React from 'react';
+import { Text, View } from 'react-native';
+import { useTheme } from '../../context/ThemeContext';
+import { styles } from './AssociationTag.styles';
+export function AssociationTag({ text, iconLeft, iconRight, backgroundColor, textColor, }) {
+    const { colors, fontFamily } = useTheme();
+    const resolvedBg = backgroundColor ?? colors.success.light;
+    const resolvedText = textColor ?? colors.text.primary;
+    return (<View style={[styles.container, { backgroundColor: resolvedBg }]}>
+      {iconLeft != null && (<View style={styles.iconWrapper}>
+          {React.isValidElement(iconLeft)
+                ? React.cloneElement(iconLeft, { color: resolvedText })
+                : iconLeft}
+        </View>)}
+      <Text style={[styles.text, { color: resolvedText, fontFamily }]} numberOfLines={1}>
+        {text}
+      </Text>
+      {iconRight != null && (<View style={styles.iconWrapper}>
+          {React.isValidElement(iconRight)
+                ? React.cloneElement(iconRight, { color: resolvedText })
+                : iconRight}
+        </View>)}
+    </View>);
+}
+//# sourceMappingURL=AssociationTag.js.map

package/build/components/AssociationTag/AssociationTag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssociationTag.js","sourceRoot":"","sources":["../../../src/components/AssociationTag/AssociationTag.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAejD,MAAM,UAAU,cAAc,CAAC,EAC7B,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,eAAe,EACf,SAAS,GACW;IACpB,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE1C,MAAM,UAAU,GAAG,eAAe,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;IAC3D,MAAM,YAAY,GAAG,SAAS,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC;IAEtD,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,eAAe,EAAE,UAAU,EAAE,CAAC,CAAC,CAC/D;MAAA,CAAC,QAAQ,IAAI,IAAI,IAAI,CACnB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAC9B;UAAA,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;gBAC7B,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,QAAkD,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;gBACjG,CAAC,CAAC,QAAQ,CACd;QAAA,EAAE,IAAI,CAAC,CACR,CACD;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAChF;QAAA,CAAC,IAAI,CACP;MAAA,EAAE,IAAI,CACN;MAAA,CAAC,SAAS,IAAI,IAAI,IAAI,CACpB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAC9B;UAAA,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC;gBAC9B,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,SAAmD,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;gBAClG,CAAC,CAAC,SAAS,CACf;QAAA,EAAE,IAAI,CAAC,CACR,CACH;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC","sourcesContent":["/**\n * AssociationTag — compact rectangular badge with text and optional left/right icons.\n * Used to display beacon/tracker MAC addresses in CardEquip; reusable elsewhere.\n */\nimport React from 'react';\nimport { Text, View } from 'react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { styles } from './AssociationTag.styles';\n\nexport interface AssociationTagProps {\n  /** Label text */\n  text: string;\n  /** Icon displayed on the left */\n  iconLeft?: React.ReactNode;\n  /** Icon displayed on the right */\n  iconRight?: React.ReactNode;\n  /** Background color override */\n  backgroundColor?: string;\n  /** Text and icon color override */\n  textColor?: string;\n}\n\nexport function AssociationTag({\n  text,\n  iconLeft,\n  iconRight,\n  backgroundColor,\n  textColor,\n}: AssociationTagProps) {\n  const { colors, fontFamily } = useTheme();\n\n  const resolvedBg = backgroundColor ?? colors.success.light;\n  const resolvedText = textColor ?? colors.text.primary;\n\n  return (\n    <View style={[styles.container, { backgroundColor: resolvedBg }]}>\n      {iconLeft != null && (\n        <View style={styles.iconWrapper}>\n          {React.isValidElement(iconLeft)\n            ? React.cloneElement(iconLeft as React.ReactElement<{ color?: string }>, { color: resolvedText })\n            : iconLeft}\n        </View>\n      )}\n      <Text style={[styles.text, { color: resolvedText, fontFamily }]} numberOfLines={1}>\n        {text}\n      </Text>\n      {iconRight != null && (\n        <View style={styles.iconWrapper}>\n          {React.isValidElement(iconRight)\n            ? React.cloneElement(iconRight as React.ReactElement<{ color?: string }>, { color: resolvedText })\n            : iconRight}\n        </View>\n      )}\n    </View>\n  );\n}"]}

package/build/components/AssociationTag/AssociationTag.styles.d.ts

@@ -0,0 +1,21 @@
+export declare const styles: {
+    container: {
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "center";
+        gap: number;
+        paddingVertical: number;
+        paddingHorizontal: number;
+        borderRadius: number;
+    };
+    iconWrapper: {
+        flexShrink: number;
+    };
+    text: {
+        fontSize: number;
+        fontWeight: "600";
+        fontFamily: string;
+        flexShrink: number;
+    };
+};
+//# sourceMappingURL=AssociationTag.styles.d.ts.map

package/build/components/AssociationTag/AssociationTag.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssociationTag.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AssociationTag/AssociationTag.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;CAmBjB,CAAC"}

package/build/components/AssociationTag/AssociationTag.styles.js

@@ -0,0 +1,26 @@
+/**
+ * Static styles for the AssociationTag component.
+ * Dynamic colors (background, text) are applied inline in AssociationTag.tsx.
+ */
+import { StyleSheet } from 'react-native';
+export const styles = StyleSheet.create({
+    container: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        gap: 4,
+        paddingVertical: 4,
+        paddingHorizontal: 6,
+        borderRadius: 2,
+    },
+    iconWrapper: {
+        flexShrink: 0,
+    },
+    text: {
+        fontSize: 10,
+        fontWeight: '600',
+        fontFamily: 'Urbanist',
+        flexShrink: 1,
+    },
+});
+//# sourceMappingURL=AssociationTag.styles.js.map

package/build/components/AssociationTag/AssociationTag.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssociationTag.styles.js","sourceRoot":"","sources":["../../../src/components/AssociationTag/AssociationTag.styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IACtC,SAAS,EAAE;QACT,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,GAAG,EAAE,CAAC;QACN,eAAe,EAAE,CAAC;QAClB,iBAAiB,EAAE,CAAC;QACpB,YAAY,EAAE,CAAC;KAChB;IACD,WAAW,EAAE;QACX,UAAU,EAAE,CAAC;KACd;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;QACjB,UAAU,EAAE,UAAU;QACtB,UAAU,EAAE,CAAC;KACd;CACF,CAAC,CAAC","sourcesContent":["/**\n * Static styles for the AssociationTag component.\n * Dynamic colors (background, text) are applied inline in AssociationTag.tsx.\n */\nimport { StyleSheet } from 'react-native';\n\nexport const styles = StyleSheet.create({\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    gap: 4,\n    paddingVertical: 4,\n    paddingHorizontal: 6,\n    borderRadius: 2,\n  },\n  iconWrapper: {\n    flexShrink: 0,\n  },\n  text: {\n    fontSize: 10,\n    fontWeight: '600',\n    fontFamily: 'Urbanist',\n    flexShrink: 1,\n  },\n});"]}

package/build/components/AssociationTag/index.d.ts

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

package/build/components/AssociationTag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/AssociationTag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}

package/build/components/AssociationTag/index.js

@@ -0,0 +1,2 @@
+export { AssociationTag } from './AssociationTag';
+//# sourceMappingURL=index.js.map

package/build/components/AssociationTag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AssociationTag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export { AssociationTag } from './AssociationTag';\nexport type { AssociationTagProps } from './AssociationTag';"]}

package/build/components/BottomSheet/BottomSheet.d.ts

@@ -0,0 +1,36 @@
+/** Bottom sheet — controllable via isOpen/onClose with optional gestures, backdrop and close button */
+import React from 'react';
+export type BottomSheetProps = {
+    /** Sheet content */
+    children: React.ReactNode;
+    /** Whether the sheet is open */
+    isOpen: boolean;
+    /** Called when the sheet opens */
+    onOpen?: () => void;
+    /** Called when the sheet closes */
+    onClose?: () => void;
+    /** Initial height as a fraction of screen height (0 to 1) */
+    size?: number;
+    /** Allow sliding up to expand to full screen (default: true) */
+    expandable?: boolean;
+    /** Allow sliding down to close (default: true) */
+    closeable?: boolean;
+    /** Show a close button (default: false) */
+    showCloseButton?: boolean;
+    /** Position of the close button (default: 'right') */
+    closeButtonPosition?: 'left' | 'right';
+    /** Show dark backdrop behind the sheet (default: true) */
+    backdrop?: boolean;
+    /** Block interactions with content behind the sheet even without a visible backdrop (default: false) */
+    blockBackground?: boolean;
+    /** Close the sheet when the backdrop is pressed (default: false) */
+    closeOnBackdropPress?: boolean;
+    /** Auto-size the sheet based on content height instead of a fixed snap point (default: false) */
+    autoSize?: boolean;
+    /** How the sheet reacts when the keyboard opens */
+    keyboardBehavior?: 'extend' | 'fillParent' | 'interactive';
+    /** Whether the sheet restores its position when the keyboard closes */
+    keyboardBlurBehavior?: 'none' | 'restore';
+};
+export declare const BottomSheet: ({ children, isOpen, onOpen, onClose, size, expandable, closeable, showCloseButton, closeButtonPosition, backdrop, blockBackground, closeOnBackdropPress, autoSize, keyboardBehavior, keyboardBlurBehavior, }: BottomSheetProps) => React.JSX.Element;
+//# sourceMappingURL=BottomSheet.d.ts.map

package/build/components/BottomSheet/BottomSheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../../src/components/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAAA,uGAAuG;AACvG,OAAO,KAA4D,MAAM,OAAO,CAAC;AAYjF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,oBAAoB;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gCAAgC;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gEAAgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,2CAA2C;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,sDAAsD;IACtD,mBAAmB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACvC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wGAAwG;IACxG,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,iGAAiG;IACjG,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mDAAmD;IACnD,gBAAgB,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,aAAa,CAAC;IAC3D,uEAAuE;IACvE,oBAAoB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC3C,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,8MAgBzB,gBAAgB,sBAiHlB,CAAC"}

package/build/components/BottomSheet/BottomSheet.js

@@ -0,0 +1,76 @@
+/** Bottom sheet — controllable via isOpen/onClose with optional gestures, backdrop and close button */
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { View, TouchableOpacity } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import RNBottomSheet, { BottomSheetView, BottomSheetBackdrop, } from '@gorhom/bottom-sheet';
+import { XIcon } from 'phosphor-react-native';
+import { useTheme } from '../../context/ThemeContext';
+import { styles } from './BottomSheet.styles';
+export const BottomSheet = ({ children, isOpen, onOpen, onClose, size = 0.5, expandable = true, closeable = true, showCloseButton = false, closeButtonPosition = 'right', backdrop = true, blockBackground = false, closeOnBackdropPress = false, autoSize = false, keyboardBehavior, keyboardBlurBehavior = 'restore', }) => {
+    const ref = useRef(null);
+    // Freeze the initial open state so gorhom starts in the right position on mount
+    const [initialIndex] = useState(() => (isOpen ? 0 : -1));
+    const didMountRef = useRef(false);
+    const { bottom } = useSafeAreaInsets();
+    const { colors } = useTheme();
+    const snapPoints = autoSize
+        ? undefined
+        : expandable
+            ? [`${Math.round(size * 100)}%`, '100%']
+            : [`${Math.round(size * 100)}%`];
+    const themedStyles = useMemo(() => ({
+        background: {
+            borderWidth: 1,
+            borderColor: colors.bottomSheet.border,
+            borderTopLeftRadius: 16,
+            borderTopRightRadius: 16,
+            borderBottomLeftRadius: 0,
+            borderBottomRightRadius: 0,
+            backgroundColor: colors.bottomSheet.background,
+        },
+        handle: {
+            backgroundColor: colors.bottomSheet.handle,
+            width: 36,
+            height: 4,
+        },
+    }), [colors]);
+    useEffect(() => {
+        // Skip the initial mount — gorhom's index prop handles the initial state
+        if (!didMountRef.current) {
+            didMountRef.current = true;
+            if (isOpen)
+                onOpen?.();
+            return;
+        }
+        if (isOpen) {
+            ref.current?.snapToIndex(0);
+            onOpen?.();
+        }
+        else {
+            ref.current?.close();
+        }
+    }, [isOpen, onOpen]);
+    const handleChange = useCallback((index) => {
+        if (index === -1)
+            onClose?.();
+    }, [onClose]);
+    const renderBackdrop = useCallback((props) => (<BottomSheetBackdrop {...props} disappearsOnIndex={-1} appearsOnIndex={0} pressBehavior={closeOnBackdropPress ? 'close' : 'none'} opacity={backdrop ? 0.5 : 0}/>), [backdrop, closeOnBackdropPress]);
+    const closeButtonStyle = [
+        styles.closeButton,
+        closeButtonPosition === 'left' ? styles.closeLeft : styles.closeRight,
+    ];
+    return (<RNBottomSheet ref={ref} index={initialIndex} snapPoints={snapPoints} enableDynamicSizing={autoSize} enablePanDownToClose={closeable} enableOverDrag={false} enableHandlePanningGesture={expandable || closeable} enableContentPanningGesture={expandable || closeable} onChange={handleChange} keyboardBehavior={keyboardBehavior} keyboardBlurBehavior={keyboardBlurBehavior} backdropComponent={backdrop || blockBackground ? renderBackdrop : undefined} handleIndicatorStyle={expandable || closeable ? themedStyles.handle : styles.handleHidden} backgroundStyle={themedStyles.background} style={styles.shadow}>
+      {autoSize ? (<BottomSheetView style={styles.content}>
+          {showCloseButton && (<TouchableOpacity onPress={onClose} style={closeButtonStyle} hitSlop={8}>
+              <XIcon size={20} color={colors.bottomSheet.closeIcon}/>
+            </TouchableOpacity>)}
+          {children}
+        </BottomSheetView>) : (<View style={[styles.content, { paddingBottom: bottom }]}>
+          {showCloseButton && (<TouchableOpacity onPress={onClose} style={closeButtonStyle} hitSlop={8}>
+              <XIcon size={20} color={colors.bottomSheet.closeIcon}/>
+            </TouchableOpacity>)}
+          {children}
+        </View>)}
+    </RNBottomSheet>);
+};
+//# sourceMappingURL=BottomSheet.js.map

package/build/components/BottomSheet/BottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.js","sourceRoot":"","sources":["../../../src/components/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"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","sourcesContent":["/** Bottom sheet — controllable via isOpen/onClose with optional gestures, backdrop and close button */\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { View, TouchableOpacity } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport RNBottomSheet, {\n  BottomSheetView,\n  BottomSheetBackdrop,\n} from '@gorhom/bottom-sheet';\nimport type { BottomSheetBackdropProps } from '@gorhom/bottom-sheet';\nimport { XIcon } from 'phosphor-react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { styles } from './BottomSheet.styles';\n\nexport type BottomSheetProps = {\n  /** Sheet content */\n  children: React.ReactNode;\n  /** Whether the sheet is open */\n  isOpen: boolean;\n  /** Called when the sheet opens */\n  onOpen?: () => void;\n  /** Called when the sheet closes */\n  onClose?: () => void;\n  /** Initial height as a fraction of screen height (0 to 1) */\n  size?: number;\n  /** Allow sliding up to expand to full screen (default: true) */\n  expandable?: boolean;\n  /** Allow sliding down to close (default: true) */\n  closeable?: boolean;\n  /** Show a close button (default: false) */\n  showCloseButton?: boolean;\n  /** Position of the close button (default: 'right') */\n  closeButtonPosition?: 'left' | 'right';\n  /** Show dark backdrop behind the sheet (default: true) */\n  backdrop?: boolean;\n  /** Block interactions with content behind the sheet even without a visible backdrop (default: false) */\n  blockBackground?: boolean;\n  /** Close the sheet when the backdrop is pressed (default: false) */\n  closeOnBackdropPress?: boolean;\n  /** Auto-size the sheet based on content height instead of a fixed snap point (default: false) */\n  autoSize?: boolean;\n  /** How the sheet reacts when the keyboard opens */\n  keyboardBehavior?: 'extend' | 'fillParent' | 'interactive';\n  /** Whether the sheet restores its position when the keyboard closes */\n  keyboardBlurBehavior?: 'none' | 'restore';\n};\n\nexport const BottomSheet = ({\n  children,\n  isOpen,\n  onOpen,\n  onClose,\n  size = 0.5,\n  expandable = true,\n  closeable = true,\n  showCloseButton = false,\n  closeButtonPosition = 'right',\n  backdrop = true,\n  blockBackground = false,\n  closeOnBackdropPress = false,\n  autoSize = false,\n  keyboardBehavior,\n  keyboardBlurBehavior = 'restore',\n}: BottomSheetProps) => {\n  const ref = useRef<RNBottomSheet>(null);\n  // Freeze the initial open state so gorhom starts in the right position on mount\n  const [initialIndex] = useState(() => (isOpen ? 0 : -1));\n  const didMountRef = useRef(false);\n  const { bottom } = useSafeAreaInsets();\n  const { colors } = useTheme();\n\n  const snapPoints = autoSize\n    ? undefined\n    : expandable\n      ? [`${Math.round(size * 100)}%`, '100%']\n      : [`${Math.round(size * 100)}%`];\n\n  const themedStyles = useMemo(\n    () => ({\n      background: {\n        borderWidth: 1,\n        borderColor: colors.bottomSheet.border,\n        borderTopLeftRadius: 16,\n        borderTopRightRadius: 16,\n        borderBottomLeftRadius: 0,\n        borderBottomRightRadius: 0,\n        backgroundColor: colors.bottomSheet.background,\n      },\n      handle: {\n        backgroundColor: colors.bottomSheet.handle,\n        width: 36,\n        height: 4,\n      },\n    }),\n    [colors],\n  );\n\n  useEffect(() => {\n    // Skip the initial mount — gorhom's index prop handles the initial state\n    if (!didMountRef.current) {\n      didMountRef.current = true;\n      if (isOpen) onOpen?.();\n      return;\n    }\n    if (isOpen) {\n      ref.current?.snapToIndex(0);\n      onOpen?.();\n    } else {\n      ref.current?.close();\n    }\n  }, [isOpen, onOpen]);\n\n  const handleChange = useCallback(\n    (index: number) => {\n      if (index === -1) onClose?.();\n    },\n    [onClose],\n  );\n\n  const renderBackdrop = useCallback(\n    (props: BottomSheetBackdropProps) => (\n      <BottomSheetBackdrop\n        {...props}\n        disappearsOnIndex={-1}\n        appearsOnIndex={0}\n        pressBehavior={closeOnBackdropPress ? 'close' : 'none'}\n        opacity={backdrop ? 0.5 : 0}\n      />\n    ),\n    [backdrop, closeOnBackdropPress],\n  );\n\n  const closeButtonStyle = [\n    styles.closeButton,\n    closeButtonPosition === 'left' ? styles.closeLeft : styles.closeRight,\n  ];\n\n  return (\n    <RNBottomSheet\n      ref={ref}\n      index={initialIndex}\n      snapPoints={snapPoints}\n      enableDynamicSizing={autoSize}\n      enablePanDownToClose={closeable}\n      enableOverDrag={false}\n      enableHandlePanningGesture={expandable || closeable}\n      enableContentPanningGesture={expandable || closeable}\n      onChange={handleChange}\n      keyboardBehavior={keyboardBehavior}\n      keyboardBlurBehavior={keyboardBlurBehavior}\n      backdropComponent={backdrop || blockBackground ? renderBackdrop : undefined}\n      handleIndicatorStyle={expandable || closeable ? themedStyles.handle : styles.handleHidden}\n      backgroundStyle={themedStyles.background}\n      style={styles.shadow}\n    >\n      {autoSize ? (\n        <BottomSheetView style={styles.content}>\n          {showCloseButton && (\n            <TouchableOpacity onPress={onClose} style={closeButtonStyle} hitSlop={8}>\n              <XIcon size={20} color={colors.bottomSheet.closeIcon} />\n            </TouchableOpacity>\n          )}\n          {children}\n        </BottomSheetView>\n      ) : (\n        <View style={[styles.content, { paddingBottom: bottom }]}>\n          {showCloseButton && (\n            <TouchableOpacity onPress={onClose} style={closeButtonStyle} hitSlop={8}>\n              <XIcon size={20} color={colors.bottomSheet.closeIcon} />\n            </TouchableOpacity>\n          )}\n          {children}\n        </View>\n      )}\n    </RNBottomSheet>\n  );\n};"]}

package/build/components/BottomSheet/BottomSheet.styles.d.ts

@@ -0,0 +1,32 @@
+export declare const styles: {
+    content: {
+        flex: number;
+    };
+    handleHidden: {
+        height: number;
+        width: number;
+    };
+    closeButton: {
+        position: "absolute";
+        top: number;
+        padding: number;
+        zIndex: number;
+    };
+    closeRight: {
+        right: number;
+    };
+    closeLeft: {
+        left: number;
+    };
+    shadow: {
+        shadowColor: string;
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+    };
+};
+//# sourceMappingURL=BottomSheet.styles.d.ts.map

package/build/components/BottomSheet/BottomSheet.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.styles.d.ts","sourceRoot":"","sources":["../../../src/components/BottomSheet/BottomSheet.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BjB,CAAC"}

package/build/components/BottomSheet/BottomSheet.styles.js

@@ -0,0 +1,31 @@
+/** Static layout styles for BottomSheet — all colors injected via useTheme() */
+import { StyleSheet } from 'react-native';
+export const styles = StyleSheet.create({
+    content: {
+        flex: 1,
+    },
+    handleHidden: {
+        height: 0,
+        width: 0,
+    },
+    closeButton: {
+        position: 'absolute',
+        top: 10,
+        padding: 4,
+        zIndex: 1,
+    },
+    closeRight: {
+        right: 10,
+    },
+    closeLeft: {
+        left: 10,
+    },
+    shadow: {
+        shadowColor: '#0f0f0f',
+        shadowOffset: { width: 0, height: -4 },
+        shadowOpacity: 0.08,
+        shadowRadius: 12,
+        elevation: 8,
+    },
+});
+//# sourceMappingURL=BottomSheet.styles.js.map

package/build/components/BottomSheet/BottomSheet.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheet.styles.js","sourceRoot":"","sources":["../../../src/components/BottomSheet/BottomSheet.styles.ts"],"names":[],"mappings":"AAAA,gFAAgF;AAChF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IACtC,OAAO,EAAE;QACP,IAAI,EAAE,CAAC;KACR;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,CAAC;QACT,KAAK,EAAE,CAAC;KACT;IACD,WAAW,EAAE;QACX,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,EAAE;QACP,OAAO,EAAE,CAAC;QACV,MAAM,EAAE,CAAC;KACV;IACD,UAAU,EAAE;QACV,KAAK,EAAE,EAAE;KACV;IACD,SAAS,EAAE;QACT,IAAI,EAAE,EAAE;KACT;IACD,MAAM,EAAE;QACN,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE;QACtC,aAAa,EAAE,IAAI;QACnB,YAAY,EAAE,EAAE;QAChB,SAAS,EAAE,CAAC;KACb;CACF,CAAC,CAAC","sourcesContent":["/** Static layout styles for BottomSheet — all colors injected via useTheme() */\nimport { StyleSheet } from 'react-native';\n\nexport const styles = StyleSheet.create({\n  content: {\n    flex: 1,\n  },\n  handleHidden: {\n    height: 0,\n    width: 0,\n  },\n  closeButton: {\n    position: 'absolute',\n    top: 10,\n    padding: 4,\n    zIndex: 1,\n  },\n  closeRight: {\n    right: 10,\n  },\n  closeLeft: {\n    left: 10,\n  },\n  shadow: {\n    shadowColor: '#0f0f0f',\n    shadowOffset: { width: 0, height: -4 },\n    shadowOpacity: 0.08,\n    shadowRadius: 12,\n    elevation: 8,\n  },\n});"]}

package/build/components/BottomSheet/index.d.ts

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

package/build/components/BottomSheet/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/BottomSheet/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}

package/build/components/BottomSheet/index.js

@@ -0,0 +1,2 @@
+export { BottomSheet } from './BottomSheet';
+//# sourceMappingURL=index.js.map

package/build/components/BottomSheet/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BottomSheet/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { BottomSheet } from './BottomSheet';\nexport type { BottomSheetProps } from './BottomSheet';"]}

package/build/components/Button/Button.d.ts

@@ -26,6 +26,10 @@ export interface ButtonProps {
     onPress?: () => void;
     /** Additional container styles */
     style?: StyleProp<ViewStyle>;
+    /** Accessibility label for screen readers — defaults to label when omitted */
+    accessibilityLabel?: string;
+    /** Test identifier */
+    testID?: string;
 }
-export declare function Button({ variant, size, content, label, iconLeft, iconRight, disabled, onPress, style, }: ButtonProps): React.JSX.Element;
+export declare function Button({ variant, size, content, label, iconLeft, iconRight, disabled, onPress, style, accessibilityLabel, testID, }: ButtonProps): React.JSX.Element;
 //# sourceMappingURL=Button.d.ts.map

package/build/components/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzD,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,CAAC;AAC7E,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAChD,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,mBAAmB,GAAG,WAAW,CAAC;AAE5E,MAAM,WAAW,WAAW;IAC1B,4BAA4B;IAC5B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,kBAAkB;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qBAAqB;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC9B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC/B,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAaD,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAU,EACV,OAAqB,EACrB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAgB,EAChB,OAAO,EACP,KAAK,GACN,EAAE,WAAW,qBAwEb"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzD,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,CAAC;AAC7E,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAChD,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,mBAAmB,GAAG,WAAW,CAAC;AAE5E,MAAM,WAAW,WAAW;IAC1B,4BAA4B;IAC5B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,kBAAkB;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qBAAqB;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC9B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC/B,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,8EAA8E;IAC9E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAaD,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAU,EACV,OAAqB,EACrB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAgB,EAChB,OAAO,EACP,KAAK,EACL,kBAAkB,EAClB,MAAM,GACP,EAAE,WAAW,qBAiFb"}

package/build/components/Button/Button.js

@@ -13,9 +13,9 @@ const SIZE_TOKENS = {
     XL: { height: 60, paddingVertical: 16, paddingHorizontal: 32, gap: 12, borderRadius: 8, iconSize: 24, fontSize: 18, lineHeight: 26 },
 };
 // --- Component ---
-export function Button({ variant = 'primary', size = 'M', content = 'icon-both', label, iconLeft, iconRight, disabled = false, onPress, style, }) {
+export function Button({ variant = 'primary', size = 'M', content = 'icon-both', label, iconLeft, iconRight, disabled = false, onPress, style, accessibilityLabel, testID, }) {
     const [pressed, setPressed] = useState(false);
-    const { colors } = useTheme();
+    const { colors, fontFamily } = useTheme();
     const sizeTokens = SIZE_TOKENS[size];
     const state = disabled ? 'disabled' : pressed ? 'pressed' : 'default';
     const colorTokens = colors.button[variant][state];
@@ -40,8 +40,8 @@ export function Button({ variant = 'primary', size = 'M', content = 'icon-both',
         color: colorTokens.text,
         fontSize: sizeTokens.fontSize,
         lineHeight: sizeTokens.lineHeight,
-        fontFamily: 'Urbanist',
-        fontWeight: '500',
+        fontFamily,
+        fontWeight: (variant === 'ghost' ? '600' : '500'),
     };
     // Clone icon elements to inject size and color from active theme state
     const cloneIcon = (icon) => {
@@ -53,12 +53,18 @@ export function Button({ variant = 'primary', size = 'M', content = 'icon-both',
             ...icon.props,
         });
     };
+    const sharedA11y = {
+        accessibilityRole: 'button',
+        accessibilityLabel: accessibilityLabel ?? label,
+        accessibilityState: { disabled },
+        testID,
+    };
     if (isIconOnly) {
-        return (<Pressable pointerEvents={disabled ? 'none' : 'auto'} onPressIn={() => setPressed(true)} onPressOut={() => setPressed(false)} onPress={disabled ? undefined : onPress} style={[containerStyle, style]}>
+        return (<Pressable pointerEvents={disabled ? 'none' : 'auto'} onPressIn={() => setPressed(true)} onPressOut={() => setPressed(false)} onPress={disabled ? undefined : onPress} style={[containerStyle, style]} {...sharedA11y}>
         {cloneIcon(iconLeft)}
       </Pressable>);
     }
-    return (<Pressable pointerEvents={disabled ? 'none' : 'auto'} onPressIn={() => setPressed(true)} onPressOut={() => setPressed(false)} onPress={disabled ? undefined : onPress} style={[containerStyle, style]}>
+    return (<Pressable pointerEvents={disabled ? 'none' : 'auto'} onPressIn={() => setPressed(true)} onPressOut={() => setPressed(false)} onPress={disabled ? undefined : onPress} style={[containerStyle, style]} {...sharedA11y}>
       {cloneIcon(iconLeft)}
       {label != null && <Text style={textStyle}>{label}</Text>}
       {cloneIcon(iconRight)}