everkit-ui 0.1.0

package/dist/module/components/PhotoViewer.js

@@ -0,0 +1,121 @@
+"use strict";
+
+import { Pressable, View } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { X } from 'lucide-react-native';
+import { Text } from "./Text.js";
+import { useColors } from "../theme/ThemeProvider.js";
+import { SPACE, RADIUS } from "../theme/scale.js";
+
+// `react-native-image-viewing` is an OPTIONAL peer, loaded behind a try/catch so
+// the library builds without it. Consumers that use PhotoViewer install the peer;
+// if it's absent the component degrades to rendering nothing (the lightbox simply
+// never opens) rather than crashing the import graph.
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+let ImageViewComp = null;
+try {
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  ImageViewComp = require('react-native-image-viewing').default ?? null;
+} catch {
+  ImageViewComp = null;
+}
+
+/** A single viewable image. The bare `{ uri }` shape `react-native-image-viewing` expects. */
+
+/** Coerce the `string[]` convenience form into the `{ uri }[]` shape the peer expects. */
+function normaliseImages(images) {
+  return images.map(image => typeof image === 'string' ? {
+    uri: image
+  } : image);
+}
+
+/**
+ * Theme-agnostic fullscreen image lightbox — a thin wrapper over the optional
+ * `react-native-image-viewing` peer with a pure-black backdrop, swipe-to-close and
+ * double-tap-to-zoom, plus a custom header (index counter + close button).
+ *
+ * The backdrop is intrinsically black, so the header chrome is coloured from the
+ * theme's on-dark token ({@link useColors} `text.inverse`) for legibility; layout
+ * comes INLINE from {@link SPACE} / {@link RADIUS} and the safe-area inset. Side
+ * effects (open/close, paging) are injected via props — the parent owns `visible`,
+ * `imageIndex` and the data.
+ *
+ * `react-native-image-viewing` is an optional peer (see top of file); when it is
+ * absent the component renders nothing.
+ */
+export function PhotoViewer({
+  images,
+  visible,
+  imageIndex = 0,
+  onClose,
+  onIndexChange
+}) {
+  const ImageView = ImageViewComp;
+  if (!ImageView) return null;
+  const normalised = normaliseImages(images);
+
+  // The peer's Modal mounts above everything; no portal/nav coupling needed.
+  return /*#__PURE__*/_jsx(ImageView, {
+    images: normalised,
+    imageIndex: imageIndex,
+    visible: visible,
+    onRequestClose: onClose,
+    onImageIndexChange: onIndexChange,
+    presentationStyle: "overFullScreen",
+    backgroundColor: "#000000",
+    animationType: "fade",
+    swipeToCloseEnabled: true,
+    doubleTapToZoomEnabled: true,
+    HeaderComponent: ({
+      imageIndex: index
+    }) => /*#__PURE__*/_jsx(PhotoViewerHeader, {
+      imageIndex: index,
+      total: normalised.length,
+      onClose: onClose
+    })
+  });
+}
+function PhotoViewerHeader({
+  imageIndex,
+  total,
+  onClose
+}) {
+  const colors = useColors();
+  const insets = useSafeAreaInsets();
+  return /*#__PURE__*/_jsxs(View, {
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      paddingTop: insets.top + SPACE['2'],
+      paddingHorizontal: SPACE['5'],
+      paddingBottom: SPACE['3']
+    },
+    children: [/*#__PURE__*/_jsxs(Text, {
+      variant: "label-md"
+      // Hide the counter when there is only one photo — looks cleaner.
+      ,
+      style: {
+        color: colors.text.inverse,
+        opacity: total > 1 ? 1 : 0
+      },
+      accessibilityLabel: `Photo ${imageIndex + 1} of ${total}`,
+      children: [imageIndex + 1, " / ", total]
+    }), /*#__PURE__*/_jsx(Pressable, {
+      onPress: onClose,
+      hitSlop: 12,
+      accessibilityRole: "button",
+      accessibilityLabel: "Close photo viewer",
+      style: {
+        padding: SPACE['1.5'],
+        borderRadius: RADIUS.full,
+        backgroundColor: 'rgba(255, 255, 255, 0.12)'
+      },
+      children: /*#__PURE__*/_jsx(X, {
+        size: 22,
+        color: colors.text.inverse
+      })
+    })]
+  });
+}
+//# sourceMappingURL=PhotoViewer.js.map

