คอมโพเนนต์แบบผสม (Compound Components)

import { DatePicker } from "react-date-range-picker-tailwind3";

// การใช้งานแบบง่าย — เรนเดอร์เลย์เอาต์เริ่มต้น
<DatePicker value={value} onChange={setValue} />

// การใช้งานแบบผสม — ควบคุมโครงสร้างได้เต็มที่
<DatePicker.Root value={value} onChange={setValue}>
  <DatePicker.Trigger />
  <DatePicker.Content>
    <DatePicker.Header>
      <DatePicker.PrevButton />
      <DatePicker.Title />
      <DatePicker.NextButton />
    </DatePicker.Header>
    <DatePicker.Grid />
    <DatePicker.Footer>
      <DatePicker.ClearButton />
      <DatePicker.CancelButton />
      <DatePicker.ConfirmButton />
    </DatePicker.Footer>
  </DatePicker.Content>
</DatePicker.Root>