@kkkarsss/ui 1.1.0 → 1.1.2

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

@@ -3,7 +3,6 @@ import { useMemo } from 'react';
 import { CalendarHourSlot } from './calendar-hour-slot';
 import { CalendarItemWrapper } from './calendar-item-wrapper';
 import { calculateTaskPositions, groupTasksByHour } from './utils';
-import { Offset } from '../../layout';
 export * from './types';
 export * from './calendar-item-wrapper';
 export * from './calendar-item';
@@ -20,5 +19,8 @@ export const CalendarLike = ({ tasks, hours = DEFAULT_HOURS, renderTask, onTaskD
             onTaskDrop(taskId, hour);
         }
     };
-    return (_jsx(Offset, { type: 'vertical', children: _jsx("div", { className: "relative border-l border-secondary/20 ml-12 select-none", children: hours.map((hour) => (_jsx(CalendarHourSlot, { hour: hour, onDrop: handleDrop, onCreateTask: onCreateTask, children: tasksByHour[hour]?.map((task) => (_jsx(CalendarItemWrapper, { task: task, position: task.position, onDragStart: handleDragStart, onResize: onTaskResize, renderTask: renderTask }, task.id))) }, hour))) }) }));
+    return (_jsx("div", { className: "relative border-l border-secondary/20 ml-12 select-none", children: hours.map((hour) => {
+            const tasksForHour = tasksByHour[hour];
+            return (_jsx(CalendarHourSlot, { hour: hour, onDrop: handleDrop, onCreateTask: onCreateTask, children: tasksForHour?.map((task) => (_jsx(CalendarItemWrapper, { task: task, position: task.position, onDragStart: handleDragStart, onResize: onTaskResize, renderTask: renderTask }, task.id))) }, hour));
+        }) }));
 };

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

