@retray-dev/ui-kit 10.1.0 → 10.2.0

package/COMPONENTS.md

@@ -1,4 +1,4 @@
-# @retray-dev/ui-kit — Component Reference (v10.1.0)
+# @retray-dev/ui-kit — Component Reference (v10.2.0)
 
 This file is the AI reference for this package. Add all three lines below to your project's `CLAUDE.md` to give Claude full context — components, setup guide, and usage examples:
 
@@ -1175,6 +1175,69 @@ const [amount, setAmount] = useState(0)
 
 ---
 
+### NumberStepper
+
+**Import:** `import { NumberStepper } from '@retray-dev/ui-kit'`
+
+**When to use:** Quantity +/- controls — cart item counts, guest selectors, inventory adjustments, portion sizes. Use when the user needs to increment/decrement a discrete numeric value within a constrained range (min–max).
+
+| Prop | Type | Default | Notes |
+|------|------|---------|-------|
+| value | `number` | required | Current numeric value |
+| onValueChange | `(value: number) => void` | required | Called with clamped value on each step |
+| min | `number` | `1` | Minimum allowed value |
+| max | `number` | `99` | Maximum allowed value |
+| step | `number` | `1` | Increment/decrement amount. Supports decimals (e.g. `0.5`) |
+| size | `'sm' \| 'md' \| 'lg'` | `'md'` | Controls button and value text size |
+| disabled | `boolean` | `false` | Disables both buttons |
+| accessibilityLabel | `string` | — | Custom a11y label for value text. Default: `"Quantity: {value}"` |
+| style | `ViewStyle` | — | Outer container style |
+
+**Styling:** Row layout with two square buttons flanking a centered value label. Buttons use `RADIUS.md` (14pt), `borderWidth: 1.5`, `surface` background with `border` outline. Value text: `Sohne-Medium`, centered, `foreground` color.
+
+**Button states:** The decrement button disables (opacity 0.35, non-pressable) when `value ≤ min`. The increment button disables when `value ≥ max`. Both disable when the `disabled` prop is `true`.
+
+**Haptics:** `impactLight` on each press.
+
+**Accessibility:** Each button has a descriptive label (`"Decrease, current value X"` / `"Increase, current value X"`). The value text has `accessibilityRole="text"`. Disabled state passed to `accessibilityState`.
+
+**Animation:** `PressableButton` (scale 0.95) on each button — matches the Button/IconButton press feel.
+
+**Examples:**
+```tsx
+// Basic quantity stepper
+const [qty, setQty] = useState(1)
+<NumberStepper value={qty} onValueChange={setQty} />
+
+// Custom range and step
+const [rating, setRating] = useState(3)
+<NumberStepper value={rating} onValueChange={setRating} min={0} max={5} step={0.5} />
+
+// Large size for prominent use
+const [guests, setGuests] = useState(2)
+<NumberStepper value={guests} onValueChange={setGuests} min={1} max={16} size="lg" />
+
+// Disabled during async operation
+<NumberStepper
+  value={qty}
+  onValueChange={setQty}
+  disabled={isUpdating}
+/>
+```
+
+**Composition — cart item row:**
+```tsx
+<View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
+  <View>
+    <Text variant="body-md">Margherita Pizza</Text>
+    <Text variant="caption-sm" color={colors.foregroundMuted}>$12.000</Text>
+  </View>
+  <NumberStepper value={quantity} onValueChange={setQuantity} />
+</View>
+```
+
+---
+
 ### CurrencyDisplay
 
 **Import:** `import { CurrencyDisplay } from '@retray-dev/ui-kit'`
@@ -3077,7 +3140,7 @@ dismiss(id)
 
 **Import:** `import { Chip, ChipGroup } from '@retray-dev/ui-kit'`
 
-**When to use:** Inline filter options, quick selections, multi-select toggles. Use `Chip` for standalone custom logic; use `ChipGroup` for managed selection (single or multi).
+**When to use:** Inline filter options, quick selections, multi-select toggles. Use `Chip` for standalone custom logic; use `ChipGroup` for managed selection (single or multi). **ChipGroup vs CategoryStrip:** ChipGroup wraps to multiple rows and supports disabled items — best for filter tags, feature toggles, and tray-style selections. CategoryStrip scrolls horizontally and supports badge counts — best for top-of-screen category browsers.
 
 **`Chip` Props:**
 
