@retray-dev/ui-kit 12.1.0 → 13.0.0

package/src/utils/haptics.ts

@@ -1,22 +1,12 @@
-/**
- * Haptic feedback utilities using expo-haptics.
- *
- * Uses expo-haptics which works with both Expo Go and development builds.
- * react-native-pulsar support is optional for dev builds with native modules.
- *
- * All functions are web-safe (no-op on web platform).
- */
-import { Platform, NativeModules } from 'react-native'
+import { Platform } from 'react-native'
 
-// ─── expo-haptics (primary) ───────────────────────────────────────────────────
-type HapticsModule = typeof import('expo-haptics')
-let _haptics: HapticsModule | null = null
-let _hapticsLoaded = false
+let _haptics: typeof import('expo-haptics') | null = null
+let _loaded = false
 
-async function getHaptics(): Promise<HapticsModule | null> {
+async function getHaptics(): Promise<typeof import('expo-haptics') | null> {
   if (Platform.OS === 'web') return null
-  if (!_hapticsLoaded) {
-    _hapticsLoaded = true
+  if (!_loaded) {
+    _loaded = true
     try {
       _haptics = await import('expo-haptics')
     } catch {
@@ -26,215 +16,30 @@ async function getHaptics(): Promise<HapticsModule | null> {
   return _haptics
 }
 
-// ─── Pulsar (optional for dev builds) ─────────────────────────────────────────
-// Only available in development builds with native modules installed.
-// Gracefully falls back to expo-haptics if not available.
-type PulsarModule = typeof import('react-native-pulsar')
-let _pulsar: PulsarModule | null = null
-let _pulsarChecked = false
-let _pulsarAvailable = false
-
-function isPulsarNativeRegistered(): boolean {
-  // react-native-pulsar's NativeRNPulsar.ts calls
-  // TurboModuleRegistry.getEnforcing('RNPulsar') at module-eval time. When the
-  // native binary is absent (e.g. Expo Go), requiring the package throws during
-  // Metro module eval — and that throw is surfaced by RN's global error handler
-  // (red screen) even when wrapped in try/catch, because guardedLoadModule
-  // reports it before rethrowing. So we must confirm the native module is
-  // actually registered BEFORE requiring the JS wrapper.
-  //
-  // TurboModuleRegistry.get() returns a truthy proxy even for unregistered
-  // modules (false positive), so it can't be trusted. Instead we probe the low
-  // level: the new-arch turbo proxy returns null for unregistered names, and
-  // the old-arch NativeModules map omits them. A direct lookup throws nothing —
-  // unlike a top-level import — so any failure is caught safely here.
-  try {
-    const g = globalThis as {
-      __turboModuleProxy?: (name: string) => unknown
-    }
-    if (typeof g.__turboModuleProxy === 'function') {
-      return g.__turboModuleProxy('RNPulsar') != null
-    }
-    return NativeModules?.RNPulsar != null
-  } catch {
-    return false
-  }
-}
-
-function getPulsar(): PulsarModule | null {
-  if (Platform.OS === 'web') return null
-  if (!_pulsarChecked) {
-    _pulsarChecked = true
-    try {
-      // Only require the package when its native module is registered —
-      // otherwise the require would red-screen the app (see above).
-      if (isPulsarNativeRegistered()) {
-        // eslint-disable-next-line @typescript-eslint/no-require-imports
-        _pulsar = require('react-native-pulsar') as PulsarModule
-        _pulsarAvailable = true
-      }
-    } catch {
-      _pulsar = null
-      _pulsarAvailable = false
-    }
-  }
-  return _pulsarAvailable ? _pulsar : null
-}
-
-// ─── Public API ───────────────────────────────────────────────────────────────
-
-/**
- * Light selection feedback — checkboxes, switches, toggles, pickers.
- */
 export function selectionAsync(): void {
-  if (Platform.OS === 'web') return
-  // Try expo-haptics first (always available in Expo Go)
-  getHaptics().then((h) => {
-    if (h) {
-      h.selectionAsync()
-    } else {
-      // Fallback to Pulsar if available
-      getPulsar()?.Presets.System.selection()
-    }
-  })
+  getHaptics().then((h) => h?.selectionAsync())
 }
 
-/**
- * Light impact — cards, surfaces, light interactions.
- */
 export function impactLight(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.impactAsync(h.ImpactFeedbackStyle.Light)
-    } else {
-      getPulsar()?.Presets.System.impactLight()
-    }
-  })
+  getHaptics().then((h) => h?.impactAsync(h.ImpactFeedbackStyle.Light))
 }
 
-/**
- * Medium impact — buttons, primary actions.
- */
 export function impactMedium(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.impactAsync(h.ImpactFeedbackStyle.Medium)
-    } else {
-      getPulsar()?.Presets.System.impactMedium()
-    }
-  })
+  getHaptics().then((h) => h?.impactAsync(h.ImpactFeedbackStyle.Medium))
 }
 
