@progress/kendo-react-dateinputs 7.4.0-develop.9 → 7.5.0-develop.1

package/messages/index.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="multiviewcalendar.prevView",t="multiviewcalendar.nextView",a="dateinput.increment",c="dateinput.decrement",i="calendar.today",r="datepicker.toggleCalendar",n="daterangepicker.swapStartEnd",o="daterangepicker.start",l="daterangepicker.end",s="daterangepicker.separator",d="datetimepicker.toggleDateTimeSelector",g="timepicker.now",m="timepicker.selectNow",k="timepicker.cancel",p="timepicker.set",S="timepicker.toggleTimeSelector",w="timepicker.toggleClock",T="datetimepicker.date",u="datetimepicker.time",C="datetimepicker.cancel",v="datetimepicker.set",P="daterangepicker.cancel",V="daterangepicker.set",N={[i]:"TODAY",[g]:"NOW",[p]:"Set",[k]:"Cancel",[T]:"Date",[u]:"Time",[C]:"Cancel",[v]:"Set",[P]:"Cancel",[V]:"Set",[o]:"Start",[l]:"End",[s]:" ",[m]:"Select Now",[S]:"Toggle TimeSelector",[w]:"Toggle Clock",[a]:"Increase value",[c]:"Decrease value",[r]:"Toggle calendar",[e]:"Navigate to previous view",[t]:"Navigate to next view",[n]:"Swap start and end values",[d]:"Toggle date-time selector"};exports.date=T;exports.dateRangePickerCancel=P;exports.dateRangePickerSet=V;exports.dateTimePickerCancel=C;exports.dateTimePickerSet=v;exports.decreaseValue=c;exports.end=l;exports.increaseValue=a;exports.messages=N;exports.nextView=t;exports.now=g;exports.prevView=e;exports.selectNow=m;exports.separator=s;exports.start=o;exports.swapStartEnd=n;exports.time=u;exports.timePickerCancel=k;exports.timePickerSet=p;exports.today=i;exports.toggleCalendar=r;exports.toggleClock=w;exports.toggleDateTimeSelector=d;exports.toggleTimeSelector=S;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="multiviewcalendar.prevView",t="multiviewcalendar.nextView",a="dateinput.increment",c="dateinput.decrement",i="calendar.today",r="datepicker.toggleCalendar",n="daterangepicker.swapStartEnd",o="daterangepicker.start",l="daterangepicker.end",s="daterangepicker.separator",d="datetimepicker.toggleDateTimeSelector",g="timepicker.now",m="timepicker.selectNow",k="timepicker.cancel",p="timepicker.set",S="timepicker.toggleTimeSelector",w="timepicker.toggleClock",T="datetimepicker.date",u="datetimepicker.time",C="datetimepicker.cancel",v="datetimepicker.set",P="daterangepicker.cancel",V="daterangepicker.set",N={[i]:"Today",[g]:"NOW",[p]:"Set",[k]:"Cancel",[T]:"Date",[u]:"Time",[C]:"Cancel",[v]:"Set",[P]:"Cancel",[V]:"Set",[o]:"Start",[l]:"End",[s]:" ",[m]:"Select Now",[S]:"Toggle TimeSelector",[w]:"Toggle Clock",[a]:"Increase value",[c]:"Decrease value",[r]:"Toggle calendar",[e]:"Navigate to previous view",[t]:"Navigate to next view",[n]:"Swap start and end values",[d]:"Toggle date-time selector"};exports.date=T;exports.dateRangePickerCancel=P;exports.dateRangePickerSet=V;exports.dateTimePickerCancel=C;exports.dateTimePickerSet=v;exports.decreaseValue=c;exports.end=l;exports.increaseValue=a;exports.messages=N;exports.nextView=t;exports.now=g;exports.prevView=e;exports.selectNow=m;exports.separator=s;exports.start=o;exports.swapStartEnd=n;exports.time=u;exports.timePickerCancel=k;exports.timePickerSet=p;exports.today=i;exports.toggleCalendar=r;exports.toggleClock=w;exports.toggleDateTimeSelector=d;exports.toggleTimeSelector=S;

package/messages/index.mjs

