Skip to content

[Enhancement] Update DatePicker component design, features, and APIΒ #526

Description

@Luizgomess

✨ Enhancement: Update DatePicker

πŸ“– Description

Revamp the DatePicker component to align with the latest shadcn/ui design standards. This includes updating the visual design, expanding functionality with new variants and features, and refining the public API for better developer experience.

Goals:

  • Align visual design with the latest shadcn/ui reference
  • Review and update component variants and styling
  • Improve API consistency with ZardUI conventions
  • Add missing features or demos if applicable

Philosophy: Keep the API minimal and consistent with ZardUI patterns β€” signal-based inputs, CVA variants, and mergeClasses for styling.

🎨 References

🎯 Scope

  1. Design: Update styles to match current shadcn/ui visuals (colors, spacing, borders, animations)
  2. Features: Add any missing variants, sizes, or states available in shadcn/ui
  3. API: Review inputs/outputs β€” ensure naming follows z prefix convention and types are strict
  4. Demos: Update demo components to match the exact same examples shown on the shadcn/ui documentation page
  5. Documentation: Update doc/overview.md and doc/api.md to reflect changes

βœ… Acceptance Criteria

  • Visual design matches latest shadcn/ui reference
  • All variants and sizes are implemented
  • API follows ZardUI conventions (z prefix, signal inputs, OnPush, ViewEncapsulation.None)
  • Demos updated with simple β†’ complex progression
  • Examples match the ones shown on the shadcn/ui docs page
  • Accessible (ARIA attributes, keyboard navigation)
  • Supports dark mode
  • Unit tests updated/added
  • Documentation updated

Labels: enhancement

Metadata

Metadata

Assignees

Labels

enhancementRequest or implementation of a new feature

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions