SmartMaker - Front (React)

SmartMaker - Front (React)

La partie front de SmartMaker est construite avec React 19, Vite, et TailwindCSS 4.

Stack technique

Technologie Version Description
React 19.x Framework UI
Vite 6.x Build tool et dev server
TailwindCSS 4.x Framework CSS utility-first
Redux Toolkit 2.x State management
i18next 24.x Internationalisation
Framer Motion 12.x Animations
Dexie 4.x IndexedDB wrapper
ky 1.x HTTP client
Zod 4.x Validation de schémas

SmartCommon

SmartCommon est la bibliothèque de composants React partagés pour toutes les applications SmartMaker.

Repository : https://inligit.fr/cap-rel/dolibarr/smartmaker/smartcommon

Installation

npm install @cap-rel/smartcommon

Voir SmartCommon pour la documentation complète.

Contenu de SmartCommon

Providers

Composants qui fournissent le contexte à l'application (Provider, ApiProvider, ReduxProvider, etc.).

Composants de formulaire

  • Input, Textarea, Select
  • Calendar, Timer
  • AddressInput, Gps
  • PhotosUploader, AudiosUploader, VideosUploader
  • ColorPicker, IconSelect
  • SignaturePad
  • Editor (markdown)

Composants d'affichage

  • String, Text, Number
  • Datetime, Duration
  • Email, Url, PhoneNumber
  • Address, Coordinates
  • Color, Icon, Tags

Composants UI

  • Page, Block, Panel, Popup
  • List, ListItem
  • Carousel, DataTable, Chart
  • Navbar, Sidebar, Tabbar
  • Button, Icon, Spinner, Tag

Hooks

  • useApi - Appels API avec auth JWT
  • useGlobalStates - État global persistant
  • useStates - État local
  • useForm - Gestion de formulaires
  • useDb - Base IndexedDB via Dexie
  • useNavigation - Navigation router
  • useIntl - Formatage dates/nombres
  • useCachedQuery - Cache API avec stratégies (NetworkFirst, CacheFirst, SWR)
  • useSyncClient - Synchronisation offline complète
  • useReferenceSync - Catalogue de référence offline, en lecture seule
  • useOnlineStatus - Détection état réseau
  • useAuthenticatedImage - Chargement d'images avec JWT
  • useIsDesktop - Détection viewport desktop
  • useWindow - Orientation, dimensions, scroll, darkMode
  • useConfirm - Dialogues de confirmation
  • usePWAUpdate - Mise à jour du Service Worker

Voir Hooks pour la documentation complète.

Documentation

SmartMaker - Front (React) Page Animations