Native-UI
Native-UI - design system dla React Native
Design system dla React Native - komponenty, które na iOS i Android wyglądają natywnie.
System projektowy
About
Native-UI to design system dla React Native zbudowany wokół tokenów, motywów i prymitywów projektowanych z myślą o dostępności. Dostarcza 32 komponenty i 9 prymitywów layoutu - Button, Input, Select, BottomSheet, HeaderBar, ListItem, Toast, Modal i inne - każdy zachowujący się poprawnie zarówno na iOS jak i Android, z pełnymi motywami jasny / ciemny, wsparciem reduce-motion i otypowanymi API. Publikowany jako @polprog/native-ui na npm na licencji MIT.
Key Features
Motywy oparte na tokenach
Każda powierzchnia - kolor, odstęp, zaokrąglenie, typografia, cień - to nazwany token. Przełączasz motyw jasny / ciemny / własny przez jeden provider; komponenty czytają tylko tokeny, więc jedna zmiana propaguje się w całym systemie.
40+ komponentów i prymitywów
32 komponenty - Button, Input, Select, BottomSheet, HeaderBar, ListItem, Modal, Toast, Switch, Checkbox, Radio, Card, Avatar, Badge, Chip, Spinner, Skeleton, SearchBar i inne - oraz 9 prymitywów layoutu (Box, Stack, Heading, Text, Divider).
Natywne zachowanie per platforma
iOS używa natywnego feedbacku SF i wymiarów arkuszy; Android używa ripple i elewacji Material. Te same propsy, właściwe zachowanie na każdej platformie - bez kodu platformowego w Twojej aplikacji.
Dostępność w pierwszej kolejności
Każdy interaktywny komponent domyślnie posiada etykiety, hit-slopy, kolejność fokusu, role dla czytników ekranu i szacunek dla reduce-motion. Nadpisuj domyślne ustawienia per instancja w razie potrzeby.
W pełni otypowane API
100% TypeScript. Wyczerpujące typy propsów, wariantów i kontraktów motywów - edytor podpowiada poprawne użycie, błędy wychwytywane są przed runtime.
Zero zależności runtime
Żadnych bibliotek do stylowania, żadnych ciężkich frameworków UI - tylko sam React Native plus cienki provider motywu. Minimalny rozmiar instalacji, brak ryzyka zablokowania wersji.
Motywy oparte na tokenach
Każda powierzchnia - kolor, odstęp, zaokrąglenie, typografia, cień - to nazwany token. Przełączasz motyw jasny / ciemny / własny przez jeden provider; komponenty czytają tylko tokeny, więc jedna zmiana propaguje się w całym systemie.
40+ komponentów i prymitywów
32 komponenty - Button, Input, Select, BottomSheet, HeaderBar, ListItem, Modal, Toast, Switch, Checkbox, Radio, Card, Avatar, Badge, Chip, Spinner, Skeleton, SearchBar i inne - oraz 9 prymitywów layoutu (Box, Stack, Heading, Text, Divider).
Natywne zachowanie per platforma
iOS używa natywnego feedbacku SF i wymiarów arkuszy; Android używa ripple i elewacji Material. Te same propsy, właściwe zachowanie na każdej platformie - bez kodu platformowego w Twojej aplikacji.
Dostępność w pierwszej kolejności
Każdy interaktywny komponent domyślnie posiada etykiety, hit-slopy, kolejność fokusu, role dla czytników ekranu i szacunek dla reduce-motion. Nadpisuj domyślne ustawienia per instancja w razie potrzeby.
W pełni otypowane API
100% TypeScript. Wyczerpujące typy propsów, wariantów i kontraktów motywów - edytor podpowiada poprawne użycie, błędy wychwytywane są przed runtime.
Zero zależności runtime
Żadnych bibliotek do stylowania, żadnych ciężkich frameworków UI - tylko sam React Native plus cienki provider motywu. Minimalny rozmiar instalacji, brak ryzyka zablokowania wersji.