package/dist/module/components/PhotoViewer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","View","useSafeAreaInsets","X","Text","useColors","SPACE","RADIUS","jsx","_jsx","jsxs","_jsxs","ImageViewComp","require","default","normaliseImages","images","map","image","uri","PhotoViewer","visible","imageIndex","onClose","onIndexChange","ImageView","normalised","onRequestClose","onImageIndexChange","presentationStyle","backgroundColor","animationType","swipeToCloseEnabled","doubleTapToZoomEnabled","HeaderComponent","index","PhotoViewerHeader","total","length","colors","insets","style","flexDirection","alignItems","justifyContent","paddingTop","top","paddingHorizontal","paddingBottom","children","variant","color","text","inverse","opacity","accessibilityLabel","onPress","hitSlop","accessibilityRole","padding","borderRadius","full","size"],"sourceRoot":"../../../src","sources":["components/PhotoViewer.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/components/ProgressBar.js

@@ -0,0 +1,103 @@
+"use strict";
+
+import { useEffect } from 'react';
+import { View } from 'react-native';
+import Animated, { useSharedValue, useAnimatedStyle, withSpring } from 'react-native-reanimated';
+import { Text } from "./Text.js";
+import { useColors } from "../theme/ThemeProvider.js";
+import { SPACE } from "../theme/scale.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const DEFAULT_HEIGHT = 10;
+const SPRING_CONFIG = {
+  damping: 18,
+  stiffness: 120,
+  mass: 1
+};
+
+/**
+ * Theme-agnostic animated horizontal progress bar — a generic fill primitive.
+ * The header row (optional leading icon + `label`, with `trailingLabel` on the
+ * right) carries no domain meaning: names and values are injected by the caller.
+ *
+ * Colour comes INLINE from {@link useColors}: the fill defaults to
+ * `brand.primary` and the track to `bg.secondary`, both overridable via `color`
+ * / `trackColor`. The label tints from `color` (so it matches the fill) and the
+ * trailing label from `text.tertiary`. Layout (gaps + spacing) is applied INLINE
+ * from the library-owned {@link SPACE} scale, so the bar renders with no
+ * NativeWind setup in the consumer; `style` is an inline override merged last.
+ *
+ * When `animated` the fill width springs to `progress` on change (matching the
+ * source's `withSpring` feel); otherwise it snaps. `progress` is clamped to
+ * `0`–`1`.
+ */
+export function ProgressBar({
+  progress,
+  label,
+  trailingLabel,
+  icon,
+  color,
+  trackColor,
+  height = DEFAULT_HEIGHT,
+  animated = true,
+  style
+}) {
+  const colors = useColors();
+  const fillColor = color ?? colors.brand.primary;
+  const track = trackColor ?? colors.bg.secondary;
+  const clamped = Math.max(0, Math.min(progress, 1));
+  const progressAnim = useSharedValue(animated ? 0 : clamped);
+  useEffect(() => {
+    progressAnim.value = animated ? withSpring(clamped, SPRING_CONFIG) : clamped;
+  }, [clamped, animated, progressAnim]);
+  const barStyle = useAnimatedStyle(() => ({
+    width: `${progressAnim.value * 100}%`
+  }));
+  const hasHeader = !!label || !!trailingLabel || !!icon;
+  return /*#__PURE__*/_jsxs(View, {
+    style: style,
+    children: [hasHeader ? /*#__PURE__*/_jsxs(View, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        marginBottom: SPACE['2']
+      },
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: {
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap: SPACE['1']
+        },
+        children: [icon ?? null, label ? /*#__PURE__*/_jsx(Text, {
+          variant: "label-md",
+          style: {
+            color: fillColor
+          },
+          children: label
+        }) : null]
+      }), trailingLabel ? /*#__PURE__*/_jsx(Text, {
+        variant: "caption",
+        style: {
+          color: colors.text.tertiary
+        },
+        children: trailingLabel
+      }) : null]
+    }) : null, /*#__PURE__*/_jsx(View, {
+      style: {
+        width: '100%',
+        height,
+        borderRadius: height / 2,
+        backgroundColor: track,
+        overflow: 'hidden'
+      },
+      children: /*#__PURE__*/_jsx(Animated.View, {
+        style: [{
+          height,
+          borderRadius: height / 2,
+          backgroundColor: fillColor
+        }, barStyle]
+      })
+    })]
+  });
+}
+//# sourceMappingURL=ProgressBar.js.map