-/**
- * Heavy impact — confirmations, important actions.
- */
 export function impactHeavy(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.impactAsync(h.ImpactFeedbackStyle.Heavy)
-    } else {
-      getPulsar()?.Presets.System.impactHeavy()
-    }
-  })
+  getHaptics().then((h) => h?.impactAsync(h.ImpactFeedbackStyle.Heavy))
 }
 
-/**
- * Success notification — confirmations, completed actions.
- */
 export function notificationSuccess(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.notificationAsync(h.NotificationFeedbackType.Success)
-    } else {
-      getPulsar()?.Presets.System.notificationSuccess()
-    }
-  })
+  getHaptics().then((h) => h?.notificationAsync(h.NotificationFeedbackType.Success))
 }
 
-/**
- * Error notification — failed actions, errors.
- */
 export function notificationError(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.notificationAsync(h.NotificationFeedbackType.Error)
-    } else {
-      getPulsar()?.Presets.System.notificationError()
-    }
-  })
+  getHaptics().then((h) => h?.notificationAsync(h.NotificationFeedbackType.Error))
 }
 
-/**
- * Warning notification — caution states.
- */
 export function notificationWarning(): void {
-  if (Platform.OS === 'web') return
-  getHaptics().then((h) => {
-    if (h) {
-      h.notificationAsync(h.NotificationFeedbackType.Warning)
-    } else {
-      getPulsar()?.Presets.System.notificationWarning()
-    }
-  })
-}
-
-// ─── Rich Pulsar Presets (enhanced feedback) ──────────────────────────────────
-
-/**
- * Rich haptic presets from Pulsar — enhanced feedback for special interactions.
- * Falls back to basic expo-haptics on Expo Go or unsupported devices.
- */
-export const richHaptics = {
-  /** Hammer strike — strong confirmation feedback. */
-  hammer: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.hammer()
-    else impactHeavy()
-  },
-
-  /** Pulse — rhythmic feedback for toggles or state changes. */
-  pulse: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.pulse()
-    else selectionAsync()
-  },
-
-  /** Buzz — continuous vibration for attention. */
-  buzz: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.buzz()
-    else impactMedium()
-  },
-
-  /** Flick — crisp click feedback. */
-  flick: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.flick()
-    else selectionAsync()
-  },
-
-  /** Soft — gentle, subtle feedback. */
-  soft: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.System.impactSoft()
-    else impactLight()
-  },
-
-  /** Rigid — firm, solid feedback. */
-  rigid: (): void => {
-    if (Platform.OS === 'web') return
-    const p = getPulsar()
-    if (p) p.Presets.System.impactRigid()
-    else impactMedium()
-  },
+  getHaptics().then((h) => h?.notificationAsync(h.NotificationFeedbackType.Warning))
 }

package/src/utils/icons.ts

@@ -9,110 +9,46 @@ import Ionicons from '@expo/vector-icons/Ionicons'
 export type IconFamily = 'Feather' | 'AntDesign' | 'Entypo' | 'FontAwesome5' | 'MaterialIcons' | 'Ionicons'
 
 export interface IconProps {
-  /** Icon name from any supported @expo/vector-icons family. See https://icons.expo.fyi */
   name: string
   size: number
   color: string
-  /** Override the resolved family when the same name exists in multiple families. */
   family?: IconFamily
 }
 
 type IconComponentType = React.ComponentType<{ name: string; size: number; color: string }>
-type IconFamilyEntry = {
-  name: IconFamily
-  component: IconComponentType
-  /** Deferred — glyphMap is only read when the resolution cache is first built. */
-  getGlyphMap: () => Record<string, number>
-}
-
-type WithGlyphMap = { glyphMap?: Record<string, number> }
-
-const glyphMapOf = (mod: unknown): Record<string, number> =>
-  (mod as WithGlyphMap).glyphMap ?? {}
 
