jpmorganchase/salt-ds

🧂 Salt-ds: Bộ component UI doanh nghiệp từ JPMorgan Chase

Một bộ công cụ giao diện người dùng (UI) React được thiết kế với tiêu chuẩn truy cập WCAG 2.1, hỗ trợ tùy biến sâu và hiệu năng tối ưu — phát triển bởi JPMorgan Chase.

Salt-ds (viết tắt của Salt Design System) cung cấp một bộ component UI React toàn diện, được xây dựng với mục tiêu hỗ trợ phát triển ứng dụng doanh nghiệp. Dự án nằm trong hệ sinh thái mã nguồn mở của JPMorgan Chase, nhằm mang lại trải nghiệm người dùng nhất quán, an toàn và hiện đại. Salt được thiết kế để dễ dàng tích hợp, tùy biến theo thương hiệu, đồng thời đảm bảo tuân thủ tiêu chuẩn truy cập WCAG 2.1.

✨ Điểm nổi bật

• Component UI đầy đủ: Cung cấp bộ sưu tập các component phổ biến như Button, Form, Navigation... phù hợp cho các ứng dụng doanh nghiệp.
• Tuân thủ WCAG 2.1: Được kiểm chứng hỗ trợ kết hợp trình đọc màn hình NVDA, JAWS, VoiceOver trên nền tảng Windows và macOS.
• Hệ thống theme linh hoạt: Hỗ trợ chế độ sáng/tối mặc định, đồng thời cho phép tạo biến thể theme tùy chỉnh hoặc thay thế hoàn toàn.
• Hỗ trợ mật độ giao diện: Tùi chỉnh độ dày, kích thước và khoảng cách hiển thị để phù hợp với các nhu cầu sử dụng khác nhau.
• Hiệu năng nhẹ: Tối ưu kích thước bundle và hiệu suất render, giảm thiểu phụ thuộc thư viện bên thứ ba.
• Phân phối qua bốn gói npm: @salt-ds/core (ổn định), @salt-ds/lab (thử nghiệm), @salt-ds/theme (CSS), @salt-ds/icons (biểu tượng SVG).
• Cài đặt đơn giản: Hỗ trợ cả npm và yarn, dễ dàng tích hợp vào dự án React hiện có.
• Kiểm thử trực quan: Được kiểm thử bởi nền tảng Chromatic giúp phát hiện lỗi giao diện nhanh chóng.

💡 Vì sao đáng chú ý

Salt-ds khác biệt từ các thư viện UI khác nhờ sự kết hợp giữa hiệu năng cao và tuân thủ tiêu chuẩn truy cập. Được phát triển nội bộ tại JPMorgan Chase, dự án mang lại trải nghiệm người dùng doanh nghiệp vững chắc, đồng thời mở nguồn cho cộng đồng sử dụng và đóng góp. Với thiết kế modular qua bốn gói npm, nhà phát triên có thể lựa chọn cài đặt linh hoạt, phù hợp với từng giai đoạn phát triển — từ nguyên mẫu đến sản phẩm hoàn chỉnh.

#React #UIComponents #Accessibility #DesignSystem #TypeScript #OpenSource #TiniX