package/dist/module/components/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","View","Animated","useSharedValue","useAnimatedStyle","withSpring","Text","useColors","SPACE","jsx","_jsx","jsxs","_jsxs","DEFAULT_HEIGHT","SPRING_CONFIG","damping","stiffness","mass","ProgressBar","progress","label","trailingLabel","icon","color","trackColor","height","animated","style","colors","fillColor","brand","primary","track","bg","secondary","clamped","Math","max","min","progressAnim","value","barStyle","width","hasHeader","children","flexDirection","alignItems","justifyContent","marginBottom","gap","variant","text","tertiary","borderRadius","backgroundColor","overflow"],"sourceRoot":"../../../src","sources":["components/ProgressBar.tsx"],"mappings":";;AAAA,SAASA,SAAS,QAAwB,OAAO;AACjD,SAASC,IAAI,QAAwC,cAAc;AACnE,OAAOC,QAAQ,IAAIC,cAAc,EAAEC,gBAAgB,EAAEC,UAAU,QAAQ,yBAAyB;AAChG,SAASC,IAAI,QAAQ,WAAQ;AAC7B,SAASC,SAAS,QAAQ,2BAAwB;AAClD,SAASC,KAAK,QAAQ,mBAAgB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AA0BtC,MAAMC,cAAc,GAAG,EAAE;AACzB,MAAMC,aAAa,GAAG;EAAEC,OAAO,EAAE,EAAE;EAAEC,SAAS,EAAE,GAAG;EAAEC,IAAI,EAAE;AAAE,CAAC;;AAE9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,QAAQ;EACRC,KAAK;EACLC,aAAa;EACbC,IAAI;EACJC,KAAK;EACLC,UAAU;EACVC,MAAM,GAAGZ,cAAc;EACvBa,QAAQ,GAAG,IAAI;EACfC;AACgB,CAAC,EAAE;EACnB,MAAMC,MAAM,GAAGrB,SAAS,CAAC,CAAC;EAC1B,MAAMsB,SAAS,GAAGN,KAAK,IAAIK,MAAM,CAACE,KAAK,CAACC,OAAO;EAC/C,MAAMC,KAAK,GAAGR,UAAU,IAAII,MAAM,CAACK,EAAE,CAACC,SAAS;EAE/C,MAAMC,OAAO,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,GAAG,CAACnB,QAAQ,EAAE,CAAC,CAAC,CAAC;EAClD,MAAMoB,YAAY,GAAGpC,cAAc,CAACuB,QAAQ,GAAG,CAAC,GAAGS,OAAO,CAAC;EAE3DnC,SAAS,CAAC,MAAM;IACduC,YAAY,CAACC,KAAK,GAAGd,QAAQ,GAAGrB,UAAU,CAAC8B,OAAO,EAAErB,aAAa,CAAC,GAAGqB,OAAO;EAC9E,CAAC,EAAE,CAACA,OAAO,EAAET,QAAQ,EAAEa,YAAY,CAAC,CAAC;EAErC,MAAME,QAAQ,GAAGrC,gBAAgB,CAAC,OAAO;IACvCsC,KAAK,EAAE,GAAGH,YAAY,CAACC,KAAK,GAAG,GAAG;EACpC,CAAC,CAAC,CAAC;EAEH,MAAMG,SAAS,GAAG,CAAC,CAACvB,KAAK,IAAI,CAAC,CAACC,aAAa,IAAI,CAAC,CAACC,IAAI;EAEtD,oBACEV,KAAA,CAACX,IAAI;IAAC0B,KAAK,EAAEA,KAAM;IAAAiB,QAAA,GAChBD,SAAS,gBACR/B,KAAA,CAACX,IAAI;MACH0B,KAAK,EAAE;QACLkB,aAAa,EAAE,KAAK;QACpBC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,eAAe;QAC/BC,YAAY,EAAExC,KAAK,CAAC,GAAG;MACzB,CAAE;MAAAoC,QAAA,gBAEFhC,KAAA,CAACX,IAAI;QAAC0B,KAAK,EAAE;UAAEkB,aAAa,EAAE,KAAK;UAAEC,UAAU,EAAE,QAAQ;UAAEG,GAAG,EAAEzC,KAAK,CAAC,GAAG;QAAE,CAAE;QAAAoC,QAAA,GAC1EtB,IAAI,IAAI,IAAI,EACZF,KAAK,gBACJV,IAAA,CAACJ,IAAI;UAAC4C,OAAO,EAAC,UAAU;UAACvB,KAAK,EAAE;YAAEJ,KAAK,EAAEM;UAAU,CAAE;UAAAe,QAAA,EAClDxB;QAAK,CACF,CAAC,GACL,IAAI;MAAA,CACJ,CAAC,EACNC,aAAa,gBACZX,IAAA,CAACJ,IAAI;QAAC4C,OAAO,EAAC,SAAS;QAACvB,KAAK,EAAE;UAAEJ,KAAK,EAAEK,MAAM,CAACuB,IAAI,CAACC;QAAS,CAAE;QAAAR,QAAA,EAC5DvB;MAAa,CACV,CAAC,GACL,IAAI;IAAA,CACJ,CAAC,GACL,IAAI,eAGRX,IAAA,CAACT,IAAI;MACH0B,KAAK,EAAE;QACLe,KAAK,EAAE,MAAM;QACbjB,MAAM;QACN4B,YAAY,EAAE5B,MAAM,GAAG,CAAC;QACxB6B,eAAe,EAAEtB,KAAK;QACtBuB,QAAQ,EAAE;MACZ,CAAE;MAAAX,QAAA,eAGFlC,IAAA,CAACR,QAAQ,CAACD,IAAI;QACZ0B,KAAK,EAAE,CACL;UACEF,MAAM;UACN4B,YAAY,EAAE5B,MAAM,GAAG,CAAC;UACxB6B,eAAe,EAAEzB;QACnB,CAAC,EACDY,QAAQ;MACR,CACH;IAAC,CACE,CAAC;EAAA,CACH,CAAC;AAEX","ignoreList":[]}