-// Priority order: highest-priority family LAST so it overwrites lower-priority entries in the cache.
-const ALL_FAMILIES: IconFamilyEntry[] = [
-  { name: 'Ionicons',      component: Ionicons as unknown as IconComponentType,      getGlyphMap: () => glyphMapOf(Ionicons) },
-  { name: 'MaterialIcons', component: MaterialIcons as unknown as IconComponentType, getGlyphMap: () => glyphMapOf(MaterialIcons) },
-  { name: 'FontAwesome5',  component: FontAwesome5 as unknown as IconComponentType,  getGlyphMap: () => glyphMapOf(FontAwesome5) },
-  { name: 'Entypo',        component: Entypo as unknown as IconComponentType,        getGlyphMap: () => glyphMapOf(Entypo) },
-  { name: 'AntDesign',     component: AntDesign as unknown as IconComponentType,     getGlyphMap: () => glyphMapOf(AntDesign) },
-  { name: 'Feather',       component: Feather as unknown as IconComponentType,       getGlyphMap: () => glyphMapOf(Feather) },
+const ALL_FAMILIES: { name: IconFamily; component: IconComponentType; glyphMap?: Record<string, number> }[] = [
+  { name: 'Feather',       component: Feather as unknown as IconComponentType },
+  { name: 'AntDesign',     component: AntDesign as unknown as IconComponentType },
+  { name: 'Entypo',        component: Entypo as unknown as IconComponentType },
+  { name: 'FontAwesome5',  component: FontAwesome5 as unknown as IconComponentType },
+  { name: 'MaterialIcons', component: MaterialIcons as unknown as IconComponentType },
+  { name: 'Ionicons',      component: Ionicons as unknown as IconComponentType },
 ]
 
-// Active families participating in name resolution. Defaults to all six.
-let activeFamilies: IconFamilyEntry[] = ALL_FAMILIES
-let resolvedCache: Map<string, IconFamilyEntry> | null = null
-
-/**
- * Restrict which icon families participate in automatic name resolution.
- * Narrowing to the families you actually use shrinks the resolution cache and
- * speeds up the first `renderIcon` call (no scanning thousands of unused glyphs).
- *
- * Note: all six families are still statically imported by this module — Metro
- * bundles them regardless. This controls *resolution scope*, not bundle size.
- *
- * @example configureIconFamilies(['Feather', 'MaterialIcons'])
- */
-export function configureIconFamilies(families: IconFamily[]): void {
-  const order = families
-    .map((n) => ALL_FAMILIES.find((f) => f.name === n))
-    .filter((f): f is IconFamilyEntry => f !== undefined)
-  activeFamilies = order.length > 0 ? order : ALL_FAMILIES
-  resolvedCache = null // invalidate — rebuilt lazily on next resolve
-}
-
-function buildCache(families?: IconFamilyEntry[]): Map<string, IconFamilyEntry> {
-  const cache = new Map<string, IconFamilyEntry>()
-  for (const family of (families ?? activeFamilies)) {
-    const glyphMap = family.getGlyphMap()
-    for (const iconName of Object.keys(glyphMap)) {
-      cache.set(iconName, family)
+// Lazy singleton cache — populates on first Icon render, persists for session.
+let glyphCacheInitialized = false
+function ensureGlyphCache() {
+  if (glyphCacheInitialized) return
+  glyphCacheInitialized = true
+  for (const entry of ALL_FAMILIES) {
+    try {
+      entry.glyphMap = (entry.component as unknown as { glyphMap?: Record<string, number> }).glyphMap
+    } catch {
+      entry.glyphMap = {}
     }
   }
-  return cache
-}
-
-function resolveFamily(name: string): IconFamilyEntry | null {
-  if (!resolvedCache) {
-    resolvedCache = buildCache()
-  }
-  return resolvedCache.get(name) ?? null
-}
-
-let cachedIconNames: string[] | null = null
-
-export function getValidIconNames(families?: IconFamily[]): string[] {
-  if (families && families.length > 0) {
-    const tempFamilies = families
-      .map((n) => ALL_FAMILIES.find((f) => f.name === n))
-      .filter((f): f is IconFamilyEntry => f !== undefined)
-    if (tempFamilies.length === 0) return []
-    const cache = buildCache(tempFamilies)
-    return Array.from(cache.keys())
-  }
-  if (!cachedIconNames) {
-    const cache = buildCache()
-    cachedIconNames = Array.from(cache.keys())
-  }
-  return cachedIconNames
 }
 
 export function Icon({ name, size, color, family }: IconProps): React.ReactElement | null {
-  let resolved: IconFamilyEntry | null = null
-
-  if (family) {
-    resolved = ALL_FAMILIES.find((f) => f.name === family) ?? null
-  } else {
-    resolved = resolveFamily(name)
-  }
-
-  if (!resolved) return null
-
-  const Component = resolved.component
-  return React.createElement(Component, { name, size, color })
-}
-
-export function renderIcon(name: string, size: number, color: string): React.ReactElement | null {
-  return React.createElement(Icon, { name, size, color })
+  ensureGlyphCache()
+  const entry = family
+    ? ALL_FAMILIES.find((f) => f.name === family)
+    : ALL_FAMILIES.find((f) => {
+        const glyphMap = f.glyphMap
+        return glyphMap ? name in glyphMap : false
+      })
+
+  if (!entry) return null
+  return React.createElement(entry.component, { name, size, color })
 }

package/src/utils/pressable.ts

@@ -1,66 +1,15 @@
-/**
- * Pressto-based pressable primitives for the UI Kit.
- *
- * Pressto provides main-thread pressable animations built on react-native-gesture-handler
- * and react-native-reanimated. Animations run at 60fps with zero JS overhead.
- *
- * These custom pressables match the UI Kit's design language:
- * - Button: 0.95 scale (tight, premium press)
- * - Card: 0.98 scale (subtle surface response)
- * - Row: 0.97 scale (list items, menu items)
- * - Chip: 0.94 scale (compact, snappy)
- */
 import { createAnimatedPressable } from 'pressto'
-import { PRESS_SCALE } from './animations'
 
-/**
- * Button pressable — tight 0.95 scale for primary actions.
- * Use for: Button, IconButton, Toggle, Checkbox triggers.
- */
-export const PressableButton = createAnimatedPressable((progress) => {
-  'worklet'
-  const scale = 1 - (1 - PRESS_SCALE.button) * progress
-  return { transform: [{ scale }] }
-})
+const makePressable = (scale: number) =>
+  createAnimatedPressable((progress) => {
+    'worklet'
+    return { transform: [{ scale: 1 - (1 - scale) * progress }] }
+  })
 
-/**
- * Card pressable — subtle 0.98 scale for surfaces.
- * Use for: Card (interactive), MediaCard, Pressable component.
- */
-export const PressableCard = createAnimatedPressable((progress) => {
-  'worklet'
-  const scale = 1 - (1 - PRESS_SCALE.card) * progress
-  return { transform: [{ scale }] }
-})
+export const PressableButton = makePressable(0.95)
+export const PressableCard = makePressable(0.98)
+export const PressableRow = makePressable(0.97)
+export const PressableChip = makePressable(0.94)
+export const PressableTab = makePressable(0.95)
 
-/**
- * Row pressable — balanced 0.97 scale for list interactions.
- * Use for: ListItem, MenuItem, Accordion triggers.
- */
-export const PressableRow = createAnimatedPressable((progress) => {
-  'worklet'
-  const scale = 1 - (1 - PRESS_SCALE.row) * progress
-  return { transform: [{ scale }] }
-})
-
-/**
- * Chip pressable — snappy 0.94 scale for compact elements.
- * Use for: Chip, small toggleable items.
- */
-export const PressableChip = createAnimatedPressable((progress) => {
-  'worklet'
-  const scale = 1 - (1 - PRESS_SCALE.chip) * progress
-  return { transform: [{ scale }] }
-})
-
-/**
- * Tab pressable — same as button for tab triggers.
- */
-export const PressableTab = createAnimatedPressable((progress) => {
-  'worklet'
-  const scale = 1 - (1 - PRESS_SCALE.button) * progress
-  return { transform: [{ scale }] }
-})
-
-// Re-export pressto components for direct use
 export { PressableScale, PressableOpacity, PressablesConfig } from 'pressto'

package/dist/VirtualList.d.mts

@@ -1,19 +0,0 @@
-import React from 'react';
-import { FlatListProps, FlatList } from 'react-native';
-
-interface VirtualListItem {
-    id?: string | number;
-}
-interface VirtualListProps<T> extends Omit<FlatListProps<T>, 'getItemLayout'> {
-    /**
-     * Fixed row height in px. When provided, enables `getItemLayout` so the list
-     * skips async measurement — large datasets scroll and `scrollToIndex` jump
-     * without layout passes. Omit only for variable-height rows.
-     */
-    itemHeight?: number;
-}
-declare const VirtualList: <T>(props: VirtualListProps<T> & {
-    ref?: React.Ref<FlatList<T>>;
-}) => React.ReactElement;
-
-export { VirtualList, type VirtualListItem, type VirtualListProps };

package/dist/VirtualList.d.ts

@@ -1,19 +0,0 @@
-import React from 'react';
-import { FlatListProps, FlatList } from 'react-native';
-
-interface VirtualListItem {
-    id?: string | number;
-}
-interface VirtualListProps<T> extends Omit<FlatListProps<T>, 'getItemLayout'> {
-    /**
-     * Fixed row height in px. When provided, enables `getItemLayout` so the list
-     * skips async measurement — large datasets scroll and `scrollToIndex` jump
-     * without layout passes. Omit only for variable-height rows.
-     */
-    itemHeight?: number;
-}
-declare const VirtualList: <T>(props: VirtualListProps<T> & {
-    ref?: React.Ref<FlatList<T>>;
-}) => React.ReactElement;
-
-export { VirtualList, type VirtualListItem, type VirtualListProps };

package/dist/VirtualList.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var React = require('react');
-var reactNative = require('react-native');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-// src/components/VirtualList/VirtualList.tsx
-var defaultKeyExtractor = (item, index) => {
-  const id = item?.id;
-  return id !== void 0 ? String(id) : String(index);
-};
-function VirtualListInner({ itemHeight, keyExtractor, renderItem, ...props }, ref) {
-  const getItemLayout = React.useCallback(
-    (_data, index) => ({
-      length: itemHeight ?? 0,
-      offset: (itemHeight ?? 0) * index,
-      index
-    }),
-    [itemHeight]
-  );
-  return /* @__PURE__ */ React__default.default.createElement(
-    reactNative.FlatList,
-    {
-      ref,
-      keyExtractor: keyExtractor ?? defaultKeyExtractor,
-      renderItem,
-      getItemLayout: itemHeight !== void 0 ? getItemLayout : void 0,
-      removeClippedSubviews: true,
-      ...props
-    }
-  );
-}
-var VirtualList = React__default.default.forwardRef(VirtualListInner);
-
-exports.VirtualList = VirtualList;

package/dist/VirtualList.mjs

@@ -1,2 +0,0 @@
-export { VirtualList } from './chunk-NC5ZTR2Y.mjs';
-import './chunk-Y6FXYEAI.mjs';

package/dist/chunk-3DKJ2GIC.mjs

@@ -1,30 +0,0 @@
-import { PRESS_SCALE } from './chunk-DVK4G2GT.mjs';
-import { createAnimatedPressable } from 'pressto';
-
-var PressableButton = createAnimatedPressable((progress) => {
-  "worklet";
-  const scale = 1 - (1 - PRESS_SCALE.button) * progress;
-  return { transform: [{ scale }] };
-});
-var PressableCard = createAnimatedPressable((progress) => {
-  "worklet";
-  const scale = 1 - (1 - PRESS_SCALE.card) * progress;
-  return { transform: [{ scale }] };
-});
-var PressableRow = createAnimatedPressable((progress) => {
-  "worklet";
-  const scale = 1 - (1 - PRESS_SCALE.row) * progress;
-  return { transform: [{ scale }] };
-});
-var PressableChip = createAnimatedPressable((progress) => {
-  "worklet";
-  const scale = 1 - (1 - PRESS_SCALE.chip) * progress;
-  return { transform: [{ scale }] };
-});
-var PressableTab = createAnimatedPressable((progress) => {
-  "worklet";
-  const scale = 1 - (1 - PRESS_SCALE.button) * progress;
-  return { transform: [{ scale }] };
-});
-
-export { PressableButton, PressableCard, PressableChip, PressableRow, PressableTab };