'use client';import { a as a$2 } from './chunk-DG7BHES5.js';
import { a as a$1 } from './chunk-CXK4UZYG.js';
import { a } from './chunk-TWGPE4V7.js';
import { CalendarIcon } from '@onbeam/icons';
import { Popover, PopoverAnchor, PopoverTrigger, PopoverPortal, PopoverContent } from '@radix-ui/react-popover';
import { useRef, useImperativeHandle, useState, useEffect } from 'react';
import { cx } from '@onbeam/styled-system/css';
import { isDesktop } from 'react-device-detect';
import { padString } from '@onbeam/utils';
import { datePicker, customScrollbar } from '@onbeam/styled-system/recipes';
import { jsxs, jsx } from 'react/jsx-runtime';

var p=e=>{if(typeof e!="string")return;let n=new Date(e);if(!Number.isNaN(n.getTime()))return n},f=e=>`${padString(e.getFullYear(),4,"0")}-${padString(e.getMonth()+1,2,"0")}-${padString(e.getDate(),2,"0")}`;var g=a(({value:e,className:n,calendarProps:v,children:h,...k},I)=>{let t=useRef(null);useImperativeHandle(I,()=>t.current);let[b,u]=useState(p(e)||new Date),[C,w]=useState(p(e)),i=datePicker();useEffect(()=>{let r=t.current?.value;if(!r)return;let a=p(r);a&&(u(a),w(a));},[t.current?.value]);let y=r=>{if(!t.current)return;Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set?.call(t.current,f(r)),t.current.dispatchEvent(new Event("input",{bubbles:!0}));};return jsxs(Popover,{children:[jsx(PopoverAnchor,{children:jsx(PopoverTrigger,{asChild:!0,children:jsx(a$1,{ref:t,type:"date",size:"sm",className:cx(i.input,n),leftAddon:jsx(CalendarIcon,{height:16,width:16}),value:e,...k})})}),jsx(PopoverPortal,{children:jsxs(PopoverContent,{side:"bottom",align:"end",sideOffset:4,className:cx(customScrollbar(),i.content),"data-desktop":isDesktop,onOpenAutoFocus:r=>r.preventDefault(),children:[h,jsx(a$2,{mode:"single",required:!0,selected:C,onSelect:y,month:b,onMonthChange:u,className:i.calendar,...v})]})})]})});g.displayName="DatePicker";

export { g as a };
//# sourceMappingURL=out.js.map
//# sourceMappingURL=chunk-PHLQPWI5.js.map