@@ -3149,7 +3212,7 @@ const [categories, setCategories] = useState<number[]>([1, 3])
 
 **Import:** `import { CategoryStrip } from '@retray-dev/ui-kit'`
 
-**When to use:** Horizontal scrollable filter/category bar at the top of browse screens — marketplace categories, content type filters, location tabs. Airbnb-style pill chips that scroll horizontally.
+**When to use:** Horizontal scrollable filter/category bar at the top of browse screens — marketplace categories, content type filters, location tabs. Airbnb-style pill chips that scroll horizontally. **CategoryStrip vs ChipGroup:** CategoryStrip scrolls horizontally and supports badge counts — best for top-of-screen category browsers. ChipGroup wraps to multiple rows and supports disabled items — best for filter tags and tray-style selections.
 
 | Prop | Type | Default | Notes |
 |------|------|---------|-------|
@@ -3274,7 +3337,7 @@ const [categories, setCategories] = useState<number[]>([1, 3])
 | Prop | Type | Default | Notes |
 |------|------|---------|-------|
 | label | `string \| ReactNode` | required | Left side. Strings auto-styled in `foregroundMuted` caption |
-| value | `string` | required | Right side value text |
+| value | `string \| number \| ReactNode` | required | Right side value. Strings and numbers auto-styled in `Sohne-SemiBold`; pass `ReactNode` for custom content |
 | separator | `'dotted' \| 'solid' \| 'dashed' \| 'none'` | `'dotted'` | Fill line between label and value |
 | labelWeight | `'normal' \| 'medium' \| 'semibold' \| 'bold'` | `'normal'` | Font weight of label text |
 | valueColor | `string` | — | Override value text color (hex or theme token value) |
@@ -3920,6 +3983,7 @@ import { HolographicCard, FOIL_PRESETS } from '@retray-dev/ui-kit/HolographicCar
 | onChange | `(uri: string \| null) => void` | — | Called with selected URI after picker completes |
 | loading | `boolean` | `false` | Show spinner overlay (e.g. while uploading to server) |
 | placeholder | `string` | `'Tap to add image'` | Text shown when no image selected |
+| showPlaceholderText | `boolean` | `true` | Whether to show the placeholder text. Use `false` for compact/avatar variants |
 | width | `number` | — | Width of the upload area. Defaults to full width |
 | height | `number` | `200` | Height of the upload area |
 | borderRadius | `number` | `RADIUS.lg` | — |
