본문으로 건너뛰기

@kalyx/react

Public React API. All names below are importable directly from @kalyx/react.

import {
  DatePicker, RangePicker, TimePicker, DateTimePicker,
  MonthPicker, YearPicker, WeekPicker,
} from '@kalyx/react';

Components​

NameReference
DatePickerComponent docs
RangePickerComponent docs
TimePickerComponent docs
DateTimePickerComponent docs
MonthPickerComponent docs
YearPickerComponent docs
WeekPickerComponent docs

Hooks​

NameReference
useDatePickerHook docs
useRangePickerHook docs
useTimePickerHook docs

Adapters​

DateFnsAdapter — re-exported from @kalyx/core.

import { DateFnsAdapter } from '@kalyx/react';

Types​

DatePicker types​

import type {
  DatePickerRootProps,
  DatePickerInputProps,
  DatePickerTriggerProps,
  DatePickerPopoverProps,
  DatePickerCalendarProps,
  DatePickerCalendarClassNames,
  DatePickerMonthGridProps,
  DatePickerMonthGridClassNames,
  DatePickerYearGridProps,
  DatePickerYearGridClassNames,
  DatePickerPresetsProps,
  DatePickerPresetsClassNames,
  DatePickerPresetProps,
  DatePickerPresetKey,
} from '@kalyx/react';

RangePicker types​

import type {
  RangePickerRootProps,
  RangePickerInputProps,
  RangeInputPart,            // 'start' | 'end'
  RangePickerPopoverProps,
  RangePickerCalendarProps,
  RangePickerCalendarClassNames,
  RangePickerPresetsProps,
  RangePickerPresetsClassNames,
  RangePickerPresetProps,
  PresetKey,
} from '@kalyx/react';

TimePicker types​

import type {
  TimePickerRootProps,
  TimePickerInputProps,
  TimePickerHourListProps,
  TimePickerHourListClassNames,
  TimePickerMinuteListProps,
  TimePickerMinuteListClassNames,
  TimePickerAmPmToggleProps,
  TimePickerAmPmToggleClassNames,
} from '@kalyx/react';

DateTimePicker types​

import type {
  DateTimePickerRootProps,
  DateTimePickerInputProps,
} from '@kalyx/react';

Sub-component types are re-exported from DatePicker and TimePicker.

MonthPicker types​

import type {
  MonthPickerRootProps,
  MonthPickerInputProps,
  MonthPickerTriggerProps,
  MonthPickerPopoverProps,
  MonthPickerGridProps,
  MonthPickerGridClassNames,
} from '@kalyx/react';

YearPicker types​

import type {
  YearPickerRootProps,
  YearPickerInputProps,
  YearPickerTriggerProps,
  YearPickerPopoverProps,
  YearPickerGridProps,
  YearPickerGridClassNames,
} from '@kalyx/react';

WeekPicker types​

import type {
  WeekPickerRootProps,
  WeekPickerInputProps,
  WeekPickerPopoverProps,
  WeekPickerCalendarProps,
  WeekPickerCalendarClassNames,
} from '@kalyx/react';

Hook types​

import type {
  UseDatePickerOptions,
  UseDatePickerReturn,
  UseRangePickerOptions,
  UseRangePickerReturn,
  UseTimePickerOptions,
  UseTimePickerReturn,
} from '@kalyx/react';

Re-exports from @kalyx/core​

import type {
  ISODateString,
  DateRange,
  DisabledRule,
  DateAdapter,
  CalendarDay,
  TimeValue,
} from '@kalyx/react';

Runtime dependencies​

  • @kalyx/core (workspace)
  • @kalyx/adapter-date-fns (workspace — bundles date-fns for the default entry)
  • @floating-ui/react ^0.27.0

Peer dependencies: react ^19.0.0, react-dom ^19.0.0.

Bundle size​

Gzipped build of the full public surface: ~15.99 KB (7 components, CI ceiling 17 KB). Tree-shakes per import — e.g., using only TimePicker drops DatePicker code. Verified in CI by scripts/check-bundle-size.js.

See also​