Logical layout + percentage prop-getter

Đang mở
  • Có gì không ổn?
#34 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
5/5
Thời gian dự kiến
Hơn một tuần
Mức phù hợp với người mới
35/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
typescript
Lĩnh vực
frontend

Hướng nghiên cứu

Start by reading the parent issue #25 and the blocking issue #28 to understand the surrounding design and whether this work can begin. Then trace the core projection and view-layer APIs described here; the payload does not name specific files or tests. Done means the projection exposes fractional logical layout without container dimensions, and the view prop-getter produces percentage styles for both orientations.

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

Mô tả

enhancement

Parent

https://github.com/TanStack/time/issues/25

What to build

Remove all pixel values from the core projection and introduce a percentage-based prop-getter that gives consumers an easy, zero-configuration way to position events. The kernel and projection are pixel-free; the prop-getter lives on the view layer.

The projection emits logical Event Layout per event: `{ startFraction, endFraction, column, columnCount, lane }`. The `getEventProps(event)` prop-getter on the view converts these into a `%`-based `style` object the consumer spreads directly onto an element. View orientation (vertical for day/week, horizontal for timeline) is a config on the view, not a separate function.

The timeline view ships under this slice — it is a view over the same logical layout data, not a separate product.

Acceptance criteria

  • `getUnavailableRanges(date)` no longer accepts `containerHeight`; returns fractional ranges (`{ startFraction, endFraction }`)
  • `getTimelineLayout()` returns fractional `left`/`width` (0–1 range) and logical `lane` index — no pixel values
  • `getEventProps(event)` returns `{ style: { position: 'absolute', top: '...%', height: '...%', ... } }` for vertical orientation
  • `getEventProps(event)` returns `{ style: { position: 'absolute', left: '...%', width: '...%', ... } }` for horizontal (timeline) orientation
  • Raw logical fields (`startFraction`, `endFraction`, `column`, `columnCount`, `lane`) remain public on the event layout object for canvas/virtualized renderers
  • Overlap resolution (interval-graph coloring → `column`/`columnCount`) is computed in the projection, not in the prop-getter
  • `currentTimePosition` (previously in pixels) is returned as a fraction (0–1)
  • No method in the core or projection accepts a container dimension as a parameter

Blocked by

https://github.com/TanStack/time/issues/28

Ngôn ngữ chính
TypeScript
Star
620
Fork
6
Không có pull request nào được merge trong 30 ngày

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của TanStack/time

Tất cả issue của TanStack/time

Issue tương tự

Thêm issue về TypeScript

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.