package/dist/module/components/ScreenGradient.js

@@ -0,0 +1,64 @@
+"use strict";
+
+import { StyleSheet } from 'react-native';
+import { LinearGradient } from 'expo-linear-gradient';
+import { useColors } from "../theme/ThemeProvider.js";
+import { hexToRgba } from "../internal/hexToRgba.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Theme-agnostic full-screen background — the base every scaffold (`FormScreen`,
+ * `DetailScreen`, `AuthFormScreen`) wraps its content in.
+ *
+ * Color comes INLINE from {@link useColors}: the base stops are
+ * `colors.gradient.screen` (a `[string, string, ...]` tuple the theme owns), so
+ * the screen background follows any injected palette rather than a
+ * `bg-bg-primary` className (NativeWind's CSS-variable path doesn't resolve
+ * reliably on native — it left screens rendering plain white). A faint diagonal
+ * brand WASH is layered on top for depth; its color is DERIVED from
+ * `colors.brand.primary` at 10% via {@link hexToRgba} (never a literal brand
+ * rgba), fading to a generic `'transparent'`. Works in light and dark
+ * automatically.
+ *
+ * Usage: wrap a screen's content and put the (transparent) SafeAreaView inside.
+ */
+export function ScreenGradient({
+  children,
+  style
+}) {
+  const colors = useColors();
+
+  // Brand-derived wash — terracotta/green/etc. follows the theme's brand.primary.
+  const washStops = [hexToRgba(colors.brand.primary, 0.1), 'transparent'];
+  return /*#__PURE__*/_jsxs(LinearGradient, {
+    colors: colors.gradient.screen,
+    locations: [0, 0.6, 1],
+    start: {
+      x: 0.5,
+      y: 0
+    },
+    end: {
+      x: 0.5,
+      y: 1
+    },
+    style: [styles.fill, style],
+    children: [/*#__PURE__*/_jsx(LinearGradient, {
+      pointerEvents: "none",
+      colors: washStops,
+      start: {
+        x: 0.85,
+        y: 0
+      },
+      end: {
+        x: 0.25,
+        y: 0.55
+      },
+      style: StyleSheet.absoluteFill
+    }), children]
+  });
+}
+const styles = StyleSheet.create({
+  fill: {
+    flex: 1
+  }
+});
+//# sourceMappingURL=ScreenGradient.js.map