@@ -7,7 +7,7 @@
  */
 "use client";
 const e = "multiviewcalendar.prevView", t = "multiviewcalendar.nextView", a = "dateinput.increment", c = "dateinput.decrement", n = "calendar.today", i = "datepicker.toggleCalendar", r = "daterangepicker.swapStartEnd", o = "daterangepicker.start", l = "daterangepicker.end", s = "daterangepicker.separator", d = "datetimepicker.toggleDateTimeSelector", g = "timepicker.now", m = "timepicker.selectNow", p = "timepicker.cancel", k = "timepicker.set", w = "timepicker.toggleTimeSelector", S = "timepicker.toggleClock", T = "datetimepicker.date", v = "datetimepicker.time", u = "datetimepicker.cancel", C = "datetimepicker.set", N = "daterangepicker.cancel", P = "daterangepicker.set", V = {
-  [n]: "TODAY",
+  [n]: "Today",
   [g]: "NOW",
   [k]: "Set",
   [p]: "Cancel",

package/package-metadata.mjs

@@ -10,7 +10,7 @@ const e = {
   name: "@progress/kendo-react-dateinputs",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1711533163,
+  publishDate: 1712850691,
   version: "",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-dateinputs",
-  "version": "7.4.0-develop.9",
+  "version": "7.5.0-develop.1",
   "description": "React DateInput is a perfect input component for handling quick and efficient date values. KendoReact Date Inputs package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -24,12 +24,12 @@
   "peerDependencies": {
     "@progress/kendo-date-math": "^1.4.0",
     "@progress/kendo-licensing": "^1.3.4",
-    "@progress/kendo-react-buttons": "7.4.0-develop.9",
-    "@progress/kendo-react-common": "7.4.0-develop.9",
-    "@progress/kendo-react-intl": "7.4.0-develop.9",
-    "@progress/kendo-react-labels": "7.4.0-develop.9",
-    "@progress/kendo-react-layout": "7.4.0-develop.9",
-    "@progress/kendo-react-popup": "7.4.0-develop.9",
+    "@progress/kendo-react-buttons": "7.5.0-develop.1",
+    "@progress/kendo-react-common": "7.5.0-develop.1",
+    "@progress/kendo-react-intl": "7.5.0-develop.1",
+    "@progress/kendo-react-labels": "7.5.0-develop.1",
+    "@progress/kendo-react-layout": "7.5.0-develop.1",
+    "@progress/kendo-react-popup": "7.5.0-develop.1",
     "@progress/kendo-svg-icons": "^2.1.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"

package/timepicker/TimeList.js

@@ -5,10 +5,10 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),c=require("prop-types"),v=require("@progress/kendo-date-math"),r=require("@progress/kendo-react-common"),S=require("@progress/kendo-react-intl"),b=require("../virtualization/Virtualization.js"),u=require("./models/TimePart.js"),x=require("./services/DayPeriodService.js"),y=require("./services/DOMService.js"),I=require("./services/HoursService.js"),M=require("./services/MinutesService.js"),H=require("./services/SecondsService.js"),d=require("../utils.js");function D(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(s,t,e.get?e:{enumerable:!0,get:()=>n[t]})}}return s.default=n,Object.freeze(s)}const l=D(T),E=2,g=.05,P=100,R=0,O=9,_={[r.Keys.end]:(n,s)=>n[n.length-1],[r.Keys.home]:(n,s)=>n[0],[r.Keys.up]:(n,s)=>n[s-1],[r.Keys.down]:(n,s)=>n[s+1]},m={[u.TIME_PART.dayperiod]:x.DayPeriodService,[u.TIME_PART.hour]:I.HoursService,[u.TIME_PART.minute]:M.MinutesService,[u.TIME_PART.second]:H.SecondsService},a=class a extends l.Component{constructor(s){super(s),this.intl=null,this._element=null,this.service=null,this.virtualization=null,this.topOffset=0,this.bottomOffset=0,this.itemHeight=0,this.listHeight=0,this.topThreshold=0,this.bottomThreshold=0,this.animateToIndex=!1,this.focus=t=>{Promise.resolve().then(()=>{this.element&&this.element.focus(t)})},this.itemOffset=t=>{if(!this.virtualization||!this.service)return-1;const e=this.service.selectedIndex(this.props.value),i=this.virtualization.activeIndex(),o=this.virtualization.itemOffset(i),h=Math.abs(Math.ceil(t)-o);if(e===i&&h<E)return o;const f=e>i;return f&&h>=this.bottomThreshold||!f&&h>this.topThreshold?this.virtualization.itemOffset(i+1):o},this.calculateHeights=()=>{this.dom.didCalculate&&(this.itemHeight=this.dom.itemHeight,this.listHeight=this.dom.timeListHeight,this.topOffset=(this.listHeight-this.itemHeight)/2,this.bottomOffset=this.listHeight-this.itemHeight,this.props.mobileMode&&(this.topOffset+=O,this.bottomOffset+=O*2),this.topThreshold=this.itemHeight*g,this.bottomThreshold=this.itemHeight*(1-g))},this.configureServices=({min:t,max:e,value:i}=this.props)=>{if(this.service){const[o,h]=this.service.limitRange(t||this.min,e||this.max,i||this.props.value);this.service.configure(this.serviceSettings({min:o,max:h}))}},this.serviceSettings=t=>{const e={boundRange:this.props.boundRange||a.defaultProps.boundRange,insertUndividedMax:!1,min:v.cloneDate(this.min),max:v.cloneDate(this.max),part:this.props.part,step:this.step},i=Object.assign({},e,t);return i.boundRange=i.part.type!=="hour"||this.props.boundRange||a.defaultProps.boundRange,i},this.handleScrollAction=({target:t,animationInProgress:e})=>{if(!(!this.virtualization||!this.service)&&t&&!e){this.animateToIndex=!1;const i=this.virtualization.itemIndex(this.itemOffset(t.scrollTop)),o=this.service.data(this.props.value)[i];this.handleChange(o)}},this.handleFocus=t=>{const{onFocus:e}=this.props;e&&e.call(void 0,t)},this.handleBlur=t=>{const{onBlur:e}=this.props;e&&e.call(void 0,t)},this.handleMouseOver=()=>{if(!this._element)return;const t=r.getActiveElement(document);document&&t!==this._element&&this.props.show&&this._element.focus({preventScroll:!0})},this.handleKeyDown=t=>{if(!this.service)return;const{keyCode:e}=t;(e===r.Keys.down||e===r.Keys.up||e===r.Keys.end||e===r.Keys.home)&&t.preventDefault();const o=(_[t.keyCode]||r.noop)(this.service.data(this.props.value),this.service.selectedIndex(this.props.value));o&&this.handleChange(o)},this.handleChange=d.debounce(t=>{if(!this.service)return;const e=this.service.apply(this.props.value,t.value);if(this.props.value.getTime()===e.getTime())return;const{onChange:i}=this.props;i&&i.call(void 0,e)},P),this.dom=new y.DOMService}get element(){return this._element}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get min(){return this.props.min||a.defaultProps.min}get max(){return this.props.max||a.defaultProps.max}get step(){return this.props.step!==void 0&&this.props.step!==0?Math.floor(this.props.step):a.defaultProps.step}componentDidMount(){Promise.resolve().then(()=>{this._element&&(this.dom.calculateHeights(this._element),this.forceUpdate())})}componentDidUpdate(){if(!this.virtualization||!this.service)return;const s=this.service.selectedIndex(this.props.value);this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](s),this.animateToIndex=!0}render(){if(!this.props.part.type||!m[this.props.part.type])return;this.calculateHeights(),this.intl=S.provideIntlService(this),this.service=new m[this.props.part.type](this.intl),this.configureServices();const s=this.service.data(this.props.value),t="translateY("+this.topOffset+"px)",e=this.service.total(this.props.value),i=l.createElement("ul",{style:{transform:t,msTransform:t},className:"k-reset"},s.map((o,h)=>l.createElement("li",{key:h,className:"k-item",onClick:()=>{this.handleChange(o)}},l.createElement("span",null,o.text))));return l.createElement("div",{className:"k-time-list",id:String(this.props.id||""),tabIndex:this.props.disabled?-1:0,ref:o=>{this._element=o},onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseOver:this.handleMouseOver},this.dom.didCalculate?l.createElement(b.Virtualization,{bottomOffset:this.bottomOffset,children:i,className:"k-time-container",itemHeight:this.itemHeight,maxScrollDifference:this.listHeight,onScrollAction:this.handleScrollAction,ref:o=>{this.virtualization=o},role:"presentation",skip:R,tabIndex:-1,take:e,topOffset:this.topOffset,total:e}):l.createElement("div",{className:"k-time-container"},i))}};a.propTypes={id:c.number,max:c.instanceOf(Date),min:c.instanceOf(Date),part:function(s,t,e){const i=s[t];if(!i||!m[i.type])throw new Error(`
-                    Invalid prop '${t}' supplied to ${e}.
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),c=require("prop-types"),v=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),S=require("@progress/kendo-react-intl"),b=require("../virtualization/Virtualization.js"),u=require("./models/TimePart.js"),x=require("./services/DayPeriodService.js"),y=require("./services/DOMService.js"),I=require("./services/HoursService.js"),M=require("./services/MinutesService.js"),H=require("./services/SecondsService.js"),d=require("../utils.js");function D(o){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const e in o)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(o,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>o[e]})}}return s.default=o,Object.freeze(s)}const r=D(T),E=2,g=.05,P=100,R=0,O=9,k={[a.Keys.end]:(o,s)=>o[o.length-1],[a.Keys.home]:(o,s)=>o[0],[a.Keys.up]:(o,s)=>o[s-1],[a.Keys.down]:(o,s)=>o[s+1]},m={[u.TIME_PART.dayperiod]:x.DayPeriodService,[u.TIME_PART.hour]:I.HoursService,[u.TIME_PART.minute]:M.MinutesService,[u.TIME_PART.second]:H.SecondsService},h=class h extends r.Component{constructor(s){super(s),this.intl=null,this._element=null,this.service=null,this.virtualization=null,this.topOffset=0,this.bottomOffset=0,this.itemHeight=0,this.listHeight=0,this.topThreshold=0,this.bottomThreshold=0,this.animateToIndex=!1,this.focus=e=>{Promise.resolve().then(()=>{this.element&&this.element.focus(e)})},this.itemOffset=e=>{if(!this.virtualization||!this.service)return-1;const t=this.service.selectedIndex(this.props.value),i=this.virtualization.activeIndex(),n=this.virtualization.itemOffset(i),l=Math.abs(Math.ceil(e)-n);if(t===i&&l<E)return n;const f=t>i;return f&&l>=this.bottomThreshold||!f&&l>this.topThreshold?this.virtualization.itemOffset(i+1):n},this.calculateHeights=()=>{this.dom.didCalculate&&(this.itemHeight=this.dom.itemHeight,this.listHeight=this.dom.timeListHeight,this.topOffset=(this.listHeight-this.itemHeight)/2,this.bottomOffset=this.listHeight-this.itemHeight,this.props.mobileMode&&(this.topOffset+=O,this.bottomOffset+=O*2),this.topThreshold=this.itemHeight*g,this.bottomThreshold=this.itemHeight*(1-g))},this.configureServices=({min:e,max:t,value:i}=this.props)=>{if(this.service){const[n,l]=this.service.limitRange(e||this.min,t||this.max,i||this.props.value);this.service.configure(this.serviceSettings({min:n,max:l}))}},this.serviceSettings=e=>{const t={boundRange:this.props.boundRange||h.defaultProps.boundRange,insertUndividedMax:!1,min:v.cloneDate(this.min),max:v.cloneDate(this.max),part:this.props.part,step:this.step},i=Object.assign({},t,e);return i.boundRange=i.part.type!=="hour"||this.props.boundRange||h.defaultProps.boundRange,i},this.handleScrollAction=({target:e,animationInProgress:t})=>{if(!(!this.virtualization||!this.service)&&e&&!t){this.animateToIndex=!1;const i=this.virtualization.itemIndex(this.itemOffset(e.scrollTop)),n=this.service.data(this.props.value)[i];this.handleChange(n)}},this.handleFocus=e=>{const{onFocus:t}=this.props;t&&t.call(void 0,e)},this.handleBlur=e=>{const{onBlur:t}=this.props;t&&t.call(void 0,e)},this.handleMouseOver=()=>{if(!this._element)return;const e=a.getActiveElement(document);document&&e!==this._element&&this.props.show&&this._element.focus({preventScroll:!0})},this.handleKeyDown=e=>{if(!this.service)return;const{keyCode:t}=e;(t===a.Keys.down||t===a.Keys.up||t===a.Keys.end||t===a.Keys.home)&&e.preventDefault();const n=(k[e.keyCode]||a.noop)(this.service.data(this.props.value),this.service.selectedIndex(this.props.value));n&&this.handleChange(n)},this.handleChange=d.debounce(e=>{if(!this.service)return;const t=this.service.apply(this.props.value,e.value);if(this.props.value.getTime()===t.getTime())return;const{onChange:i}=this.props;i&&i.call(void 0,t)},P),this.dom=new y.DOMService}get element(){return this._element}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get min(){return this.props.min||h.defaultProps.min}get max(){return this.props.max||h.defaultProps.max}get step(){return this.props.step!==void 0&&this.props.step!==0?Math.floor(this.props.step):h.defaultProps.step}componentDidMount(){Promise.resolve().then(()=>{this._element&&(this.dom.calculateHeights(this._element),this.forceUpdate())})}componentDidUpdate(){if(!this.virtualization||!this.service)return;const s=this.service.selectedIndex(this.props.value);this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](s),this.animateToIndex=!0}render(){if(!this.props.part.type||!m[this.props.part.type])return;this.calculateHeights(),this.intl=S.provideIntlService(this),this.service=new m[this.props.part.type](this.intl),this.configureServices();const s=this.service.data(this.props.value),e="translateY("+this.topOffset+"px)",t=this.service.total(this.props.value),i=r.createElement(r.Fragment,null,r.createElement("ul",{style:{transform:e,msTransform:e},className:"k-reset"},s.map((n,l)=>r.createElement("li",{key:l,className:"k-item",onClick:()=>{this.handleChange(n)}},r.createElement("span",null,n.text)))),r.createElement("div",{className:"k-scrollable-placeholder"}));return r.createElement("div",{className:"k-time-list",id:String(this.props.id||""),tabIndex:this.props.disabled?-1:0,ref:n=>{this._element=n},onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseOver:this.handleMouseOver},this.dom.didCalculate?r.createElement(b.Virtualization,{bottomOffset:this.bottomOffset,children:i,className:"k-time-container",itemHeight:this.itemHeight,maxScrollDifference:this.listHeight,onScrollAction:this.handleScrollAction,ref:n=>{this.virtualization=n},role:"presentation",skip:R,tabIndex:-1,take:t,topOffset:this.topOffset,total:t}):r.createElement("div",{className:"k-time-container k-content k-scrollable"},i))}};h.propTypes={id:c.number,max:c.instanceOf(Date),min:c.instanceOf(Date),part:function(s,e,t){const i=s[e];if(!i||!m[i.type])throw new Error(`
+                    Invalid prop '${e}' supplied to ${t}.
                     Supported part types are hour|minute|second|dayperiod.
-                `);return null},step:function(s,t,e){const i=s[t];if(i!==void 0&&i<=0)throw new Error(`
-                    Invalid prop '${t}' supplied to ${e}.
-                    ${t} cannot be less than 1.
-                `);return null},value:c.instanceOf(Date),smoothScroll:c.bool,show:c.bool},a.defaultProps={boundRange:!1,max:d.MAX_TIME,min:d.MIDNIGHT_DATE,step:1,smoothScroll:!0};let p=a;S.registerForIntl(p);exports.TimeList=p;
+                `);return null},step:function(s,e,t){const i=s[e];if(i!==void 0&&i<=0)throw new Error(`
+                    Invalid prop '${e}' supplied to ${t}.
+                    ${e} cannot be less than 1.
+                `);return null},value:c.instanceOf(Date),smoothScroll:c.bool,show:c.bool},h.defaultProps={boundRange:!1,max:d.MAX_TIME,min:d.MIDNIGHT_DATE,step:1,smoothScroll:!0};let p=h;S.registerForIntl(p);exports.TimeList=p;

