[Release note] Tini Design library v3.3

Tháng này Tini UI kit có sự thay đổi lớn về structure của file, cải thiện một số components, và thêm icon mới.

Thay đổi về structure

Mục đích của thay đổi này phục vụ cho việc đồng bộ hóa giữa development và design về mặt documentation, từ đó tạo nền tảng để đẩy nhanh việc phát triển component ở phía development.

1.1 Bỏ các đầu mục con của Form như Input, Selection, Picker, Modal. Chuyển các thành phần trong các đầu mục này vào đầu mục chính.

1.2 Đưa Navigation bar và Bottom bar vào mục App shell components. Đổi tên Navgation bar thành App shell navigation bar, Bottom bar thành App shell tab bar.

Đọc thêm về App shell component ở đây

1.3 Đưa Image, Divider, Overlay vào mục Support components.

Support components là những components được dành riêng cho quá trình design. Những component này sẽ ko được developers build.

Đồng thời mang các components như Status bar, iOS Home indicator, Keyboard, Browser và mục page Device elements

1.4 Chỉnh sửa tên một số page và component

Đổi tên page List view thành List item, Grid view thành Grid item. Mục đích là để đồng nhất với tên component

Đổi tên page Sheet thành Bottom sheet, bỏ component Center sheet vì use case chưa rõ ràng.

Đổi tên page Steps thành Step cho đồng nhất với development.

Cải thiện các components

2.1 Table

Sữa lỗi thiếu token màu cho Icon của Cell action

2.2 Support components

Status bar và iOS home indicator được apply Alias token vào. Mục đích là khi swap qua lại giữa dark theme và light theme, các component này cũng thay đổi theo.

2.2 Input stepper

Sửa lỗi sai state của Increment button và Decrement button.

2.3 Audio player

Sửa lỗi token của icon.

Những icon mới



Thông tin liên quan

Design library

Standard flows

  • Tini Checkout flows: Figma

Template

3 Likes