@progress/kendo-react-dateinputs 8.4.0-develop.3 → 8.4.0-develop.4

package/index.d.mts

@@ -2696,7 +2696,7 @@ export declare class DOMService {
     didCalculate: boolean;
     private hostContainer;
     ensureHeights(): void;
-    calculateHeights(container?: HTMLElement): void;
+    calculateHeights(container?: HTMLElement, unstyled?: any): void;
     viewHeight(viewType: CalendarViewEnum): number;
     viewWidth(viewType: CalendarViewEnum): number;
     private viewDimension;
@@ -2711,7 +2711,7 @@ declare class DOMService_2 {
     timeListHeight: number;
     didCalculate: boolean;
     ensureHeights(): void;
-    calculateHeights(container?: HTMLElement): void;
+    calculateHeights(container?: HTMLElement, unstyled?: DateInputsClassStructure): void;
 }
 
 /**

package/index.d.ts

@@ -2696,7 +2696,7 @@ export declare class DOMService {
     didCalculate: boolean;
     private hostContainer;
     ensureHeights(): void;
-    calculateHeights(container?: HTMLElement): void;
+    calculateHeights(container?: HTMLElement, unstyled?: any): void;
     viewHeight(viewType: CalendarViewEnum): number;
     viewWidth(viewType: CalendarViewEnum): number;
     private viewDimension;
@@ -2711,7 +2711,7 @@ declare class DOMService_2 {
     timeListHeight: number;
     didCalculate: boolean;
     ensureHeights(): void;
-    calculateHeights(container?: HTMLElement): void;
+    calculateHeights(container?: HTMLElement, unstyled?: DateInputsClassStructure): void;
 }
 
 /**

package/package-metadata.mjs

@@ -10,7 +10,7 @@ const e = {
   name: "@progress/kendo-react-dateinputs",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1727193857,
+  publishDate: 1727785179,
   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": "8.4.0-develop.3",
+  "version": "8.4.0-develop.4",
   "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": "8.4.0-develop.3",
-    "@progress/kendo-react-common": "8.4.0-develop.3",
-    "@progress/kendo-react-intl": "8.4.0-develop.3",
-    "@progress/kendo-react-labels": "8.4.0-develop.3",
-    "@progress/kendo-react-layout": "8.4.0-develop.3",
-    "@progress/kendo-react-popup": "8.4.0-develop.3",
+    "@progress/kendo-react-buttons": "8.4.0-develop.4",
+    "@progress/kendo-react-common": "8.4.0-develop.4",
+    "@progress/kendo-react-intl": "8.4.0-develop.4",
+    "@progress/kendo-react-labels": "8.4.0-develop.4",
+    "@progress/kendo-react-layout": "8.4.0-develop.4",
+    "@progress/kendo-react-popup": "8.4.0-develop.4",
     "@progress/kendo-svg-icons": "^3.0.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,7 +5,7 @@
  * 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 y=require("react"),u=require("prop-types"),T=require("@progress/kendo-date-math"),i=require("@progress/kendo-react-common"),b=require("@progress/kendo-react-intl"),I=require("../virtualization/Virtualization.js"),p=require("./models/TimePart.js"),M=require("./services/DayPeriodService.js"),H=require("./services/DOMService.js"),D=require("./services/HoursService.js"),E=require("./services/MinutesService.js"),P=require("./services/SecondsService.js"),v=require("../utils.js");function R(o){const n=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(n,e,t.get?t:{enumerable:!0,get:()=>o[e]})}}return n.default=o,Object.freeze(n)}const a=R(y),_=2,O=.05,w=100,C=0,S=9,N={[i.Keys.end]:(o,n)=>o[o.length-1],[i.Keys.home]:(o,n)=>o[0],[i.Keys.up]:(o,n)=>o[n-1],[i.Keys.down]:(o,n)=>o[n+1]},g={[p.TIME_PART.dayperiod]:M.DayPeriodService,[p.TIME_PART.hour]:D.HoursService,[p.TIME_PART.minute]:E.MinutesService,[p.TIME_PART.second]:P.SecondsService},l=class l extends a.Component{constructor(n){super(n),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),s=this.virtualization.activeIndex(),r=this.virtualization.itemOffset(s),h=Math.abs(Math.ceil(e)-r);if(t===s&&h<_)return r;const d=t>s;return d&&h>=this.bottomThreshold||!d&&h>this.topThreshold?this.virtualization.itemOffset(s+1):r},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+=S,this.bottomOffset+=S*2),this.topThreshold=this.itemHeight*O,this.bottomThreshold=this.itemHeight*(1-O))},this.configureServices=({min:e,max:t,value:s}=this.props)=>{if(this.service){const[r,h]=this.service.limitRange(e||this.min,t||this.max,s||this.props.value);this.service.configure(this.serviceSettings({min:r,max:h}))}},this.serviceSettings=e=>{const t={boundRange:this.props.boundRange||l.defaultProps.boundRange,insertUndividedMax:!1,min:T.cloneDate(this.min),max:T.cloneDate(this.max),part:this.props.part,step:this.step},s=Object.assign({},t,e);return s.boundRange=s.part.type!=="hour"||this.props.boundRange||l.defaultProps.boundRange,s},this.handleScrollAction=({target:e,animationInProgress:t})=>{if(!(!this.virtualization||!this.service)&&e&&!t){this.animateToIndex=!1;const s=this.virtualization.itemIndex(this.itemOffset(e.scrollTop)),r=this.service.data(this.props.value)[s];this.handleChange(r)}},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=i.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===i.Keys.down||t===i.Keys.up||t===i.Keys.end||t===i.Keys.home)&&e.preventDefault();const r=(N[e.keyCode]||i.noop)(this.service.data(this.props.value),this.service.selectedIndex(this.props.value));r&&this.handleChange(r)},this.handleChange=v.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:s}=this.props;s&&s.call(void 0,t)},w),this.dom=new H.DOMService}get element(){return this._element}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get min(){return this.props.min||l.defaultProps.min}get max(){return this.props.max||l.defaultProps.max}get step(){return this.props.step!==void 0&&this.props.step!==0?Math.floor(this.props.step):l.defaultProps.step}componentDidMount(){Promise.resolve().then(()=>{this._element&&(this.dom.calculateHeights(this._element),this.forceUpdate())})}componentDidUpdate(){if(!this.virtualization||!this.service)return;const n=this.service.selectedIndex(this.props.value);this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](n),this.animateToIndex=!0}render(){const{part:n,value:e,unstyled:t}=this.props;if(!n.type||!g[n.type])return;const s=t&&t.uTime;this.calculateHeights(),this.intl=b.provideIntlService(this),this.service=new g[n.type](this.intl),this.configureServices();const r=this.service.data(e),h="translateY("+this.topOffset+"px)",d=this.service.total(e),f=a.createElement(a.Fragment,null,a.createElement("ul",{style:{transform:h,msTransform:h},className:i.classNames(i.uTime.ul({c:s}))},r.map((c,x)=>a.createElement("li",{key:x,className:i.classNames(i.uTime.li({c:s})),onClick:()=>{this.handleChange(c)}},a.createElement("span",null,c.text)))),a.createElement("div",{className:i.classNames(i.uTime.scrollablePlaceholder({c:s}))}));return a.createElement("div",{className:i.classNames(i.uTime.list({c:s})),id:String(this.props.id||""),tabIndex:this.props.disabled?-1:0,ref:c=>{this._element=c},onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseOver:this.handleMouseOver},this.dom.didCalculate?a.createElement(I.Virtualization,{bottomOffset:this.bottomOffset,children:f,className:i.classNames(i.uTime.container({c:s})),itemHeight:this.itemHeight,maxScrollDifference:this.listHeight,onScrollAction:this.handleScrollAction,ref:c=>{this.virtualization=c},role:"presentation",skip:C,tabIndex:-1,take:d,topOffset:this.topOffset,total:d}):a.createElement("div",{className:i.classNames(i.uTime.container({c:s,content:!0,scrollable:!0}))},f))}};l.propTypes={id:u.number,max:u.instanceOf(Date),min:u.instanceOf(Date),part:function(n,e,t){const s=n[e];if(!s||!g[s.type])throw new Error(`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("react"),u=require("prop-types"),T=require("@progress/kendo-date-math"),i=require("@progress/kendo-react-common"),b=require("@progress/kendo-react-intl"),I=require("../virtualization/Virtualization.js"),p=require("./models/TimePart.js"),M=require("./services/DayPeriodService.js"),H=require("./services/DOMService.js"),D=require("./services/HoursService.js"),E=require("./services/MinutesService.js"),P=require("./services/SecondsService.js"),v=require("../utils.js");function R(o){const n=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(n,e,t.get?t:{enumerable:!0,get:()=>o[e]})}}return n.default=o,Object.freeze(n)}const a=R(x),_=2,S=.05,w=100,C=0,O=9,N={[i.Keys.end]:(o,n)=>o[o.length-1],[i.Keys.home]:(o,n)=>o[0],[i.Keys.up]:(o,n)=>o[n-1],[i.Keys.down]:(o,n)=>o[n+1]},g={[p.TIME_PART.dayperiod]:M.DayPeriodService,[p.TIME_PART.hour]:D.HoursService,[p.TIME_PART.minute]:E.MinutesService,[p.TIME_PART.second]:P.SecondsService},l=class l extends a.Component{constructor(n){super(n),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),s=this.virtualization.activeIndex(),r=this.virtualization.itemOffset(s),c=Math.abs(Math.ceil(e)-r);if(t===s&&c<_)return r;const d=t>s;return d&&c>=this.bottomThreshold||!d&&c>this.topThreshold?this.virtualization.itemOffset(s+1):r},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*S,this.bottomThreshold=this.itemHeight*(1-S))},this.configureServices=({min:e,max:t,value:s}=this.props)=>{if(this.service){const[r,c]=this.service.limitRange(e||this.min,t||this.max,s||this.props.value);this.service.configure(this.serviceSettings({min:r,max:c}))}},this.serviceSettings=e=>{const t={boundRange:this.props.boundRange||l.defaultProps.boundRange,insertUndividedMax:!1,min:T.cloneDate(this.min),max:T.cloneDate(this.max),part:this.props.part,step:this.step},s=Object.assign({},t,e);return s.boundRange=s.part.type!=="hour"||this.props.boundRange||l.defaultProps.boundRange,s},this.handleScrollAction=({target:e,animationInProgress:t})=>{if(!(!this.virtualization||!this.service)&&e&&!t){this.animateToIndex=!1;const s=this.virtualization.itemIndex(this.itemOffset(e.scrollTop)),r=this.service.data(this.props.value)[s];this.handleChange(r)}},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=i.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===i.Keys.down||t===i.Keys.up||t===i.Keys.end||t===i.Keys.home)&&e.preventDefault();const r=(N[e.keyCode]||i.noop)(this.service.data(this.props.value),this.service.selectedIndex(this.props.value));r&&this.handleChange(r)},this.handleChange=v.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:s}=this.props;s&&s.call(void 0,t)},w),this.dom=new H.DOMService}get element(){return this._element}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get min(){return this.props.min||l.defaultProps.min}get max(){return this.props.max||l.defaultProps.max}get step(){return this.props.step!==void 0&&this.props.step!==0?Math.floor(this.props.step):l.defaultProps.step}componentDidMount(){Promise.resolve().then(()=>{const{unstyled:n}=this.props;this._element&&(this.dom.calculateHeights(this._element,n),this.forceUpdate())})}componentDidUpdate(){if(!this.virtualization||!this.service)return;const n=this.service.selectedIndex(this.props.value);this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](n),this.animateToIndex=!0}render(){const{part:n,value:e,unstyled:t}=this.props;if(!n.type||!g[n.type])return;const s=t&&t.uTime;this.calculateHeights(),this.intl=b.provideIntlService(this),this.service=new g[n.type](this.intl),this.configureServices();const r=this.service.data(e),c="translateY("+this.topOffset+"px)",d=this.service.total(e),f=a.createElement(a.Fragment,null,a.createElement("ul",{style:{transform:c,msTransform:c},className:i.classNames(i.uTime.ul({c:s}))},r.map((h,y)=>a.createElement("li",{key:y,className:i.classNames(i.uTime.li({c:s})),onClick:()=>{this.handleChange(h)}},a.createElement("span",null,h.text)))),a.createElement("div",{className:i.classNames(i.uTime.scrollablePlaceholder({c:s}))}));return a.createElement("div",{className:i.classNames(i.uTime.list({c:s})),id:String(this.props.id||""),tabIndex:this.props.disabled?-1:0,ref:h=>{this._element=h},onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseOver:this.handleMouseOver},this.dom.didCalculate?a.createElement(I.Virtualization,{bottomOffset:this.bottomOffset,children:f,className:i.classNames(i.uTime.containerSelector({c:s}),i.uTime.container({c:s})),itemHeight:this.itemHeight,maxScrollDifference:this.listHeight,onScrollAction:this.handleScrollAction,ref:h=>{this.virtualization=h},role:"presentation",skip:C,tabIndex:-1,take:d,topOffset:this.topOffset,total:d,unstyled:t}):a.createElement("div",{className:i.classNames(i.uTime.containerSelector({c:s}),i.uTime.container({c:s,content:!0,scrollable:!0}))},f))}};l.propTypes={id:u.number,max:u.instanceOf(Date),min:u.instanceOf(Date),part:function(n,e,t){const s=n[e];if(!s||!g[s.type])throw new Error(`
                     Invalid prop '${e}' supplied to ${t}.
                     Supported part types are hour|minute|second|dayperiod.
                 `);return null},step:function(n,e,t){const s=n[e];if(s!==void 0&&s<=0)throw new Error(`

package/timepicker/TimeList.mjs

@@ -7,9 +7,9 @@
  */
 "use client";
 import * as n from "react";
-import p from "prop-types";
+import m from "prop-types";
 import { cloneDate as O } from "@progress/kendo-date-math";
-import { Keys as l, getActiveElement as I, noop as H, classNames as m, uTime as u } from "@progress/kendo-react-common";
+import { Keys as c, getActiveElement as I, noop as H, classNames as u, uTime as l } from "@progress/kendo-react-common";
 import { provideIntlService as y, registerForIntl as E } from "@progress/kendo-react-intl";
 import { Virtualization as M } from "../virtualization/Virtualization.mjs";
 import { TIME_PART as f } from "./models/TimePart.mjs";
@@ -19,11 +19,11 @@ import { HoursService as R } from "./services/HoursService.mjs";
 import { MinutesService as C } from "./services/MinutesService.mjs";
 import { SecondsService as P } from "./services/SecondsService.mjs";
 import { debounce as z, MAX_TIME as _, MIDNIGHT_DATE as A } from "../utils.mjs";
-const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
-  [l.end]: (h, s) => h[h.length - 1],
-  [l.home]: (h, s) => h[0],
-  [l.up]: (h, s) => h[s - 1],
-  [l.down]: (h, s) => h[s + 1]
+const F = 2, S = 0.05, N = 100, k = 0, T = 9, B = {
+  [c.end]: (h, s) => h[h.length - 1],
+  [c.home]: (h, s) => h[0],
+  [c.up]: (h, s) => h[s - 1],
+  [c.down]: (h, s) => h[s + 1]
 }, g = {
   [f.dayperiod]: D,
   [f.hour]: R,
@@ -38,40 +38,40 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
     }, 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), a = Math.abs(Math.ceil(t) - o);
