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

var g=a(({className:y,...k},D)=>{let r=useRef(null),s=useRef(null),a=useRef(null),[o,I]=useState(void 0);useImperativeHandle(D,()=>r.current);let i=timePicker();useEffect(()=>{let t=r.current?.value;if(!t)return;let[e,l]=t.split(":").map(Number);if(!isNumber(e)||!isNumber(l))return;let f=new Date;f.setHours(e,l),I(f);},[r.current?.value]);let u=o?.getHours(),c=o?.getMinutes(),H=()=>{let t=!!u&&!!s.current&&s.current.children?.[u];t&&s.current.scrollTo({top:t.offsetTop-s.current.offsetTop,behavior:"instant"});let e=!!c&&!!a.current&&a.current.children?.[c];e&&a.current.scrollTo({top:e.offsetTop-a.current.offsetTop,behavior:"instant"});},C=t=>{let e=o?new Date(o):new Date;e.setHours(t),p(e);},M=t=>{let e=o?new Date(o):new Date;e.setMinutes(t),p(e);},p=t=>{if(!r.current)return;let e=t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1});Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set?.call(r.current,e),r.current?.dispatchEvent(new Event("input",{bubbles:!0}));};return jsxs(Popover,{onOpenChange:t=>{t&&setTimeout(H);},children:[jsx(PopoverAnchor,{children:jsx(PopoverTrigger,{asChild:!0,children:jsx(a$1,{ref:r,type:"time",size:"sm",className:cx(i.input,y),leftAddon:jsx(ClockIcon,{height:16,width:16}),...k})})}),jsx(PopoverPortal,{children:jsxs(PopoverContent,{side:"bottom",align:"end",sideOffset:4,className:cx(customScrollbar(),i.content),"data-desktop":isDesktop,onOpenAutoFocus:t=>t.preventDefault(),children:[jsx("div",{className:i.rowWrapper,children:jsx("div",{className:i.row,ref:s,children:new Array(24).fill(null).map((t,e)=>jsx("button",{type:"button",className:timePickerItem(),"data-active":e===u,onClick:()=>C(e),children:padString(e,2,"0")},e))})}),jsx("div",{className:i.rowWrapper,children:jsx("div",{className:i.row,ref:a,children:new Array(60).fill(null).map((t,e)=>jsx("button",{type:"button",className:timePickerItem(),"data-active":e===c,onClick:()=>M(e),children:padString(e,2,"0")},e))})})]})})]})});g.displayName="TimePicker";

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