Components

Date Time Picker

Date Time Picker component with multiple variants and sizes.

Client Only

Installation

pnpm dlx @docyrus/cli add @docyrus/ui-date-time-picker

Required Packages(2 packages)

pnpm add react-hook-form date-fns

UI Primitives(5 components)

npx shadcn@latest add button calendar form popover scroll-area

Usage

import {
  DateTimePicker
} from "@docyrus/ui/components/date-time-picker";

<DateTimePicker
  size="sm"
/>

Sizes

Size	Description
`sm`	Small — `gap-1 text-sm`
`default`	Default — `gap-1.5`
`lg`	Large — `gap-2 text-lg`

API Reference

Prop	Type	Default
`size`	`"sm"` \| `"default"` \| `"lg"`	`"default"`
`className`	`string`	—

Credits

shadcn-ui/ui

Data Table Side Filters

An always-visible side filter panel for e-commerce-style listings — covers every Docyrus field type and emits the same RuleGroupType JSON as the Query Builder.

Date Time Range Picker

Date Time Range Picker component with multiple variants and sizes.