@@ -3949,16 +4013,68 @@ const handleChange = async (uri: string | null) => {
   height={200}
 />
 
-// Avatar upload (square)
+// Avatar upload (square, no text)
 <ImageUpload
   value={avatarUri}
   onChange={setAvatarUri}
   width={100}
   height={100}
   borderRadius={50}
+  showPlaceholderText={false}
+/>
+```
+
+---
+
+### IconPicker
+
+**Import:** `import { IconPicker } from '@retray-dev/ui-kit'`
+
+**When to use:** Selecting an icon from a curated catalog of ~320 icons (across all 6 `@expo/vector-icons` families) organized by 12 categories. The trigger is a simple tappable square showing the selected icon (or a + placeholder). Tapping opens a bottom sheet with category chips (icon + label) and a scrollable grid. No search, no text clutter — purely visual selection.
+
+**Requires:** `@gorhom/bottom-sheet` (already a peer dependency of the UI kit).
+
+| Prop | Type | Default | Notes |
+|------|------|---------|-------|
+| value | `string \| null` | — | Currently selected icon name |
+| onChange | `(iconName: string) => void` | — | Called when an icon is selected |
+| label | `string` | — | Optional label above the trigger |
+| error | `string` | — | Error message (red border + helper text) |
+| hint | `string` | — | Hint text below trigger |
+| disabled | `boolean` | `false` | Prevents opening |
+| numColumns | `number` | `6` | Icons per row in the sheet grid |
+| gap | `number` | `6` | Gap between cells (dp) |
+| style | `ViewStyle` | — | — |
+
+**Examples:**
+```tsx
+const [icon, setIcon] = useState<string | null>(null)
+
+// Basic usage
+<IconPicker
+  label="Icon"
+  value={icon}
+  onChange={setIcon}
+/>
+
+// With validation error
+<IconPicker
+  label="Icon"
+  value={icon}
+  onChange={setIcon}
+  error={!icon ? 'Please select an icon' : undefined}
 />
 ```
 
+**Notes:**
+- Uses a static curated list of ~320 icons in 12 categories (food, sports, business, objects, status, actions, communication, navigation, media, layout, nature, brands) — instant load, no runtime glyphMap scanning.
+- Category chips use representative icons (coffee, activity, briefcase, folder, alert-circle, edit-3, message-circle, compass, image, grid, sun, globe) with Spanish labels and a "Todos" (All) chip.
+- Grid cells show only icons — clean, fast visual scanning. Cell size adapts to container width.
+- Sheet uses `enableDynamicSizing` with `maxDynamicContentSize` (70% screen height) — height auto-fits content up to that cap.
+- Category strip is a horizontal `ScrollView` of pill-shaped chips. The grid is rendered in rows inside a `BottomSheetScrollView`.
+- Selection closes the sheet immediately and resets category to "Todos".
+- Haptics: medium impact on open, selection on icon tap.
+
 ---
 
 ### useConfirmDialog
@@ -4063,6 +4179,21 @@ import { renderIcon } from '@retray-dev/ui-kit'
 const icon = renderIcon('check', 18, colors.primary)
 ```
 
+### `getValidIconNames` utility
+
+```tsx
+import { getValidIconNames } from '@retray-dev/ui-kit'
+
+// All icon names across all configured families
+const allIcons: string[] = getValidIconNames()
+// => ["home", "user", "heart", "star", ...]
+
+// Scoped to specific families (does not mutate global config)
+const featherOnly: string[] = getValidIconNames(['Feather'])
+```
+
+Returns `string[]` — all resolvable icon names from the configured families. Respects `configureIconFamilies()` global config. The optional `families` parameter builds a temporary cache scoped to those families without mutating global state. Use to build icon pickers, search, and galleries.
+
 ### `iconName` props on components
 
 All components with icon slots accept `iconName` — auto-resolved size and color:

package/README.md

@@ -2,7 +2,7 @@
 
 A personal React Native / Expo UI component library with a built-in design system, dark mode support, haptic feedback, and smooth animations.
 
-- 51 components across 9 categories (plus the deep-import `HolographicCard`)
+- 53 components across 9 categories (plus the deep-import `HolographicCard`)
 - Light/dark theme with 12 public tokens (25 resolved) and full customization
 - Apple HIG–compliant touch targets and haptic feedback
 - Animated interactions: spring press, sliding tabs, accordion easing, animated progress
@@ -23,14 +23,14 @@ pnpm add @retray-dev/ui-kit
 Install these in your app if not already present:
 
 ```bash
-pnpm add expo-font expo-haptics expo-linear-gradient react-native-safe-area-context @gorhom/bottom-sheet react-native-reanimated react-native-gesture-handler react-native-worklets @react-native-picker/picker @react-native-community/slider @expo/vector-icons react-native-size-matters react-native-svg react-native-screens sonner-native pressto react-native-ease
+pnpm add expo-font expo-haptics expo-linear-gradient react-native-safe-area-context @gorhom/bottom-sheet react-native-reanimated react-native-gesture-handler react-native-worklets @react-native-picker/picker @react-native-community/slider @expo/vector-icons react-native-size-matters react-native-svg react-native-screens sonner-native pressto react-native-ease expo-image-picker
 ```
 
 For Expo projects, run `npx expo install` instead to get SDK-compatible versions.
 
 `pressto` is **required** — it powers the press animations on every interactive component. Omitting it crashes the import. `sonner-native` is **required** for `Toast`.
 
-**Optional:** for richer haptics in a custom dev build (not Expo Go), also `pnpm add react-native-pulsar`. The kit falls back to `expo-haptics` automatically when it is absent. For the deep-import `HolographicCard`, add `@shopify/react-native-skia expo-sensors`.
+**Optional:** for richer haptics in a custom dev build (not Expo Go), also `pnpm add react-native-pulsar`. The kit falls back to `expo-haptics` automatically when it is absent. For `ImageUpload`, add `expo-image-picker`. For the deep-import `HolographicCard`, add `@shopify/react-native-skia expo-sensors`.
 
 Add the Worklets Babel plugin to `babel.config.js` (required by `@gorhom/bottom-sheet`):
 
@@ -183,7 +183,7 @@ import { SPACING, ICON_SIZES, RADIUS, SHADOWS, BREAKPOINTS, TYPOGRAPHY } from '@
 | ----------- | ----------------------------------------------------------------------------------------------- |
 | Display     | `Text`, `Badge`, `Avatar`, `Separator`, `Spinner`, `Skeleton`, `Progress`, `CurrencyDisplay`   |
 | Surfaces    | `Card`, `AlertBanner`, `EmptyState`, `MediaCard`, `PricingCard`                                 |
-| Form        | `Form` (+ `Form.Field` / `Form.Section` / `Form.Footer`), `Button`, `ButtonGroup`, `IconButton`, `Input`, `CurrencyInput`, `Textarea`, `Checkbox`, `Switch`, `Toggle`, `RadioGroup`, `Select`, `Slider`, `SelectableGrid`, `SheetSelect`, `ImageUpload` |
+| Form        | `Form` (+ `Form.Field` / `Form.Section` / `Form.Footer`), `Button`, `ButtonGroup`, `IconButton`, `Input`, `CurrencyInput`, `Textarea`, `Checkbox`, `Switch`, `Toggle`, `RadioGroup`, `Select`, `Slider`, `SelectableGrid`, `SheetSelect`, `ImageUpload`, `IconPicker`, `NumberStepper` |
 | Composition | `Tabs`, `Accordion`                                                                             |
 | Navigation  | `AppHeader`, `TabBar`, `PagerDots`                                                              |
 | Overlays    | `Sheet`, `ConfirmDialog`, `ImageViewer`                                                         |

package/dist/Accordion.js

@@ -217,7 +217,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/Accordion.mjs

@@ -1,7 +1,7 @@
-export { Accordion } from './chunk-DJ7RN37L.mjs';
+export { Accordion } from './chunk-YJ7I257J.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/AlertBanner.js

@@ -156,7 +156,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/AlertBanner.mjs

@@ -1,6 +1,6 @@
-export { AlertBanner } from './chunk-6MKGPAR2.mjs';
+export { AlertBanner } from './chunk-BEMIQXXU.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/AppHeader.js

@@ -218,7 +218,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/AppHeader.mjs

@@ -1,10 +1,10 @@
-export { AppHeader } from './chunk-AZJF2BLK.mjs';
-import './chunk-3U4SSNWP.mjs';
+export { AppHeader } from './chunk-TBNZHU6C.mjs';
+import './chunk-T2KCAHOS.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Badge.js

@@ -155,7 +155,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/Badge.mjs

@@ -1,5 +1,5 @@
-export { Badge } from './chunk-TERDKCLE.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+export { Badge } from './chunk-VF2ATYN3.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Button.js

@@ -217,7 +217,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/Button.mjs

@@ -1,9 +1,9 @@
-export { Button } from './chunk-2TFTAWVJ.mjs';
+export { Button } from './chunk-HTHGSXFG.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/CategoryStrip.js

@@ -217,7 +217,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/CategoryStrip.mjs

@@ -1,9 +1,9 @@
-export { CategoryStrip } from './chunk-VQ57HWPL.mjs';
+export { CategoryStrip } from './chunk-6L4G6PBT.mjs';
 import './chunk-YNROWHQJ.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Chip.js

@@ -218,7 +218,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/Chip.mjs

@@ -1,8 +1,8 @@
-export { Chip, ChipGroup } from './chunk-UREA2GYY.mjs';
+export { Chip, ChipGroup } from './chunk-DYT7BG5I.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/ConfirmDialog.js

@@ -240,7 +240,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/ConfirmDialog.mjs

@@ -1,10 +1,10 @@
-export { ConfirmDialog } from './chunk-KZL5VTYK.mjs';
-import './chunk-2TFTAWVJ.mjs';
+export { ConfirmDialog } from './chunk-WYEUNUTP.mjs';
+import './chunk-HTHGSXFG.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/CurrencyInput.js

@@ -159,7 +159,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/CurrencyInput.mjs

@@ -1,7 +1,7 @@
-export { CurrencyInput } from './chunk-JUXSWN54.mjs';
-import './chunk-ZUR7AU5R.mjs';
+export { CurrencyInput } from './chunk-NMU5FMQJ.mjs';
+import './chunk-SXLKNTA4.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/DetailRow.d.mts

@@ -5,7 +5,7 @@ type DetailRowSeparator = 'dotted' | 'solid' | 'dashed' | 'none';
 type DetailRowLabelWeight = 'normal' | 'medium' | 'semibold' | 'bold';
 interface DetailRowProps {
     label: React.ReactNode;
-    value: string | React.ReactNode;
+    value: string | number | React.ReactNode;
     /** Dotted/dashed/solid line between label and value. Defaults to 'dotted'. */
     separator?: DetailRowSeparator;
     labelWeight?: DetailRowLabelWeight;

package/dist/DetailRow.d.ts

@@ -5,7 +5,7 @@ type DetailRowSeparator = 'dotted' | 'solid' | 'dashed' | 'none';
 type DetailRowLabelWeight = 'normal' | 'medium' | 'semibold' | 'bold';
 interface DetailRowProps {
     label: React.ReactNode;
-    value: string | React.ReactNode;
+    value: string | number | React.ReactNode;
     /** Dotted/dashed/solid line between label and value. Defaults to 'dotted'. */
     separator?: DetailRowSeparator;
     labelWeight?: DetailRowLabelWeight;

package/dist/DetailRow.js

@@ -155,7 +155,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/DetailRow.mjs

@@ -1,5 +1,5 @@
-export { DetailRow } from './chunk-JB67UOB5.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+export { DetailRow } from './chunk-S2R7UVOE.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/EmptyState.js

@@ -163,7 +163,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/EmptyState.mjs

@@ -1,10 +1,10 @@
-export { EmptyState } from './chunk-6OAZJ577.mjs';
-import './chunk-2TFTAWVJ.mjs';
+export { EmptyState } from './chunk-6SECQ2ZF.mjs';
+import './chunk-HTHGSXFG.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/ErrorBoundary.js

@@ -156,7 +156,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/ErrorBoundary.mjs

@@ -1,7 +1,7 @@
-export { ErrorBoundary } from './chunk-LXJIIOYQ.mjs';
+export { ErrorBoundary } from './chunk-RYZC432S.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/IconButton.js

@@ -215,7 +215,7 @@ var ALL_FAMILIES = [
 ];
 var activeFamilies = ALL_FAMILIES;
 var resolvedCache = null;
-function buildCache() {
+function buildCache(families) {
   const cache = /* @__PURE__ */ new Map();
   for (const family of activeFamilies) {
     const glyphMap = family.getGlyphMap();

package/dist/IconButton.mjs

@@ -1,8 +1,8 @@
-export { IconButton } from './chunk-3U4SSNWP.mjs';
+export { IconButton } from './chunk-T2KCAHOS.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-T7XZ7H7Y.mjs';
+import './chunk-KA7LTET3.mjs';
 import './chunk-SOYNZDVY.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/IconPicker.d.mts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ViewStyle } from 'react-native';
+
+interface IconPickerProps {
+    value: string | null;
+    onChange: (iconName: string) => void;
+    label?: string;
+    error?: string;
+    hint?: string;
+    disabled?: boolean;
+    numColumns?: number;
+    gap?: number;
+    style?: ViewStyle;
+}
+declare function IconPicker({ value, onChange, label, error, hint, disabled, numColumns, gap, style, }: IconPickerProps): React.JSX.Element;
+
+export { IconPicker, type IconPickerProps };

package/dist/IconPicker.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ViewStyle } from 'react-native';
+
+interface IconPickerProps {
+    value: string | null;
+    onChange: (iconName: string) => void;
+    label?: string;
+    error?: string;
+    hint?: string;
+    disabled?: boolean;
+    numColumns?: number;
+    gap?: number;
+    style?: ViewStyle;
+}
+declare function IconPicker({ value, onChange, label, error, hint, disabled, numColumns, gap, style, }: IconPickerProps): React.JSX.Element;
+
+export { IconPicker, type IconPickerProps };