@konstructio/ui/dist/components/DateRangePicker/DateRangePicker.js

A set of reusable and customizable React components built for konstruct.io

import { t as a } from "../../utils-COaoD3PI.js";
import { Typography as i } from "../Typography/Typography.js";
import { DateRangePickerProvider as Q } from "./contexts/date-range-picker.provider.js";
import { PresetPanel as S } from "./components/PresetPanel/PresetPanel.js";
import { DateTimeInputs as U } from "./components/DateTimeInputs/DateTimeInputs.js";
import { CalendarPanel as W } from "./components/CalendarPanel/CalendarPanel.js";
import { dateRangePickerVariants as X, rightPanelVariants as Y } from "./DateRangePicker.variants.js";
import { jsx as e, jsxs as t } from "react/jsx-runtime";
var Z = ({ animationDuration: m = 500, className: o, defaultPreset: l = "custom", defaultRange: s, defaultTime: c, disabled: p = !1, isRequired: d, label: n, labelWrapperClassName: f, name: g, showTime: P = !0, theme: h, timeFormat: x = "24", blockedDays: u, blockedMonths: v, minDate: k, maxDate: N, hideDisabledNavigation: D, showOutsideDays: R, navigationMode: y = "independent", ariaLabelCalendar: T, ariaLabelPrevMonth: j, ariaLabelNextMonth: I, ariaLabelPrevMonthStart: V, ariaLabelNextMonthStart: b, ariaLabelPrevMonthEnd: C, ariaLabelNextMonthEnd: K, labelStartDate: L, labelEndDate: q, labelTime: w, ariaLabelStartDate: z, ariaLabelEndDate: A, errorInvalidDate: B, errorDateNotAvailable: E, showPresets: F = !0, labelTimePeriod: G, ariaLabelTimePeriod: H, presetLabels: J, classNames: r, onRangeChange: M, onDateChange: O }) => /* @__PURE__ */ e(Q, {
  defaultRange: s,
  defaultTime: c,
  defaultPreset: l,
  timeFormat: x,
  showTime: P,
  name: g,
  disabled: p,
  animationDuration: m,
  blockedDays: u,
  blockedMonths: v,
  minDate: k,
  maxDate: N,
  hideDisabledNavigation: D,
  showOutsideDays: R,
  navigationMode: y,
  onRangeChange: M,
  onDateChange: O,
  children: /* @__PURE__ */ t("div", {
    className: "flex flex-col gap-2",
    "data-theme": h,
    children: [n ? /* @__PURE__ */ e("div", {
      className: a(f),
      children: /* @__PURE__ */ t(i, {
        component: "label",
        variant: "labelLarge",
        className: a("cursor-pointer", "flex", "gap-1", "text-sm", "font-medium"),
        children: [n, d && /* @__PURE__ */ e(i, {
          component: "span",
          className: a("text-red-600", "dark:text-red-500", "text-xs", "mt-0.5"),
          children: "*"
        })]
      })
    }) : null, /* @__PURE__ */ t("div", {
      className: a(X({ className: o }), "gap-4", r?.container),
      role: "group",
      "aria-label": n || "Date range picker",
      children: [F && /* @__PURE__ */ e(S, {
        labelTimePeriod: G,
        ariaLabelTimePeriod: H,
        presetLabels: J,
        classNames: r?.presetPanel
      }), /* @__PURE__ */ t("div", {
        className: a(Y(), r?.rightPanel),
        children: [/* @__PURE__ */ e(U, {
          labelStartDate: L,
          labelEndDate: q,
          labelTime: w,
          ariaLabelStartDate: z,
          ariaLabelEndDate: A,
          errorInvalidDate: B,
          errorDateNotAvailable: E,
          classNames: r?.dateTimeInputs
        }), /* @__PURE__ */ e(W, {
          ariaLabelCalendar: T,
          ariaLabelPrevMonth: j,
          ariaLabelNextMonth: I,
          ariaLabelPrevMonthStart: V,
          ariaLabelNextMonthStart: b,
          ariaLabelPrevMonthEnd: C,
          ariaLabelNextMonthEnd: K,
          classNames: r?.calendarPanel
        })]
      })]
    })]
  })
});
Z.displayName = "KonstructDateRangePicker";
export {
  Z as DateRangePicker
};