How guokaigdg/animal-island-ui works
Animal-Island-UI is a React/TypeScript component library, with a separate interactive demo for exploring component behavior. The main consumer workflow is to import the public API and styles, then compose UI components in an application. The library covers foundational controls, form input and validation, overlays and feedback, data display, and visual utilities. The demo provides navigation and per-component examples. README capabilities inform the subsystem coverage; source excerpts are partial, so internal wiring is shown only where directly supported.
Main entry points: index.ts Public Exports · index.tsx Component Examples · Form.tsx Form Components · useForm.ts Form State
Components 23
Library API
- Public Exports
src/index.ts
Controls and Forms
- Button and Input
src/components/Button/Button.tsx - Form Components
src/components/Form/Form.tsx - Form State
src/components/Form/useForm.ts - Rule Validation
src/components/Form/validators.ts - Date and Time
src/components/DatePicker/DatePicker.tsx - Selection Controls
src/components/Select/Select.tsx - File Upload
src/components/Upload/Upload.tsx
Overlays and Feedback
- Modal and Drawer
src/components/Modal/Modal.tsx - Notifications
src/components/Notification/Notification.tsx - Loading States
src/components/Loading/Loading.tsx
Data Display
- Table and Pagination
src/components/Table/Table.tsx - Cards and Tags
src/components/Card/Card.tsx - Image and Skeleton
src/components/Image/Image.tsx - Carousel and Tabs
src/components/Carousel/Carousel.tsx
Visual Components
- Background and Cursor
src/components/Background/Background.tsx - Code and Typewriter
src/components/CodeBlock/CodeBlock.tsx
Interactive Demo
- Demo Application
demo/App.tsx - Home and Component Pages
demo/ComponentPage.tsx - Component Examples
demo/components/Form/index.tsx - Demo Helpers
demo/tools/index.tsx
Other components
- React App
- React Runtime
Connections 21
- React App → Public Exports: imports components
- Public Exports → Button and Input: exports
- Public Exports → Form Components: exports
- Public Exports → Date and Time: exports
- Public Exports → Selection Controls: exports
- Public Exports → File Upload: exports
- Public Exports → Modal and Drawer: exports
- Public Exports → Notifications: exports
- Public Exports → Table and Pagination: exports
- Public Exports → Cards and Tags: exports
- Public Exports → Image and Skeleton: exports
- Public Exports → Carousel and Tabs: exports
- Public Exports → Background and Cursor: exports
- Public Exports → Code and Typewriter: exports
- Form Components → Form State: uses instance
- Form State → Rule Validation: runs rules
- React Runtime → Demo Application: renders
- Demo Application → Home and Component Pages: routes views
- Home and Component Pages → Component Examples: renders examples
- Component Examples → Demo Helpers: uses helpers
- Component Examples → Public Exports: demonstrates