package/dist/module/components/ScreenGradient.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","LinearGradient","useColors","hexToRgba","jsx","_jsx","jsxs","_jsxs","ScreenGradient","children","style","colors","washStops","brand","primary","gradient","screen","locations","start","x","y","end","styles","fill","pointerEvents","absoluteFill","create","flex"],"sourceRoot":"../../../src","sources":["components/ScreenGradient.tsx"],"mappings":";;AACA,SAASA,UAAU,QAAwB,cAAc;AACzD,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,SAAS,QAAQ,2BAAwB;AAClD,SAASC,SAAS,QAAQ,0BAAuB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAQjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAC;EAAEC,QAAQ;EAAEC;AAA2B,CAAC,EAAE;EACvE,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;;EAE1B;EACA,MAAMU,SAAS,GAAG,CAACT,SAAS,CAACQ,MAAM,CAACE,KAAK,CAACC,OAAO,EAAE,GAAG,CAAC,EAAE,aAAa,CAAU;EAEhF,oBACEP,KAAA,CAACN,cAAc;IACbU,MAAM,EAAEA,MAAM,CAACI,QAAQ,CAACC,MAAO;IAC/BC,SAAS,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAE;IACvBC,KAAK,EAAE;MAAEC,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE;IAAE,CAAE;IACxBC,GAAG,EAAE;MAAEF,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE;IAAE,CAAE;IACtBV,KAAK,EAAE,CAACY,MAAM,CAACC,IAAI,EAAEb,KAAK,CAAE;IAAAD,QAAA,gBAE5BJ,IAAA,CAACJ,cAAc;MACbuB,aAAa,EAAC,MAAM;MACpBb,MAAM,EAAEC,SAAU;MAClBM,KAAK,EAAE;QAAEC,CAAC,EAAE,IAAI;QAAEC,CAAC,EAAE;MAAE,CAAE;MACzBC,GAAG,EAAE;QAAEF,CAAC,EAAE,IAAI;QAAEC,CAAC,EAAE;MAAK,CAAE;MAC1BV,KAAK,EAAEV,UAAU,CAACyB;IAAa,CAChC,CAAC,EACDhB,QAAQ;EAAA,CACK,CAAC;AAErB;AAEA,MAAMa,MAAM,GAAGtB,UAAU,CAAC0B,MAAM,CAAC;EAAEH,IAAI,EAAE;IAAEI,IAAI,EAAE;EAAE;AAAE,CAAC,CAAC","ignoreList":[]}

package/dist/module/components/ScreenHeader.js

