@choco-vanille/ui 1.18.1 → 1.20.0

package/dist/components/forms/select/components/select-trigger/SelectTrigger.js

@@ -7,7 +7,7 @@ import N from "../../../../../resources/asset/ChevronDownIcon.svg.js";
 import _ from "../../../../layout/box/Box.js";
 import "../../../../layout/box/styles/Box.css.js";
 import B from "../../../text-field/components/text-field-start-icon/TextFieldStartIcon.js";
-import '../../../../../ui-kit88.css';import '../../../../../ui-kit87.css';import '../../../../../ui-kit2.css';import '../../../../../ui-kit.css';/* empty css                                               */
+import '../../../../../ui-kit87.css';import '../../../../../ui-kit99.css';import '../../../../../ui-kit2.css';import '../../../../../ui-kit.css';/* empty css                                               */
 /* empty css                                                   */
 /* empty css                                                                                                */
 import "../../../text-field/components/text-field-end-action/TextFieldEndAction.js";

package/dist/components/forms/select/components/select-trigger/styles/SelectTrigger.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit117.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                   */const n=require("@vanilla-extract/recipes/createRuntimeFn");var e="_15nnodx0",r={recipe:n.createRuntimeFn({defaultClassName:"_15nnodx1",variantClassNames:{size:{sm:"_15nnodx2",md:"_15nnodx3",lg:"_15nnodx4"},hasError:{true:"_15nnodx5"},hasStartIcon:{true:"_15nnodx6"},hasEndIcon:{true:"_15nnodx7"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndIcon:!0},compoundVariants:[[{hasStartIcon:!0},"_15nnodx8"],[{hasEndIcon:!0},"_15nnodx9"]]})};exports.SELECT_TRIGGER_END_ICON=e;exports.SELECT_TRIGGER_STYLES=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit115.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                   */const n=require("@vanilla-extract/recipes/createRuntimeFn");var e="_15nnodx0",r={recipe:n.createRuntimeFn({defaultClassName:"_15nnodx1",variantClassNames:{size:{sm:"_15nnodx2",md:"_15nnodx3",lg:"_15nnodx4"},hasError:{true:"_15nnodx5"},hasStartIcon:{true:"_15nnodx6"},hasEndIcon:{true:"_15nnodx7"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndIcon:!0},compoundVariants:[[{hasStartIcon:!0},"_15nnodx8"],[{hasEndIcon:!0},"_15nnodx9"]]})};exports.SELECT_TRIGGER_END_ICON=e;exports.SELECT_TRIGGER_STYLES=r;
 //# sourceMappingURL=SelectTrigger.css.cjs.map

package/dist/components/forms/select/components/select-trigger/styles/SelectTrigger.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit117.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit115.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                 */
 import { createRuntimeFn as n } from "@vanilla-extract/recipes/createRuntimeFn";
 var t = "_15nnodx0", e = { recipe: n({ defaultClassName: "_15nnodx1", variantClassNames: { size: { sm: "_15nnodx2", md: "_15nnodx3", lg: "_15nnodx4" }, hasError: { true: "_15nnodx5" }, hasStartIcon: { true: "_15nnodx6" }, hasEndIcon: { true: "_15nnodx7" } }, defaultVariants: { size: "md", hasError: !1, hasStartIcon: !1, hasEndIcon: !0 }, compoundVariants: [[{ hasStartIcon: !0 }, "_15nnodx8"], [{ hasEndIcon: !0 }, "_15nnodx9"]] }) };

package/dist/components/forms/select/styles/Select.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit32.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={placeholder:"f53dgk0"};exports.SELECT_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit17.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={placeholder:"f53dgk0"};exports.SELECT_STYLES=e;
 //# sourceMappingURL=Select.css.cjs.map

package/dist/components/forms/select/styles/Select.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit32.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit17.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                          */
 var p = { placeholder: "f53dgk0" };
 export {

package/dist/components/forms/slider/components/slider-header/styles/SliderHeader.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit144.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                  */var e={root:"tjesq90",label:"tjesq91",value:"tjesq92"};exports.SLIDER_HEADER_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit154.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                  */var e={root:"tjesq90",label:"tjesq91",value:"tjesq92"};exports.SLIDER_HEADER_STYLES=e;
 //# sourceMappingURL=SliderHeader.css.cjs.map

package/dist/components/forms/slider/components/slider-header/styles/SliderHeader.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit144.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit154.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                */
 var o = { root: "tjesq90", label: "tjesq91", value: "tjesq92" };
 export {

package/dist/components/forms/slider/components/slider-track/styles/SliderTrack.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit151.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                 */const a=require("@vanilla-extract/recipes/createRuntimeFn");var e={control:"ky6kla0",track:a.createRuntimeFn({defaultClassName:"ky6kla1",variantClassNames:{size:{sm:"ky6kla2",md:"ky6kla3",lg:"ky6kla4"}},defaultVariants:{size:"md"},compoundVariants:[]}),indicator:a.createRuntimeFn({defaultClassName:"ky6kla5",variantClassNames:{color:{primary:"ky6kla6",secondary:"ky6kla7",destructive:"ky6kla8"}},defaultVariants:{color:"primary"},compoundVariants:[]}),thumb:a.createRuntimeFn({defaultClassName:"ky6kla9",variantClassNames:{size:{sm:"ky6klaa",md:"ky6klab",lg:"ky6klac"},color:{primary:"ky6klad",secondary:"ky6klae",destructive:"ky6klaf"}},defaultVariants:{size:"md",color:"primary"},compoundVariants:[]})};exports.SLIDER_TRACK_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit148.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                 */const a=require("@vanilla-extract/recipes/createRuntimeFn");var e={control:"ky6kla0",track:a.createRuntimeFn({defaultClassName:"ky6kla1",variantClassNames:{size:{sm:"ky6kla2",md:"ky6kla3",lg:"ky6kla4"}},defaultVariants:{size:"md"},compoundVariants:[]}),indicator:a.createRuntimeFn({defaultClassName:"ky6kla5",variantClassNames:{color:{primary:"ky6kla6",secondary:"ky6kla7",destructive:"ky6kla8"}},defaultVariants:{color:"primary"},compoundVariants:[]}),thumb:a.createRuntimeFn({defaultClassName:"ky6kla9",variantClassNames:{size:{sm:"ky6klaa",md:"ky6klab",lg:"ky6klac"},color:{primary:"ky6klad",secondary:"ky6klae",destructive:"ky6klaf"}},defaultVariants:{size:"md",color:"primary"},compoundVariants:[]})};exports.SLIDER_TRACK_STYLES=e;
 //# sourceMappingURL=SliderTrack.css.cjs.map

package/dist/components/forms/slider/components/slider-track/styles/SliderTrack.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit151.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit148.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                               */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var s = { control: "ky6kla0", track: a({ defaultClassName: "ky6kla1", variantClassNames: { size: { sm: "ky6kla2", md: "ky6kla3", lg: "ky6kla4" } }, defaultVariants: { size: "md" }, compoundVariants: [] }), indicator: a({ defaultClassName: "ky6kla5", variantClassNames: { color: { primary: "ky6kla6", secondary: "ky6kla7", destructive: "ky6kla8" } }, defaultVariants: { color: "primary" }, compoundVariants: [] }), thumb: a({ defaultClassName: "ky6kla9", variantClassNames: { size: { sm: "ky6klaa", md: "ky6klab", lg: "ky6klac" }, color: { primary: "ky6klad", secondary: "ky6klae", destructive: "ky6klaf" } }, defaultVariants: { size: "md", color: "primary" }, compoundVariants: [] }) };

package/dist/components/forms/slider/styles/Slider.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit18.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={root:"_1exybeb0",helper:"_1exybeb1",error:"_1exybeb2"};exports.SLIDER_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit39.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={root:"_1exybeb0",helper:"_1exybeb1",error:"_1exybeb2"};exports.SLIDER_STYLES=e;
 //# sourceMappingURL=Slider.css.cjs.map

package/dist/components/forms/slider/styles/Slider.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit18.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit39.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                          */
 var b = { root: "_1exybeb0", helper: "_1exybeb1", error: "_1exybeb2" };
 export {

package/dist/components/forms/switch/styles/Switch.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit44.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={wrapper:"ih5w140",wrapperDisabled:"ih5w141",root:e.createRuntimeFn({defaultClassName:"ih5w142",variantClassNames:{size:{sm:"ih5w143",md:"ih5w144",lg:"ih5w145"},error:{true:"ih5w146",false:"ih5w147"}},defaultVariants:{size:"md",error:!1},compoundVariants:[]}),thumb:e.createRuntimeFn({defaultClassName:"ih5w148",variantClassNames:{size:{sm:"ih5w149",md:"ih5w14a",lg:"ih5w14b"}},defaultVariants:{size:"sm"},compoundVariants:[]}),label:"ih5w14c",labelDisabled:"ih5w14d"};exports.SWITCH_STYLES=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit28.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={wrapper:"ih5w140",wrapperDisabled:"ih5w141",root:e.createRuntimeFn({defaultClassName:"ih5w142",variantClassNames:{size:{sm:"ih5w143",md:"ih5w144",lg:"ih5w145"},error:{true:"ih5w146",false:"ih5w147"}},defaultVariants:{size:"md",error:!1},compoundVariants:[]}),thumb:e.createRuntimeFn({defaultClassName:"ih5w148",variantClassNames:{size:{sm:"ih5w149",md:"ih5w14a",lg:"ih5w14b"}},defaultVariants:{size:"sm"},compoundVariants:[]}),label:"ih5w14c",labelDisabled:"ih5w14d"};exports.SWITCH_STYLES=a;
 //# sourceMappingURL=Switch.css.cjs.map

package/dist/components/forms/switch/styles/Switch.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit44.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit28.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                          */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var s = { wrapper: "ih5w140", wrapperDisabled: "ih5w141", root: a({ defaultClassName: "ih5w142", variantClassNames: { size: { sm: "ih5w143", md: "ih5w144", lg: "ih5w145" }, error: { true: "ih5w146", false: "ih5w147" } }, defaultVariants: { size: "md", error: !1 }, compoundVariants: [] }), thumb: a({ defaultClassName: "ih5w148", variantClassNames: { size: { sm: "ih5w149", md: "ih5w14a", lg: "ih5w14b" } }, defaultVariants: { size: "sm" }, compoundVariants: [] }), label: "ih5w14c", labelDisabled: "ih5w14d" };

package/dist/components/forms/text-area/TextArea.cjs

@@ -1,2 +1,2 @@
-"use strict";require('../../../ui-kit93.css');require('../../../ui-kit96.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const e=require("react/jsx-runtime"),v=require("./components/text-area-start-icon/TextAreaStartIcon.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                              */const E=require("./components/text-area-end-action/TextAreaEndAction.cjs");;/* empty css                                                                              */const j=require("../_shared/components/form-label/FormLabel.cjs"),$=require("./styles/TextArea.css.cjs"),G=require("../_shared/components/helper-text/HelperText.cjs"),J=require("./hooks/useAutoResizeTextArea.hook.cjs"),O=require("./hooks/useTextArea.hook.cjs"),S=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const Q=require("../../../utils/cn.cjs"),V=require("../../../theme/contract.css.cjs"),s=require("react"),n=s.memo(d=>{const{inputId:o,helperId:x,hasError:i,hasStartIcon:I,hasEndAction:h,handleMouseDown:g,handleFocus:_,handleBlur:C}=O.useTextArea(d),{disabled:b,startIcon:f,className:k,width:q,error:a,helperText:c,label:l,endAction:D,size:F,fontSize:A="md",placeholder:L,value:m,onChange:p,onKeyDown:B,onKeyUp:N,ref:r,style:P,rows:u,minRows:T,maxRows:K,"aria-labelledby":M,...H}=d,R=F??"md",w=l&&o?`${o}-label`:void 0,y=s.useRef(null),U=s.useCallback(t=>{y.current=t,typeof r=="function"?r(t):r&&(r.current=t)},[r]),{isEnabled:X,resize:z}=J.useAutoResizeTextArea(y,{minRows:T??u,maxRows:K,value:m}),Y=s.useCallback(t=>{p?.(t),z()},[p,z]);return e.jsxs(S,{flexDirection:"column",gap:"xs",width:"100%",alignItems:"start",style:q!==void 0?{width:q}:void 0,children:[l&&e.jsx(j,{id:w,disabled:b,fontSize:A,children:l}),e.jsxs(S,{position:"relative",width:"100%",gap:"none",children:[f&&e.jsx(v,{icon:f,size:R}),e.jsx("textarea",{ref:U,id:o,disabled:b,"aria-labelledby":M??w,"aria-invalid":i||void 0,"aria-describedby":a||c?x:void 0,onMouseDown:g,onFocus:_,onBlur:C,className:Q.cn($.TEXT_AREA_STYLES.recipe({size:R,hasError:i,hasStartIcon:I,hasEndAction:h}),k),placeholder:L,value:m,onChange:Y,onKeyDown:B,onKeyUp:N,rows:X?T??u:u,...H,style:{fontSize:V.vars.fontSize[A],...P}}),h&&e.jsx(E,{children:D})]}),(a||c)&&e.jsx(G,{id:x,hasError:i,children:a??c})]})});n.displayName="TextArea";n.Label=j;n.StartIcon=v;n.EndAction=E;module.exports=n;
+"use strict";require('../../../ui-kit78.css');require('../../../ui-kit104.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const e=require("react/jsx-runtime"),v=require("./components/text-area-start-icon/TextAreaStartIcon.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                              */const E=require("./components/text-area-end-action/TextAreaEndAction.cjs");;/* empty css                                                                              */const j=require("../_shared/components/form-label/FormLabel.cjs"),$=require("./styles/TextArea.css.cjs"),G=require("../_shared/components/helper-text/HelperText.cjs"),J=require("./hooks/useAutoResizeTextArea.hook.cjs"),O=require("./hooks/useTextArea.hook.cjs"),S=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const Q=require("../../../utils/cn.cjs"),V=require("../../../theme/contract.css.cjs"),s=require("react"),n=s.memo(d=>{const{inputId:o,helperId:x,hasError:i,hasStartIcon:I,hasEndAction:h,handleMouseDown:g,handleFocus:_,handleBlur:C}=O.useTextArea(d),{disabled:b,startIcon:f,className:k,width:q,error:a,helperText:c,label:l,endAction:D,size:F,fontSize:A="md",placeholder:L,value:m,onChange:p,onKeyDown:B,onKeyUp:N,ref:r,style:P,rows:u,minRows:T,maxRows:K,"aria-labelledby":M,...H}=d,R=F??"md",w=l&&o?`${o}-label`:void 0,y=s.useRef(null),U=s.useCallback(t=>{y.current=t,typeof r=="function"?r(t):r&&(r.current=t)},[r]),{isEnabled:X,resize:z}=J.useAutoResizeTextArea(y,{minRows:T??u,maxRows:K,value:m}),Y=s.useCallback(t=>{p?.(t),z()},[p,z]);return e.jsxs(S,{flexDirection:"column",gap:"xs",width:"100%",alignItems:"start",style:q!==void 0?{width:q}:void 0,children:[l&&e.jsx(j,{id:w,disabled:b,fontSize:A,children:l}),e.jsxs(S,{position:"relative",width:"100%",gap:"none",children:[f&&e.jsx(v,{icon:f,size:R}),e.jsx("textarea",{ref:U,id:o,disabled:b,"aria-labelledby":M??w,"aria-invalid":i||void 0,"aria-describedby":a||c?x:void 0,onMouseDown:g,onFocus:_,onBlur:C,className:Q.cn($.TEXT_AREA_STYLES.recipe({size:R,hasError:i,hasStartIcon:I,hasEndAction:h}),k),placeholder:L,value:m,onChange:Y,onKeyDown:B,onKeyUp:N,rows:X?T??u:u,...H,style:{fontSize:V.vars.fontSize[A],...P}}),h&&e.jsx(E,{children:D})]}),(a||c)&&e.jsx(G,{id:x,hasError:i,children:a??c})]})});n.displayName="TextArea";n.Label=j;n.StartIcon=v;n.EndAction=E;module.exports=n;
 //# sourceMappingURL=TextArea.cjs.map

package/dist/components/forms/text-area/TextArea.js

@@ -1,6 +1,6 @@
 import { jsxs as R, jsx as r } from "react/jsx-runtime";
 import I from "./components/text-area-start-icon/TextAreaStartIcon.js";
-import '../../../ui-kit93.css';import '../../../ui-kit96.css';import '../../../ui-kit2.css';import '../../../ui-kit.css';/* empty css                                         */
+import '../../../ui-kit78.css';import '../../../ui-kit104.css';import '../../../ui-kit2.css';import '../../../ui-kit.css';/* empty css                                         */
 /* empty css                                             */
 /* empty css                                                                            */
 import g from "./components/text-area-end-action/TextAreaEndAction.js";

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit93.css');;/* empty css                                       */var e={root:"lf8geo0"};exports.TEXT_AREA_END_ACTION_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit78.css');;/* empty css                                       */var e={root:"lf8geo0"};exports.TEXT_AREA_END_ACTION_STYLES=e;
 //# sourceMappingURL=TextAreaEndAction.css.cjs.map

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit93.css';/* empty css                                     */
+import '../../../../../../ui-kit78.css';/* empty css                                     */
 var r = { root: "lf8geo0" };
 export {
   r as TEXT_AREA_END_ACTION_STYLES

package/dist/components/forms/text-area/components/text-area-start-icon/styles/TextAreaStartIcon.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit96.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                       */var e={root:"_1q572tr0"};exports.TEXT_AREA_START_ICON_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit104.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                       */var e={root:"_1q572tr0"};exports.TEXT_AREA_START_ICON_STYLES=e;
 //# sourceMappingURL=TextAreaStartIcon.css.cjs.map

package/dist/components/forms/text-area/components/text-area-start-icon/styles/TextAreaStartIcon.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit96.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit104.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                                      */
 /* empty css                                     */
 var T = { root: "_1q572tr0" };

package/dist/components/forms/text-area/styles/TextArea.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit77.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                              */const a=require("@vanilla-extract/recipes/createRuntimeFn");var t={recipe:a.createRuntimeFn({defaultClassName:"sqatm00",variantClassNames:{size:{sm:"sqatm01",md:"sqatm02",lg:"sqatm03"},hasError:{true:"sqatm04",false:"sqatm05"},hasStartIcon:{true:"sqatm06",false:"sqatm07"},hasEndAction:{true:"sqatm08",false:"sqatm09"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndAction:!1},compoundVariants:[[{size:"sm",hasStartIcon:!0},"sqatm0a"],[{size:"md",hasStartIcon:!0},"sqatm0b"],[{size:"lg",hasStartIcon:!0},"sqatm0c"],[{size:"sm",hasEndAction:!0},"sqatm0d"],[{size:"md",hasEndAction:!0},"sqatm0e"],[{size:"lg",hasEndAction:!0},"sqatm0f"]]})};exports.TEXT_AREA_STYLES=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit63.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                              */const a=require("@vanilla-extract/recipes/createRuntimeFn");var t={recipe:a.createRuntimeFn({defaultClassName:"sqatm00",variantClassNames:{size:{sm:"sqatm01",md:"sqatm02",lg:"sqatm03"},hasError:{true:"sqatm04",false:"sqatm05"},hasStartIcon:{true:"sqatm06",false:"sqatm07"},hasEndAction:{true:"sqatm08",false:"sqatm09"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndAction:!1},compoundVariants:[[{size:"sm",hasStartIcon:!0},"sqatm0a"],[{size:"md",hasStartIcon:!0},"sqatm0b"],[{size:"lg",hasStartIcon:!0},"sqatm0c"],[{size:"sm",hasEndAction:!0},"sqatm0d"],[{size:"md",hasEndAction:!0},"sqatm0e"],[{size:"lg",hasEndAction:!0},"sqatm0f"]]})};exports.TEXT_AREA_STYLES=t;
 //# sourceMappingURL=TextArea.css.cjs.map

package/dist/components/forms/text-area/styles/TextArea.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit77.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit63.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                            */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var m = { recipe: a({ defaultClassName: "sqatm00", variantClassNames: { size: { sm: "sqatm01", md: "sqatm02", lg: "sqatm03" }, hasError: { true: "sqatm04", false: "sqatm05" }, hasStartIcon: { true: "sqatm06", false: "sqatm07" }, hasEndAction: { true: "sqatm08", false: "sqatm09" } }, defaultVariants: { size: "md", hasError: !1, hasStartIcon: !1, hasEndAction: !1 }, compoundVariants: [[{ size: "sm", hasStartIcon: !0 }, "sqatm0a"], [{ size: "md", hasStartIcon: !0 }, "sqatm0b"], [{ size: "lg", hasStartIcon: !0 }, "sqatm0c"], [{ size: "sm", hasEndAction: !0 }, "sqatm0d"], [{ size: "md", hasEndAction: !0 }, "sqatm0e"], [{ size: "lg", hasEndAction: !0 }, "sqatm0f"]] }) };

package/dist/components/forms/text-field/TextField.cjs

@@ -1,2 +1,2 @@
-"use strict";require('../../../ui-kit88.css');require('../../../ui-kit87.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const e=require("react/jsx-runtime"),X=require("../../actions/icon-button/IconButton.cjs");require("../../actions/icon-button/styles/IconButton.css.cjs");const I=require("../_shared/components/form-label/FormLabel.cjs"),m=require("./components/text-field-start-icon/TextFieldStartIcon.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                                */const v=require("./components/text-field-end-action/TextFieldEndAction.cjs");;/* empty css                                                                                */const Y=require("./styles/TextField.css.cjs"),$=require("../_shared/components/helper-text/HelperText.cjs"),G=require("./constants/index.cjs"),J=require("./hooks/useTextfield.hook.cjs"),S=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const Q=require("../../../resources/asset/EyeIcon.svg.cjs"),V=require("../../../resources/asset/EyeOffIcon.svg.cjs"),W=require("../../../utils/cn.cjs"),Z=require("../../../theme/contract.css.cjs"),T=require("react"),r=T.memo(c=>{const{inputId:o,helperId:d,hasError:n,hasStartIcon:f,hasEndAction:u,handleMouseDown:z,handleFocus:F,handleBlur:E,resolvedType:j,isPassword:g,showPassword:i,setShowPassword:h}=J.useTextField(c),{disabled:p,startIcon:q,className:P,width:x,error:s,helperText:t,label:a,required:y,showRequiredIndicator:A=!0,endAction:_,size:D,fontSize:b="md",placeholder:L,value:B,onChange:k,onKeyDown:C,onKeyUp:N,ref:R,style:H,type:ee,"aria-labelledby":K,...M}=c,l=D??"md",w=a&&o?`${o}-label`:void 0,O=T.useCallback(()=>h(!i),[h,i]),U=g?e.jsx(X,{icon:i?V:Q,"aria-label":i?"Hide password":"Show password",variant:"ghost",color:"primary",size:G.fieldSizeToActionSize[l],type:"button",tabIndex:-1,onClick:O}):_;return e.jsxs(S,{flexDirection:"column",gap:"xs",width:"100%",alignItems:"start",style:x!==void 0?{width:x}:void 0,children:[a&&e.jsx(I,{id:w,disabled:p,required:y&&A,fontSize:b,children:a}),e.jsxs(S,{position:"relative",width:"100%",gap:"none",children:[q&&e.jsx(m,{icon:q,size:l}),e.jsx("input",{ref:R,id:o,type:j,disabled:p,required:y,"aria-labelledby":K??w,"aria-invalid":n||void 0,"aria-describedby":s||t?d:void 0,onMouseDown:z,onFocus:F,onBlur:E,className:W.cn(Y.TEXT_FIELD_STYLES.recipe({size:l,hasError:n,hasStartIcon:f,hasEndAction:u}),P),placeholder:L,value:B,onChange:k,onKeyDown:C,onKeyUp:N,...M,style:{fontSize:Z.vars.fontSize[b],...H}}),u&&e.jsx(v,{children:U})]}),(s||t)&&e.jsx($,{id:d,hasError:n,children:s??t})]})});r.displayName="TextField";r.Label=I;r.StartIcon=m;r.EndAction=v;module.exports=r;
+"use strict";require('../../../ui-kit87.css');require('../../../ui-kit99.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const e=require("react/jsx-runtime"),X=require("../../actions/icon-button/IconButton.cjs");require("../../actions/icon-button/styles/IconButton.css.cjs");const I=require("../_shared/components/form-label/FormLabel.cjs"),m=require("./components/text-field-start-icon/TextFieldStartIcon.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                                */const v=require("./components/text-field-end-action/TextFieldEndAction.cjs");;/* empty css                                                                                */const Y=require("./styles/TextField.css.cjs"),$=require("../_shared/components/helper-text/HelperText.cjs"),G=require("./constants/index.cjs"),J=require("./hooks/useTextfield.hook.cjs"),S=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const Q=require("../../../resources/asset/EyeIcon.svg.cjs"),V=require("../../../resources/asset/EyeOffIcon.svg.cjs"),W=require("../../../utils/cn.cjs"),Z=require("../../../theme/contract.css.cjs"),T=require("react"),r=T.memo(c=>{const{inputId:o,helperId:d,hasError:n,hasStartIcon:f,hasEndAction:u,handleMouseDown:z,handleFocus:F,handleBlur:E,resolvedType:j,isPassword:g,showPassword:i,setShowPassword:h}=J.useTextField(c),{disabled:p,startIcon:q,className:P,width:x,error:s,helperText:t,label:a,required:y,showRequiredIndicator:A=!0,endAction:_,size:D,fontSize:b="md",placeholder:L,value:B,onChange:k,onKeyDown:C,onKeyUp:N,ref:R,style:H,type:ee,"aria-labelledby":K,...M}=c,l=D??"md",w=a&&o?`${o}-label`:void 0,O=T.useCallback(()=>h(!i),[h,i]),U=g?e.jsx(X,{icon:i?V:Q,"aria-label":i?"Hide password":"Show password",variant:"ghost",color:"primary",size:G.fieldSizeToActionSize[l],type:"button",tabIndex:-1,onClick:O}):_;return e.jsxs(S,{flexDirection:"column",gap:"xs",width:"100%",alignItems:"start",style:x!==void 0?{width:x}:void 0,children:[a&&e.jsx(I,{id:w,disabled:p,required:y&&A,fontSize:b,children:a}),e.jsxs(S,{position:"relative",width:"100%",gap:"none",children:[q&&e.jsx(m,{icon:q,size:l}),e.jsx("input",{ref:R,id:o,type:j,disabled:p,required:y,"aria-labelledby":K??w,"aria-invalid":n||void 0,"aria-describedby":s||t?d:void 0,onMouseDown:z,onFocus:F,onBlur:E,className:W.cn(Y.TEXT_FIELD_STYLES.recipe({size:l,hasError:n,hasStartIcon:f,hasEndAction:u}),P),placeholder:L,value:B,onChange:k,onKeyDown:C,onKeyUp:N,...M,style:{fontSize:Z.vars.fontSize[b],...H}}),u&&e.jsx(v,{children:U})]}),(s||t)&&e.jsx($,{id:d,hasError:n,children:s??t})]})});r.displayName="TextField";r.Label=I;r.StartIcon=m;r.EndAction=v;module.exports=r;
 //# sourceMappingURL=TextField.cjs.map

package/dist/components/forms/text-field/TextField.js

@@ -3,7 +3,7 @@ import X from "../../actions/icon-button/IconButton.js";
 import "../../actions/icon-button/styles/IconButton.css.js";
 import x from "../_shared/components/form-label/FormLabel.js";
 import I from "./components/text-field-start-icon/TextFieldStartIcon.js";
-import '../../../ui-kit88.css';import '../../../ui-kit87.css';import '../../../ui-kit2.css';import '../../../ui-kit.css';/* empty css                                         */
+import '../../../ui-kit87.css';import '../../../ui-kit99.css';import '../../../ui-kit2.css';import '../../../ui-kit.css';/* empty css                                         */
 /* empty css                                             */
 /* empty css                                                                              */
 import T from "./components/text-field-end-action/TextFieldEndAction.js";

package/dist/components/forms/text-field/components/text-field-end-action/styles/TextFieldEndAction.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit88.css');;/* empty css                                        */var e={root:"_14iivnx0"};exports.TEXT_FIELD_END_ACTION_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit87.css');;/* empty css                                        */var e={root:"_14iivnx0"};exports.TEXT_FIELD_END_ACTION_STYLES=e;
 //# sourceMappingURL=TextFieldEndAction.css.cjs.map

package/dist/components/forms/text-field/components/text-field-end-action/styles/TextFieldEndAction.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit88.css';/* empty css                                      */
+import '../../../../../../ui-kit87.css';/* empty css                                      */
 var o = { root: "_14iivnx0" };
 export {
   o as TEXT_FIELD_END_ACTION_STYLES

package/dist/components/forms/text-field/components/text-field-start-icon/styles/TextFieldStartIcon.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit87.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                        */var e={root:"_1hy9fia0"};exports.TEXT_FIELD_START_ICON_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit99.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                        */var e={root:"_1hy9fia0"};exports.TEXT_FIELD_START_ICON_STYLES=e;
 //# sourceMappingURL=TextFieldStartIcon.css.cjs.map

package/dist/components/forms/text-field/components/text-field-start-icon/styles/TextFieldStartIcon.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit87.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit99.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                                      */
 /* empty css                                      */
 var T = { root: "_1hy9fia0" };

package/dist/components/forms/text-field/styles/TextField.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit65.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                               */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={recipe:e.createRuntimeFn({defaultClassName:"_1ugc12d0",variantClassNames:{size:{sm:"_1ugc12d1",md:"_1ugc12d2",lg:"_1ugc12d3"},hasError:{true:"_1ugc12d4",false:"_1ugc12d5"},hasStartIcon:{true:"_1ugc12d6",false:"_1ugc12d7"},hasEndAction:{true:"_1ugc12d8",false:"_1ugc12d9"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndAction:!1},compoundVariants:[[{size:"sm",hasStartIcon:!0},"_1ugc12da"],[{size:"md",hasStartIcon:!0},"_1ugc12db"],[{size:"lg",hasStartIcon:!0},"_1ugc12dc"],[{size:"sm",hasEndAction:!0},"_1ugc12dd"],[{size:"md",hasEndAction:!0},"_1ugc12de"],[{size:"lg",hasEndAction:!0},"_1ugc12df"]]})};exports.TEXT_FIELD_STYLES=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit70.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                               */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={recipe:e.createRuntimeFn({defaultClassName:"_1ugc12d0",variantClassNames:{size:{sm:"_1ugc12d1",md:"_1ugc12d2",lg:"_1ugc12d3"},hasError:{true:"_1ugc12d4",false:"_1ugc12d5"},hasStartIcon:{true:"_1ugc12d6",false:"_1ugc12d7"},hasEndAction:{true:"_1ugc12d8",false:"_1ugc12d9"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndAction:!1},compoundVariants:[[{size:"sm",hasStartIcon:!0},"_1ugc12da"],[{size:"md",hasStartIcon:!0},"_1ugc12db"],[{size:"lg",hasStartIcon:!0},"_1ugc12dc"],[{size:"sm",hasEndAction:!0},"_1ugc12dd"],[{size:"md",hasEndAction:!0},"_1ugc12de"],[{size:"lg",hasEndAction:!0},"_1ugc12df"]]})};exports.TEXT_FIELD_STYLES=a;
 //# sourceMappingURL=TextField.css.cjs.map

package/dist/components/forms/text-field/styles/TextField.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit65.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit70.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                             */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var r = { recipe: a({ defaultClassName: "_1ugc12d0", variantClassNames: { size: { sm: "_1ugc12d1", md: "_1ugc12d2", lg: "_1ugc12d3" }, hasError: { true: "_1ugc12d4", false: "_1ugc12d5" }, hasStartIcon: { true: "_1ugc12d6", false: "_1ugc12d7" }, hasEndAction: { true: "_1ugc12d8", false: "_1ugc12d9" } }, defaultVariants: { size: "md", hasError: !1, hasStartIcon: !1, hasEndAction: !1 }, compoundVariants: [[{ size: "sm", hasStartIcon: !0 }, "_1ugc12da"], [{ size: "md", hasStartIcon: !0 }, "_1ugc12db"], [{ size: "lg", hasStartIcon: !0 }, "_1ugc12dc"], [{ size: "sm", hasEndAction: !0 }, "_1ugc12dd"], [{ size: "md", hasEndAction: !0 }, "_1ugc12de"], [{ size: "lg", hasEndAction: !0 }, "_1ugc12df"]] }) };

package/dist/components/forms/time-picker/TimePicker.cjs

@@ -0,0 +1,2 @@
+"use strict";require('../../../ui-kit87.css');require('../../../ui-kit99.css');require('../../../ui-kit76.css');require('../../../ui-kit65.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const e=require("react/jsx-runtime"),Y=require("../../actions/icon-button/IconButton.cjs");require("../../actions/icon-button/styles/IconButton.css.cjs");const z=require("../text-field/TextField.cjs");require("../text-field/styles/TextField.css.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                 */;/* empty css                                                                     */;/* empty css                                                                                            */;/* empty css                                                                                            */const B=require("./components/time-picker-panel/TimePickerPanel.cjs"),q=require("./constants/index.cjs"),V=require("./hooks/useTimePicker.hook.cjs"),d=require("./styles/TimePicker.css.cjs"),a=require("../../overlay/popover/Popover.cjs");require("../../overlay/popover/components/content/styles/PopoverContent.css.cjs");const G=require("../../../resources/asset/ClockIcon.svg.cjs"),J=require("../../../utils/cn.cjs"),n=require("react"),h=n.memo(({value:T,defaultValue:m,onChange:C,defaultPanelTime:t,minTime:i,maxTime:o,hourStep:S=q.DEFAULT_HOUR_STEP,minuteStep:b=q.DEFAULT_MINUTE_STEP,showNowButton:k=!1,clearable:E=!1,nowLabel:g="Now",clearLabel:I="Clear",id:P,disabled:l,"aria-label":_,"aria-labelledby":x,panelAriaLabel:y="Time",hoursAriaLabel:M="Hours",minutesAriaLabel:N="Minutes",triggerAriaLabel:f="Open time picker",onKeyDown:s,...c})=>{const{selectedTime:j,inputValue:w,open:D,inputId:R,handleInputChange:F,handleInputKeyDown:u,handleHourSelect:H,handleMinuteSelect:K,handleNowSelect:L,handleClear:O,setOpen:U}=V.useTimePicker({value:T,defaultValue:m,onChange:C,id:P,defaultPanelTime:t,minTime:i,maxTime:o}),p=n.useRef(null),v=n.useCallback(r=>{u(r),s?.(r)},[u,s]),A=n.useCallback(r=>{r.preventDefault()},[]);return e.jsxs(a,{open:D,onOpenChange:U,children:[e.jsx(z,{...c,ref:p,id:R,type:"time",min:i,max:o,disabled:l,value:w,onChange:F,onKeyDown:v,className:J.cn(d.TIME_PICKER_STYLES.input,c.className),"aria-label":_,"aria-labelledby":x,"aria-haspopup":"dialog",endAction:e.jsx(a.Trigger,{children:e.jsx(Y,{icon:G,"aria-label":f,variant:"ghost",color:"primary",size:"sm",type:"button",disabled:l,onMouseDown:A})})}),e.jsx(a.Content,{side:"bottom",align:"end",className:d.TIME_PICKER_STYLES.content,"aria-label":y,initialFocus:!1,finalFocus:p,children:e.jsx(B,{selectedTime:j,defaultPanelTime:t,minTime:i,maxTime:o,hourStep:S,minuteStep:b,hoursAriaLabel:M,minutesAriaLabel:N,showNowButton:k,clearable:E,nowLabel:g,clearLabel:I,onHourSelect:H,onMinuteSelect:K,onNowSelect:L,onClear:O})})]})});h.displayName="TimePicker";module.exports=h;
+//# sourceMappingURL=TimePicker.cjs.map

package/dist/components/forms/time-picker/TimePicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.cjs","sources":["../../../../src/components/forms/time-picker/TimePicker.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\nimport { TextField } from '@components/forms/text-field'\nimport TimePickerPanel from '@components/forms/time-picker/components/time-picker-panel/TimePickerPanel.tsx'\nimport { DEFAULT_HOUR_STEP, DEFAULT_MINUTE_STEP } from '@components/forms/time-picker/constants'\nimport { useTimePicker } from '@components/forms/time-picker/hooks/useTimePicker.hook.ts'\nimport { TIME_PICKER_STYLES } from '@components/forms/time-picker/styles/TimePicker.css.ts'\nimport type { TimePickerProps } from '@components/forms/time-picker/types/TimePicker.props.ts'\nimport { Popover } from '@components/overlay/popover'\nimport ClockIcon from '@resources/asset/ClockIcon.svg?react'\nimport { cn } from '@utils/cn.ts'\nimport { memo, useCallback, useRef } from 'react'\n\n/**\n * A time picker that combines a native `type=\"time\"` text field with a popover\n * listing hours and minutes.\n *\n * - Typing a valid `HH:mm` time updates the popover and calls `onChange`.\n * - Choosing an hour updates the input; choosing a minute also closes the popover.\n * - Incomplete typed values are kept in the input but do not update the selected\n *   time until they become valid.\n * - Closing the popover returns focus to the input.\n *\n * @example\n * ```tsx\n * const [time, setTime] = useState<string | undefined>()\n * <TimePicker label=\"Start time\" value={time} onChange={setTime} />\n * ```\n */\nconst TimePicker = memo(\n    ({\n        value,\n        defaultValue,\n        onChange,\n        defaultPanelTime,\n        minTime,\n        maxTime,\n        hourStep = DEFAULT_HOUR_STEP,\n        minuteStep = DEFAULT_MINUTE_STEP,\n        showNowButton = false,\n        clearable = false,\n        nowLabel = 'Now',\n        clearLabel = 'Clear',\n        id,\n        disabled,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        panelAriaLabel = 'Time',\n        hoursAriaLabel = 'Hours',\n        minutesAriaLabel = 'Minutes',\n        triggerAriaLabel = 'Open time picker',\n        onKeyDown,\n        ...textFieldProps\n    }: TimePickerProps) => {\n        const {\n            selectedTime,\n            inputValue,\n            open,\n            inputId,\n            handleInputChange,\n            handleInputKeyDown,\n            handleHourSelect,\n            handleMinuteSelect,\n            handleNowSelect,\n            handleClear,\n            setOpen,\n        } = useTimePicker({\n            value,\n            defaultValue,\n            onChange,\n            id,\n            defaultPanelTime,\n            minTime,\n            maxTime,\n        })\n\n        const inputRef = useRef<HTMLInputElement>(null)\n\n        const handleKeyDown = useCallback(\n            (event: React.KeyboardEvent<HTMLInputElement>) => {\n                handleInputKeyDown(event)\n                onKeyDown?.(event)\n            },\n            [handleInputKeyDown, onKeyDown],\n        )\n\n        const handleTriggerMouseDown = useCallback(\n            (event: React.MouseEvent<HTMLButtonElement>) => {\n                event.preventDefault()\n            },\n            [],\n        )\n\n        return (\n            <Popover\n                open={open}\n                onOpenChange={setOpen}\n            >\n                <TextField\n                    {...textFieldProps}\n                    ref={inputRef}\n                    id={inputId}\n                    type={'time'}\n                    min={minTime}\n                    max={maxTime}\n                    disabled={disabled}\n                    value={inputValue}\n                    onChange={handleInputChange}\n                    onKeyDown={handleKeyDown}\n                    className={cn(TIME_PICKER_STYLES.input, textFieldProps.className)}\n                    aria-label={ariaLabel}\n                    aria-labelledby={ariaLabelledBy}\n                    aria-haspopup={'dialog'}\n                    endAction={\n                        <Popover.Trigger>\n                            <IconButton\n                                icon={ClockIcon}\n                                aria-label={triggerAriaLabel}\n                                variant={'ghost'}\n                                color={'primary'}\n                                size={'sm'}\n                                type={'button'}\n                                disabled={disabled}\n                                onMouseDown={handleTriggerMouseDown}\n                            />\n                        </Popover.Trigger>\n                    }\n                />\n\n                <Popover.Content\n                    side={'bottom'}\n                    align={'end'}\n                    className={TIME_PICKER_STYLES.content}\n                    aria-label={panelAriaLabel}\n                    initialFocus={false}\n                    finalFocus={inputRef}\n                >\n                    <TimePickerPanel\n                        selectedTime={selectedTime}\n                        defaultPanelTime={defaultPanelTime}\n                        minTime={minTime}\n                        maxTime={maxTime}\n                        hourStep={hourStep}\n                        minuteStep={minuteStep}\n                        hoursAriaLabel={hoursAriaLabel}\n                        minutesAriaLabel={minutesAriaLabel}\n                        showNowButton={showNowButton}\n                        clearable={clearable}\n                        nowLabel={nowLabel}\n                        clearLabel={clearLabel}\n                        onHourSelect={handleHourSelect}\n                        onMinuteSelect={handleMinuteSelect}\n                        onNowSelect={handleNowSelect}\n                        onClear={handleClear}\n                    />\n                </Popover.Content>\n            </Popover>\n        )\n    },\n)\n\nTimePicker.displayName = 'TimePicker'\n\nexport default TimePicker\n"],"names":["TimePicker","memo","value","defaultValue","onChange","defaultPanelTime","minTime","maxTime","hourStep","DEFAULT_HOUR_STEP","minuteStep","DEFAULT_MINUTE_STEP","showNowButton","clearable","nowLabel","clearLabel","id","disabled","ariaLabel","ariaLabelledBy","panelAriaLabel","hoursAriaLabel","minutesAriaLabel","triggerAriaLabel","onKeyDown","textFieldProps","selectedTime","inputValue","open","inputId","handleInputChange","handleInputKeyDown","handleHourSelect","handleMinuteSelect","handleNowSelect","handleClear","setOpen","useTimePicker","inputRef","useRef","handleKeyDown","useCallback","event","handleTriggerMouseDown","jsxs","Popover","jsx","TextField","cn","TIME_PICKER_STYLES","IconButton","ClockIcon","TimePickerPanel"],"mappings":"6qCA4BMA,EAAaC,EAAAA,KACf,CAAC,CACG,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,iBAAAC,EACA,QAAAC,EACA,QAAAC,EACA,SAAAC,EAAWC,EAAAA,kBACX,WAAAC,EAAaC,EAAAA,oBACb,cAAAC,EAAgB,GAChB,UAAAC,EAAY,GACZ,SAAAC,EAAW,MACX,WAAAC,EAAa,QACb,GAAAC,EACA,SAAAC,EACA,aAAcC,EACd,kBAAmBC,EACnB,eAAAC,EAAiB,OACjB,eAAAC,EAAiB,QACjB,iBAAAC,EAAmB,UACnB,iBAAAC,EAAmB,mBACnB,UAAAC,EACA,GAAGC,CAAA,IACgB,CACnB,KAAM,CACF,aAAAC,EACA,WAAAC,EACA,KAAAC,EACA,QAAAC,EACA,kBAAAC,EACA,mBAAAC,EACA,iBAAAC,EACA,mBAAAC,EACA,gBAAAC,EACA,YAAAC,EACA,QAAAC,CAAA,EACAC,gBAAc,CACd,MAAAnC,EACA,aAAAC,EACA,SAAAC,EACA,GAAAY,EACA,iBAAAX,EACA,QAAAC,EACA,QAAAC,CAAA,CACH,EAEK+B,EAAWC,EAAAA,OAAyB,IAAI,EAExCC,EAAgBC,EAAAA,YACjBC,GAAiD,CAC9CX,EAAmBW,CAAK,EACxBlB,IAAYkB,CAAK,CACrB,EACA,CAACX,EAAoBP,CAAS,CAAA,EAG5BmB,EAAyBF,EAAAA,YAC1BC,GAA+C,CAC5CA,EAAM,eAAA,CACV,EACA,CAAA,CAAC,EAGL,OACIE,EAAAA,KAACC,EAAA,CACG,KAAAjB,EACA,aAAcQ,EAEd,SAAA,CAAAU,EAAAA,IAACC,EAAA,CACI,GAAGtB,EACJ,IAAKa,EACL,GAAIT,EACJ,KAAM,OACN,IAAKvB,EACL,IAAKC,EACL,SAAAU,EACA,MAAOU,EACP,SAAUG,EACV,UAAWU,EACX,UAAWQ,EAAAA,GAAGC,EAAAA,mBAAmB,MAAOxB,EAAe,SAAS,EAChE,aAAYP,EACZ,kBAAiBC,EACjB,gBAAe,SACf,UACI2B,EAAAA,IAACD,EAAQ,QAAR,CACG,SAAAC,EAAAA,IAACI,EAAA,CACG,KAAMC,EACN,aAAY5B,EACZ,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,SACN,SAAAN,EACA,YAAa0B,CAAA,CAAA,CACjB,CACJ,CAAA,CAAA,EAIRG,EAAAA,IAACD,EAAQ,QAAR,CACG,KAAM,SACN,MAAO,MACP,UAAWI,EAAAA,mBAAmB,QAC9B,aAAY7B,EACZ,aAAc,GACd,WAAYkB,EAEZ,SAAAQ,EAAAA,IAACM,EAAA,CACG,aAAA1B,EACA,iBAAArB,EACA,QAAAC,EACA,QAAAC,EACA,SAAAC,EACA,WAAAE,EACA,eAAAW,EACA,iBAAAC,EACA,cAAAV,EACA,UAAAC,EACA,SAAAC,EACA,WAAAC,EACA,aAAciB,EACd,eAAgBC,EAChB,YAAaC,EACb,QAASC,CAAA,CAAA,CACb,CAAA,CACJ,CAAA,CAAA,CAGZ,CACJ,EAEAnC,EAAW,YAAc"}

package/dist/components/forms/time-picker/TimePicker.d.ts

@@ -0,0 +1,20 @@
+import { TimePickerProps } from './types/TimePicker.props.ts';
+import { MemoExoticComponent } from 'react';
+/**
+ * A time picker that combines a native `type="time"` text field with a popover
+ * listing hours and minutes.
+ *
+ * - Typing a valid `HH:mm` time updates the popover and calls `onChange`.
+ * - Choosing an hour updates the input; choosing a minute also closes the popover.
+ * - Incomplete typed values are kept in the input but do not update the selected
+ *   time until they become valid.
+ * - Closing the popover returns focus to the input.
+ *
+ * @example
+ * ```tsx
+ * const [time, setTime] = useState<string | undefined>()
+ * <TimePicker label="Start time" value={time} onChange={setTime} />
+ * ```
+ */
+declare const TimePicker: MemoExoticComponent<({ value, defaultValue, onChange, defaultPanelTime, minTime, maxTime, hourStep, minuteStep, showNowButton, clearable, nowLabel, clearLabel, id, disabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, panelAriaLabel, hoursAriaLabel, minutesAriaLabel, triggerAriaLabel, onKeyDown, ...textFieldProps }: TimePickerProps) => import("react").JSX.Element>;
+export default TimePicker;

package/dist/components/forms/time-picker/TimePicker.js

@@ -0,0 +1,156 @@
+import { jsxs as x, jsx as e } from "react/jsx-runtime";
+import z from "../../actions/icon-button/IconButton.js";
+import "../../actions/icon-button/styles/IconButton.css.js";
+import B from "../text-field/TextField.js";
+import "../text-field/styles/TextField.css.js";
+import '../../../ui-kit87.css';import '../../../ui-kit99.css';import '../../../ui-kit76.css';import '../../../ui-kit65.css';import '../../../ui-kit2.css';import '../../../ui-kit.css';/* empty css                                         */
+/* empty css                                             */
+/* empty css                                                               */
+/* empty css                                                                   */
+/* empty css                                                                                          */
+/* empty css                                                                                          */
+import V from "./components/time-picker-panel/TimePickerPanel.js";
+import { DEFAULT_MINUTE_STEP as Y, DEFAULT_HOUR_STEP as q } from "./constants/index.js";
+import { useTimePicker as G } from "./hooks/useTimePicker.hook.js";
+import { TIME_PICKER_STYLES as s } from "./styles/TimePicker.css.js";
+import n from "../../overlay/popover/Popover.js";
+import "../../overlay/popover/components/content/styles/PopoverContent.css.js";
+import J from "../../../resources/asset/ClockIcon.svg.js";
+import { cn as Q } from "../../../utils/cn.js";
+import { memo as W, useRef as X, useCallback as u } from "react";
+const Z = W(
+  ({
+    value: d,
+    defaultValue: f,
+    onChange: h,
+    defaultPanelTime: i,
+    minTime: r,
+    maxTime: t,
+    hourStep: g = q,
+    minuteStep: S = Y,
+    showNowButton: T = !1,
+    clearable: b = !1,
+    nowLabel: C = "Now",
+    clearLabel: y = "Clear",
+    id: E,
+    disabled: a,
+    "aria-label": I,
+    "aria-labelledby": N,
+    panelAriaLabel: k = "Time",
+    hoursAriaLabel: w = "Hours",
+    minutesAriaLabel: D = "Minutes",
+    triggerAriaLabel: M = "Open time picker",
+    onKeyDown: l,
+    ...m
+  }) => {
+    const {
+      selectedTime: P,
+      inputValue: _,
+      open: v,
+      inputId: F,
+      handleInputChange: H,
+      handleInputKeyDown: p,
+      handleHourSelect: O,
+      handleMinuteSelect: R,
+      handleNowSelect: U,
+      handleClear: A,
+      setOpen: K
+    } = G({
+      value: d,
+      defaultValue: f,
+      onChange: h,
+      id: E,
+      defaultPanelTime: i,
+      minTime: r,
+      maxTime: t
+    }), c = X(null), L = u(
+      (o) => {
+        p(o), l?.(o);
+      },
+      [p, l]
+    ), j = u(
+      (o) => {
+        o.preventDefault();
+      },
+      []
+    );
+    return /* @__PURE__ */ x(
+      n,
+      {
+        open: v,
+        onOpenChange: K,
+        children: [
+          /* @__PURE__ */ e(
+            B,
+            {
+              ...m,
+              ref: c,
+              id: F,
+              type: "time",
+              min: r,
+              max: t,
+              disabled: a,
+              value: _,
+              onChange: H,
+              onKeyDown: L,
+              className: Q(s.input, m.className),
+              "aria-label": I,
+              "aria-labelledby": N,
+              "aria-haspopup": "dialog",
+              endAction: /* @__PURE__ */ e(n.Trigger, { children: /* @__PURE__ */ e(
+                z,
+                {
+                  icon: J,
+                  "aria-label": M,
+                  variant: "ghost",
+                  color: "primary",
+                  size: "sm",
+                  type: "button",
+                  disabled: a,
+                  onMouseDown: j
+                }
+              ) })
+            }
+          ),
+          /* @__PURE__ */ e(
+            n.Content,
+            {
+              side: "bottom",
+              align: "end",
+              className: s.content,
+              "aria-label": k,
+              initialFocus: !1,
+              finalFocus: c,
+              children: /* @__PURE__ */ e(
+                V,
+                {
+                  selectedTime: P,
+                  defaultPanelTime: i,
+                  minTime: r,
+                  maxTime: t,
+                  hourStep: g,
+                  minuteStep: S,
+                  hoursAriaLabel: w,
+                  minutesAriaLabel: D,
+                  showNowButton: T,
+                  clearable: b,
+                  nowLabel: C,
+                  clearLabel: y,
+                  onHourSelect: O,
+                  onMinuteSelect: R,
+                  onNowSelect: U,
+                  onClear: A
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Z.displayName = "TimePicker";
+export {
+  Z as default
+};
+//# sourceMappingURL=TimePicker.js.map

package/dist/components/forms/time-picker/TimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.js","sources":["../../../../src/components/forms/time-picker/TimePicker.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\nimport { TextField } from '@components/forms/text-field'\nimport TimePickerPanel from '@components/forms/time-picker/components/time-picker-panel/TimePickerPanel.tsx'\nimport { DEFAULT_HOUR_STEP, DEFAULT_MINUTE_STEP } from '@components/forms/time-picker/constants'\nimport { useTimePicker } from '@components/forms/time-picker/hooks/useTimePicker.hook.ts'\nimport { TIME_PICKER_STYLES } from '@components/forms/time-picker/styles/TimePicker.css.ts'\nimport type { TimePickerProps } from '@components/forms/time-picker/types/TimePicker.props.ts'\nimport { Popover } from '@components/overlay/popover'\nimport ClockIcon from '@resources/asset/ClockIcon.svg?react'\nimport { cn } from '@utils/cn.ts'\nimport { memo, useCallback, useRef } from 'react'\n\n/**\n * A time picker that combines a native `type=\"time\"` text field with a popover\n * listing hours and minutes.\n *\n * - Typing a valid `HH:mm` time updates the popover and calls `onChange`.\n * - Choosing an hour updates the input; choosing a minute also closes the popover.\n * - Incomplete typed values are kept in the input but do not update the selected\n *   time until they become valid.\n * - Closing the popover returns focus to the input.\n *\n * @example\n * ```tsx\n * const [time, setTime] = useState<string | undefined>()\n * <TimePicker label=\"Start time\" value={time} onChange={setTime} />\n * ```\n */\nconst TimePicker = memo(\n    ({\n        value,\n        defaultValue,\n        onChange,\n        defaultPanelTime,\n        minTime,\n        maxTime,\n        hourStep = DEFAULT_HOUR_STEP,\n        minuteStep = DEFAULT_MINUTE_STEP,\n        showNowButton = false,\n        clearable = false,\n        nowLabel = 'Now',\n        clearLabel = 'Clear',\n        id,\n        disabled,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        panelAriaLabel = 'Time',\n        hoursAriaLabel = 'Hours',\n        minutesAriaLabel = 'Minutes',\n        triggerAriaLabel = 'Open time picker',\n        onKeyDown,\n        ...textFieldProps\n    }: TimePickerProps) => {\n        const {\n            selectedTime,\n            inputValue,\n            open,\n            inputId,\n            handleInputChange,\n            handleInputKeyDown,\n            handleHourSelect,\n            handleMinuteSelect,\n            handleNowSelect,\n            handleClear,\n            setOpen,\n        } = useTimePicker({\n            value,\n            defaultValue,\n            onChange,\n            id,\n            defaultPanelTime,\n            minTime,\n            maxTime,\n        })\n\n        const inputRef = useRef<HTMLInputElement>(null)\n\n        const handleKeyDown = useCallback(\n            (event: React.KeyboardEvent<HTMLInputElement>) => {\n                handleInputKeyDown(event)\n                onKeyDown?.(event)\n            },\n            [handleInputKeyDown, onKeyDown],\n        )\n\n        const handleTriggerMouseDown = useCallback(\n            (event: React.MouseEvent<HTMLButtonElement>) => {\n                event.preventDefault()\n            },\n            [],\n        )\n\n        return (\n            <Popover\n                open={open}\n                onOpenChange={setOpen}\n            >\n                <TextField\n                    {...textFieldProps}\n                    ref={inputRef}\n                    id={inputId}\n                    type={'time'}\n                    min={minTime}\n                    max={maxTime}\n                    disabled={disabled}\n                    value={inputValue}\n                    onChange={handleInputChange}\n                    onKeyDown={handleKeyDown}\n                    className={cn(TIME_PICKER_STYLES.input, textFieldProps.className)}\n                    aria-label={ariaLabel}\n                    aria-labelledby={ariaLabelledBy}\n                    aria-haspopup={'dialog'}\n                    endAction={\n                        <Popover.Trigger>\n                            <IconButton\n                                icon={ClockIcon}\n                                aria-label={triggerAriaLabel}\n                                variant={'ghost'}\n                                color={'primary'}\n                                size={'sm'}\n                                type={'button'}\n                                disabled={disabled}\n                                onMouseDown={handleTriggerMouseDown}\n                            />\n                        </Popover.Trigger>\n                    }\n                />\n\n                <Popover.Content\n                    side={'bottom'}\n                    align={'end'}\n                    className={TIME_PICKER_STYLES.content}\n                    aria-label={panelAriaLabel}\n                    initialFocus={false}\n                    finalFocus={inputRef}\n                >\n                    <TimePickerPanel\n                        selectedTime={selectedTime}\n                        defaultPanelTime={defaultPanelTime}\n                        minTime={minTime}\n                        maxTime={maxTime}\n                        hourStep={hourStep}\n                        minuteStep={minuteStep}\n                        hoursAriaLabel={hoursAriaLabel}\n                        minutesAriaLabel={minutesAriaLabel}\n                        showNowButton={showNowButton}\n                        clearable={clearable}\n                        nowLabel={nowLabel}\n                        clearLabel={clearLabel}\n                        onHourSelect={handleHourSelect}\n                        onMinuteSelect={handleMinuteSelect}\n                        onNowSelect={handleNowSelect}\n                        onClear={handleClear}\n                    />\n                </Popover.Content>\n            </Popover>\n        )\n    },\n)\n\nTimePicker.displayName = 'TimePicker'\n\nexport default TimePicker\n"],"names":["TimePicker","memo","value","defaultValue","onChange","defaultPanelTime","minTime","maxTime","hourStep","DEFAULT_HOUR_STEP","minuteStep","DEFAULT_MINUTE_STEP","showNowButton","clearable","nowLabel","clearLabel","id","disabled","ariaLabel","ariaLabelledBy","panelAriaLabel","hoursAriaLabel","minutesAriaLabel","triggerAriaLabel","onKeyDown","textFieldProps","selectedTime","inputValue","open","inputId","handleInputChange","handleInputKeyDown","handleHourSelect","handleMinuteSelect","handleNowSelect","handleClear","setOpen","useTimePicker","inputRef","useRef","handleKeyDown","useCallback","event","handleTriggerMouseDown","jsxs","Popover","jsx","TextField","cn","TIME_PICKER_STYLES","IconButton","ClockIcon","TimePickerPanel"],"mappings":"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"}

package/dist/components/forms/time-picker/components/time-picker-panel/TimePickerPanel.cjs

@@ -0,0 +1,2 @@
+"use strict";const s=require("react/jsx-runtime"),n=require("react"),p=require("../../../../actions/button/Button.cjs");require("../../../../actions/button/styles/Button.css.cjs");const t=require("./styles/TimePickerPanel.css.cjs"),r=require("../../utils/timePicker.utils.cjs"),m=n.memo(({selectedTime:L,defaultPanelTime:R,minTime:i,maxTime:l,hourStep:_,minuteStep:u,hoursAriaLabel:d,minutesAriaLabel:P,showNowButton:T,clearable:I,nowLabel:j,clearLabel:f,onHourSelect:x,onMinuteSelect:C,onNowSelect:h,onClear:M})=>{const o=r.splitTime(L),a=o??r.splitTime(R),E=a?.hour,g=n.useMemo(()=>r.getHourOptions(_).filter(e=>r.isTimeInRange(`${e}:59`,i,void 0)&&r.isTimeInRange(`${e}:00`,void 0,l)),[_,i,l]),v=n.useMemo(()=>r.getMinuteOptions(u).filter(e=>E===void 0||r.isTimeInRange(`${E}:${e}`,i,l)),[u,E,i,l]),N=n.useRef(null);n.useEffect(()=>{N.current?.querySelectorAll('[aria-pressed="true"], [data-reference="true"]').forEach(e=>{const c=e.parentElement?.parentElement;c&&(c.scrollTop=e.offsetTop-c.clientHeight/2+e.clientHeight/2)})},[]);const S=(e,c)=>({"aria-pressed":e,"data-reference":!o&&c?!0:void 0});return s.jsxs("div",{ref:N,className:t.TIME_PICKER_PANEL_STYLES.root,children:[s.jsxs("div",{className:t.TIME_PICKER_PANEL_STYLES.body,children:[s.jsxs("div",{className:t.TIME_PICKER_PANEL_STYLES.group,children:[s.jsx("p",{className:t.TIME_PICKER_PANEL_STYLES.title,children:d}),s.jsx("ul",{"aria-label":d,className:t.TIME_PICKER_PANEL_STYLES.column,children:g.map(e=>s.jsx("li",{children:s.jsx("button",{type:"button",...S(o?.hour===e,a?.hour===e),className:t.TIME_PICKER_PANEL_STYLES.item,onClick:()=>x(e),children:e})},e))})]}),s.jsxs("div",{className:t.TIME_PICKER_PANEL_STYLES.group,children:[s.jsx("p",{className:t.TIME_PICKER_PANEL_STYLES.title,children:P}),s.jsx("ul",{"aria-label":P,className:t.TIME_PICKER_PANEL_STYLES.column,children:v.map(e=>s.jsx("li",{children:s.jsx("button",{type:"button",...S(o?.minute===e,a?.minute===e),className:t.TIME_PICKER_PANEL_STYLES.item,onClick:()=>C(e),children:e})},e))})]})]}),(T||I)&&s.jsxs("div",{className:t.TIME_PICKER_PANEL_STYLES.footer,children:[I?s.jsx(p,{label:f,variant:"ghost",size:"sm",type:"button",onClick:M}):s.jsx("span",{}),T&&s.jsx(p,{label:j,variant:"ghost",size:"sm",type:"button",onClick:h})]})]})});m.displayName="TimePickerPanel";module.exports=m;
+//# sourceMappingURL=TimePickerPanel.cjs.map

package/dist/components/forms/time-picker/components/time-picker-panel/TimePickerPanel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePickerPanel.cjs","sources":["../../../../../../src/components/forms/time-picker/components/time-picker-panel/TimePickerPanel.tsx"],"sourcesContent":["import { memo, useEffect, useMemo, useRef } from 'react'\r\n\r\nimport { Button } from '@components/actions/button'\r\nimport { TIME_PICKER_PANEL_STYLES } from '@components/forms/time-picker/components/time-picker-panel/styles/TimePickerPanel.css.ts'\r\nimport type { TimePickerPanelProps } from '@components/forms/time-picker/components/time-picker-panel/types/TimePickerPanel.props.ts'\r\nimport {\r\n    getHourOptions,\r\n    getMinuteOptions,\r\n    isTimeInRange,\r\n    splitTime,\r\n} from '@components/forms/time-picker/utils/timePicker.utils.ts'\r\n\r\n/**\r\n * Two scrollable lists, hours and minutes, used inside the TimePicker popover.\r\n * Options outside the allowed range are not listed. The selected values, or the\r\n * default panel time, are scrolled into view on mount.\r\n */\r\nconst TimePickerPanel = memo(\r\n    ({\r\n        selectedTime,\r\n        defaultPanelTime,\r\n        minTime,\r\n        maxTime,\r\n        hourStep,\r\n        minuteStep,\r\n        hoursAriaLabel,\r\n        minutesAriaLabel,\r\n        showNowButton,\r\n        clearable,\r\n        nowLabel,\r\n        clearLabel,\r\n        onHourSelect,\r\n        onMinuteSelect,\r\n        onNowSelect,\r\n        onClear,\r\n    }: TimePickerPanelProps) => {\r\n        const selected = splitTime(selectedTime)\r\n        const reference = selected ?? splitTime(defaultPanelTime)\r\n        const referenceHour = reference?.hour\r\n        const hours = useMemo(\r\n            () => getHourOptions(hourStep).filter(\r\n                hour => isTimeInRange(`${hour}:59`, minTime, undefined)\r\n                    && isTimeInRange(`${hour}:00`, undefined, maxTime),\r\n            ),\r\n            [hourStep, minTime, maxTime],\r\n        )\r\n        const minutes = useMemo(\r\n            () => getMinuteOptions(minuteStep).filter(\r\n                minute => referenceHour === undefined\r\n                    || isTimeInRange(`${referenceHour}:${minute}`, minTime, maxTime),\r\n            ),\r\n            [minuteStep, referenceHour, minTime, maxTime],\r\n        )\r\n        const rootRef = useRef<HTMLDivElement>(null)\r\n\r\n        useEffect(() => {\r\n            rootRef.current\r\n                ?.querySelectorAll<HTMLElement>('[aria-pressed=\"true\"], [data-reference=\"true\"]')\r\n                .forEach((item) => {\r\n                    const column = item.parentElement?.parentElement\r\n                    if (column) {\r\n                        column.scrollTop = item.offsetTop - column.clientHeight / 2 + item.clientHeight / 2\r\n                    }\r\n                })\r\n        }, [])\r\n\r\n        const getState = (isSelected: boolean, isReference: boolean) => ({\r\n            'aria-pressed': isSelected,\r\n            'data-reference': !selected && isReference ? true : undefined,\r\n        })\r\n\r\n        return (\r\n            <div\r\n                ref={rootRef}\r\n                className={TIME_PICKER_PANEL_STYLES.root}\r\n            >\r\n                <div className={TIME_PICKER_PANEL_STYLES.body}>\r\n                    <div className={TIME_PICKER_PANEL_STYLES.group}>\r\n                        <p className={TIME_PICKER_PANEL_STYLES.title}>{hoursAriaLabel}</p>\r\n                        <ul\r\n                            aria-label={hoursAriaLabel}\r\n                            className={TIME_PICKER_PANEL_STYLES.column}\r\n                        >\r\n                            {hours.map((hour) => (\r\n                                <li key={hour}>\r\n                                    <button\r\n                                        type={'button'}\r\n                                        {...getState(selected?.hour === hour, reference?.hour === hour)}\r\n                                        className={TIME_PICKER_PANEL_STYLES.item}\r\n                                        onClick={() => onHourSelect(hour)}\r\n                                    >\r\n                                        {hour}\r\n                                    </button>\r\n                                </li>\r\n                            ))}\r\n                        </ul>\r\n                    </div>\r\n                    <div className={TIME_PICKER_PANEL_STYLES.group}>\r\n                        <p className={TIME_PICKER_PANEL_STYLES.title}>{minutesAriaLabel}</p>\r\n                        <ul\r\n                            aria-label={minutesAriaLabel}\r\n                            className={TIME_PICKER_PANEL_STYLES.column}\r\n                        >\r\n                            {minutes.map((minute) => (\r\n                                <li key={minute}>\r\n                                    <button\r\n                                        type={'button'}\r\n                                        {...getState(selected?.minute === minute, reference?.minute === minute)}\r\n                                        className={TIME_PICKER_PANEL_STYLES.item}\r\n                                        onClick={() => onMinuteSelect(minute)}\r\n                                    >\r\n                                        {minute}\r\n                                    </button>\r\n                                </li>\r\n                            ))}\r\n                        </ul>\r\n                    </div>\r\n                </div>\r\n                {(showNowButton || clearable) && (\r\n                    <div className={TIME_PICKER_PANEL_STYLES.footer}>\r\n                        {clearable\r\n                            ? (\r\n                                <Button\r\n                                    label={clearLabel}\r\n                                    variant={'ghost'}\r\n                                    size={'sm'}\r\n                                    type={'button'}\r\n                                    onClick={onClear}\r\n                                />\r\n                            )\r\n                            : <span />}\r\n                        {showNowButton && (\r\n                            <Button\r\n                                label={nowLabel}\r\n                                variant={'ghost'}\r\n                                size={'sm'}\r\n                                type={'button'}\r\n                                onClick={onNowSelect}\r\n                            />\r\n                        )}\r\n                    </div>\r\n                )}\r\n            </div>\r\n        )\r\n    },\r\n)\r\n\r\nTimePickerPanel.displayName = 'TimePickerPanel'\r\n\r\nexport default TimePickerPanel\r\n"],"names":["TimePickerPanel","memo","selectedTime","defaultPanelTime","minTime","maxTime","hourStep","minuteStep","hoursAriaLabel","minutesAriaLabel","showNowButton","clearable","nowLabel","clearLabel","onHourSelect","onMinuteSelect","onNowSelect","onClear","selected","splitTime","reference","referenceHour","hours","useMemo","getHourOptions","hour","isTimeInRange","minutes","getMinuteOptions","minute","rootRef","useRef","useEffect","item","column","getState","isSelected","isReference","jsxs","TIME_PICKER_PANEL_STYLES","jsx","Button"],"mappings":"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"}

package/dist/components/forms/time-picker/components/time-picker-panel/TimePickerPanel.d.ts

@@ -0,0 +1,9 @@
+import { TimePickerPanelProps } from './types/TimePickerPanel.props.ts';
+import { MemoExoticComponent } from 'react';
+/**
+ * Two scrollable lists, hours and minutes, used inside the TimePicker popover.
+ * Options outside the allowed range are not listed. The selected values, or the
+ * default panel time, are scrolled into view on mount.
+ */
+declare const TimePickerPanel: MemoExoticComponent<({ selectedTime, defaultPanelTime, minTime, maxTime, hourStep, minuteStep, hoursAriaLabel, minutesAriaLabel, showNowButton, clearable, nowLabel, clearLabel, onHourSelect, onMinuteSelect, onNowSelect, onClear, }: TimePickerPanelProps) => import("react").JSX.Element>;
+export default TimePickerPanel;