react-fa-picker/src/components/icon-picker/types.ts

A reusable React Icon Picker component, bundled with its own Tailwind CSS build.

import { z } from "zod";

// Icon type definitions
export const IconSchema = z.object({
  id: z.string(),
  name: z.string(),
  icon: z.any(), // Font Awesome icon object
  unicode: z.string(),
  class: z.string(),
  category: z.string().optional(),
});

export type IconType = z.infer<typeof IconSchema>;

// Icon category definitions
export const IconCategorySchema = z.object({
  id: z.string().nullable(),
  name: z.string(),
  icon: z.any(), // Font Awesome icon object
});

export type IconCategoryType = z.infer<typeof IconCategorySchema>;

// Icon state definitions
export const IconStateSchema = z.object({
  size: z.coerce.number().default(14),
  color: z.coerce.string().default("#09032f"),
  searchQuery: z.coerce.string().default(""),
  selectedIcon: z.string().nullable().default(null),
  activeCategory: z.string().nullable().default(null),
});

export type IconStateType = z.infer<typeof IconStateSchema>;

// Category interface for our utility
export interface IconCategory {
  name: string;
  icons: IconType[];
}