"use client";
import { cva } from 'class-variance-authority';
import { ArrowRight, Calendar } from 'lucide-react';
import { format } from 'date-fns';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var datePickerContainerVariants = cva(
  "group/date-picker flex w-full cursor-pointer items-center gap-1.5 overflow-clip rounded-[var(--radius-sm)] shadow-none transition-[background-color] duration-150 focus-visible:transition-none data-[state=open]:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0",
  {
    variants: {
      inputStyle: {
        default: "border border-border bg-white hover:border-input-hover hover:bg-[var(--theme-background-input-hover)] dark:bg-sidebar",
        shadow: "border border-border bg-white shadow-none hover:border-input-hover hover:bg-[var(--theme-background-input-hover)] dark:bg-sidebar",
        soft: "border border-border bg-white hover:border-input-hover hover:bg-[var(--theme-background-input-hover)] dark:bg-sidebar"
      },
      size: {
        sm: "p-1.5",
        lg: "p-2"
      }
    },
    defaultVariants: {
      inputStyle: "default",
      size: "sm"
    }
  }
);
function DateSegment({
  value,
  placeholder,
  width,
  isDisabled
}) {
  const isFilled = value !== void 0 && value !== "";
  return /* @__PURE__ */ jsx(
    "span",
    {
      "data-slot": "date-segment",
      className: cn(
        "inline-flex items-center justify-center rounded-xs px-1 text-sm leading-5 tabular-nums",
        isDisabled ? "text-foreground/30" : isFilled ? "text-foreground" : "text-muted-foreground",
        width
      ),
      children: isFilled ? value : placeholder
    }
  );
}
function DateSegmentSeparator() {
  return /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-sm leading-5 text-foreground/30 select-none", children: "/" });
}
function DateSegmentGroup({
  value,
  isDisabled,
  className
}) {
  const day = value ? format(value, "dd") : void 0;
  const month = value ? format(value, "MM") : void 0;
  const year = value ? format(value, "yyyy") : void 0;
  return /* @__PURE__ */ jsxs("span", { className: cn("inline-flex items-center gap-0.5", className), children: [
    /* @__PURE__ */ jsx(DateSegment, { value: day, placeholder: "dd", width: "w-[26px]", isDisabled }),
    /* @__PURE__ */ jsx(DateSegmentSeparator, {}),
    /* @__PURE__ */ jsx(DateSegment, { value: month, placeholder: "mm", width: "w-[33px]", isDisabled }),
    /* @__PURE__ */ jsx(DateSegmentSeparator, {}),
    /* @__PURE__ */ jsx(DateSegment, { value: year, placeholder: "yyyy", width: "w-[40px]", isDisabled })
  ] });
}
function DatePickerInput(_a) {
  var _b = _a, {
    className,
    type = "default",
    inputStyle = "default",
    size = "sm",
    value,
    endValue,
    invalid,
    isOpen,
    disabled
  } = _b, props = __objRest(_b, [
    "className",
    "type",
    "inputStyle",
    "size",
    "value",
    "endValue",
    "invalid",
    "isOpen",
    "disabled"
  ]);
  return /* @__PURE__ */ jsxs(
    "button",
    __spreadProps(__spreadValues({
      type: "button",
      "data-slot": "date-picker-input",
      disabled,
      "data-state": isOpen ? "open" : "closed",
      "data-invalid": invalid ? "true" : void 0,
      className: cn(
        datePickerContainerVariants({ inputStyle, size }),
        isOpen && "border-input-hover ring-0",
        invalid && !isOpen && "border-destructive",
        disabled && "pointer-events-none border-border bg-muted shadow-none after:hidden hover:bg-muted",
        className
      )
    }, props), {
      children: [
        /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 items-center gap-0.5", children: [
          /* @__PURE__ */ jsx(DateSegmentGroup, { value, isDisabled: disabled }),
          type === "range" && /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx(ArrowRight, { className: "mx-0.5 size-4 shrink-0 text-muted-foreground" }),
            /* @__PURE__ */ jsx(DateSegmentGroup, { value: endValue, isDisabled: disabled })
          ] })
        ] }),
        /* @__PURE__ */ jsx("span", { className: "flex size-5 shrink-0 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx(Calendar, { className: "size-4" }) })
      ]
    })
  );
}

export { DatePickerInput, DateSegmentGroup, datePickerContainerVariants };
//# sourceMappingURL=date-picker-input.js.map
//# sourceMappingURL=date-picker-input.js.map