@@ -0,0 +1,94 @@
+"use strict";
+
+import { View, Pressable, StyleSheet } from 'react-native';
+import { ArrowLeft } from 'lucide-react-native';
+import { Text } from "./Text.js";
+import { useColors } from "../theme/ThemeProvider.js";
+import { SPACE } from "../theme/scale.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Theme-agnostic screen header — back chevron on the left, optional
+ * title + subtitle in the middle, optional right-action slot on the right.
+ * Safe-area is owned by the parent scaffold.
+ *
+ * Color comes INLINE from {@link useColors}: the chevron is `text.primary`, the
+ * title defaults to `text.primary` (via {@link Text}), and the subtitle is
+ * `text.secondary`. Layout (flex, padding, gap) is applied INLINE from the
+ * library-owned {@link SPACE} scale, so the header renders with no NativeWind
+ * setup in the consumer; `style` is an inline override merged last.
+ *
+ * Router-decoupled: `onBack` is a plain callback wired straight to the back
+ * Pressable's `onPress` — there is deliberately NO `expo-router` import and NO
+ * `router.back()` default. The consuming app supplies navigation.
+ */
+export function ScreenHeader({
+  title,
+  subtitle,
+  onBack,
+  showBack = true,
+  rightActions,
+  variant = 'detail',
+  style
+}) {
+  const colors = useColors();
+  const hasTitle = Boolean(title) || Boolean(subtitle);
+  const titleVariant = variant === 'form' ? 'display-sm' : 'heading-lg';
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.root, style],
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.left,
+      children: [showBack ? /*#__PURE__*/_jsx(Pressable, {
+        onPress: onBack,
+        hitSlop: 12,
+        accessibilityRole: "button",
+        accessibilityLabel: "Go back",
+        children: /*#__PURE__*/_jsx(ArrowLeft, {
+          size: 24,
+          color: colors.text.primary
+        })
+      }) : null, hasTitle ? /*#__PURE__*/_jsxs(View, {
+        style: styles.titleSlot,
+        children: [title ? /*#__PURE__*/_jsx(Text, {
+          variant: titleVariant,
+          numberOfLines: 1,
+          children: title
+        }) : null, subtitle ? /*#__PURE__*/_jsx(Text, {
+          variant: "caption",
+          numberOfLines: 1,
+          style: {
+            color: colors.text.secondary
+          },
+          children: subtitle
+        }) : null]
+      }) : null]
+    }), rightActions ? /*#__PURE__*/_jsx(View, {
+      style: styles.rightActions,
+      children: rightActions
+    }) : null]
+  });
+}
+const styles = StyleSheet.create({
+  root: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    paddingHorizontal: SPACE['5'],
+    paddingTop: SPACE['4'],
+    paddingBottom: SPACE['4']
+  },
+  left: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACE['3'],
+    flex: 1
+  },
+  titleSlot: {
+    flex: 1
+  },
+  rightActions: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACE['4']
+  }
+});
+//# sourceMappingURL=ScreenHeader.js.map

package/dist/module/components/ScreenHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Pressable","StyleSheet","ArrowLeft","Text","useColors","SPACE","jsx","_jsx","jsxs","_jsxs","ScreenHeader","title","subtitle","onBack","showBack","rightActions","variant","style","colors","hasTitle","Boolean","titleVariant","styles","root","children","left","onPress","hitSlop","accessibilityRole","accessibilityLabel","size","color","text","primary","titleSlot","numberOfLines","secondary","create","flexDirection","alignItems","justifyContent","paddingHorizontal","paddingTop","paddingBottom","gap","flex"],"sourceRoot":"../../../src","sources":["components/ScreenHeader.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/components/SearchInput.js

