@retray-dev/ui-kit 10.1.0 → 12.1.0

package/src/utils/curatedIcons.ts

@@ -0,0 +1,849 @@
+/**
+ * Curated icon set — 12 categories, themed icons, all outlined style.
+ * Ordered by usage probability: most-common categories first, niche last.
+ *
+ * All names resolve across 6 @expo/vector-icons families via renderIcon().
+ * Priority (lowest→highest): Ionicons → MaterialIcons → FontAwesome5 → Entypo → AntDesign → Feather.
+ * Feather is the highest priority — any name it has wins over all other families.
+ *
+ * ICON FAMILY RULES (strict):
+ *  - Feather (stroke-outlined, always safe) — first choice for utility icons. ✅
+ *  - Ionicons `-outline` suffix for domain-specific icons (food, sports, nature). ✅
+ *    These names don't exist in any higher-priority family, so they resolve
+ *    cleanly to Ionicons outline style — no collisions, no filled rendering.
+ *  - FontAwesome5 brand glyphs (github, twitter, etc.) — consistent flat brand
+ *    logos in the Brands category. They render as the official brand silhouette
+ *    and are visually consistent across all brands.
+ *  - AntDesign (filled)        ❌ NEVER — renders filled.
+ *  - Entypo (filled)            ❌ NEVER — renders filled.
+ *  - MaterialIcons (filled)     ❌ NEVER — renders filled.
+ *  - Ionicons base (filled)     ❌ NEVER — always use the `-outline` variant.
+ *  - FA5 regular/solid substyles (filled) ❌ NEVER.
+ *
+ * THEMATIC RULE (strict):
+ *  - Every icon must be directly relevant to its category. No generic
+ *    filler. Contextual relevance is allowed (e.g. truck/map-pin in Food
+ *    for delivery/location), but icons that fit in any category (phone,
+ *    mail, bell, search, etc.) are NOT used as filler — they belong in
+ *    the appropriate category (Communication / Status / Actions).
+ *  - No duplicate concepts per category (don't list both `arrow-up` and
+ *    `arrow-up-outline` — pick the best outlined version once).
+ *
+ * Verify: check glyphMaps in node_modules/@expo/vector-icons/build/vendor/
+ *          react-native-vector-icons/glyphmaps/
+ *   - Feather.json, Ionicons.json, FA5Free.json, FA5Free_meta.json
+ */
+
+export interface IconCategory {
+  name: string
+  label: string
+  labelEs: string
+  categoryIcon: string
+  icons: string[]
+}
+
+export const CURATED_ICONS: IconCategory[] = [
+  // ─── Food ────────────────────────────────────────────────────────────────────
+  {
+    name: 'food',
+    label: 'Food',
+    labelEs: 'Comida',
+    categoryIcon: 'coffee',
+    icons: [
+      // Bebidas
+      'beer-outline',
+      'wine-outline',
+      'cafe-outline',
+      'water-outline',
+      'coffee',
+      // Comida
+      'pizza-outline',
+      'fast-food-outline',
+      'fish-outline',
+      'ice-cream-outline',
+      'egg-outline',
+      'nutrition-outline',
+      // Servicio y operación
+      'restaurant-outline',
+      'server-outline',
+      'menu-outline',
+      'basket-outline',
+      'receipt-outline',
+      'pricetag-outline',
+      'pricetags-outline',
+      'reorder-four-outline',
+      'reorder-three-outline',
+      'cart-outline',
+      'cash-outline',
+      'wallet-outline',
+      'storefront-outline',
+      // Delivery / pedidos
+      'truck',
+      'package',
+      'shopping-bag',
+      'shopping-cart',
+      // Ubicación y reserva
+      'map-pin',
+      'home',
+      'calendar',
+      'clock',
+      // Experiencia
+      'star',
+      'heart',
+      'bookmark',
+      'thumbs-up',
+      'check',
+      'gift',
+    ],
+  },
+
+  // ─── Sports ──────────────────────────────────────────────────────────────────
+  {
+    name: 'sports',
+    label: 'Sports',
+    labelEs: 'Deportes',
+    categoryIcon: 'trophy-outline',
+    icons: [
+      // Deportes
+      'american-football-outline',
+      'baseball-outline',
+      'basketball-outline',
+      'bicycle-outline',
+      'football-outline',
+      'tennisball-outline',
+      'golf-outline',
+      'fitness-outline',
+      'car-sport-outline',
+      'game-controller-outline',
+      // Competición y logros
+      'trophy-outline',
+      'medal-outline',
+      'award',
+      'target',
+      'flag',
+      'crosshair',
+      // Outdoor
+      'compass-outline',
+      'map-outline',
+      'trail-sign-outline',
+      'bonfire-outline',
+      'snow-outline',
+      'flame-outline',
+      'sun',
+      'droplet',
+      'wind',
+      'map',
+      'map-pin',
+      'navigation',
+      'navigation-2',
+      // Rendimiento y métricas
+      'stats-chart-outline',
+      'trending-up-outline',
+      'trending-down-outline',
+      'bar-chart-outline',
+      'pie-chart-outline',
+      'analytics-outline',
+      'activity',
+      'zap',
+      'watch',
+      'trending-up',
+      'trending-down',
+      'bar-chart-2',
+      'clock',
+      'calendar',
+    ],
+  },
+
+  // ─── Business ────────────────────────────────────────────────────────────────
+  {
+    name: 'business',
+    label: 'Business',
+    labelEs: 'Negocios',
+    categoryIcon: 'briefcase',
+    icons: [
+      // Empresa
+      'briefcase',
+      'users',
+      'user',
+      'user-plus',
+      'user-check',
+      'user-x',
+      'briefcase-outline',
+      'business-outline',
+      'id-card-outline',
+      // Comercio y operación
+      'shopping-cart',
+      'shopping-bag',
+      'credit-card',
+      'dollar-sign',
+      'percent',
+      'tag',
+      'gift',
+      'cart-outline',
+      'cash-outline',
+      'wallet-outline',
+      'storefront-outline',
+      'pricetag-outline',
+      'pricetags-outline',
+      'receipt-outline',
+      'card-outline',
+      // Logística
+      'truck',
+      'package',
+      // Documentos
+      'file',
+      'file-text',
+      'file-plus',
+      'folder',
+      'paperclip',
+      'document-outline',
+      'document-text-outline',
+      'documents-outline',
+      'folder-outline',
+      // Comunicación de negocio
+      'mail',
+      'phone',
+      'phone-call',
+      'send',
+      'message-square',
+      'mail-outline',
+      // Análisis
+      'bar-chart',
+      'bar-chart-2',
+      'pie-chart',
+      'trending-up',
+      'trending-down',
+      'activity',
+      'globe',
+    ],
+  },
+
+  // ─── Objects ─────────────────────────────────────────────────────────────────
+  {
+    name: 'objects',
+    label: 'Objects',
+    labelEs: 'Objetos',
+    categoryIcon: 'package',
+    icons: [
+      // Archivos y carpetas
+      'file',
+      'file-text',
+      'file-plus',
+      'file-minus',
+      'folder',
+      'folder-plus',
+      'folder-minus',
+      'archive',
+      'save',
+      'paperclip',
+      'document-outline',
+      'document-text-outline',
+      'documents-outline',
+      'folder-outline',
+      'folder-open-outline',
+      'file-tray-outline',
+      'file-tray-full-outline',
+      'file-tray-stacked-outline',
+      'archive-outline',
+      'save-outline',
+      // Seguridad
+      'lock',
+      'unlock',
+      'key',
+      'shield',
+      'shield-off',
+      'lock-closed-outline',
+      'lock-open-outline',
+      'key-outline',
+      'shield-outline',
+      'shield-checkmark-outline',
+      // Dispositivos
+      'monitor',
+      'tablet',
+      'smartphone',
+      'tv',
+      'server',
+      'database',
+      'hard-drive',
+      'cpu',
+      'radio',
+      'laptop-outline',
+      'phone-portrait-outline',
+      'phone-landscape-outline',
+      'tablet-landscape-outline',
+      'tablet-portrait-outline',
+      'tv-outline',
+      'server-outline',
+      'hardware-chip-outline',
+      'watch-outline',
+    ],
+  },
+
+  // ─── Status ──────────────────────────────────────────────────────────────────
+  {
+    name: 'status',
+    label: 'Status',
+    labelEs: 'Estado',
+    categoryIcon: 'alert-circle',
+    icons: [
+      // Alertas
+      'alert-circle',
+      'alert-triangle',
+      'alert-octagon',
+      'info',
+      'help-circle',
+      'alert-circle-outline',
+      'alert-outline',
+      'information-circle-outline',
+      'help-circle-outline',
+      // Notificaciones
+      'bell',
+      'bell-off',
+      'notifications-outline',
+      'notifications-off-outline',
+      'notifications-circle-outline',
+      // Visibilidad
+      'eye',
+      'eye-off',
+      'eye-outline',
+      'eye-off-outline',
+      // Indicadores
+      'flag',
+      'zap',
+      'zap-off',
+      'loader',
+      'activity',
+      'flash-outline',
+      'bulb-outline',
+      // Éxito / error / advertencia
+      'check',
+      'check-circle',
+      'x',
+      'x-circle',
+      'x-octagon',
+      'slash',
+      'plus-circle',
+      'minus-circle',
+      'checkmark-circle-outline',
+      'checkmark-done-circle-outline',
+      'close-circle-outline',
+      'add-circle-outline',
+      'remove-circle-outline',
+      // Estados de proceso
+      'play-circle',
+      'pause-circle',
+      'stop-circle',
+      'play-circle-outline',
+      'pause-circle-outline',
+      'stop-circle-outline',
+    ],
+  },
+
+  // ─── Actions ─────────────────────────────────────────────────────────────────
+  {
+    name: 'actions',
+    label: 'Actions',
+    labelEs: 'Acciones',
+    categoryIcon: 'edit-3',
+    icons: [
+      // Crear / añadir
+      'plus',
+      'plus-circle',
+      'plus-square',
+      'add-outline',
+      'add-circle-outline',
+      // Eliminar / quitar
+      'minus',
+      'minus-circle',
+      'minus-square',
+      'trash',
+      'trash-2',
+      'x',
+      'x-circle',
+      'x-square',
+      'x-octagon',
+      'slash',
+      'trash-outline',
+      'trash-bin-outline',
+      'remove-outline',
+      'remove-circle-outline',
+      'close-circle-outline',
+      'backspace-outline',
+      'cut-outline',
+      // Confirmar
+      'check',
+      'check-circle',
+      'check-square',
+      'checkmark-circle-outline',
+      // Editar
+      'edit',
+      'edit-2',
+      'edit-3',
+      'copy',
+      'clipboard',
+      'scissors',
+      'create-outline',
+      'pencil-outline',
+      'duplicate-outline',
+      'copy-outline',
+      'clipboard-outline',
+      // Mover datos
+      'download',
+      'download-cloud',
+      'upload',
+      'upload-cloud',
+      'download-outline',
+      'cloud-download-outline',
+      'cloud-upload-outline',
+    ],
+  },
+
+  // ─── Communication ───────────────────────────────────────────────────────────
+  {
+    name: 'communication',
+    label: 'Communication',
+    labelEs: 'Comunicación',
+    categoryIcon: 'message-circle',
+    icons: [
+      // Mensajería
+      'message-circle',
+      'message-square',
+      'send',
+      'mail',
+      'inbox',
+      'at-sign',
+      'mail-outline',
+      'mail-open-outline',
+      'mail-unread-outline',
+      'chatbubble-outline',
+      'chatbubble-ellipses-outline',
+      'chatbubbles-outline',
+      'send-outline',
+      'attach-outline',
+      'at-outline',
+      'at-circle-outline',
+      // Llamadas
+      'phone',
+      'phone-call',
+      'phone-incoming',
+      'phone-outgoing',
+      'phone-missed',
+      'phone-off',
+      'phone-forwarded',
+      'voicemail',
+      'call-outline',
+      'phone-portrait-outline',
+      'phone-landscape-outline',
+      // Personas
+      'user',
+      'user-plus',
+      'user-minus',
+      'user-check',
+      'user-x',
+      'users',
+      'person-outline',
+      'person-circle-outline',
+      'person-add-outline',
+      'person-remove-outline',
+      'people-outline',
+      'people-circle-outline',
+      // Reacciones
+      'smile',
+      'frown',
+      'meh',
+      'heart',
+      'thumbs-up',
+      'thumbs-down',
+      'happy-outline',
+      'sad-outline',
+      'heart-outline',
+      'thumbs-up-outline',
+      'thumbs-down-outline',
+    ],
+  },
+
+  // ─── Navigation ──────────────────────────────────────────────────────────────
+  {
+    name: 'navigation',
+    label: 'Navigation',
+    labelEs: 'Navegación',
+    categoryIcon: 'compass',
+    icons: [
+      // Flechas cardinales
+      'arrow-up',
+      'arrow-down',
+      'arrow-left',
+      'arrow-right',
+      'arrow-up-left',
+      'arrow-up-right',
+      'arrow-down-left',
+      'arrow-down-right',
+      'arrow-up-outline',
+      'arrow-down-outline',
+      'arrow-back-outline',
+      'arrow-forward-outline',
+      'arrow-undo-outline',
+      'arrow-redo-outline',
+      // Chevrones
+      'chevron-up',
+      'chevron-down',
+      'chevron-left',
+      'chevron-right',
+      'chevrons-up',
+      'chevrons-down',
+      'chevrons-left',
+      'chevrons-right',
+      'chevron-up-outline',
+      'chevron-down-outline',
+      'chevron-back-outline',
+      'chevron-forward-outline',
+      'chevron-collapse-outline',
+      'chevron-expand-outline',
+      // Esquinas
+      'corner-up-left',
+      'corner-up-right',
+      'corner-down-left',
+      'corner-down-right',
+      'corner-left-up',
+      'corner-left-down',
+      'corner-right-up',
+      'corner-right-down',
+      // Giro / refrescar
+      'refresh-cw',
+      'refresh-ccw',
+      'rotate-cw',
+      'rotate-ccw',
+      'refresh-outline',
+      'reload-outline',
+      // Orientación y mapa
+      'navigation',
+      'navigation-2',
+      'compass',
+      'map',
+      'map-pin',
+      'target',
+      'crosshair',
+      'home',
+      'anchor',
+      'compass-outline',
+      'map-outline',
+      'location-outline',
+      'navigate-outline',
+      'pin-outline',
+      'home-outline',
+    ],
+  },
+
+  // ─── Media ───────────────────────────────────────────────────────────────────
+  {
+    name: 'media',
+    label: 'Media',
+    labelEs: 'Medios',
+    categoryIcon: 'image',
+    icons: [
+      // Visual
+      'image',
+      'film',
+      'video',
+      'video-off',
+      'camera',
+      'camera-off',
+      'image-outline',
+      'images-outline',
+      'film-outline',
+      'videocam-outline',
+      'videocam-off-outline',
+      'camera-outline',
+      'camera-reverse-outline',
+      // Reproducción
+      'play',
+      'play-circle',
+      'pause',
+      'pause-circle',
+      'square',
+      'stop-circle',
+      'fast-forward',
+      'rewind',
+      'skip-forward',
+      'skip-back',
+      'repeat',
+      'shuffle',
+      'play-outline',
+      'pause-outline',
+      'play-circle-outline',
+      'pause-circle-outline',
+      'stop-circle-outline',
+      'play-back-outline',
+      'play-forward-outline',
+      'play-skip-back-outline',
+      'play-skip-forward-outline',
+      'repeat-outline',
+      'shuffle-outline',
+      // Audio
+      'music',
+      'headphones',
+      'speaker',
+      'volume',
+      'volume-1',
+      'volume-2',
+      'volume-x',
+      'mic',
+      'mic-off',
+      'mic-outline',
+      'mic-off-outline',
+      'mic-circle-outline',
+      'musical-note-outline',
+      'musical-notes-outline',
+      'volume-high-outline',
+      'volume-low-outline',
+      'volume-medium-outline',
+      'volume-mute-outline',
+      'volume-off-outline',
+    ],
+  },
+
+  // ─── Layout ──────────────────────────────────────────────────────────────────
+  {
+    name: 'layout',
+    label: 'Layout',
+    labelEs: 'Diseño',
+    categoryIcon: 'grid',
+    icons: [
+      // Estructura
+      'grid',
+      'columns',
+      'sidebar',
+      'layout',
+      'list',
+      'menu',
+      'table',
+      'trello',
+      'grid-outline',
+      'list-outline',
+      'menu-outline',
+      'layers-outline',
+      // Alineación
+      'align-left',
+      'align-center',
+      'align-right',
+      'align-justify',
+      // Tipografía
+      'bold',
+      'italic',
+      'underline',
+      'type',
+      'hash',
+      // Formas
+      'circle',
+      'square',
+      'triangle',
+      'hexagon',
+      'octagon',
+      'square-outline',
+      'triangle-outline',
+      'diamond-outline',
+      'shapes-outline',
+      // Herramientas de diseño
+      'pen-tool',
+      'crop',
+      'layers',
+      'filter',
+      'sliders',
+      'aperture',
+      'crop-outline',
+      'filter-outline',
+      'color-fill-outline',
+      'color-filter-outline',
+      'color-palette-outline',
+      'color-wand-outline',
+      'brush-outline',
+      // Edición
+      'edit',
+      'edit-2',
+      'edit-3',
+      'copy',
+      'trash',
+      'move',
+      'create-outline',
+      'pencil-outline',
+      'move-outline',
+      'resize-outline',
+      'duplicate-outline',
+      // Navegación UI
+      'more-horizontal',
+      'more-vertical',
+      'maximize',
+      'minimize',
+      'zoom-in',
+      'zoom-out',
+      'eye',
+      'eye-off',
+      'eye-outline',
+      'eye-off-outline',
+      'ellipsis-horizontal-circle-outline',
+      'ellipsis-vertical-circle-outline',
+    ],
+  },
+
+  // ─── Nature ──────────────────────────────────────────────────────────────────
+  {
+    name: 'nature',
+    label: 'Nature',
+    labelEs: 'Naturaleza',
+    categoryIcon: 'sunny-outline',
+    icons: [
+      // Sol, luna y estrellas
+      'sunny-outline',
+      'moon-outline',
+      'star-outline',
+      'star-half-outline',
+      'partly-sunny-outline',
+      'sun',
+      'moon',
+      'sunrise',
+      'sunset',
+      // Clima
+      'rainy-outline',
+      'thunderstorm-outline',
+      'snow-outline',
+      'cloudy-outline',
+      'cloudy-night-outline',
+      'cloud-outline',
+      'cloud-done-outline',
+      'cloud-download-outline',
+      'cloud-upload-outline',
+      'cloud-offline-outline',
+      'cloud-circle-outline',
+      'cloud',
+      'cloud-drizzle',
+      'cloud-lightning',
+      'cloud-rain',
+      'cloud-snow',
+      'cloud-off',
+      'umbrella-outline',
+      'thermometer-outline',
+      'droplet',
+      'wind',
+      // Agua y fuego
+      'water-outline',
+      'flame-outline',
+      'bonfire-outline',
+      'eyedrop-outline',
+      // Flora y fauna
+      'leaf-outline',
+      'flower-outline',
+      'bug-outline',
+      'fish-outline',
+      'paw-outline',
+      // Outdoor
+      'binoculars-outline',
+      'telescope-outline',
+      'compass-outline',
+      'map-outline',
+      'location-outline',
+      'flag-outline',
+      'trail-sign-outline',
+      'earth-outline',
+      'globe-outline',
+      'planet-outline',
+      'compass',
+      'map',
+      'map-pin',
+      'flag',
+      'navigation',
+      'navigation-2',
+      'target',
+      'crosshair',
+      'life-buoy',
+    ],
+  },
+
+  // ─── Brands ──────────────────────────────────────────────────────────────────
+  {
+    name: 'brands',
+    label: 'Brands',
+    labelEs: 'Marcas',
+    categoryIcon: 'globe',
+    icons: [
+      // Feather brand icons — outlined, consistent with the rest of the library
+      'github',
+      'gitlab',
+      'codepen',
+      'codesandbox',
+      'twitter',
+      'facebook',
+      'instagram',
+      'linkedin',
+      'youtube',
+      'dribbble',
+      'twitch',
+      'slack',
+      'figma',
+      'framer',
+      'chrome',
+      'rss',
+      // Filled / flat brand logos (FA5 brands) — kept in a second
+      // visual tier. Rendered as the brand's official silhouette.
+      // Visually consistent (all flat single-color) but heavier than the
+      // Feather outlined set above. Use these only when an outlined Feather
+      // version of the brand doesn't exist.
+      'reddit',
+      'tiktok',
+      'pinterest',
+      'whatsapp',
+      'discord',
+      'snapchat',
+      'telegram',
+      'viber',
+      'line',
+      'vimeo',
+      'tumblr',
+      'behance',
+      'medium',
+      'soundcloud',
+      'google',
+      'apple',
+      'android',
+      'windows',
+      'linux',
+      'amazon',
+      'paypal',
+      'stripe',
+      'shopify',
+      'dropbox',
+      'spotify',
+      'steam',
+      'atlassian',
+      'jira',
+      'confluence',
+      'bitbucket',
+      'jenkins',
+      'docker',
+      'aws',
+      'node',
+      'react',
+      'angular',
+      'wordpress',
+      'drupal',
+      'joomla',
+      'squarespace',
+      'wix',
+      'magento',
+      'terminal',
+      'pen-tool',
+    ],
+  },
+]
+
+/** Flat deduplicated array of all curated icon names (for "Todos" / search). */
+export const ALL_CURATED_ICONS: string[] = [
+  ...new Set(CURATED_ICONS.flatMap((c) => c.icons)),
+]
+
+/** Resolve icon to its category label, or undefined if not found. */
+export function getIconCategory(name: string): string | undefined {
+  for (const cat of CURATED_ICONS) {
+    if (cat.icons.includes(name)) return cat.label
+  }
+  return undefined
+}