-      if (e === i && a < F)
+      const i = this.service.selectedIndex(this.props.value), e = this.virtualization.activeIndex(), o = this.virtualization.itemOffset(e), a = Math.abs(Math.ceil(t) - o);
+      if (i === e && a < F)
         return o;
-      const d = e > i;
-      return d && a >= this.bottomThreshold || !d && a > this.topThreshold ? this.virtualization.itemOffset(i + 1) : o;
+      const d = i > e;
+      return d && a >= this.bottomThreshold || !d && a > this.topThreshold ? this.virtualization.itemOffset(e + 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 += b, this.bottomOffset += b * 2), this.topThreshold = this.itemHeight * T, this.bottomThreshold = this.itemHeight * (1 - T));
-    }, this.configureServices = ({ min: t, max: e, value: i } = this.props) => {
+      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 += T, this.bottomOffset += T * 2), this.topThreshold = this.itemHeight * S, this.bottomThreshold = this.itemHeight * (1 - S));
+    }, this.configureServices = ({ min: t, max: i, value: e } = this.props) => {
       if (this.service) {
-        const [o, a] = this.service.limitRange(t || this.min, e || this.max, i || this.props.value);
+        const [o, a] = this.service.limitRange(t || this.min, i || this.max, e || this.props.value);
         this.service.configure(this.serviceSettings({ min: o, max: a }));
       }
     }, this.serviceSettings = (t) => {
-      const e = {
+      const i = {
         boundRange: this.props.boundRange || r.defaultProps.boundRange,
         insertUndividedMax: !1,
         min: O(this.min),
         max: O(this.max),
         part: this.props.part,
         step: this.step
-      }, i = Object.assign({}, e, t);
-      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) {
+      }, e = Object.assign({}, i, t);
+      return e.boundRange = e.part.type !== "hour" || this.props.boundRange || r.defaultProps.boundRange, e;
+    }, this.handleScrollAction = ({ target: t, animationInProgress: i }) => {
+      if (!(!this.virtualization || !this.service) && t && !i) {
         this.animateToIndex = !1;
-        const i = this.virtualization.itemIndex(this.itemOffset(t.scrollTop)), o = this.service.data(this.props.value)[i];
+        const e = this.virtualization.itemIndex(this.itemOffset(t.scrollTop)), o = this.service.data(this.props.value)[e];
         this.handleChange(o);
       }
     }, this.handleFocus = (t) => {
-      const { onFocus: e } = this.props;
-      e && e.call(void 0, t);
+      const { onFocus: i } = this.props;
+      i && i.call(void 0, t);
     }, this.handleBlur = (t) => {
-      const { onBlur: e } = this.props;
-      e && e.call(void 0, t);
+      const { onBlur: i } = this.props;
+      i && i.call(void 0, t);
     }, this.handleMouseOver = () => {
       if (!this._element)
         return;
@@ -80,8 +80,8 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
     }, this.handleKeyDown = (t) => {
       if (!this.service)
         return;
-      const { keyCode: e } = t;
-      (e === l.down || e === l.up || e === l.end || e === l.home) && t.preventDefault();
+      const { keyCode: i } = t;
+      (i === c.down || i === c.up || i === c.end || i === c.home) && t.preventDefault();
       const o = (B[t.keyCode] || H)(
         this.service.data(this.props.value),
         this.service.selectedIndex(this.props.value)
@@ -90,11 +90,11 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
     }, this.handleChange = z((t) => {
       if (!this.service)
         return;
-      const e = this.service.apply(this.props.value, t.value);
-      if (this.props.value.getTime() === e.getTime())
+      const i = this.service.apply(this.props.value, t.value);
+      if (this.props.value.getTime() === i.getTime())
         return;
-      const { onChange: i } = this.props;
-      i && i.call(void 0, e);
+      const { onChange: e } = this.props;
+      e && e.call(void 0, i);
     }, N), this.dom = new w();
   }
   get element() {
@@ -117,7 +117,8 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
    */
   componentDidMount() {
     Promise.resolve().then(() => {
-      this._element && (this.dom.calculateHeights(this._element), this.forceUpdate());
+      const { unstyled: s } = this.props;
+      this._element && (this.dom.calculateHeights(this._element, s), this.forceUpdate());
     });
   }
   /**
@@ -133,29 +134,29 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
    * @hidden
    */
   render() {
-    const { part: s, value: t, unstyled: e } = this.props;
+    const { part: s, value: t, unstyled: i } = this.props;
     if (!s.type || !g[s.type])
       return;
-    const i = e && e.uTime;
+    const e = i && i.uTime;
     this.calculateHeights(), this.intl = y(this), this.service = new g[s.type](this.intl), this.configureServices();
     const o = this.service.data(t), a = "translateY(" + this.topOffset + "px)", d = this.service.total(t), v = /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
       "ul",
       {
         style: { transform: a, msTransform: a },
-        className: m(u.ul({ c: i }))
+        className: u(l.ul({ c: e }))
       },
-      o.map((c, S) => /* @__PURE__ */ n.createElement("li", { key: S, className: m(u.li({ c: i })), onClick: () => {
-        this.handleChange(c);
-      } }, /* @__PURE__ */ n.createElement("span", null, c.text)))
-    ), /* @__PURE__ */ n.createElement("div", { className: m(u.scrollablePlaceholder({ c: i })) }));
+      o.map((p, b) => /* @__PURE__ */ n.createElement("li", { key: b, className: u(l.li({ c: e })), onClick: () => {
+        this.handleChange(p);
+      } }, /* @__PURE__ */ n.createElement("span", null, p.text)))
+    ), /* @__PURE__ */ n.createElement("div", { className: u(l.scrollablePlaceholder({ c: e })) }));
     return /* @__PURE__ */ n.createElement(
       "div",
       {
-        className: m(u.list({ c: i })),
+        className: u(l.list({ c: e })),
         id: String(this.props.id || ""),
         tabIndex: this.props.disabled ? -1 : 0,
-        ref: (c) => {
-          this._element = c;
+        ref: (p) => {
+          this._element = p;
         },
         onKeyDown: this.handleKeyDown,
         onFocus: this.handleFocus,
@@ -167,49 +168,56 @@ const F = 2, T = 0.05, N = 100, k = 0, b = 9, B = {
         {
           bottomOffset: this.bottomOffset,
           children: v,
-          className: m(u.container({ c: i })),
+          className: u(
+            l.containerSelector({ c: e }),
+            l.container({ c: e })
+          ),
           itemHeight: this.itemHeight,
           maxScrollDifference: this.listHeight,
           onScrollAction: this.handleScrollAction,
-          ref: (c) => {
-            this.virtualization = c;
+          ref: (p) => {
+            this.virtualization = p;
           },
           role: "presentation",
           skip: k,
           tabIndex: -1,
           take: d,
           topOffset: this.topOffset,
-          total: d
+          total: d,
+          unstyled: i
         }
-      ) : /* @__PURE__ */ n.createElement("div", { className: m(u.container({ c: i, content: !0, scrollable: !0 })) }, v)
+      ) : /* @__PURE__ */ n.createElement("div", { className: u(
+        l.containerSelector({ c: e }),
+        l.container({ c: e, content: !0, scrollable: !0 })
+      ) }, v)
     );
   }
 };
 r.propTypes = {
-  id: p.number,
-  max: p.instanceOf(Date),
-  min: p.instanceOf(Date),
-  part: function(s, t, e) {
-    const i = s[t];
-    if (!i || !g[i.type])
+  id: m.number,
+  max: m.instanceOf(Date),
+  min: m.instanceOf(Date),
+  part: function(s, t, i) {
+    const e = s[t];
+    if (!e || !g[e.type])
       throw new Error(`
-                    Invalid prop '${t}' supplied to ${e}.
+                    Invalid prop '${t}' supplied to ${i}.
                     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)
+  step: function(s, t, i) {
+    const e = s[t];
+    if (e !== void 0 && e <= 0)
       throw new Error(`
-                    Invalid prop '${t}' supplied to ${e}.
+                    Invalid prop '${t}' supplied to ${i}.
                     ${t} cannot be less than 1.
                 `);
     return null;
   },
-  value: p.instanceOf(Date),
-  smoothScroll: p.bool,
-  show: p.bool
+  value: m.instanceOf(Date),
+  smoothScroll: m.bool,
+  show: m.bool
 }, r.defaultProps = {
   boundRange: !1,
   max: _,

package/timepicker/services/DOMService.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("../../utils.js"),h=require("@progress/kendo-react-common");class d{constructor(){this.itemHeight=0,this.timeListHeight=0,this.didCalculate=!1}ensureHeights(){this.timeListHeight===void 0&&this.calculateHeights()}calculateHeights(s){if(!h.canUseDOM)return;const e=t.domContainerFactory("div"),r=t.domContainerFactory("span"),n=t.domContainerFactory("ul"),c=t.domContainerFactory("li"),l=()=>c("<span>02</span>","k-item"),a=()=>n([l()],"k-reset"),u=()=>e([a()],"k-content k-scrollable k-time-container"),m=e([r("minute","k-title"),e([u()],"k-time-list")],"k-time-list-wrapper",{left:"-10000px",position:"absolute"}),o=s&&s.querySelector(".k-time-container")||document.body,i=o.appendChild(m);this.timeListHeight=i.querySelector(".k-scrollable").offsetHeight,this.itemHeight=i.querySelector("li").offsetHeight,o.removeChild(i),this.didCalculate=!0}}exports.DOMService=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../utils.js"),e=require("@progress/kendo-react-common");class g{constructor(){this.itemHeight=0,this.timeListHeight=0,this.didCalculate=!1}ensureHeights(){this.timeListHeight===void 0&&this.calculateHeights()}calculateHeights(o,c){if(!e.canUseDOM)return;const t=c&&c.uTime,s=i.domContainerFactory("div"),l=i.domContainerFactory("span"),u=i.domContainerFactory("ul"),m=i.domContainerFactory("li"),p=()=>m("<span>02</span>",e.strippedClassNames(e.uTime.li({c:t}))),d=()=>u([p()],e.strippedClassNames(e.uTime.ul({c:t}))),h=()=>s([d()],e.strippedClassNames(e.uTime.containerSelector({c:t}),e.uTime.container({c:t,content:!0,scrollable:!0}))),C=s([l("minute",e.strippedClassNames(e.uTime.title({c:t}))),s([h()],e.strippedClassNames(e.uTime.list({c:t})))],e.strippedClassNames(e.uTime.listWrapper({c:t})),{left:"-10000px",position:"absolute"}),a=`.${e.strippedClassNames(e.uTime.containerSelector({c:t}))}`,n=o&&o.querySelector(a)||document.body,r=n.appendChild(C);this.timeListHeight=r.querySelector(a).offsetHeight,this.itemHeight=r.querySelector("li").offsetHeight,n.removeChild(r),this.didCalculate=!0}}exports.DOMService=g;

package/timepicker/services/DOMService.mjs

@@ -6,29 +6,32 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import { domContainerFactory as t } from "../../utils.mjs";
-import { canUseDOM as p } from "@progress/kendo-react-common";
-class H {
+import { domContainerFactory as s } from "../../utils.mjs";
+import { canUseDOM as C, strippedClassNames as i, uTime as e } from "@progress/kendo-react-common";
+class y {
   constructor() {
     this.itemHeight = 0, this.timeListHeight = 0, this.didCalculate = !1;
   }
   ensureHeights() {
     this.timeListHeight === void 0 && this.calculateHeights();
   }
-  calculateHeights(s) {
-    if (!p)
+  calculateHeights(c, n) {
+    if (!C)
       return;
-    const e = t("div"), r = t("span"), l = t("ul"), n = t("li"), c = () => n("<span>02</span>", "k-item"), a = () => l([c()], "k-reset"), m = () => e([a()], "k-content k-scrollable k-time-container"), h = e(
+    const t = n && n.uTime, o = s("div"), p = s("span"), u = s("ul"), h = s("li"), m = () => h("<span>02</span>", i(e.li({ c: t }))), d = () => u([m()], i(e.ul({ c: t }))), f = () => o([d()], i(
+      e.containerSelector({ c: t }),
+      e.container({ c: t, content: !0, scrollable: !0 })
+    )), g = o(
       [
-        r("minute", "k-title"),
-        e([m()], "k-time-list")
+        p("minute", i(e.title({ c: t }))),
+        o([f()], i(e.list({ c: t })))
       ],
-      "k-time-list-wrapper",
+      i(e.listWrapper({ c: t })),
       { left: "-10000px", position: "absolute" }
-    ), o = s && s.querySelector(".k-time-container") || document.body, i = o.appendChild(h);
-    this.timeListHeight = i.querySelector(".k-scrollable").offsetHeight, this.itemHeight = i.querySelector("li").offsetHeight, o.removeChild(i), this.didCalculate = !0;
+    ), l = `.${i(e.containerSelector({ c: t }))}`, a = c && c.querySelector(l) || document.body, r = a.appendChild(g);
+    this.timeListHeight = r.querySelector(l).offsetHeight, this.itemHeight = r.querySelector("li").offsetHeight, a.removeChild(r), this.didCalculate = !0;
   }
 }
 export {
-  H as DOMService
+  y as DOMService
 };

package/virtualization/Virtualization.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 w=require("react"),s=require("prop-types"),d=require("@progress/kendo-react-common"),H=require("./services/ScrollerService.js");function P(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const g=P(w),T=(r,e,t)=>Math.min(Math.abs(e-r),t),C=17,O=10,A={1:r=>e=>e+r,0:r=>e=>e-r},x={1:r=>e=>Math.min(e,r),0:r=>e=>Math.max(e,r)},I={1:r=>e=>e<r,0:r=>e=>e>r},a=class a extends g.Component{constructor(e){super(e),this.rowHeightService=null,this.scrollContainer=null,this.lastDirection=null,this.lastTotal=0,this.lastTake=0,this.animationInProgress=!1,this.restrictScroll=!1,this.scrollTo=t=>{const i=this.direction==="vertical"?"scrollTop":"scrollLeft";if(!this.scrollContainer)return;const o=this.scrollContainer[i];this.restrictScroll&&i==="scrollTop"&&(!Number.isInteger(o)||!Number.isInteger(t))&&Math.abs(o-t)<O||(this.scrollContainer[i]=t)},this.scrollToIndex=t=>{this.animationInProgress=!1,this.rowHeightService&&this.scrollTo(this.rowHeightService.offset(t))},this.animateToIndex=t=>{if(!this.rowHeightService||!window)return;window.cancelAnimationFrame(this.cancelAnimation);const i=this.rowHeightService.offset(t),o=this.getContainerScrollDirection(i);let{start:n,end:l}=this.scrollRange(i,o);if(n===l)return;const h=this.scrollStep(n,l),c=A[o](h),f=x[o](l),u=I[o](c(l)),m=p=>{this.animationInProgress=!0;const S=c(p);this.scrollTo(f(S)),u(S)?this.cancelAnimation=window.requestAnimationFrame(()=>{m(S)}):this.animationInProgress=!1};this.cancelAnimation=window.requestAnimationFrame(()=>{m(n)})},this.scrollToBottom=()=>{this.rowHeightService&&this.scrollTo(this.rowHeightService.totalHeight()+this.props.bottomOffset)},this.scrollStep=(t,i)=>{const o=this.props.scrollDuration||a.defaultProps.scrollDuration;return Math.abs(i-t)/(o/C)},this.scrollRange=(t,i)=>{const o=this.containerScrollPosition;if(parseInt(`${t}`,10)===parseInt(`${o}`,10))return{start:t,end:t};const n=this.containerMaxScroll(),l=i===0?1:-1,h=T(o,t,this.props.maxScrollDifference||0),c=Math.min(t,n);return{start:Math.min(Math.max(c+l*h,0),n),end:c}},this.containerMaxScroll=()=>this.containerScrollSize-this.containerOffsetSize,this.getContainerScrollDirection=t=>t<this.containerScrollPosition?0:1,this.initServices=(t=this.props)=>{const i=this.direction==="vertical"?t.itemHeight:t.itemWidth;i!==void 0&&(this.rowHeightService=new d.RowHeightService(t.total,i,0),this.scrollerService.create(this.rowHeightService,t.skip,t.take,t.total,t.topOffset,this.scrollOffsetSize,this.direction))},this.getContainerProperty=t=>this.scrollContainer?this.scrollContainer[t]:0,this.handleScroll=t=>{if(!this.scrollContainer||!this.rowHeightService)return;const i=t.target;this.scrollerService.onScroll({scrollLeft:i.scrollLeft,scrollTop:i.scrollTop,offsetHeight:i.offsetHeight,offsetWidth:i.offsetWidth});const o=this.rowHeightService.index(this.containerScrollPosition-this.props.topOffset),{onScrollAction:n}=this.props,l={index:o,target:i,scrollAction:this.scrollAction,pageAction:this.pageAction,animationInProgress:this.animationInProgress};this.props.onScroll&&this.props.onScroll.call(void 0,t),n&&n.call(void 0,l),this.scrollAction=void 0,this.pageAction=void 0},this.handleScrollAction=t=>{this.scrollAction=t},this.handlePageAction=t=>{this.pageAction=t},this.scrollerService=new H.ScrollerService(this.handleScrollAction,this.handlePageAction),this.restrictScroll=Number.parseFloat(g.version)>17}get element(){return this.scrollContainer}get containerOffsetSize(){return this.getContainerProperty(this.direction==="vertical"?"offsetHeight":"offsetWidth")}get containerScrollSize(){return this.getContainerProperty(this.direction==="vertical"?"scrollHeight":"scrollWidth")}get containerScrollPosition(){return this.getContainerProperty(this.direction==="vertical"?"scrollTop":"scrollLeft")}get direction(){return this.props.direction!==void 0?this.props.direction:a.defaultProps.direction}get scrollOffsetSize(){return this.props.scrollOffsetSize!==void 0?this.props.scrollOffsetSize:a.defaultProps.scrollOffsetSize}activeIndex(){return this.itemIndex(Math.ceil(this.containerScrollPosition))}itemIndex(e){return this.rowHeightService?this.rowHeightService.index(e):0}itemOffset(e){return this.rowHeightService?this.rowHeightService.offset(e):0}isIndexVisible(e){if(!this.rowHeightService)return!1;const t=this.containerScrollPosition,i=t+this.containerOffsetSize,o=this.rowHeightService.offset(e),n=o+this.rowHeightService.height(e);return o>=t&&n<=i}isListScrolled(e){return this.rowHeightService?this.containerScrollPosition!==this.rowHeightService.offset(e):!1}componentDidMount(){const{onMount:e}=this.props;e&&e.call(void 0,this)}render(){const{total:e,take:t,bottomOffset:i,className:o,tabIndex:n,role:l,children:h,unstyled:c}=this.props,f=c&&c.uCalendar;(this.lastTotal!==e||this.lastDirection!==this.direction||this.lastTake!==t)&&(this.initServices(),this.lastTotal=e,this.lastDirection=this.direction,this.lastTake=t);const u=`${(this.rowHeightService?this.rowHeightService.totalHeight():0)+i}`,m=this.direction==="vertical"?{height:`${u}px`}:{width:`${u}px`},p=d.classNames(d.uCalendar.scrollable({c:f,horizontal:this.direction==="horizontal"}),o),S=d.classNames(d.uCalendar.scrollablePlaceholder({c:f,horizontal:this.direction==="horizontal"}));return g.createElement("div",{ref:b=>{this.scrollContainer=b},onScroll:this.handleScroll,className:p,tabIndex:n,role:l},h,g.createElement("div",{style:m,className:S}))}};a.propTypes={bottomOffset:s.number.isRequired,className:s.string,direction:s.oneOf(["horizontal","vertical"]),forceScroll:s.bool,itemHeight:s.number,itemWidth:s.number,maxScrollDifference:s.number,onScroll:s.func,onScrollAction:s.func,scrollDuration:s.number,scrollOffsetSize:s.number,skip:s.number.isRequired,tabIndex:s.number,take:s.number.isRequired,topOffset:s.number.isRequired,total:s.number.isRequired,role:s.string},a.defaultProps={direction:"vertical",forceScroll:!1,scrollOffsetSize:0,maxScrollDifference:100,scrollDuration:100};let v=a;exports.Virtualization=v;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),s=require("prop-types"),f=require("@progress/kendo-react-common"),H=require("./services/ScrollerService.js");function P(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const g=P(w),T=(r,e,t)=>Math.min(Math.abs(e-r),t),C=17,O=10,A={1:r=>e=>e+r,0:r=>e=>e-r},x={1:r=>e=>Math.min(e,r),0:r=>e=>Math.max(e,r)},I={1:r=>e=>e<r,0:r=>e=>e>r},a=class a extends g.Component{constructor(e){super(e),this.rowHeightService=null,this.scrollContainer=null,this.lastDirection=null,this.lastTotal=0,this.lastTake=0,this.animationInProgress=!1,this.restrictScroll=!1,this.scrollTo=t=>{const i=this.direction==="vertical"?"scrollTop":"scrollLeft";if(!this.scrollContainer)return;const o=this.scrollContainer[i];this.restrictScroll&&i==="scrollTop"&&(!Number.isInteger(o)||!Number.isInteger(t))&&Math.abs(o-t)<O||(this.scrollContainer[i]=t)},this.scrollToIndex=t=>{this.animationInProgress=!1,this.rowHeightService&&this.scrollTo(this.rowHeightService.offset(t))},this.animateToIndex=t=>{if(!this.rowHeightService||!window)return;window.cancelAnimationFrame(this.cancelAnimation);const i=this.rowHeightService.offset(t),o=this.getContainerScrollDirection(i);let{start:n,end:l}=this.scrollRange(i,o);if(n===l)return;const S=this.scrollStep(n,l),c=A[o](S),h=x[o](l),u=I[o](c(l)),m=p=>{this.animationInProgress=!0;const d=c(p);this.scrollTo(h(d)),u(d)?this.cancelAnimation=window.requestAnimationFrame(()=>{m(d)}):this.animationInProgress=!1};this.cancelAnimation=window.requestAnimationFrame(()=>{m(n)})},this.scrollToBottom=()=>{this.rowHeightService&&this.scrollTo(this.rowHeightService.totalHeight()+this.props.bottomOffset)},this.scrollStep=(t,i)=>{const o=this.props.scrollDuration||a.defaultProps.scrollDuration;return Math.abs(i-t)/(o/C)},this.scrollRange=(t,i)=>{const o=this.containerScrollPosition;if(parseInt(`${t}`,10)===parseInt(`${o}`,10))return{start:t,end:t};const n=this.containerMaxScroll(),l=i===0?1:-1,S=T(o,t,this.props.maxScrollDifference||0),c=Math.min(t,n);return{start:Math.min(Math.max(c+l*S,0),n),end:c}},this.containerMaxScroll=()=>this.containerScrollSize-this.containerOffsetSize,this.getContainerScrollDirection=t=>t<this.containerScrollPosition?0:1,this.initServices=(t=this.props)=>{const i=this.direction==="vertical"?t.itemHeight:t.itemWidth;i!==void 0&&(this.rowHeightService=new f.RowHeightService(t.total,i,0),this.scrollerService.create(this.rowHeightService,t.skip,t.take,t.total,t.topOffset,this.scrollOffsetSize,this.direction))},this.getContainerProperty=t=>this.scrollContainer?this.scrollContainer[t]:0,this.handleScroll=t=>{if(!this.scrollContainer||!this.rowHeightService)return;const i=t.target;this.scrollerService.onScroll({scrollLeft:i.scrollLeft,scrollTop:i.scrollTop,offsetHeight:i.offsetHeight,offsetWidth:i.offsetWidth});const o=this.rowHeightService.index(this.containerScrollPosition-this.props.topOffset),{onScrollAction:n}=this.props,l={index:o,target:i,scrollAction:this.scrollAction,pageAction:this.pageAction,animationInProgress:this.animationInProgress};this.props.onScroll&&this.props.onScroll.call(void 0,t),n&&n.call(void 0,l),this.scrollAction=void 0,this.pageAction=void 0},this.handleScrollAction=t=>{this.scrollAction=t},this.handlePageAction=t=>{this.pageAction=t},this.scrollerService=new H.ScrollerService(this.handleScrollAction,this.handlePageAction),this.restrictScroll=Number.parseFloat(g.version)>17}get element(){return this.scrollContainer}get containerOffsetSize(){return this.getContainerProperty(this.direction==="vertical"?"offsetHeight":"offsetWidth")}get containerScrollSize(){return this.getContainerProperty(this.direction==="vertical"?"scrollHeight":"scrollWidth")}get containerScrollPosition(){return this.getContainerProperty(this.direction==="vertical"?"scrollTop":"scrollLeft")}get direction(){return this.props.direction!==void 0?this.props.direction:a.defaultProps.direction}get scrollOffsetSize(){return this.props.scrollOffsetSize!==void 0?this.props.scrollOffsetSize:a.defaultProps.scrollOffsetSize}activeIndex(){return this.itemIndex(Math.ceil(this.containerScrollPosition))}itemIndex(e){return this.rowHeightService?this.rowHeightService.index(e):0}itemOffset(e){return this.rowHeightService?this.rowHeightService.offset(e):0}isIndexVisible(e){if(!this.rowHeightService)return!1;const t=this.containerScrollPosition,i=t+this.containerOffsetSize,o=this.rowHeightService.offset(e),n=o+this.rowHeightService.height(e);return o>=t&&n<=i}isListScrolled(e){return this.rowHeightService?this.containerScrollPosition!==this.rowHeightService.offset(e):!1}componentDidMount(){const{onMount:e}=this.props;e&&e.call(void 0,this)}render(){const{total:e,take:t,bottomOffset:i,className:o,tabIndex:n,role:l,children:S,unstyled:c}=this.props,h=c&&c.uCalendar;(this.lastTotal!==e||this.lastDirection!==this.direction||this.lastTake!==t)&&(this.initServices(),this.lastTotal=e,this.lastDirection=this.direction,this.lastTake=t);const u=`${(this.rowHeightService?this.rowHeightService.totalHeight():0)+i}`,m=this.direction==="vertical"?{height:`${u}px`}:{width:`${u}px`},p=f.classNames(f.uCalendar.scrollableSelector({c:h}),f.uCalendar.scrollable({c:h,horizontal:this.direction==="horizontal"}),o),d=f.classNames(f.uCalendar.scrollablePlaceholder({c:h,horizontal:this.direction==="horizontal"}));return g.createElement("div",{ref:b=>{this.scrollContainer=b},onScroll:this.handleScroll,className:p,tabIndex:n,role:l},S,g.createElement("div",{style:m,className:d}))}};a.propTypes={bottomOffset:s.number.isRequired,className:s.string,direction:s.oneOf(["horizontal","vertical"]),forceScroll:s.bool,itemHeight:s.number,itemWidth:s.number,maxScrollDifference:s.number,onScroll:s.func,onScrollAction:s.func,scrollDuration:s.number,scrollOffsetSize:s.number,skip:s.number.isRequired,tabIndex:s.number,take:s.number.isRequired,topOffset:s.number.isRequired,total:s.number.isRequired,role:s.string},a.defaultProps={direction:"vertical",forceScroll:!1,scrollOffsetSize:0,maxScrollDifference:100,scrollDuration:100};let v=a;exports.Virtualization=v;

package/virtualization/Virtualization.mjs

@@ -8,7 +8,7 @@
 "use client";
 import * as u from "react";
 import o from "prop-types";
-import { RowHeightService as b, classNames as p, uCalendar as v } from "@progress/kendo-react-common";
+import { RowHeightService as b, classNames as v, uCalendar as p } from "@progress/kendo-react-common";
 import { ScrollerService as P } from "./services/ScrollerService.mjs";
 const T = (s, i, t) => Math.min(Math.abs(i - s), t), A = 17, C = 10, x = {
   1: (s) => (i) => i + s,
@@ -37,10 +37,10 @@ const T = (s, i, t) => Math.min(Math.abs(i - s), t), A = 17, C = 10, x = {
       let { start: n, end: l } = this.scrollRange(e, r);
       if (n === l)
         return;
-      const h = this.scrollStep(n, l), c = x[r](h), f = I[r](l), d = M[r](c(l)), m = (g) => {
+      const f = this.scrollStep(n, l), c = x[r](f), h = I[r](l), d = M[r](c(l)), m = (g) => {
         this.animationInProgress = !0;
         const S = c(g);
-        this.scrollTo(f(S)), d(S) ? this.cancelAnimation = window.requestAnimationFrame(() => {
+        this.scrollTo(h(S)), d(S) ? this.cancelAnimation = window.requestAnimationFrame(() => {
           m(S);
         }) : this.animationInProgress = !1;
       };
@@ -56,8 +56,8 @@ const T = (s, i, t) => Math.min(Math.abs(i - s), t), A = 17, C = 10, x = {
       const r = this.containerScrollPosition;
       if (parseInt(`${t}`, 10) === parseInt(`${r}`, 10))
         return { start: t, end: t };
-      const n = this.containerMaxScroll(), l = e === 0 ? 1 : -1, h = T(r, t, this.props.maxScrollDifference || 0), c = Math.min(t, n);
-      return { start: Math.min(Math.max(c + l * h, 0), n), end: c };
+      const n = this.containerMaxScroll(), l = e === 0 ? 1 : -1, f = T(r, t, this.props.maxScrollDifference || 0), c = Math.min(t, n);
+      return { start: Math.min(Math.max(c + l * f, 0), n), end: c };
     }, this.containerMaxScroll = () => this.containerScrollSize - this.containerOffsetSize, this.getContainerScrollDirection = (t) => t < this.containerScrollPosition ? 0 : 1, this.initServices = (t = this.props) => {
       const e = this.direction === "vertical" ? t.itemHeight : t.itemWidth;
       e !== void 0 && (this.rowHeightService = new b(t.total, e, 0), this.scrollerService.create(
@@ -137,17 +137,20 @@ const T = (s, i, t) => Math.min(Math.abs(i - s), t), A = 17, C = 10, x = {
     i && i.call(void 0, this);
   }
   render() {
-    const { total: i, take: t, bottomOffset: e, className: r, tabIndex: n, role: l, children: h, unstyled: c } = this.props, f = c && c.uCalendar;
+    const { total: i, take: t, bottomOffset: e, className: r, tabIndex: n, role: l, children: f, unstyled: c } = this.props, h = c && c.uCalendar;
     (this.lastTotal !== i || this.lastDirection !== this.direction || this.lastTake !== t) && (this.initServices(), this.lastTotal = i, this.lastDirection = this.direction, this.lastTake = t);
-    const d = `${(this.rowHeightService ? this.rowHeightService.totalHeight() : 0) + e}`, m = this.direction === "vertical" ? { height: `${d}px` } : { width: `${d}px` }, g = p(
-      v.scrollable({
-        c: f,
+    const d = `${(this.rowHeightService ? this.rowHeightService.totalHeight() : 0) + e}`, m = this.direction === "vertical" ? { height: `${d}px` } : { width: `${d}px` }, g = v(
+      p.scrollableSelector({
+        c: h
+      }),
+      p.scrollable({
+        c: h,
         horizontal: this.direction === "horizontal"
       }),
       r
-    ), S = p(
-      v.scrollablePlaceholder({
-        c: f,
+    ), S = v(
+      p.scrollablePlaceholder({
+        c: h,
         horizontal: this.direction === "horizontal"
       })
     );
@@ -162,7 +165,7 @@ const T = (s, i, t) => Math.min(Math.abs(i - s), t), A = 17, C = 10, x = {
         tabIndex: n,
         role: l
       },
-      h,
+      f,
       /* @__PURE__ */ u.createElement(
         "div",
         {