angular / angular/components

[List] support "expand and collapse" from List spec

Đang mở
#14,994 3 bình luận 5 reaction 0 người được giao Xem trên GitHub
area: material/expansion area: material/list feature needs: discussion P5
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

#### Please describe the feature you would like to request.
The [List spec](https://material.io/design/components/lists.html#types) includes an "Expand and collapse" control. This functions more or less like an Expansion Panel but with List Item styling: dividers are used instead of a surrounding border / different background color, and the expand/collapse button is placed according to the rules for secondary action buttons.

#### What is the use-case or motivation for this proposal?
Support full capabilities of List as described in the spec

#### Is there anything else we should know?
I put together [a StackBlitz](https://stackblitz.com/edit/angular-material2-issue-list-expand) showing the current behavior when an expansion panel is placed in a list. The behavior is more or less as expected but the styling does not work as a list item, and just "fixing up" the current behavior is a lot to ask of consumers.

In my own project I built a component to implement this behavior, but it's not going to be as robust as it would be if supported directly here. Of course, styling an expansion panel to behave correctly when used as a list item is only one approach, and I don't mean to suggest a specific design. My custom component tracks its own expansion state and handles divider logic, etc, internally.

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Hướng nghiên cứu

Bắt đầu với StackBlitz được liên kết để tái hiện hành vi hiện tại, sau đó so sánh các component List và Expansion Panel hiện có với đặc tả List được liên kết. Công việc được hoàn thành khi hành vi mở rộng/thu gọn, các đường phân cách, kiểu dáng của các mục trong danh sách và vị trí của nút secondary-action khớp với thiết kế được yêu cầu; payload không nêu tên các file hoặc test cụ thể.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Tính năng
Độ khó
4/5
Thời gian dự kiến
3-5 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
35/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.