@progress/kendo-react-scheduler/items/SchedulerProportionalViewItem.js

React Scheduler brings the functionality of Outlook's Calendar to a single UI component. KendoReact Scheduler package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 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 he=require("react"),fe=require("./SchedulerItem.js"),m=require("../utils/index.js"),E=require("../views/common/utils.js"),I=require("../constants/index.js"),ge=require("@progress/kendo-react-intl"),Q=require("./SchedulerItemContent.js"),P=require("@progress/kendo-react-common"),H=require("@progress/kendo-svg-icons"),U=require("../context/SchedulerViewContext.js"),Se=require("../context/SchedulerContext.js"),Re=require("../hooks/useRowSync.js");function Ie(e){const v=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const S in e)if(S!=="default"){const x=Object.getOwnPropertyDescriptor(e,S);Object.defineProperty(v,S,x.get?x:{enumerable:!0,get:()=>e[S]})}}return v.default=e,Object.freeze(v)}const n=Ie(he),ve=1,X=25,Y=n.forwardRef((e,v)=>{const{item:S,_ref:x,itemRef:ee,...te}=e,M=n.useRef(void 0),o=n.useRef(null),q=n.useRef(null),C=n.useRef(null);n.useImperativeHandle(q,()=>({props:e,element:o.current&&o.current.element})),n.useImperativeHandle(v,()=>q.current),n.useImperativeHandle(x,()=>o.current),n.useImperativeHandle(ee,()=>o.current);const re=S||Z.item,p=ge.useInternationalization(),[ne]=U.useSchedulerViewItemsContext(),[ie]=U.useSchedulerViewSlotsContext(),D=Se.useSchedulerElementContext(),[ce,k]=n.useState(!0),[oe,se]=n.useState(!1),V=n.useRef(0),f=n.useRef(null),g=n.useRef([]),W=P.useDir(D),B=n.useMemo(()=>{var i,r;return e.isAllDay?(i=e.title)!=null?i:"":`(${p.format("{0:t} - {1:t}",e.zonedStart,e.zonedEnd)}): ${(r=e.title)!=null?r:""}`},[p,e.isAllDay,e.title,e.zonedEnd,e.zonedStart]),le=(i,r)=>{let c=0;return r.forEach(l=>{l._order!==void 0&&l._order!==null&&c<l._order&&(c=l._order)}),c+1},ae=(i,r,c)=>{const[l,h]=r,a=new Date(Math.min(h.props.end.getTime()-c,Math.max(e.start.getTime(),l.props.start.getTime()))),R=new Date(Math.max(a.getTime()+c,Math.min(e.end.getTime(),h.props.end.getTime())));return i.filter(u=>{const _=Math.max(Math.min(h.props.end.getTime()-c,u.props.start.getTime()),l.props.start.getTime()),w=Math.min(Math.max(_+c,u.props.end.getTime()),h.props.end.getTime());return u.props.id!==e.id&&u.props.group.index===e.group.index&&u.props.range.index===e.range.index&&(e.ignoreIsAllDay||u.props.isAllDay===e.isAllDay)&&m.intersects(new Date(_),new Date(w),a,R)&&m.intersects(l.props.start,h.props.end,u.props.start,u.props.end)})},ue=(i,r)=>i.group.index===r.group.index&&i.range.index===r.range.index&&(i.range.isAllDay===void 0||r.range.isAllDay===void 0||i.range.isAllDay===r.range.isAllDay)&&(e.ignoreIsAllDay||i.isAllDay===r.isAllDay),b=()=>{var $,G,L,K,J;const i=ie.filter(t=>t.current&&ue(t.current.props,e)).sort((t,T)=>t.current.props.start.getTime()-T.current.props.start.getTime()),r=i.filter(t=>m.intersects(t.current.props.start,t.current.props.end,e.start,e.end)),c=o.current&&o.current.element;if(!c||!r.length)return;const l=m.first(i),h=m.last(i),a=m.first(r),R=m.last(r);if(!a.current||!o.current||!R.current||!l.current||!h.current)return;if(!m.intersects(a.current.props.start,R.current.props.end,e.start,e.end)){k(!1);return}const A=[],u=[],_=[],w=E.getRect(a.current.element),O=(e.vertical?w.height:w.width)/(a.current.props.end.getTime()-a.current.props.start.getTime()),j=(e.vertical?X:8)/O,y=(Math.min(e.start.getTime(),R.current.props.end.getTime()-j)-a.current.props.start.getTime())*O,F=Math.floor(Math.min(e.end.getTime(),R.current.props.end.getTime())-Math.max(e.start.getTime(),a.current.props.start.getTime()))*O;(ne||[]).forEach(t=>{t.current&&(t.current.props.dragHint?u.push(t.current):t.current.props.resizeHint?_.push(t.current):A.push(t.current))}),g.current=ae(A,[l.current,h.current],j),f.current=e.resizeHint||e.dragHint?0:m.calculateProportionalOrder(o.current,g.current);let d=1;e.resizeHint||e.dragHint||(d=le(o.current,g.current),g.current.forEach(t=>{t._maxSiblingsPerSlot&&d<t._maxSiblingsPerSlot&&(d=t._maxSiblingsPerSlot)}),g.current.forEach(t=>{t._maxSiblingsPerSlot!==void 0&&t._maxSiblingsPerSlot!==null&&t._maxSiblingsPerSlot<d&&(t._maxSiblingsPerSlot=d)}));let z=0;const s=w;g.current.forEach(t=>{let T=0;t._order!==void 0&&t._order!==null&&t._order<f.current&&(T=E.getRect(t.element).top+E.getRect(t.element).height-s.top-I.BORDER_WIDTH*f.current+ve),T>z&&(z=T)});const me=20;s.width=e.vertical?s.width/d-I.BORDER_WIDTH-me/d:F-I.BORDER_WIDTH,e.vertical?s.height=F-I.BORDER_WIDTH:(e.resizeHint||e.dragHint)&&d<=1||(s.height=(G=($=e.style)==null?void 0:$.height)!=null?G:X),s.left=e.vertical?s.left+((L=f.current)!=null?L:0)+I.BORDER_WIDTH*((K=f.current)!=null?K:0)*s.width:s.left+(y<0?0:y),s.top=e.vertical?s.top+(y<0?0:y):s.top+z+I.BORDER_WIDTH*((J=f.current)!=null?J:0),V.current=d,E.setRect(c,s),se(!0),k(!0)},N=n.useCallback(i=>{const r=i&&i[0],c=C.current;M.current!==void 0&&window.cancelAnimationFrame(M.current),c&&r&&(c.width!==r.contentRect.width||c.height!==r.contentRect.height)&&(M.current=window.requestAnimationFrame(()=>{b()})),C.current={width:r.contentRect.width,height:r.contentRect.height}},[b]);n.useEffect(b);const de=o.current&&o.current.element?o.current.element.closest(".k-scheduler-layout"):null;return Re.useRowSync({element:de,selector:".k-resource-row",horizontalAttribute:"data-depth-index",verticalAttribute:"data-resource-index",applyTo:".k-resource-cell",syncHeight:e.isLast}),n.useEffect(()=>{if(!D.current)return;const i=window.ResizeObserver,r=i&&new i(N);return r&&r.observe(D.current),()=>{r&&r.disconnect()}},[N,D]),n.createElement(re,{...te,_ref:o,_order:f,_maxSiblingsPerSlot:V,_siblings:g,itemRef:o,style:{visibility:oe?void 0:"hidden",display:ce?void 0:"none",...e.style}},!e.resizeHint&&n.createElement("span",{className:"k-event-actions"},e.tail&&n.createElement(P.IconWrap,{name:W==="rtl"?"chevron-right":"chevron-left",icon:W==="rtl"?H.chevronRightIcon:H.chevronLeftIcon}),e.isRecurring&&!e.isException&&n.createElement(P.IconWrap,{name:"reload",icon:H.arrowRotateCwIcon}),!e.isRecurring&&e.isException&&n.createElement(P.IconWrap,{name:"non-recurrence",icon:H.nonRecurrenceIcon})),!e.resizeHint&&n.createElement("div",{title:B},!e.isAllDay&&n.createElement(Q.SchedulerItemContent,{className:"k-event-time"},B),n.createElement(Q.SchedulerItemContent,null,e.title)))}),Z={item:fe.SchedulerItem};Y.displayName="KendoReactSchedulerProportionalViewItem";exports.SchedulerProportionalViewItem=Y;exports.schedulerProportionalViewItemDefaultProps=Z;