@kkkarsss/ui 1.5.5 → 1.5.6

package/dist/ui/controls/date-input/date-input.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Temporal } from '@js-temporal/polyfill';
 import { Calendar } from 'lucide-react';
 import { useRef, useState } from 'react';
 import { Dropdown } from '../../layout';
@@ -9,10 +10,12 @@ export const DateInput = ({ value, onChange, label, placeholder, size = 'm', dis
     const containerRef = useRef(null);
     const handleDateSelect = (date) => {
         if (date) {
-            const year = date.getFullYear();
-            const month = String(date.getMonth() + 1).padStart(2, '0');
-            const day = String(date.getDate()).padStart(2, '0');
-            onChange(`${year}-${month}-${day}`);
+            const plainDate = Temporal.PlainDate.from({
+                year: date.getFullYear(),
+                month: date.getMonth() + 1,
+                day: date.getDate(),
+            });
+            onChange(plainDate.toString());
             setIsOpen(false);
         }
     };

package/dist/ui/information/calendar-like/calendar-item-wrapper.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Temporal } from '@js-temporal/polyfill';
 import { useState } from 'react';
 import { jc } from '../../../utils';
 export const CalendarItemWrapper = ({ task, position, onDragStart, onDragEnd, onResize, renderTask, }) => {
@@ -8,12 +9,36 @@ export const CalendarItemWrapper = ({ task, position, onDragStart, onDragEnd, on
             e.preventDefault();
             e.stopPropagation();
             const startY = e.clientY;
-            const dStart = task.dueDateStart instanceof Date ? task.dueDateStart : new Date(task.dueDateStart);
-            const dEnd = task.dueDateEnd instanceof Date ? task.dueDateEnd : new Date(task.dueDateEnd);
-            const estimatedTime = (dEnd.getTime() - dStart.getTime()) / (60 * 1000);
+            const toISO = (d) => {
+                if (d instanceof Temporal.PlainDate || d instanceof Temporal.PlainDateTime || d instanceof Temporal.Instant)
+                    return d.toString().split('T')[0];
+                if (d instanceof Date)
+                    return d.toISOString().split('T')[0];
+                if (typeof d === 'string' && d.includes(' ')) {
+                    const parsed = new Date(d);
+                    if (!isNaN(parsed.getTime()))
+                        return parsed.toISOString().split('T')[0];
+                }
+                return String(d);
+            };
+            const dStart = task.dueDateStart instanceof Temporal.PlainDate
+                ? task.dueDateStart
+                : Temporal.PlainDate.from(toISO(task.dueDateStart));
+            const dEnd = task.dueDateEnd instanceof Temporal.PlainDate
+                ? task.dueDateEnd
+                : Temporal.PlainDate.from(toISO(task.dueDateEnd));
+            const tStart = task.dueTimeStart instanceof Temporal.PlainTime
+                ? task.dueTimeStart
+                : Temporal.PlainTime.from(String(task.dueTimeStart || '00:00'));
+            const tEnd = task.dueTimeEnd instanceof Temporal.PlainTime
+                ? task.dueTimeEnd
+                : Temporal.PlainTime.from(String(task.dueTimeEnd || '23:59'));
+            const dtStart = dStart.toPlainDateTime(tStart);
+            const dtEnd = dEnd.toPlainDateTime(tEnd);
+            const estimatedTime = Number(dtEnd.since(dtStart).total('minute'));
             const startHeight = (estimatedTime / 15) * 20;
-            const startHour = dStart.getHours();
-            const startMinutes = dStart.getMinutes();
+            const startHour = tStart.hour;
+            const startMinutes = tStart.minute;
             const onMouseMove = (moveEvent) => {
                 const deltaY = moveEvent.clientY - startY;
                 let newHeight;
@@ -74,8 +99,10 @@ export const CalendarItemWrapper = ({ task, position, onDragStart, onDragEnd, on
     const displayHeight = preview ? `${(preview.estimatedTime / 15) * 20}px` : position.height;
     let displayTop = position.top;
     if (preview && (preview.startHour !== undefined || preview.startMinutes !== undefined)) {
-        const dStart = task.dueDateStart instanceof Date ? task.dueDateStart : new Date(task.dueDateStart);
-        const originalStartTotalMinutes = dStart.getHours() * 60 + dStart.getMinutes();
+        const tStart = task.dueTimeStart instanceof Temporal.PlainTime
+            ? task.dueTimeStart
+            : Temporal.PlainTime.from(String(task.dueTimeStart || '00:00'));
+        const originalStartTotalMinutes = tStart.hour * 60 + tStart.minute;
         const newStartTotalMinutes = preview.startHour * 60 + preview.startMinutes;
         const diffMinutes = newStartTotalMinutes - originalStartTotalMinutes;
         const diffPixels = (diffMinutes / 15) * 20;

package/dist/ui/information/calendar-like/calendar-like.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Temporal } from '@js-temporal/polyfill';
 import { useMemo, useState, useRef } from 'react';
 import { CalendarItemWrapper } from './calendar-item-wrapper';
 import { CalendarSlot } from './calendar-slot';
@@ -25,9 +26,31 @@ export const CalendarLike = ({ tasks, slots = DEFAULT_SLOTS, showCurrentTime = t
         setDraggingTask(task);
         e.dataTransfer.setData('taskId', task.id);
         e.dataTransfer.setData('taskTitle', task.title || '');
-        const dStart = task.dueDateStart instanceof Date ? task.dueDateStart : new Date(task.dueDateStart);
-        const dEnd = task.dueDateEnd instanceof Date ? task.dueDateEnd : new Date(task.dueDateEnd);
-        const estimatedTime = (dEnd.getTime() - dStart.getTime()) / (60 * 1000);
+        const toISO = (d) => {
+            if (d instanceof Temporal.PlainDate || d instanceof Temporal.PlainDateTime || d instanceof Temporal.Instant)
+                return d.toString().split('T')[0];
+            if (d instanceof Date)
+                return d.toISOString().split('T')[0];
+            if (typeof d === 'string' && d.includes(' ')) {
+                const parsed = new Date(d);
+                if (!isNaN(parsed.getTime()))
+                    return parsed.toISOString().split('T')[0];
+            }
+            return String(d);
+        };
+        const dStart = task.dueDateStart instanceof Temporal.PlainDate
+            ? task.dueDateStart
+            : Temporal.PlainDate.from(toISO(task.dueDateStart));
+        const dEnd = task.dueDateEnd instanceof Temporal.PlainDate ? task.dueDateEnd : Temporal.PlainDate.from(toISO(task.dueDateEnd));
+        const tStart = task.dueTimeStart instanceof Temporal.PlainTime
+            ? task.dueTimeStart
+            : Temporal.PlainTime.from(String(task.dueTimeStart || '00:00'));
+        const tEnd = task.dueTimeEnd instanceof Temporal.PlainTime
+            ? task.dueTimeEnd
+            : Temporal.PlainTime.from(String(task.dueTimeEnd || '23:59'));
+        const dtStart = dStart.toPlainDateTime(tStart);
+        const dtEnd = dEnd.toPlainDateTime(tEnd);
+        const estimatedTime = Number(dtEnd.since(dtStart).total('minute'));
         e.dataTransfer.setData('taskEstimatedTime', String(estimatedTime));
         if (task.color) {
             e.dataTransfer.setData('taskColor', task.color);
@@ -51,10 +74,14 @@ export const CalendarLike = ({ tasks, slots = DEFAULT_SLOTS, showCurrentTime = t
                 const overlappingTasksCount = tasks.filter((task) => {
                     if (draggingTask && task.id === draggingTask.id)
                         return false;
-                    const dStart = task.dueDateStart instanceof Date ? task.dueDateStart : new Date(task.dueDateStart);
-                    const dEnd = task.dueDateEnd instanceof Date ? task.dueDateEnd : new Date(task.dueDateEnd);
-                    const taskStart = dStart.getHours() * 60 + dStart.getMinutes();
-                    const taskEnd = dEnd.getHours() * 60 + dEnd.getMinutes();
+                    const tStart = task.dueTimeStart instanceof Temporal.PlainTime
+                        ? task.dueTimeStart
+                        : Temporal.PlainTime.from(String(task.dueTimeStart || '00:00'));
+                    const tEnd = task.dueTimeEnd instanceof Temporal.PlainTime
+                        ? task.dueTimeEnd
+                        : Temporal.PlainTime.from(String(task.dueTimeEnd || '23:59'));
+                    const taskStart = tStart.hour * 60 + tStart.minute;
+                    const taskEnd = tEnd.hour * 60 + tEnd.minute;
                     return currentSlotTime >= taskStart && currentSlotTime < taskEnd;
                 }).length;
                 return (_jsx(CalendarSlot, { slotIndex: slotIndex, onDrop: handleDrop, onCreateTask: onCreateTask, renderTask: renderTask, overlappingTasksCount: overlappingTasksCount, draggingTask: draggingTask || undefined, children: tasksForSlot?.map((task) => (_jsx(CalendarItemWrapper, { task: task, position: task.position, onDragStart: (e) => handleDragStart(e, task), onDragEnd: handleDragEnd, onResize: onTaskResize, renderTask: renderTask }, task.id))) }, slotIndex));

package/dist/ui/information/calendar-like/calendar-like.stories.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Temporal } from '@js-temporal/polyfill';
 import { Circle, CircleCheckBig } from 'lucide-react';
 import { useState } from 'react';
 import { CalendarLike, CalendarItem } from './calendar-like';
@@ -10,10 +11,11 @@ const meta = {
     tags: ['autodocs'],
 };
 export default meta;
-const getTodayAtHour = (hour, minutes = 0) => {
-    const date = new Date();
-    date.setHours(hour, minutes, 0, 0);
-    return date;
+const getTodayAtHour = (_hour, _minutes = 0) => {
+    return Temporal.Now.plainDateISO();
+};
+const getTodayTimeAtHour = (hour, minutes = 0) => {
+    return Temporal.PlainTime.from({ hour, minute: minutes });
 };
 const INITIAL_TASKS = [
     {
@@ -21,14 +23,18 @@ const INITIAL_TASKS = [
         title: 'Утренняя почта',
         description: 'Проверить входящие и ответить на важные письма',
         dueDateStart: getTodayAtHour(9),
-        dueDateEnd: getTodayAtHour(9, 45),
+        dueDateEnd: getTodayAtHour(9),
+        dueTimeStart: getTodayTimeAtHour(9),
+        dueTimeEnd: getTodayTimeAtHour(9, 45),
         color: '#3b82f6',
     },
     {
         id: '2',
         title: 'Стендап',
         dueDateStart: getTodayAtHour(10),
-        dueDateEnd: getTodayAtHour(10, 15),
+        dueDateEnd: getTodayAtHour(10),
+        dueTimeStart: getTodayTimeAtHour(10),
+        dueTimeEnd: getTodayTimeAtHour(10, 15),
         color: '#10b981',
         isInWork: true,
     },
@@ -36,7 +42,9 @@ const INITIAL_TASKS = [
         id: '3',
         title: 'Обед',
         dueDateStart: getTodayAtHour(13),
-        dueDateEnd: getTodayAtHour(14),
+        dueDateEnd: getTodayAtHour(13),
+        dueTimeStart: getTodayTimeAtHour(13),
+        dueTimeEnd: getTodayTimeAtHour(14),
         color: '#f59e0b',
     },
     {
@@ -44,14 +52,18 @@ const INITIAL_TASKS = [
         title: 'Разработка фичи',
         description: 'Реализация логики календаря',
         dueDateStart: getTodayAtHour(14),
-        dueDateEnd: getTodayAtHour(16),
+        dueDateEnd: getTodayAtHour(14),
+        dueTimeStart: getTodayTimeAtHour(14),
+        dueTimeEnd: getTodayTimeAtHour(16),
         color: '#8b5cf6',
     },
     {
         id: '5',
         title: 'Завершенная задача',
         dueDateStart: getTodayAtHour(17),
-        dueDateEnd: getTodayAtHour(17, 30),
+        dueDateEnd: getTodayAtHour(17),
+        dueTimeStart: getTodayTimeAtHour(17),
+        dueTimeEnd: getTodayTimeAtHour(17, 30),
         isCompleted: true,
         color: '#8b5cf6',
     },
@@ -65,11 +77,18 @@ export const Interactive = {
             console.log(`Task ${taskId} dropped at ${hour}:${minutes}`);
             setTasks((prev) => prev.map((t) => {
                 if (t.id === taskId) {
-                    const durationMs = t.dueDateEnd.getTime() - t.dueDateStart.getTime();
-                    const newStartDate = new Date(t.dueDateStart);
-                    newStartDate.setHours(hour, minutes, 0, 0);
-                    const newEndDate = new Date(newStartDate.getTime() + durationMs);
-                    return { ...t, dueDateStart: newStartDate, dueDateEnd: newEndDate };
+                    const dtStart = t.dueDateStart.toPlainDateTime(t.dueTimeStart || Temporal.PlainTime.from('00:00'));
+                    const dtEnd = (t.dueDateEnd || t.dueDateStart).toPlainDateTime(t.dueTimeEnd || Temporal.PlainTime.from('23:59'));
+                    const duration = dtEnd.since(dtStart);
+                    const newDtStart = t.dueDateStart.toPlainDateTime(Temporal.PlainTime.from({ hour, minute: minutes }));
+                    const newDtEnd = newDtStart.add(duration);
+                    return {
+                        ...t,
+                        dueDateStart: newDtStart.toPlainDate(),
+                        dueDateEnd: newDtEnd.toPlainDate(),
+                        dueTimeStart: newDtStart.toPlainTime(),
+                        dueTimeEnd: newDtEnd.toPlainTime(),
+                    };
                 }
                 return t;
             }));
@@ -78,25 +97,36 @@ export const Interactive = {
             console.log(`Task ${taskId} resized to ${newEstimatedTime} minutes. New start: ${newStartHour}:${newStartMinutes}`);
             setTasks((prev) => prev.map((t) => {
                 if (t.id === taskId) {
-                    const newStartDate = new Date(t.dueDateStart);
+                    let newDtStart;
                     if (newStartHour !== undefined && newStartMinutes !== undefined) {
-                        newStartDate.setHours(newStartHour, newStartMinutes, 0, 0);
+                        newDtStart = t.dueDateStart.toPlainDateTime(Temporal.PlainTime.from({ hour: newStartHour, minute: newStartMinutes }));
+                    }
+                    else {
+                        newDtStart = t.dueDateStart.toPlainDateTime(t.dueTimeStart || Temporal.PlainTime.from('00:00'));
                     }
-                    const newEndDate = new Date(newStartDate.getTime() + newEstimatedTime * 60 * 1000);
-                    return { ...t, dueDateStart: newStartDate, dueDateEnd: newEndDate };
+                    const newDtEnd = newDtStart.add({ minutes: newEstimatedTime });
+                    return {
+                        ...t,
+                        dueDateStart: newDtStart.toPlainDate(),
+                        dueDateEnd: newDtEnd.toPlainDate(),
+                        dueTimeStart: newDtStart.toPlainTime(),
+                        dueTimeEnd: newDtEnd.toPlainTime(),
+                    };
                 }
                 return t;
             }));
         };
         const handleCreateTask = (hour, minutes, estimatedTime) => {
             console.log(`Create task at ${hour}:${minutes} with duration ${estimatedTime}`);
-            const dueDateStart = getTodayAtHour(hour, minutes);
-            const dueDateEnd = new Date(dueDateStart.getTime() + estimatedTime * 60 * 1000);
+            const dtStart = Temporal.Now.plainDateISO().toPlainDateTime(Temporal.PlainTime.from({ hour, minute: minutes }));
+            const dtEnd = dtStart.add({ minutes: estimatedTime });
             const newTask = {
                 id: Math.random().toString(36).substr(2, 9),
                 title: 'Новая задача',
-                dueDateStart,
-                dueDateEnd,
+                dueDateStart: dtStart.toPlainDate(),
+                dueDateEnd: dtEnd.toPlainDate(),
+                dueTimeStart: dtStart.toPlainTime(),
+                dueTimeEnd: dtEnd.toPlainTime(),
                 color: '#8b5cf6',
             };
             setTasks((prev) => [...prev, newTask]);

package/dist/ui/information/calendar-like/calendar-slot.js

@@ -1,4 +1,5 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Temporal } from '@js-temporal/polyfill';
 import { animated, config, useSpring } from '@react-spring/web';
 import { useState } from 'react';
 import { jc } from '../../../utils';
@@ -13,7 +14,39 @@ export const CalendarSlot = ({ slotIndex, onDrop, onCreateTask, renderTask, chil
         to: {
             opacity: dragOverInfo ? 1 : 0.6,
             height: dragOverInfo
-                ? `${((new Date(dragOverInfo.task.dueDateEnd).getTime() - new Date(dragOverInfo.task.dueDateStart).getTime()) / (60 * 1000) / 15) * 20}px`
+                ? (() => {
+                    const toISO = (d) => {
+                        if (d instanceof Temporal.PlainDate ||
+                            d instanceof Temporal.PlainDateTime ||
+                            d instanceof Temporal.Instant)
+                            return d.toString().split('T')[0];
+                        if (d instanceof Date)
+                            return d.toISOString().split('T')[0];
+                        if (typeof d === 'string' && d.includes(' ')) {
+                            const parsed = new Date(d);
+                            if (!isNaN(parsed.getTime()))
+                                return parsed.toISOString().split('T')[0];
+                        }
+                        return String(d);
+                    };
+                    const task = dragOverInfo.task;
+                    const dStart = task.dueDateStart instanceof Temporal.PlainDate
+                        ? task.dueDateStart
+                        : Temporal.PlainDate.from(toISO(task.dueDateStart));
+                    const dEnd = task.dueDateEnd instanceof Temporal.PlainDate
+                        ? task.dueDateEnd
+                        : Temporal.PlainDate.from(toISO(task.dueDateEnd));
+                    const tStart = task.dueTimeStart instanceof Temporal.PlainTime
+                        ? task.dueTimeStart
+                        : Temporal.PlainTime.from(String(task.dueTimeStart || '00:00'));
+                    const tEnd = task.dueTimeEnd instanceof Temporal.PlainTime
+                        ? task.dueTimeEnd
+                        : Temporal.PlainTime.from(String(task.dueTimeEnd || '23:59'));
+                    const dtStart = dStart.toPlainDateTime(tStart);
+                    const dtEnd = dEnd.toPlainDateTime(tEnd);
+                    const minutes = Number(dtEnd.since(dtStart).total('minute'));
+                    return `${(minutes / 15) * 20}px`;
+                })()
                 : '40px',
         },
         config: { ...config.stiff, precision: 0.001 },
@@ -83,8 +116,12 @@ export const CalendarSlot = ({ slotIndex, onDrop, onCreateTask, renderTask, chil
                         }, children: renderTask ? (renderTask({
                             id: 'new-task-preview',
                             title: 'Новая задача',
-                            dueDateStart: new Date(new Date().setHours(hour, minutes, 0, 0)),
-                            dueDateEnd: new Date(new Date().setHours(hour, minutes + selection.currentEstimatedTime, 0, 0)),
+                            dueDateStart: Temporal.Now.plainDateISO(),
+                            dueTimeStart: Temporal.PlainTime.from({ hour, minute: minutes }),
+                            dueDateEnd: Temporal.Now.plainDateISO(),
+                            dueTimeEnd: Temporal.PlainTime.from({ hour, minute: minutes }).add({
+                                minutes: selection.currentEstimatedTime,
+                            }),
                             color: 'white',
                         })) : (_jsxs("div", { className: "border rounded-sm h-full p-1", children: [_jsx(Typo, { size: "xs", weight: "500", children: "\u041D\u043E\u0432\u0430\u044F \u0437\u0430\u0434\u0430\u0447\u0430" }), _jsxs(Typo, { size: "xs", color: "secondary", children: [selection.currentEstimatedTime, " \u043C\u0438\u043D"] })] })) }))] })] }));
 };

package/dist/ui/information/calendar-like/types.d.ts

@@ -1,8 +1,9 @@
+import { Temporal } from '@js-temporal/polyfill';
 import { ReactNode } from 'react';
 export type TCalendarTask = {
     id: string;
-    dueDateStart: Date;
-    dueDateEnd: Date;
+    dueDateStart: Temporal.PlainDate;
+    dueDateEnd: Temporal.PlainDate;
     [key: string]: any;
 };
 export type TCalendarTaskWithPosition = TCalendarTask & {

package/dist/ui/information/calendar-like/use-auto-scroll.js

@@ -1,3 +1,4 @@
+import { Temporal } from '@js-temporal/polyfill';
 import { useEffect } from 'react';
 export const useAutoScroll = (containerRef, enabled, topOffset) => {
     useEffect(() => {
@@ -5,9 +6,9 @@ export const useAutoScroll = (containerRef, enabled, topOffset) => {
             const scroll = (retryCount = 0) => {
                 if (!containerRef.current)
                     return;
-                const now = new Date();
-                const hours = now.getHours();
-                const minutes = now.getMinutes();
+                const now = Temporal.Now.plainTimeISO();
+                const hours = now.hour;
+                const minutes = now.minute;
                 const totalMinutes = hours * 60 + minutes;
                 // Находим ближайший скроллируемый родитель или используем окно
                 const scrollParent = (node) => {

package/dist/ui/information/calendar-like/use-current-time.d.ts

@@ -1,4 +1,5 @@
+import { Temporal } from '@js-temporal/polyfill';
 export declare const useCurrentTime: (updateInterval?: number) => {
-    now: Date;
+    now: Temporal.PlainTime;
     topOffset: number;
 };

package/dist/ui/information/calendar-like/use-current-time.js

@@ -1,15 +1,16 @@
+import { Temporal } from '@js-temporal/polyfill';
 import { useState, useEffect, useMemo } from 'react';
 export const useCurrentTime = (updateInterval = 60000) => {
-    const [now, setNow] = useState(new Date());
+    const [now, setNow] = useState(Temporal.Now.plainTimeISO());
     useEffect(() => {
         const interval = setInterval(() => {
-            setNow(new Date());
+            setNow(Temporal.Now.plainTimeISO());
         }, updateInterval);
         return () => clearInterval(interval);
     }, [updateInterval]);
     const topOffset = useMemo(() => {
-        const hours = now.getHours();
-        const minutes = now.getMinutes();
+        const hours = now.hour;
+        const minutes = now.minute;
         const totalMinutes = hours * 60 + minutes;
         // 15 минут = 20 пикселей (высота слота)
         return totalMinutes * (20 / 15);

package/dist/ui/information/calendar-like/utils.js

@@ -1,24 +1,39 @@
+import { Temporal } from '@js-temporal/polyfill';
+const toDateTime = (date, time) => {
+    const toISO = (d) => {
+        if (d instanceof Temporal.PlainDate || d instanceof Temporal.PlainDateTime || d instanceof Temporal.Instant)
+            return d.toString().split('T')[0];
+        if (d instanceof Date)
+            return d.toISOString().split('T')[0];
+        if (typeof d === 'string' && d.includes(' ')) {
+            const parsed = new Date(d);
+            if (!isNaN(parsed.getTime()))
+                return parsed.toISOString().split('T')[0];
+        }
+        return String(d);
+    };
+    const d = date instanceof Temporal.PlainDate ? date : Temporal.PlainDate.from(toISO(date));
+    const t = time instanceof Temporal.PlainTime ? time : Temporal.PlainTime.from(String(time || '00:00'));
+    return d.toPlainDateTime(t);
+};
 export const calculateTaskPositions = (tasks) => {
     const tasksToRender = [...tasks]
         .map((t) => {
-        const dStart = t.dueDateStart instanceof Date ? t.dueDateStart : new Date(t.dueDateStart);
-        const dEnd = t.dueDateEnd instanceof Date ? t.dueDateEnd : new Date(t.dueDateEnd);
+        const dtStart = toDateTime(t.dueDateStart, t.dueTimeStart);
+        const dtEnd = toDateTime(t.dueDateEnd, t.dueTimeEnd);
         return {
             ...t,
-            dueDateStart: dStart,
-            dueDateEnd: dEnd,
+            dtStart,
+            dtEnd,
         };
     })
-        .filter((t) => t.dueDateStart && !isNaN(t.dueDateStart.getTime()) && t.dueDateEnd && !isNaN(t.dueDateEnd.getTime()))
-        .sort((a, b) => a.dueDateStart.getTime() - b.dueDateStart.getTime());
+        .sort((a, b) => Temporal.PlainDateTime.compare(a.dtStart, b.dtStart));
     const columns = [];
     tasksToRender.forEach((task) => {
-        const startTime = task.dueDateStart.getTime();
         let placed = false;
         for (const column of columns) {
             const lastTask = column[column.length - 1];
-            const lastEndTime = lastTask.dueDateEnd.getTime();
-            if (startTime >= lastEndTime) {
+            if (Temporal.PlainDateTime.compare(task.dtStart, lastTask.dtEnd) >= 0) {
                 column.push(task);
                 placed = true;
                 break;
@@ -30,24 +45,27 @@ export const calculateTaskPositions = (tasks) => {
     });
     const clusters = [];
     let currentCluster = [];
-    let clusterMaxEndTime = 0;
+    let clusterMaxEndTime = null;
     columns.forEach((column) => {
-        let columnMinStartTime = Infinity;
+        let columnMinStartTime = null;
         column.forEach((t) => {
-            const start = t.dueDateStart.getTime();
-            if (start < columnMinStartTime)
-                columnMinStartTime = start;
+            if (!columnMinStartTime || Temporal.PlainDateTime.compare(t.dtStart, columnMinStartTime) < 0) {
+                columnMinStartTime = t.dtStart;
+            }
         });
-        if (columnMinStartTime >= clusterMaxEndTime && currentCluster.length > 0) {
+        if (clusterMaxEndTime &&
+            columnMinStartTime &&
+            Temporal.PlainDateTime.compare(columnMinStartTime, clusterMaxEndTime) >= 0 &&
+            currentCluster.length > 0) {
             clusters.push(currentCluster);
             currentCluster = [];
-            clusterMaxEndTime = 0;
+            clusterMaxEndTime = null;
         }
         currentCluster.push(column);
         column.forEach((t) => {
-            const end = t.dueDateEnd.getTime();
-            if (end > clusterMaxEndTime)
-                clusterMaxEndTime = end;
+            if (!clusterMaxEndTime || Temporal.PlainDateTime.compare(t.dtEnd, clusterMaxEndTime) > 0) {
+                clusterMaxEndTime = t.dtEnd;
+            }
         });
     });
     if (currentCluster.length > 0)
@@ -60,11 +78,11 @@ export const calculateTaskPositions = (tasks) => {
                 const width = clusterColumnsCount > 1 ? `${100 / clusterColumnsCount}%` : '100%';
                 const left = clusterColumnsCount > 1 ? `${(colIndex * 100) / clusterColumnsCount}%` : '0%';
                 // Расчитываем смещение внутри 15-минутного слота
-                const minutes = task.dueDateStart.getMinutes();
+                const minutes = task.dtStart.minute;
                 const minutesInSlot = minutes % 15;
                 const topOffset = (minutesInSlot / 15) * 20;
                 const top = `${Math.round(topOffset)}px`;
-                const diffMinutes = Math.round((task.dueDateEnd.getTime() - task.dueDateStart.getTime()) / (60 * 1000));
+                const diffMinutes = Math.round(Number(task.dtEnd.since(task.dtStart).total('minute')));
                 const height = `${Math.round((Math.max(15, diffMinutes || 15) / 15) * 20)}px`;
                 result.push({
                     ...task,
@@ -78,9 +96,9 @@ export const calculateTaskPositions = (tasks) => {
 export const groupTasksBySlot = (tasksWithPosition) => {
     const map = {};
     tasksWithPosition.forEach((task) => {
-        const dStart = task.dueDateStart instanceof Date ? task.dueDateStart : new Date(task.dueDateStart);
-        const hour = dStart.getHours();
-        const minutes = dStart.getMinutes();
+        const dtStart = toDateTime(task.dueDateStart, task.dueTimeStart);
+        const hour = dtStart.hour;
+        const minutes = dtStart.minute;
         const slotIndex = hour * 4 + Math.floor(minutes / 15);
         if (!map[slotIndex])
             map[slotIndex] = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kkkarsss/ui",
-  "version": "1.5.5",
+  "version": "1.5.6",
   "description": "UI Kit for kkkarsss projects",
   "type": "module",
   "main": "dist/index.js",
@@ -33,7 +33,6 @@
     "@storybook/react": "^10.2.7",
     "@storybook/react-vite": "^10.2.7",
     "@tailwindcss/container-queries": "^0.1.1",
-    "tailwindcss": "^3.4.19",
     "@types/node": "^25.0.10",
     "@types/react": "^19.2.9",
     "@types/react-dom": "^19.2.3",
@@ -55,12 +54,14 @@
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "storybook": "^10.2.7",
+    "tailwindcss": "^3.4.19",
     "typescript": "5.9.3",
     "typescript-eslint": "^8.53.1",
     "vite": "^7.3.1",
     "vitest": "^4.0.18"
   },
   "dependencies": {
+    "@js-temporal/polyfill": "^0.5.1",
     "@react-spring/web": "^10.0.3",
     "date-fns": "^4.1.0",
     "react-datepicker": "^9.1.0",