@@ -0,0 +1,118 @@
+"use strict";
+
+import { useState, useEffect, useRef, useCallback } from 'react';
+import { View, TextInput, Pressable } from 'react-native';
+import { Search, X } from 'lucide-react-native';
+import { useColors, useTypography } from "../theme/ThemeProvider.js";
+import { VARIANT_GEOMETRY } from "../theme/geometry.js";
+import { SPACE, RADIUS } from "../theme/scale.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Theme-agnostic debounced search field — a pill with a leading magnifier and a
+ * trailing clear button. The field updates immediately for a responsive feel
+ * while `onChangeText` is debounced (`debounceMs`) so list filtering doesn't run
+ * on every keystroke.
+ *
+ * Every colour comes INLINE from {@link useColors}: the pill fills with
+ * `bg.secondary`, the icons + placeholder are `text.tertiary`, and the typed
+ * text is `text.primary`. The field font comes from the theme's `body-md`
+ * variant (family + geometry) rather than a `font-*` className — the pilot
+ * consumer's hardcoded `font-quicksand-medium` is removed. Layout (flex,
+ * padding, radius) is applied INLINE from the library-owned {@link SPACE}/
+ * {@link RADIUS} scale, so the field renders with no NativeWind setup in the
+ * consumer; `style` is an inline override merged last.
+ */
+export function SearchInput({
+  value,
+  onChangeText,
+  placeholder = 'Search...',
+  debounceMs = 300,
+  style
+}) {
+  const colors = useColors();
+  const typography = useTypography();
+  const [localValue, setLocalValue] = useState(value);
+  const debounceRef = useRef(null);
+
+  // Sync local state when the parent value changes (e.g. cleared from outside).
+  useEffect(() => {
+    setLocalValue(value);
+  }, [value]);
+
+  // Clear the pending timeout on unmount.
+  useEffect(() => {
+    return () => {
+      if (debounceRef.current) clearTimeout(debounceRef.current);
+    };
+  }, []);
+  const handleChangeText = useCallback(text => {
+    setLocalValue(text);
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    if (debounceMs <= 0) {
+      onChangeText(text);
+      return;
+    }
+    debounceRef.current = setTimeout(() => {
+      onChangeText(text);
+    }, debounceMs);
+  }, [onChangeText, debounceMs]);
+  const handleClear = useCallback(() => {
+    setLocalValue('');
+    if (debounceRef.current) clearTimeout(debounceRef.current);
+    onChangeText('');
+  }, [onChangeText]);
+  const geometry = VARIANT_GEOMETRY['body-md'];
+  const fieldFont = {
+    fontFamily: typography.fontFamily['body-md'],
+    fontSize: geometry.fontSize,
+    lineHeight: geometry.lineHeight,
+    letterSpacing: geometry.letterSpacing
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: [{
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: RADIUS.full,
+      paddingHorizontal: SPACE['4'],
+      height: 44,
+      backgroundColor: colors.bg.secondary
+    }, style],
+    children: [/*#__PURE__*/_jsx(Search, {
+      size: 18,
+      color: colors.text.tertiary
+    }), /*#__PURE__*/_jsx(TextInput, {
+      style: [{
+        flex: 1,
+        marginLeft: SPACE['2']
+      }, fieldFont, {
+        color: colors.text.primary
+      }],
+      placeholder: placeholder,
+      placeholderTextColor: colors.text.tertiary,
+      value: localValue,
+      onChangeText: handleChangeText,
+      returnKeyType: "search",
+      autoCapitalize: "none",
+      autoCorrect: false,
+      accessibilityLabel: "Search",
+      accessibilityHint: placeholder
+    }), localValue.length > 0 && /*#__PURE__*/_jsx(Pressable, {
+      onPress: handleClear,
+      style: {
+        width: 44,
+        height: 44,
+        alignItems: 'center',
+        justifyContent: 'center',
+        marginRight: -SPACE['2']
+      },
+      hitSlop: 0,
+      accessibilityRole: "button",
+      accessibilityLabel: "Clear search",
+      children: /*#__PURE__*/_jsx(X, {
+        size: 18,
+        color: colors.text.tertiary
+      })
+    })]
+  });
+}
+//# sourceMappingURL=SearchInput.js.map

package/dist/module/components/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","useEffect","useRef","useCallback","View","TextInput","Pressable","Search","X","useColors","useTypography","VARIANT_GEOMETRY","SPACE","RADIUS","jsx","_jsx","jsxs","_jsxs","SearchInput","value","onChangeText","placeholder","debounceMs","style","colors","typography","localValue","setLocalValue","debounceRef","current","clearTimeout","handleChangeText","text","setTimeout","handleClear","geometry","fieldFont","fontFamily","fontSize","lineHeight","letterSpacing","flexDirection","alignItems","borderRadius","full","paddingHorizontal","height","backgroundColor","bg","secondary","children","size","color","tertiary","flex","marginLeft","primary","placeholderTextColor","returnKeyType","autoCapitalize","autoCorrect","accessibilityLabel","accessibilityHint","length","onPress","width","justifyContent","marginRight","hitSlop","accessibilityRole"],"sourceRoot":"../../../src","sources":["components/SearchInput.tsx"],"mappings":"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","ignoreList":[]}