Trợ năng

Trang này mô tả cách biểu tượng hoạt động với trình đọc màn hình, bàn phím, thao tác chạm và cài đặt giảm chuyển động.

Tên trợ năng

Nếu không có title, biểu tượng là aria-hidden và trình đọc màn hình bỏ qua nó. Khi biểu tượng là nội dung duy nhất của một nút hoặc liên kết, hãy đặt tên trợ năng cho điều khiển đó, bằng aria-label trên điều khiển hoặc title trên biểu tượng:

tsx

import { Settings } from "kubai-icons-react";

<button aria-label="Settings"><Settings /></button>

<button><Settings title="Settings" /></button>

Web component <kubai-icon> lấy tên trợ năng từ thuộc tính label.

Đầu vào và chuyển động

Khi prefers-reduced-motion được bật, biểu tượng chuyển thẳng đến tư thế cuối mà không có hiệu ứng.
Với trigger="parent", tiêu điểm bàn phím phát chuyển động giống như khi rê chuột. Tiêu điểm còn lại sau khi nhấp chuột thì không.
Trên màn hình cảm ứng, một lần chạm phát chuyển động tiến rồi lùi. Biểu tượng bật/tắt thì đổi trạng thái.
Biểu tượng bật/tắt như Bookmark chỉ thể hiện trạng thái bằng màu và hình dạng. Hãy thêm văn bản hiển thị cạnh biểu tượng, hoặc đặt aria-pressed trên nút, để trình đọc màn hình có thể đọc ra trạng thái.