package/timepicker/TimeList.mjs

@@ -6,30 +6,30 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as l from "react";
-import p from "prop-types";
+import * as n from "react";
+import c from "prop-types";
 import { cloneDate as f } from "@progress/kendo-date-math";
-import { Keys as h, getActiveElement as x, noop as O } from "@progress/kendo-react-common";
-import { provideIntlService as S, registerForIntl as T } from "@progress/kendo-react-intl";
-import { Virtualization as I } from "../virtualization/Virtualization.mjs";
-import { TIME_PART as c } from "./models/TimePart.mjs";
-import { DayPeriodService as b } from "./services/DayPeriodService.mjs";
+import { Keys as a, getActiveElement as x, noop as O } from "@progress/kendo-react-common";
+import { provideIntlService as b, registerForIntl as S } from "@progress/kendo-react-intl";
+import { Virtualization as T } from "../virtualization/Virtualization.mjs";
+import { TIME_PART as p } from "./models/TimePart.mjs";
+import { DayPeriodService as I } from "./services/DayPeriodService.mjs";
 import { DOMService as H } from "./services/DOMService.mjs";
-import { HoursService as y } from "./services/HoursService.mjs";
-import { MinutesService as E } from "./services/MinutesService.mjs";
+import { HoursService as E } from "./services/HoursService.mjs";
+import { MinutesService as y } from "./services/MinutesService.mjs";
 import { SecondsService as M } from "./services/SecondsService.mjs";
 import { debounce as D, MAX_TIME as w, MIDNIGHT_DATE as R } from "../utils.mjs";
-const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
-  [h.end]: (r, o) => r[r.length - 1],
-  [h.home]: (r, o) => r[0],
-  [h.up]: (r, o) => r[o - 1],
-  [h.down]: (r, o) => r[o + 1]
+const k = 2, v = 0.05, C = 100, P = 0, g = 9, z = {
+  [a.end]: (h, o) => h[h.length - 1],
+  [a.home]: (h, o) => h[0],
+  [a.up]: (h, o) => h[o - 1],
+  [a.down]: (h, o) => h[o + 1]
 }, m = {
-  [c.dayperiod]: b,
-  [c.hour]: y,
-  [c.minute]: E,
-  [c.second]: M
-}, n = class n extends l.Component {
+  [p.dayperiod]: I,
+  [p.hour]: E,
+  [p.minute]: y,
+  [p.second]: M
+}, r = class r extends n.Component {
   constructor(o) {
     super(o), this.intl = null, this._element = null, this.service = null, this.virtualization = null, this.topOffset = 0, this.bottomOffset = 0, this.itemHeight = 0, this.listHeight = 0, this.topThreshold = 0, this.bottomThreshold = 0, this.animateToIndex = !1, this.focus = (t) => {
       Promise.resolve().then(() => {
@@ -38,28 +38,28 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
     }, this.itemOffset = (t) => {
       if (!this.virtualization || !this.service)
         return -1;
-      const e = this.service.selectedIndex(this.props.value), i = this.virtualization.activeIndex(), s = this.virtualization.itemOffset(i), a = Math.abs(Math.ceil(t) - s);
-      if (e === i && a < C)
+      const e = this.service.selectedIndex(this.props.value), i = this.virtualization.activeIndex(), s = this.virtualization.itemOffset(i), l = Math.abs(Math.ceil(t) - s);
+      if (e === i && l < k)
         return s;
       const u = e > i;
-      return u && a >= this.bottomThreshold || !u && a > this.topThreshold ? this.virtualization.itemOffset(i + 1) : s;
+      return u && l >= this.bottomThreshold || !u && l > this.topThreshold ? this.virtualization.itemOffset(i + 1) : s;
     }, this.calculateHeights = () => {
       this.dom.didCalculate && (this.itemHeight = this.dom.itemHeight, this.listHeight = this.dom.timeListHeight, this.topOffset = (this.listHeight - this.itemHeight) / 2, this.bottomOffset = this.listHeight - this.itemHeight, this.props.mobileMode && (this.topOffset += g, this.bottomOffset += g * 2), this.topThreshold = this.itemHeight * v, this.bottomThreshold = this.itemHeight * (1 - v));
     }, this.configureServices = ({ min: t, max: e, value: i } = this.props) => {
       if (this.service) {
-        const [s, a] = this.service.limitRange(t || this.min, e || this.max, i || this.props.value);
-        this.service.configure(this.serviceSettings({ min: s, max: a }));
+        const [s, l] = this.service.limitRange(t || this.min, e || this.max, i || this.props.value);
+        this.service.configure(this.serviceSettings({ min: s, max: l }));
       }
     }, this.serviceSettings = (t) => {
       const e = {
-        boundRange: this.props.boundRange || n.defaultProps.boundRange,
+        boundRange: this.props.boundRange || r.defaultProps.boundRange,
         insertUndividedMax: !1,
         min: f(this.min),
         max: f(this.max),
         part: this.props.part,
         step: this.step
       }, i = Object.assign({}, e, t);
-      return i.boundRange = i.part.type !== "hour" || this.props.boundRange || n.defaultProps.boundRange, i;
+      return i.boundRange = i.part.type !== "hour" || this.props.boundRange || r.defaultProps.boundRange, i;
     }, this.handleScrollAction = ({ target: t, animationInProgress: e }) => {
       if (!(!this.virtualization || !this.service) && t && !e) {
         this.animateToIndex = !1;
@@ -81,7 +81,7 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
       if (!this.service)
         return;
       const { keyCode: e } = t;
-      (e === h.down || e === h.up || e === h.end || e === h.home) && t.preventDefault();
+      (e === a.down || e === a.up || e === a.end || e === a.home) && t.preventDefault();
       const s = (z[t.keyCode] || O)(
         this.service.data(this.props.value),
         this.service.selectedIndex(this.props.value)
@@ -95,7 +95,7 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
         return;
       const { onChange: i } = this.props;
       i && i.call(void 0, e);
-    }, P), this.dom = new H();
+    }, C), this.dom = new H();
   }
   get element() {
     return this._element;
@@ -104,13 +104,13 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
     return !!(this.props.smoothScroll && this.animateToIndex);
   }
   get min() {
-    return this.props.min || n.defaultProps.min;
+    return this.props.min || r.defaultProps.min;
   }
   get max() {
-    return this.props.max || n.defaultProps.max;
+    return this.props.max || r.defaultProps.max;
   }
   get step() {
-    return this.props.step !== void 0 && this.props.step !== 0 ? Math.floor(this.props.step) : n.defaultProps.step;
+    return this.props.step !== void 0 && this.props.step !== 0 ? Math.floor(this.props.step) : r.defaultProps.step;
   }
   /**
    * @hidden
@@ -135,26 +135,18 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
   render() {
     if (!this.props.part.type || !m[this.props.part.type])
       return;
-    this.calculateHeights(), this.intl = S(this), this.service = new m[this.props.part.type](this.intl), this.configureServices();
-    const o = this.service.data(this.props.value), t = "translateY(" + this.topOffset + "px)", e = this.service.total(this.props.value), i = /* @__PURE__ */ l.createElement(
+    this.calculateHeights(), this.intl = b(this), this.service = new m[this.props.part.type](this.intl), this.configureServices();
+    const o = this.service.data(this.props.value), t = "translateY(" + this.topOffset + "px)", e = this.service.total(this.props.value), i = /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
       "ul",
       {
         style: { transform: t, msTransform: t },
         className: "k-reset"
       },
-      o.map((s, a) => /* @__PURE__ */ l.createElement(
-        "li",
-        {
-          key: a,
-          className: "k-item",
-          onClick: () => {
-            this.handleChange(s);
-          }
-        },
-        /* @__PURE__ */ l.createElement("span", null, s.text)
-      ))
-    );
-    return /* @__PURE__ */ l.createElement(
+      o.map((s, l) => /* @__PURE__ */ n.createElement("li", { key: l, className: "k-item", onClick: () => {
+        this.handleChange(s);
+      } }, /* @__PURE__ */ n.createElement("span", null, s.text)))
+    ), /* @__PURE__ */ n.createElement("div", { className: "k-scrollable-placeholder" }));
+    return /* @__PURE__ */ n.createElement(
       "div",
       {
         className: "k-time-list",
@@ -168,8 +160,8 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
         onBlur: this.handleBlur,
         onMouseOver: this.handleMouseOver
       },
-      this.dom.didCalculate ? /* @__PURE__ */ l.createElement(
-        I,
+      this.dom.didCalculate ? /* @__PURE__ */ n.createElement(
+        T,
         {
           bottomOffset: this.bottomOffset,
           children: i,
@@ -181,20 +173,20 @@ const C = 2, v = 0.05, P = 100, k = 0, g = 9, z = {
             this.virtualization = s;
           },
           role: "presentation",
-          skip: k,
+          skip: P,
           tabIndex: -1,
           take: e,
           topOffset: this.topOffset,
           total: e
         }
-      ) : /* @__PURE__ */ l.createElement("div", { className: "k-time-container" }, i)
+      ) : /* @__PURE__ */ n.createElement("div", { className: "k-time-container k-content k-scrollable" }, i)
     );
   }
 };