@@ -56,6 +56,8 @@ const INITIAL_TASKS = [
 export const Interactive = {
     render: () => {
         const [tasks, setTasks] = useState(INITIAL_TASKS);
+        const [showCompleted, setShowCompleted] = useState(true);
+        const filteredTasks = tasks.filter((t) => (showCompleted ? true : !t.isCompleted));
         const handleTaskDrop = (taskId, hour) => {
             console.log(`Task ${taskId} dropped at hour ${hour}`);
             setTasks((prev) => prev.map((t) => {
@@ -86,6 +88,6 @@ export const Interactive = {
             console.log(`Task ${taskId} clicked`);
             alert(`Клик по задаче ${taskId}`);
         };
-        return (_jsxs("div", { style: { height: '600px', overflowY: 'auto', background: 'var(--bg-primary)', padding: '20px' }, children: [_jsxs("p", { style: { marginBottom: '20px', color: 'var(--secondary)' }, children: ["\u0418\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F: ", _jsx("br", {}), "1. \u041F\u0435\u0440\u0435\u0442\u0430\u0441\u043A\u0438\u0432\u0430\u0439\u0442\u0435 \u0437\u0430\u0434\u0430\u0447\u0438 \u043C\u0435\u0436\u0434\u0443 \u0447\u0430\u0441\u0430\u043C\u0438. ", _jsx("br", {}), "2. \u0418\u0437\u043C\u0435\u043D\u044F\u0439\u0442\u0435 \u0434\u043B\u0438\u0442\u0435\u043B\u044C\u043D\u043E\u0441\u0442\u044C \u0437\u0430\u0434\u0430\u0447\u0438, \u043F\u043E\u0442\u044F\u043D\u0443\u0432 \u0437\u0430 \u043D\u0438\u0436\u043D\u0438\u0439 \u043A\u0440\u0430\u0439. ", _jsx("br", {}), "3. \u0421\u043E\u0437\u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043D\u043E\u0432\u044B\u0435 \u0437\u0430\u0434\u0430\u0447\u0438, \u043A\u043B\u0438\u043A\u043D\u0443\u0432 \u0438 \u043F\u043E\u0442\u044F\u043D\u0443\u0432 \u043D\u0430 \u0441\u0432\u043E\u0431\u043E\u0434\u043D\u043E\u043C \u043C\u0435\u0441\u0442\u0435. ", _jsx("br", {}), "\u0420\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u044B \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0432\u044B\u0432\u043E\u0434\u044F\u0442\u0441\u044F \u0432 \u043A\u043E\u043D\u0441\u043E\u043B\u044C."] }), _jsx(CalendarLike, { tasks: tasks, onTaskDrop: handleTaskDrop, onTaskResize: handleTaskResize, onCreateTask: handleCreateTask, renderTask: (task) => (_jsx(CalendarItem, { title: task.title, description: task.description, color: task.color, isCompleted: task.isCompleted, isInWork: task.isInWork, estimatedTime: task.estimatedTime, icon: task.isInWork ? _jsx(Clock, { size: 12, className: "text-white animate-pulse" }) : undefined, onClick: () => handleTaskClick(task.id) })) })] }));
+        return (_jsxs("div", { style: { height: '600px', overflowY: 'auto', background: 'var(--bg-primary)', padding: '20px' }, children: [_jsxs("p", { style: { marginBottom: '20px', color: 'var(--secondary)' }, children: ["\u0418\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F: ", _jsx("br", {}), "1. \u041F\u0435\u0440\u0435\u0442\u0430\u0441\u043A\u0438\u0432\u0430\u0439\u0442\u0435 \u0437\u0430\u0434\u0430\u0447\u0438 \u043C\u0435\u0436\u0434\u0443 \u0447\u0430\u0441\u0430\u043C\u0438. ", _jsx("br", {}), "2. \u0418\u0437\u043C\u0435\u043D\u044F\u0439\u0442\u0435 \u0434\u043B\u0438\u0442\u0435\u043B\u044C\u043D\u043E\u0441\u0442\u044C \u0437\u0430\u0434\u0430\u0447\u0438, \u043F\u043E\u0442\u044F\u043D\u0443\u0432 \u0437\u0430 \u043D\u0438\u0436\u043D\u0438\u0439 \u043A\u0440\u0430\u0439. ", _jsx("br", {}), "3. \u0421\u043E\u0437\u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043D\u043E\u0432\u044B\u0435 \u0437\u0430\u0434\u0430\u0447\u0438, \u043A\u043B\u0438\u043A\u043D\u0443\u0432 \u0438 \u043F\u043E\u0442\u044F\u043D\u0443\u0432 \u043D\u0430 \u0441\u0432\u043E\u0431\u043E\u0434\u043D\u043E\u043C \u043C\u0435\u0441\u0442\u0435. ", _jsx("br", {}), "\u0420\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u044B \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0432\u044B\u0432\u043E\u0434\u044F\u0442\u0441\u044F \u0432 \u043A\u043E\u043D\u0441\u043E\u043B\u044C."] }), _jsxs("div", { style: { marginBottom: '20px', color: 'var(--secondary)', display: 'flex', alignItems: 'center', gap: '8px' }, children: [_jsx("input", { type: "checkbox", checked: showCompleted, onChange: (e) => setShowCompleted(e.target.checked), id: "show-completed" }), _jsx("label", { htmlFor: "show-completed", style: { cursor: 'pointer' }, children: "\u041F\u043E\u043A\u0430\u0437\u044B\u0432\u0430\u0442\u044C \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043D\u043D\u044B\u0435" })] }), _jsx(CalendarLike, { tasks: filteredTasks, onTaskDrop: handleTaskDrop, onTaskResize: handleTaskResize, onCreateTask: handleCreateTask, renderTask: (task) => (_jsx(CalendarItem, { title: task.title, description: task.description, color: task.color, isCompleted: task.isCompleted, isInWork: task.isInWork, estimatedTime: task.estimatedTime, icon: task.isInWork ? _jsx(Clock, { size: 12, className: "text-white animate-pulse" }) : undefined, onClick: () => handleTaskClick(task.id) })) })] }));
     },
 };

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

@@ -1,5 +1,11 @@
 export const calculateTaskPositions = (tasks) => {
-    const tasksToRender = [...tasks].filter((t) => t.dueDate).sort((a, b) => a.dueDate.getTime() - b.dueDate.getTime());
+    const tasksToRender = [...tasks]
+        .map((t) => ({
+        ...t,
+        dueDate: t.dueDate instanceof Date ? t.dueDate : new Date(t.dueDate),
+    }))
+        .filter((t) => t.dueDate && !isNaN(t.dueDate.getTime()))
+        .sort((a, b) => a.dueDate.getTime() - b.dueDate.getTime());
     const columns = [];
     tasksToRender.forEach((task) => {
         const startTime = task.dueDate.getTime();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kkkarsss/ui",
-  "version": "1.1.0",
+  "version": "1.1.2",
   "description": "UI Kit for kkkarsss projects",
   "type": "module",
   "main": "dist/index.js",