@progress/kendo-react-dateinputs/calendar/services/DOMService.js

React DateInput is a perfect input component for handling quick and efficient date values. KendoReact Date Inputs package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("../models/CalendarViewEnum.js"),n=require("../../utils.js"),e=require("@progress/kendo-react-common");class I{constructor(){this.calendarHeight=0,this.headerHeight=0,this.monthViewHeight=0,this.yearViewHeight=0,this.decadeViewHeight=0,this.centuryViewHeight=0,this.navigationItemHeight=0,this.scrollableContentHeight=0,this.scrollableYearContentHeight=0,this.calendarWidth=0,this.monthViewWidth=0,this.yearViewWidth=0,this.decadeViewWidth=0,this.centuryViewWidth=0,this.scrollableContentWidth=0,this.didCalculate=!1,this.hostContainer=null}ensureHeights(){this.calendarHeight===void 0&&this.calculateHeights()}calculateHeights(r,o){if(!e.canUseDOM)return;const i=n.domContainerFactory("div"),u=n.domContainerFactory("ul"),S=n.domContainerFactory("li"),V=n.domContainerFactory("td"),D=n.domContainerFactory("th"),m=n.domContainerFactory("tr"),M=n.domContainerFactory("tbody"),O=n.domContainerFactory("thead"),v=n.domContainerFactory("table"),s=o&&o.uCalendar,H=o&&o.uButton,z=e.strippedClassNames(e.uButton.wrapper({c:H,fillMode:"flat",size:"medium",rounded:"medium",themeColor:"primary"}),e.uCalendar.title({c:s})),N=()=>i(`
                <span class="${z}">
                    <span class="${e.strippedClassNames(e.uButton.text({c:H}))}">March 2017</span>
                </span>
                <span class="${e.strippedClassNames(e.uCalendar.spacer({c:s}))}"></span>
                <span class="${e.strippedClassNames(e.uCalendar.nav({c:s}))}"><button class="${e.strippedClassNames(e.uCalendar.today({c:s}))}">TODAY</button></span>
            `,e.strippedClassNames(e.uCalendar.header({c:s,vertical:!0}))),q=()=>v([O([m([D("MO",e.strippedClassNames(e.uCalendar.th({c:s})))],e.strippedClassNames(e.uCalendar.tr({c:s})))],e.strippedClassNames(e.uCalendar.thead({c:s})))],e.strippedClassNames(e.uCalendar.table({c:s,weekdays:!0}))),f=(t,a)=>new Array(t).fill("1").map(a),k=(t,a=1)=>v([M([m([V("1",e.strippedClassNames(e.uCalendar.td({c:s,isWeek:!0})))])].concat(f(t,()=>m(f(a,d=>V(`<span class="${e.strippedClassNames(e.uCalendar.link({c:s}))}">${d}</span>`,e.strippedClassNames(e.uCalendar.td({c:s})))),e.strippedClassNames(e.uCalendar.tr({c:s}))))),e.strippedClassNames(e.uCalendar.tbody({c:s})))],e.strippedClassNames(e.uCalendar.table({c:s}))),w=t=>i(t,e.strippedClassNames(e.uCalendar.scrollableSelector({c:s}),e.uCalendar.scrollable({c:s,horizontal:!0}))),B=(t,a,d)=>i(d?[N(),q(),w([t,t])]:[N(),w([t,t])],a,{left:"-10000px",position:"absolute"}),Y=(()=>{let t;return()=>e.canUseDOM?(t||(t=i([w([u([S("<span>FEB</span>")])])],e.strippedClassNames(e.uCalendar.navigation({c:s})),{left:"0px",position:"absolute"})),t):null})(),g=({cells:t,rows:a},d,A)=>{let b;return()=>e.canUseDOM?(b||(b=B(k(a,t),d,A)),b):null},p=t=>t.querySelector(`.${e.strippedClassNames(e.uCalendar.scrollableSelector({c:s}))}`),y=t=>{const a=p(t);return a.className=`${a.className} scrollable-horizontal`,t},W=g({cells:7,rows:6},e.strippedClassNames(e.uCalendar.view({c:s,month:!0})),!0),F=g({cells:5,rows:3},e.strippedClassNames(e.uCalendar.view({c:s,year:!0})),!1),$=g({cells:5,rows:2},e.strippedClassNames(e.uCalendar.view({c:s,decade:!0})),!1),x=()=>y(W()),E=()=>y(F()),U=()=>y($()),l=t=>parseFloat(window.getComputedStyle(t).height)||t.offsetHeight,h=t=>{const a=window.getComputedStyle(t);return parseFloat(a.width)+parseFloat(a.paddingLeft)+parseFloat(a.paddingRight)||t.offsetWidth},c=t=>t.querySelector("tbody");this.didCalculate=!0,r&&(this.hostContainer=r),this.batch(W(),t=>{const a=c(t);this.calendarHeight=l(t),this.monthViewHeight=l(a),this.headerHeight=l(a.children[0]),this.scrollableContentHeight=l(p(t))}),this.batch(x(),t=>{const a=c(t);this.calendarWidth=h(t),this.monthViewWidth=h(a),this.scrollableContentWidth=h(p(t))}),this.batch(F(),t=>{this.yearViewHeight=l(c(t)),this.scrollableYearContentHeight=l(p(t))}),this.batch(E(),t=>{this.yearViewWidth=h(c(t))}),this.batch($(),t=>{this.decadeViewHeight=l(c(t)),this.centuryViewHeight=this.decadeViewHeight}),this.batch(U(),t=>{this.decadeViewWidth=h(c(t)),this.centuryViewWidth=this.decadeViewWidth}),this.batch(Y(),t=>{this.navigationItemHeight=l(t.querySelector("li"))})}viewHeight(r){return this.viewDimension(r,"height")}viewWidth(r){return this.viewDimension(r,"width")}viewDimension(r,o){const i=o==="height"?"ViewHeight":"ViewWidth";switch(r){case C.CalendarViewEnum.month:return this[`month${i}`];case C.CalendarViewEnum.year:return this[`year${i}`];case C.CalendarViewEnum.decade:return this[`decade${i}`];case C.CalendarViewEnum.century:return this[`century${i}`];default:return 1}}batch(r,o){const i=this.hostContainer||document.body,u=i.appendChild(r);o(u),i.removeChild(u)}}exports.DOMService=I;