-n.propTypes = {
-  id: p.number,
-  max: p.instanceOf(Date),
-  min: p.instanceOf(Date),
+r.propTypes = {
+  id: c.number,
+  max: c.instanceOf(Date),
+  min: c.instanceOf(Date),
   part: function(o, t, e) {
     const i = o[t];
     if (!i || !m[i.type])
@@ -213,18 +205,18 @@ n.propTypes = {
                 `);
     return null;
   },
-  value: p.instanceOf(Date),
-  smoothScroll: p.bool,
-  show: p.bool
-}, n.defaultProps = {
+  value: c.instanceOf(Date),
+  smoothScroll: c.bool,
+  show: c.bool
+}, r.defaultProps = {
   boundRange: !1,
   max: w,
   min: R,
   step: 1,
   smoothScroll: !0
 };
-let d = n;
-T(d);
+let d = r;
+S(d);
 export {
   d as TimeList
 };

package/timepicker/TimePart.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("react"),e=require("prop-types"),R=require("@progress/kendo-date-math"),p=require("@progress/kendo-react-common"),v=require("@progress/kendo-react-intl"),m=require("../messages/index.js"),O=require("./TimeList.js"),w=require("../utils.js"),g=require("./models/TimePart.js"),u=require("./utils.js"),B=require("@progress/kendo-react-buttons");function D(c){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const s in c)if(s!=="default"){const t=Object.getOwnPropertyDescriptor(c,s);Object.defineProperty(n,s,t.get?t:{enumerable:!0,get:()=>c[s]})}}return n.default=c,Object.freeze(n)}const i=D(x),b=new RegExp(`${g.TIME_PART.hour}|${g.TIME_PART.minute}|${g.TIME_PART.second}|${g.TIME_PART.dayperiod}|literal`),a=class a extends i.Component{constructor(n){super(n),this._element=null,this._nowButton=null,this.dateFormatParts=[],this.timeLists=[],this.focus=(s,t)=>{Promise.resolve().then(()=>{t&&this._nowButton&&this._nowButton.element&&this._nowButton.element.focus();const o=this.timeLists[0];!t&&this.state.activeListIndex===-1&&!this.hasActiveButton()&&o&&o.element&&o.focus(s)})},this.timeFormatReducer=(s,t)=>s+t.pattern,this.timeFormatFilter=(s,t,o)=>{const r=t>=1&&o[t-1];return r&&r&&s.type==="literal"?b.test(r.type||""):b.test(s.type||"")},this.focusList=s=>{this.timeLists.length&&this.timeLists.reduce(this.listReducer,[]).map(t=>s===1?t.next:t.prev).map(t=>t&&t.element&&t.element.focus({preventScroll:!0}))},this.listReducer=(s,t,o,r)=>s.length||t.props.id!==this.state.activeListIndex?s:[{next:r[o+1]||t,prev:r[o-1]||t}],this.showNowButton=()=>!this.hasSteps()&&this.props.nowButton&&u.isInTimeRange(u.getNow(),this.min,this.max),this.handleKeyDown=s=>{const{keyCode:t}=s;switch(t){case p.Keys.left:s.preventDefault(),this.focusList(0);return;case p.Keys.right:s.preventDefault(),this.focusList(1);return;default:return}},this.handleListBlur=()=>{this.nextTick(()=>{this.setState({activeListIndex:-1})})},this.handleListFocus=s=>{clearTimeout(this.nextTickId),this.setState({activeListIndex:s})},this.handleChange=s=>{const{onChange:t}=this.props;t&&t.call(void 0,s)},this.snapTime=u.snapTime(u.generateSnappers(this.props.steps,this.props.min||a.defaultProps.min)),this.state={activeListIndex:-1},this.hasActiveButton=this.hasActiveButton.bind(this)}get element(){return this._element}get value(){return u.timeInRange(this.snapTime(R.cloneDate(this.props.value||w.MIDNIGHT_DATE)),this.min,this.max)}get intl(){return v.provideIntlService(this)}get min(){return this.snapTime(this.props.min||a.defaultProps.min)}get max(){return this.snapTime(this.props.max||a.defaultProps.max)}get steps(){return this.props.steps||a.defaultProps.steps}get boundRange(){return this.props.boundRange!==void 0?this.props.boundRange:a.defaultProps.boundRange}componentWillUnmount(){clearTimeout(this.nextTickId)}componentDidMount(){const{onMount:n}=this.props;n&&n.call(void 0,this.value)}render(){const{format:n,smoothScroll:s,onNowClick:t,className:o,disabled:r,mobileMode:T,show:I,onNowKeyDown:L}=this.props;this.snapTime=u.snapTime(u.generateSnappers(this.steps,this.min)),this.dateFormatParts=this.intl.splitDateFormat(n||a.defaultProps.format).filter(this.timeFormatFilter);const N=p.classNames({"k-disabled":r,"k-time-part":T},o);this.timeLists=[];const y=v.provideLocalizationService(this),k=y.toLanguageString(m.selectNow,m.messages[m.selectNow]);return i.createElement("div",{className:N},i.createElement("div",{className:"k-time-header"},i.createElement("span",{className:"k-title"},this.intl.formatDate(this.value,this.dateFormatParts.reduce(this.timeFormatReducer,""))),this.showNowButton()&&i.createElement(B.Button,{type:"button",ref:l=>{this._nowButton=l},className:"k-time-now",fillMode:"flat",themeColor:"primary",title:k,onKeyDown:L,"aria-label":k,onClick:t,tabIndex:r?-1:0},y.toLanguageString(m.now,m.messages[m.now]))),i.createElement("div",{className:"k-time-list-container",onKeyDown:this.handleKeyDown},i.createElement("span",{className:"k-time-highlight"}),this.dateFormatParts.map((l,h)=>l.type!=="literal"?i.createElement("div",{key:h,className:p.classNames("k-time-list-wrapper",{"k-focus":h===this.state.activeListIndex}),role:"presentation",tabIndex:-1},i.createElement("span",{className:"k-title",onMouseDown:f=>{f.preventDefault()}},this.intl.dateFieldName(l)),i.createElement(O.TimeList,{min:this.min,max:this.max,boundRange:this.boundRange,part:l,step:l.type?this.steps[l.type]:1,smoothScroll:s,ref:f=>{f&&this.timeLists.push(f)},id:h,onFocus:()=>{this.handleListFocus(h)},onBlur:this.handleListBlur,onChange:this.handleChange,value:this.value,disabled:r,show:I,mobileMode:T})):i.createElement("div",{key:h,className:"k-time-separator"},l.pattern))))}nextTick(n){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>n())}hasActiveButton(){const n=p.getActiveElement(document);return this._nowButton&&n===this._nowButton.element}hasSteps(){const n=Object.keys(this.steps);return n.length!==n.reduce((s,t)=>s+this.steps[t],0)}};a.propTypes={cancelButton:e.bool,disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),max:e.instanceOf(Date),min:e.instanceOf(Date),nowButton:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,value:e.instanceOf(Date),show:e.bool},a.defaultProps={value:null,disabled:!1,nowButton:!0,cancelButton:!0,format:"hh:mm a",min:w.MIN_TIME,max:w.MAX_TIME,steps:{},boundRange:!1};let d=a;v.registerForIntl(d);v.registerForLocalization(d);exports.TimePart=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("react"),e=require("prop-types"),R=require("@progress/kendo-date-math"),p=require("@progress/kendo-react-common"),v=require("@progress/kendo-react-intl"),m=require("../messages/index.js"),O=require("./TimeList.js"),w=require("../utils.js"),g=require("./models/TimePart.js"),u=require("./utils.js"),B=require("@progress/kendo-react-buttons");function D(c){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const s in c)if(s!=="default"){const t=Object.getOwnPropertyDescriptor(c,s);Object.defineProperty(n,s,t.get?t:{enumerable:!0,get:()=>c[s]})}}return n.default=c,Object.freeze(n)}const i=D(x),b=new RegExp(`${g.TIME_PART.hour}|${g.TIME_PART.minute}|${g.TIME_PART.second}|${g.TIME_PART.dayperiod}|literal`),a=class a extends i.Component{constructor(n){super(n),this._element=null,this._nowButton=null,this.dateFormatParts=[],this.timeLists=[],this.focus=(s,t)=>{Promise.resolve().then(()=>{t&&this._nowButton&&this._nowButton.element&&this._nowButton.element.focus();const o=this.timeLists[0];!t&&this.state.activeListIndex===-1&&!this.hasActiveButton()&&o&&o.element&&o.focus(s)})},this.timeFormatReducer=(s,t)=>s+t.pattern,this.timeFormatFilter=(s,t,o)=>{const r=t>=1&&o[t-1];return r&&r&&s.type==="literal"?b.test(r.type||""):b.test(s.type||"")},this.focusList=s=>{this.timeLists.length&&this.timeLists.reduce(this.listReducer,[]).map(t=>s===1?t.next:t.prev).map(t=>t&&t.element&&t.element.focus({preventScroll:!0}))},this.listReducer=(s,t,o,r)=>s.length||t.props.id!==this.state.activeListIndex?s:[{next:r[o+1]||t,prev:r[o-1]||t}],this.showNowButton=()=>!this.hasSteps()&&this.props.nowButton&&u.isInTimeRange(u.getNow(),this.min,this.max),this.handleKeyDown=s=>{const{keyCode:t}=s;switch(t){case p.Keys.left:s.preventDefault(),this.focusList(0);return;case p.Keys.right:s.preventDefault(),this.focusList(1);return;default:return}},this.handleListBlur=()=>{this.nextTick(()=>{this.setState({activeListIndex:-1})})},this.handleListFocus=s=>{clearTimeout(this.nextTickId),this.setState({activeListIndex:s})},this.handleChange=s=>{const{onChange:t}=this.props;t&&t.call(void 0,s)},this.snapTime=u.snapTime(u.generateSnappers(this.props.steps,this.props.min||a.defaultProps.min)),this.state={activeListIndex:-1},this.hasActiveButton=this.hasActiveButton.bind(this)}get element(){return this._element}get value(){return u.timeInRange(this.snapTime(R.cloneDate(this.props.value||w.MIDNIGHT_DATE)),this.min,this.max)}get intl(){return v.provideIntlService(this)}get min(){return this.snapTime(this.props.min||a.defaultProps.min)}get max(){return this.snapTime(this.props.max||a.defaultProps.max)}get steps(){return this.props.steps||a.defaultProps.steps}get boundRange(){return this.props.boundRange!==void 0?this.props.boundRange:a.defaultProps.boundRange}componentWillUnmount(){clearTimeout(this.nextTickId)}componentDidMount(){const{onMount:n}=this.props;n&&n.call(void 0,this.value)}render(){const{format:n,smoothScroll:s,onNowClick:t,className:o,disabled:r,mobileMode:T,show:I,onNowKeyDown:L}=this.props;this.snapTime=u.snapTime(u.generateSnappers(this.steps,this.min)),this.dateFormatParts=this.intl.splitDateFormat(n||a.defaultProps.format).filter(this.timeFormatFilter);const N=p.classNames({"k-disabled":r,"k-time-part":T},o);this.timeLists=[];const y=v.provideLocalizationService(this),k=y.toLanguageString(m.selectNow,m.messages[m.selectNow]);return i.createElement("div",{className:N},i.createElement("div",{className:"k-time-header"},i.createElement("span",{className:"k-title"},this.intl.formatDate(this.value,this.dateFormatParts.reduce(this.timeFormatReducer,""))),this.showNowButton()&&i.createElement(B.Button,{type:"button",ref:l=>{this._nowButton=l},className:"k-time-now",fillMode:"flat",themeColor:"base",title:k,onKeyDown:L,"aria-label":k,onClick:t,tabIndex:r?-1:0},y.toLanguageString(m.now,m.messages[m.now]))),i.createElement("div",{className:"k-time-list-container",onKeyDown:this.handleKeyDown},i.createElement("span",{className:"k-time-highlight"}),this.dateFormatParts.map((l,h)=>l.type!=="literal"?i.createElement("div",{key:h,className:p.classNames("k-time-list-wrapper",{"k-focus":h===this.state.activeListIndex}),role:"presentation",tabIndex:-1},i.createElement("span",{className:"k-title",onMouseDown:f=>{f.preventDefault()}},this.intl.dateFieldName(l)),i.createElement(O.TimeList,{min:this.min,max:this.max,boundRange:this.boundRange,part:l,step:l.type?this.steps[l.type]:1,smoothScroll:s,ref:f=>{f&&this.timeLists.push(f)},id:h,onFocus:()=>{this.handleListFocus(h)},onBlur:this.handleListBlur,onChange:this.handleChange,value:this.value,disabled:r,show:I,mobileMode:T})):i.createElement("div",{key:h,className:"k-time-separator"},l.pattern))))}nextTick(n){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>n())}hasActiveButton(){const n=p.getActiveElement(document);return this._nowButton&&n===this._nowButton.element}hasSteps(){const n=Object.keys(this.steps);return n.length!==n.reduce((s,t)=>s+this.steps[t],0)}};a.propTypes={cancelButton:e.bool,disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),max:e.instanceOf(Date),min:e.instanceOf(Date),nowButton:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,value:e.instanceOf(Date),show:e.bool},a.defaultProps={value:null,disabled:!1,nowButton:!0,cancelButton:!0,format:"hh:mm a",min:w.MIN_TIME,max:w.MAX_TIME,steps:{},boundRange:!1};let d=a;v.registerForIntl(d);v.registerForLocalization(d);exports.TimePart=d;

package/timepicker/TimePart.mjs

@@ -11,7 +11,7 @@ import t from "prop-types";
 import { cloneDate as B } from "@progress/kendo-date-math";
 import { Keys as v, classNames as w, getActiveElement as D } from "@progress/kendo-react-common";
 import { provideIntlService as E, provideLocalizationService as F, registerForIntl as O, registerForLocalization as R } from "@progress/kendo-react-intl";
-import { selectNow as b, messages as y, now as k } from "../messages/index.mjs";
+import { selectNow as b, messages as k, now as y } from "../messages/index.mjs";
 import { TimeList as S } from "./TimeList.mjs";
 import { MIN_TIME as M, MAX_TIME as P, MIDNIGHT_DATE as C } from "../utils.mjs";
 import { TIME_PART as u } from "./models/TimePart.mjs";
@@ -129,7 +129,7 @@ const p = new RegExp(`${u.hour}|${u.minute}|${u.second}|${u.dayperiod}|literal`)
       o
     );
     this.timeLists = [];
-    const f = F(this), g = f.toLanguageString(b, y[b]);
+    const f = F(this), g = f.toLanguageString(b, k[b]);
     return /* @__PURE__ */ n.createElement("div", { className: N }, /* @__PURE__ */ n.createElement("div", { className: "k-time-header" }, /* @__PURE__ */ n.createElement("span", { className: "k-title" }, this.intl.formatDate(this.value, this.dateFormatParts.reduce(this.timeFormatReducer, ""))), this.showNowButton() && /* @__PURE__ */ n.createElement(
       $,
       {
@@ -139,14 +139,14 @@ const p = new RegExp(`${u.hour}|${u.minute}|${u.second}|${u.dayperiod}|literal`)
         },
         className: "k-time-now",
         fillMode: "flat",
-        themeColor: "primary",
+        themeColor: "base",
         title: g,
         onKeyDown: T,
         "aria-label": g,
         onClick: e,
         tabIndex: r ? -1 : 0
       },
-      f.toLanguageString(k, y[k])
+      f.toLanguageString(y, k[y])
     )), /* @__PURE__ */ n.createElement(
       "div",
       {

package/timepicker/TimePicker.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),e=require("prop-types"),L=require("@progress/kendo-react-popup"),w=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),_=require("@progress/kendo-svg-icons"),b=require("@progress/kendo-react-intl"),K=require("../package-metadata.js"),l=require("../messages/index.js"),j=require("../dateinput/DateInput.js"),U=require("./TimeSelector.js"),c=require("../utils.js"),g=require("./utils.js"),$=require("../hooks/usePickerFloatingLabel.js"),H=require("@progress/kendo-react-buttons"),W=require("../common/constants.js"),G=require("../common/AdaptiveMode.js"),X=require("@progress/kendo-react-layout");function Z(d){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const t in d)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(d,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>d[t]})}}return i.default=d,Object.freeze(i)}const r=Z(A),n=class n extends r.Component{constructor(i){super(i),this._element=null,this._dateInput=r.createRef(),this._timeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.renderTimeSelector=()=>{const{smoothScroll:t,cancelButton:s,nowButton:o,disabled:h,format:p,steps:u}=this.props;return r.createElement(U.TimeSelector,{ref:this.setTimeSelectorRef,className:this.mobileMode?"k-reset k-timeselector-lg":"",mobileMode:this.mobileMode,show:this.show,cancelButton:s,disabled:h,nowButton:o,format:p,min:this.min,max:this.max,steps:u,smoothScroll:t,value:this.value,footer:!this.mobileMode,handleTimeChange:this.mobileMode&&this.handleTimeChange,onChange:this.handleValueChange,onReject:this.handleValueReject})},this.renderPopup=()=>{const{popupClass:t,...s}=this.popupSettings,o=a.classNames("k-group k-reset",t),h={popupClass:"k-timepicker-popup",show:this.show,animate:this.element!==null,anchor:this.element,className:o,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...s};return this.props.popup?r.createElement(this.props.popup,{...h},this.renderTimeSelector()):r.createElement(L.Popup,{...h},this.renderTimeSelector())},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,s={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t,footer:{cancelText:this.localizationService.toLanguageString(l.toggleClock,l.messages[l.timePickerCancel]),onCancel:this.handleValueReject,applyText:this.localizationService.toLanguageString(l.timePickerSet,l.messages[l.timePickerSet]),onApply:o=>this.handleValueChange(o)}};return r.createElement(G.AdaptiveMode,{...s},r.createElement(X.ActionSheetContent,{className:"!k-overflow-hidden"},this.renderTimeSelector()))},this.setTimeSelectorRef=t=>{this._timeSelector=t},this.nextValue=(t,s)=>t.value!==void 0?t.value:s.value,this.nextShow=(t,s)=>t.show!==void 0?t.show:s.show,this.handleInputValueChange=t=>{const s=this.mergeTime(t.value);this.handleValueChange({...t,value:s})},this.handleTimeChange=t=>{this.setState({candidate:t.time})},this.handleValueChange=t=>{this.setState({value:w.cloneDate(t.value||this.state.candidate)}),this.valueDuringOnChange=t.value,this.showDuringOnChange=!1,this.shouldFocusDateInput=!0;const{onChange:s}=this.props,o=this.value||this.state.candidate;s&&s.call(void 0,{syntheticEvent:t.syntheticEvent,nativeEvent:t.nativeEvent,value:o,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleValueReject=t=>{this.setShow(!1)},this.handleIconClick=t=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:s,keyCode:o}=t;if(o===a.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(o===a.Keys.up||o===a.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=o===a.Keys.up,this.setShow(o===a.Keys.down))},a.validatePackage(K.packageMetadata),this.state={value:this.props.defaultValue||n.defaultProps.defaultValue,show:this.props.defaultShow||n.defaultProps.defaultShow,focused:!1,candidate:null},this.normalizeTime=this.normalizeTime.bind(this),this.setShow=this.setShow.bind(this),this.mergeTime=this.mergeTime.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get document(){if(a.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get timeSelector(){return this._timeSelector}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?w.cloneDate(i):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get validity(){const i=this.value&&this.normalizeTime(this.value),t=this.normalizeTime(this.min),s=this.normalizeTime(this.max),o=g.isInRange(i,t,s),h=this.props.validationMessage!==void 0,p=(!this.required||this.value!==null)&&o,u=this.props.valid!==void 0?this.props.valid:p;return{customError:h,rangeOverflow:g.isBiggerThanMax(i,s),rangeUnderflow:g.isSmallerThanMin(i,t),valid:u,valueMissing:this.value===null}}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=W.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:n.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:n.defaultProps.required}get popupSettings(){return this.props.popupSettings||n.defaultProps.popupSettings}get min(){return this.props.min!==void 0?this.props.min:n.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:n.defaultProps.max}get dateInputComp(){return this.props.dateInput||n.defaultProps.dateInput}get localizationService(){return b.provideLocalizationService(this)}componentDidMount(){var i;this.observerResize=a.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._timeSelector&&this.show&&!this.prevShow?this._timeSelector.focusActiveList():this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var i;(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:i=n.defaultProps.size,rounded:t=n.defaultProps.rounded,fillMode:s=n.defaultProps.fillMode,disabled:o,tabIndex:h,title:p,id:u,className:I,format:k,formatPlaceholder:M,width:T,name:C,steps:D,validationMessage:O,required:P,validityStyles:z,ariaLabelledBy:q,ariaDescribedBy:x}=this.props,f=!this.validityStyles||this.validity.valid,R={disabled:o,format:k,formatPlaceholder:M,id:u,ariaLabelledBy:q,ariaDescribedBy:x,max:this.normalizeTime(this.max),min:this.normalizeTime(this.min),name:C,onChange:this.handleInputValueChange,required:P,steps:D,tabIndex:this.show?-1:h,title:p,valid:this.validity.valid,validationMessage:O,validityStyles:z,value:this.value&&this.normalizeTime(this.value),label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaHasPopup:"dialog",ariaExpanded:this.show,size:null,fillMode:null,rounded:null,readonly:this.mobileMode},E=this.localizationService.toLanguageString(l.toggleClock,l.messages[l.toggleClock]),B=this.localizationService.toLanguageString(l.toggleTimeSelector,l.messages[l.toggleTimeSelector]),v=r.createElement(a.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},({onFocus:V,onBlur:F})=>r.createElement(r.Fragment,null,r.createElement("div",{id:this.props.id,ref:N=>{this._element=N},className:a.classNames("k-input","k-timepicker",{[`k-input-${a.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-rounded-${a.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${s}`]:s,"k-invalid":!f,"k-required":this.required,"k-disabled":this.props.disabled},I),onKeyDown:this.handleKeyDown,style:{width:T},onFocus:V,onBlur:F,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,...R}),r.createElement(H.Button,{tabIndex:-1,type:"button",icon:"clock",svgIcon:_.clockIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleIconClick,title:B,className:"k-input-button",rounded:null,"aria-label":E}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement($.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:u,editorValid:f,editorDisabled:this.props.disabled,children:v,style:{width:this.props.width}}):v}normalizeTime(i){return c.setTime(c.MIDNIGHT_DATE,i)}setShow(i){const{onOpen:t,onClose:s}=this.props;this.show!==i&&(this.setState({show:i}),i&&t&&t.call(void 0,{target:this}),!i&&s&&s.call(void 0,{target:this}))}mergeTime(i){return this.value&&i?c.setTime(this.value,i):i}calculateMedia(i){for(let t of i)this.setState({windowWidth:t.target.clientWidth})}};n.displayName="TimePicker",n.propTypes={className:e.string,cancelButton:e.bool,nowButton:e.bool,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"])},n.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"t",max:c.MAX_TIME,min:c.MIN_TIME,popupSettings:{},tabIndex:0,steps:{},required:!1,validityStyles:!0,dateInput:j.DateInput,size:"medium",rounded:"medium",fillMode:"solid"};let m=n;const S=a.createPropsContext(),y=a.withIdHOC(a.withPropsContext(S,m));y.displayName="KendoReactTimePicker";b.registerForLocalization(m);exports.TimePicker=y;exports.TimePickerPropsContext=S;exports.TimePickerWithoutContext=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),e=require("prop-types"),L=require("@progress/kendo-react-popup"),w=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),_=require("@progress/kendo-svg-icons"),b=require("@progress/kendo-react-intl"),K=require("../package-metadata.js"),l=require("../messages/index.js"),j=require("../dateinput/DateInput.js"),U=require("./TimeSelector.js"),c=require("../utils.js"),g=require("./utils.js"),$=require("../hooks/usePickerFloatingLabel.js"),H=require("@progress/kendo-react-buttons"),W=require("../common/constants.js"),G=require("../common/AdaptiveMode.js"),X=require("@progress/kendo-react-layout");function Z(d){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const t in d)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(d,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>d[t]})}}return i.default=d,Object.freeze(i)}const r=Z(A),n=class n extends r.Component{constructor(i){super(i),this._element=null,this._dateInput=r.createRef(),this._timeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.renderTimeSelector=()=>{const{smoothScroll:t,cancelButton:s,nowButton:o,disabled:h,format:p,steps:u}=this.props;return r.createElement(U.TimeSelector,{ref:this.setTimeSelectorRef,className:this.mobileMode?"k-reset k-timeselector-lg":"",mobileMode:this.mobileMode,show:this.show,cancelButton:s,disabled:h,nowButton:o,format:p,min:this.min,max:this.max,steps:u,smoothScroll:t,value:this.value,footer:!this.mobileMode,handleTimeChange:this.mobileMode&&this.handleTimeChange,onChange:this.handleValueChange,onReject:this.handleValueReject})},this.renderPopup=()=>{const{popupClass:t,...s}=this.popupSettings,o=a.classNames(t),h={popupClass:"k-timepicker-popup k-list-container",show:this.show,animate:this.element!==null,anchor:this.element,className:o,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...s};return this.props.popup?r.createElement(this.props.popup,{...h},this.renderTimeSelector()):r.createElement(L.Popup,{...h},this.renderTimeSelector())},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,s={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t,footer:{cancelText:this.localizationService.toLanguageString(l.toggleClock,l.messages[l.timePickerCancel]),onCancel:this.handleValueReject,applyText:this.localizationService.toLanguageString(l.timePickerSet,l.messages[l.timePickerSet]),onApply:o=>this.handleValueChange(o)}};return r.createElement(G.AdaptiveMode,{...s},r.createElement(X.ActionSheetContent,{className:"!k-overflow-hidden"},this.renderTimeSelector()))},this.setTimeSelectorRef=t=>{this._timeSelector=t},this.nextValue=(t,s)=>t.value!==void 0?t.value:s.value,this.nextShow=(t,s)=>t.show!==void 0?t.show:s.show,this.handleInputValueChange=t=>{const s=this.mergeTime(t.value);this.handleValueChange({...t,value:s})},this.handleTimeChange=t=>{this.setState({candidate:t.time})},this.handleValueChange=t=>{this.setState({value:w.cloneDate(t.value||this.state.candidate)}),this.valueDuringOnChange=t.value,this.showDuringOnChange=!1,this.shouldFocusDateInput=!0;const{onChange:s}=this.props,o=this.value||this.state.candidate;s&&s.call(void 0,{syntheticEvent:t.syntheticEvent,nativeEvent:t.nativeEvent,value:o,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleValueReject=t=>{this.setShow(!1)},this.handleIconClick=t=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:s,keyCode:o}=t;if(o===a.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(o===a.Keys.up||o===a.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=o===a.Keys.up,this.setShow(o===a.Keys.down))},a.validatePackage(K.packageMetadata),this.state={value:this.props.defaultValue||n.defaultProps.defaultValue,show:this.props.defaultShow||n.defaultProps.defaultShow,focused:!1,candidate:null},this.normalizeTime=this.normalizeTime.bind(this),this.setShow=this.setShow.bind(this),this.mergeTime=this.mergeTime.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get document(){if(a.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get timeSelector(){return this._timeSelector}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?w.cloneDate(i):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get validity(){const i=this.value&&this.normalizeTime(this.value),t=this.normalizeTime(this.min),s=this.normalizeTime(this.max),o=g.isInRange(i,t,s),h=this.props.validationMessage!==void 0,p=(!this.required||this.value!==null)&&o,u=this.props.valid!==void 0?this.props.valid:p;return{customError:h,rangeOverflow:g.isBiggerThanMax(i,s),rangeUnderflow:g.isSmallerThanMin(i,t),valid:u,valueMissing:this.value===null}}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=W.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:n.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:n.defaultProps.required}get popupSettings(){return this.props.popupSettings||n.defaultProps.popupSettings}get min(){return this.props.min!==void 0?this.props.min:n.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:n.defaultProps.max}get dateInputComp(){return this.props.dateInput||n.defaultProps.dateInput}get localizationService(){return b.provideLocalizationService(this)}componentDidMount(){var i;this.observerResize=a.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._timeSelector&&this.show&&!this.prevShow?this._timeSelector.focusActiveList():this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var i;(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:i=n.defaultProps.size,rounded:t=n.defaultProps.rounded,fillMode:s=n.defaultProps.fillMode,disabled:o,tabIndex:h,title:p,id:u,className:I,format:k,formatPlaceholder:M,width:T,name:C,steps:D,validationMessage:O,required:P,validityStyles:z,ariaLabelledBy:q,ariaDescribedBy:x}=this.props,f=!this.validityStyles||this.validity.valid,R={disabled:o,format:k,formatPlaceholder:M,id:u,ariaLabelledBy:q,ariaDescribedBy:x,max:this.normalizeTime(this.max),min:this.normalizeTime(this.min),name:C,onChange:this.handleInputValueChange,required:P,steps:D,tabIndex:this.show?-1:h,title:p,valid:this.validity.valid,validationMessage:O,validityStyles:z,value:this.value&&this.normalizeTime(this.value),label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaHasPopup:"dialog",ariaExpanded:this.show,size:null,fillMode:null,rounded:null,readonly:this.mobileMode},E=this.localizationService.toLanguageString(l.toggleClock,l.messages[l.toggleClock]),B=this.localizationService.toLanguageString(l.toggleTimeSelector,l.messages[l.toggleTimeSelector]),v=r.createElement(a.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},({onFocus:V,onBlur:F})=>r.createElement(r.Fragment,null,r.createElement("span",{id:this.props.id,ref:N=>{this._element=N},className:a.classNames("k-input","k-timepicker",{[`k-input-${a.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-rounded-${a.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${s}`]:s,"k-invalid":!f,"k-required":this.required,"k-disabled":this.props.disabled},I),onKeyDown:this.handleKeyDown,style:{width:T},onFocus:V,onBlur:F,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,...R}),r.createElement(H.Button,{tabIndex:-1,type:"button",icon:"clock",svgIcon:_.clockIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleIconClick,title:B,className:"k-input-button",rounded:null,"aria-label":E}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement($.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:u,editorValid:f,editorDisabled:this.props.disabled,children:v,style:{width:this.props.width}}):v}normalizeTime(i){return c.setTime(c.MIDNIGHT_DATE,i)}setShow(i){const{onOpen:t,onClose:s}=this.props;this.show!==i&&(this.setState({show:i}),i&&t&&t.call(void 0,{target:this}),!i&&s&&s.call(void 0,{target:this}))}mergeTime(i){return this.value&&i?c.setTime(this.value,i):i}calculateMedia(i){for(let t of i)this.setState({windowWidth:t.target.clientWidth})}};n.displayName="TimePicker",n.propTypes={className:e.string,cancelButton:e.bool,nowButton:e.bool,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"])},n.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"t",max:c.MAX_TIME,min:c.MIN_TIME,popupSettings:{},tabIndex:0,steps:{},required:!1,validityStyles:!0,dateInput:j.DateInput,size:"medium",rounded:"medium",fillMode:"solid"};let m=n;const S=a.createPropsContext(),y=a.withIdHOC(a.withPropsContext(S,m));y.displayName="KendoReactTimePicker";b.registerForLocalization(m);exports.TimePicker=y;exports.TimePickerPropsContext=S;exports.TimePickerWithoutContext=m;

package/timepicker/TimePicker.mjs

@@ -54,10 +54,9 @@ const n = class n extends a.Component {
       );
     }, this.renderPopup = () => {
       const { popupClass: t, ...s } = this.popupSettings, o = v(
-        "k-group k-reset",
         t
       ), r = {
-        popupClass: "k-timepicker-popup",
+        popupClass: "k-timepicker-popup k-list-container",
         show: this.show,
         animate: this.element !== null,
         anchor: this.element,
@@ -300,7 +299,7 @@ const n = class n extends a.Component {
         onSyncFocus: this.props.onFocus
       },
       ({ onFocus: N, onBlur: A }) => /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(
-        "div",
+        "span",
         {
           id: this.props.id,
           ref: (L) => {

package/timepicker/TimeSelector.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),e=require("prop-types"),p=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-intl"),r=require("../messages/index.js"),b=require("../utils.js"),h=require("./utils.js"),_=require("./TimePart.js"),y=require("@progress/kendo-react-buttons");function E(u){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const t in u)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(u,t);Object.defineProperty(i,t,n.get?n:{enumerable:!0,get:()=>u[t]})}}return i.default=u,Object.freeze(i)}const l=E(T),c=class c extends l.Component{constructor(i){super(i),this._element=null,this._cancelButton=null,this._acceptButton=null,this.timePart=null,this.focusActiveList=()=>{this.timePart&&this.timePart.focus({preventScroll:!0})},this.handleKeyDown=t=>{const{keyCode:n}=t;switch(n){case a.Keys.enter:this.hasActiveButton()||this.handleAccept(t);return;default:return}},this.revertToNowButton=t=>{const{keyCode:n,shiftKey:o}=t;!o&&n===a.Keys.tab&&(t.preventDefault(),this.props.nowButton!==!1?this.timePart&&this.timePart.focus({preventScroll:!0},!0):this.timePart&&this.timePart.focus({preventScroll:!0}))},this.handleNowKeyDown=t=>{var d;const{keyCode:n,shiftKey:o}=t;o&&n===a.Keys.tab?(t.preventDefault(),this._acceptButton&&((d=this._acceptButton.element)==null||d.focus({preventScroll:!0}))):n===a.Keys.enter&&(t.stopPropagation(),this.handleNowClick(t))},this.handleAccept=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),this.timePart?this.timePart.value:this.current);this.setState({value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleReject=t=>{this.setState({current:this.value});const{onReject:n}=this.props;n&&n.call(void 0,t)},this.handleNowClick=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),h.getNow());this.setState({current:n,value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleChange=t=>{this.setState({current:t});const{handleTimeChange:n}=this.props;n&&n.call(void 0,{time:t})},this.dateFormatParts=this.intl.splitDateFormat(this.props.format||c.defaultProps.format),this.mergeValue=h.valueMerger(h.generateGetters(this.dateFormatParts)),this.hasActiveButton=this.hasActiveButton.bind(this),this.state={current:this.props.value||b.MIDNIGHT_DATE,value:this.props.value||c.defaultProps.value}}get element(){return this._element}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?p.cloneDate(i):null}get intl(){return g.provideIntlService(this)}get current(){return this.state.current!==null?p.cloneDate(this.state.current):null}componentWillUnmount(){clearTimeout(this.nextTickId)}render(){const{format:i,cancelButton:t,disabled:n,tabIndex:o,className:d,smoothScroll:k,min:D,max:O,boundRange:B,nowButton:C,steps:P,show:N,mobileMode:S}=this.props,w=g.provideLocalizationService(this),f=w.toLanguageString(r.timePickerCancel,r.messages[r.timePickerCancel]),v=w.toLanguageString(r.timePickerSet,r.messages[r.timePickerSet]);return l.createElement("div",{ref:s=>{this._element=s},tabIndex:n?void 0:o||0,className:a.classNames("k-timeselector",d,{"k-disabled":n}),onKeyDown:this.handleKeyDown},l.createElement(_.TimePart,{ref:s=>{this.timePart=s},value:this.current,onChange:this.handleChange,onNowClick:this.handleNowClick,format:i,smoothScroll:k,min:D,max:O,boundRange:B,disabled:n,nowButton:C,steps:P,show:N,mobileMode:S,onNowKeyDown:this.handleNowKeyDown}),this.props.footer&&l.createElement("div",{className:"k-time-footer k-actions k-actions-stretched"},t&&l.createElement(y.Button,{type:"button",ref:s=>{this._cancelButton=s},className:"k-time-cancel",onClick:this.handleReject,title:f,"aria-label":f},f),l.createElement(y.Button,{type:"button",ref:s=>{this._acceptButton=s},className:"k-time-accept",themeColor:"primary",onClick:this.handleAccept,onKeyDown:this.revertToNowButton,title:v,"aria-label":v},v)))}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}hasActiveButton(){if(!this._acceptButton||!this._acceptButton.element)return!1;const i=a.getActiveElement(document);return this._acceptButton&&i===this._acceptButton.element||this._cancelButton&&i===this._cancelButton.element}};c.propTypes={cancelButton:e.bool,className:e.string,disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),max:e.instanceOf(Date),min:e.instanceOf(Date),nowButton:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,value:e.instanceOf(Date),show:e.bool},c.defaultProps={value:null,disabled:!1,cancelButton:!0,format:"t",min:b.MIN_TIME,max:b.MAX_TIME,boundRange:!1,footer:!0};let m=c;g.registerForIntl(m);g.registerForLocalization(m);exports.TimeSelector=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),e=require("prop-types"),p=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-intl"),r=require("../messages/index.js"),b=require("../utils.js"),h=require("./utils.js"),_=require("./TimePart.js"),w=require("@progress/kendo-react-buttons");function E(u){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const t in u)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(u,t);Object.defineProperty(i,t,n.get?n:{enumerable:!0,get:()=>u[t]})}}return i.default=u,Object.freeze(i)}const l=E(T),c=class c extends l.Component{constructor(i){super(i),this._element=null,this._cancelButton=null,this._acceptButton=null,this.timePart=null,this.focusActiveList=()=>{this.timePart&&this.timePart.focus({preventScroll:!0})},this.handleKeyDown=t=>{const{keyCode:n}=t;switch(n){case a.Keys.enter:this.hasActiveButton()||this.handleAccept(t);return;default:return}},this.revertToNowButton=t=>{const{keyCode:n,shiftKey:o}=t;!o&&n===a.Keys.tab&&(t.preventDefault(),this.props.nowButton!==!1?this.timePart&&this.timePart.focus({preventScroll:!0},!0):this.timePart&&this.timePart.focus({preventScroll:!0}))},this.handleNowKeyDown=t=>{var d;const{keyCode:n,shiftKey:o}=t;o&&n===a.Keys.tab?(t.preventDefault(),this._acceptButton&&((d=this._acceptButton.element)==null||d.focus({preventScroll:!0}))):n===a.Keys.enter&&(t.stopPropagation(),this.handleNowClick(t))},this.handleAccept=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),this.timePart?this.timePart.value:this.current);this.setState({value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleReject=t=>{this.setState({current:this.value});const{onReject:n}=this.props;n&&n.call(void 0,t)},this.handleNowClick=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),h.getNow());this.setState({current:n,value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleChange=t=>{this.setState({current:t});const{handleTimeChange:n}=this.props;n&&n.call(void 0,{time:t})},this.dateFormatParts=this.intl.splitDateFormat(this.props.format||c.defaultProps.format),this.mergeValue=h.valueMerger(h.generateGetters(this.dateFormatParts)),this.hasActiveButton=this.hasActiveButton.bind(this),this.state={current:this.props.value||b.MIDNIGHT_DATE,value:this.props.value||c.defaultProps.value}}get element(){return this._element}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?p.cloneDate(i):null}get intl(){return g.provideIntlService(this)}get current(){return this.state.current!==null?p.cloneDate(this.state.current):null}componentWillUnmount(){clearTimeout(this.nextTickId)}render(){const{format:i,cancelButton:t,disabled:n,tabIndex:o,className:d,smoothScroll:y,min:D,max:O,boundRange:B,nowButton:C,steps:P,show:N,mobileMode:S}=this.props,k=g.provideLocalizationService(this),f=k.toLanguageString(r.timePickerCancel,r.messages[r.timePickerCancel]),v=k.toLanguageString(r.timePickerSet,r.messages[r.timePickerSet]);return l.createElement("div",{ref:s=>{this._element=s},tabIndex:n?void 0:o||0,className:a.classNames("k-timeselector k-timeselector-md",d,{"k-disabled":n}),onKeyDown:this.handleKeyDown},l.createElement(_.TimePart,{ref:s=>{this.timePart=s},value:this.current,onChange:this.handleChange,onNowClick:this.handleNowClick,format:i,smoothScroll:y,min:D,max:O,boundRange:B,disabled:n,nowButton:C,steps:P,show:N,mobileMode:S,onNowKeyDown:this.handleNowKeyDown}),this.props.footer&&l.createElement("div",{className:"k-time-footer k-actions k-actions-stretched k-actions-horizontal"},t&&l.createElement(w.Button,{type:"button",ref:s=>{this._cancelButton=s},className:"k-time-cancel",onClick:this.handleReject,title:f,"aria-label":f},f),l.createElement(w.Button,{type:"button",ref:s=>{this._acceptButton=s},className:"k-time-accept",themeColor:"primary",onClick:this.handleAccept,onKeyDown:this.revertToNowButton,title:v,"aria-label":v},v)))}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}hasActiveButton(){if(!this._acceptButton||!this._acceptButton.element)return!1;const i=a.getActiveElement(document);return this._acceptButton&&i===this._acceptButton.element||this._cancelButton&&i===this._cancelButton.element}};c.propTypes={cancelButton:e.bool,className:e.string,disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),max:e.instanceOf(Date),min:e.instanceOf(Date),nowButton:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,value:e.instanceOf(Date),show:e.bool},c.defaultProps={value:null,disabled:!1,cancelButton:!0,format:"t",min:b.MIN_TIME,max:b.MAX_TIME,boundRange:!1,footer:!0};let m=c;g.registerForIntl(m);g.registerForLocalization(m);exports.TimeSelector=m;

package/timepicker/TimeSelector.mjs

@@ -112,8 +112,8 @@ const r = class r extends a.Component {
       disabled: n,
       tabIndex: o,
       className: l,
-      smoothScroll: B,
-      min: k,
+      smoothScroll: k,
+      min: B,
       max: y,
       boundRange: C,
       nowButton: D,
@@ -128,7 +128,7 @@ const r = class r extends a.Component {
           this._element = s;
         },
         tabIndex: n ? void 0 : o || 0,
-        className: E("k-timeselector", l, {
+        className: E("k-timeselector k-timeselector-md", l, {
           "k-disabled": n
         }),
         onKeyDown: this.handleKeyDown
@@ -143,8 +143,8 @@ const r = class r extends a.Component {
           onChange: this.handleChange,
           onNowClick: this.handleNowClick,
           format: i,
-          smoothScroll: B,
-          min: k,
+          smoothScroll: k,
+          min: B,
           max: y,
           boundRange: C,
           disabled: n,
@@ -155,7 +155,7 @@ const r = class r extends a.Component {
           onNowKeyDown: this.handleNowKeyDown
         }
       ),
-      this.props.footer && /* @__PURE__ */ a.createElement("div", { className: "k-time-footer k-actions k-actions-stretched" }, e && /* @__PURE__ */ a.createElement(
+      this.props.footer && /* @__PURE__ */ a.createElement("div", { className: "k-time-footer k-actions k-actions-stretched k-actions-horizontal" }, e && /* @__PURE__ */ a.createElement(
         b,
         {
           type: "button",