akfatimeline 1.0.6 → 1.2.0

package/dist/utils/timeUtils.js

@@ -0,0 +1,179 @@
+// src/utils/timeUtils.js
+
+/**
+ * Saat bazlı time slot'ları oluşturur
+ * @param {number} startHour - Başlangıç saati (0-23)
+ * @param {number} endHour - Bitiş saati (0-24)
+ * @param {number} intervalMinutes - Slot aralığı (dakika cinsinden)
+ * @returns {Array} - Time slot array [{hour, minute, display, totalMinutes}]
+ */
+export const generateTimeSlots = (startHour = 0, endHour = 24, intervalMinutes = 60) => {
+  const slots = [];
+  const totalMinutes = (endHour - startHour) * 60;
+  const slotCount = Math.floor(totalMinutes / intervalMinutes);
+
+  for (let i = 0; i <= slotCount; i++) {
+    const totalMinutesFromStart = i * intervalMinutes;
+    const hour = Math.floor(totalMinutesFromStart / 60) + startHour;
+    const minute = totalMinutesFromStart % 60;
+    
+    // 24:00'ı 00:00 olarak göster
+    const displayHour = hour >= 24 ? 0 : hour;
+    const displayMinute = minute === 0 ? '00' : minute.toString().padStart(2, '0');
+    
+    slots.push({
+      hour: displayHour,
+      minute,
+      display: `${displayHour.toString().padStart(2, '0')}:${displayMinute}`,
+      totalMinutes: totalMinutesFromStart,
+      rawHour: hour,
+    });
+  }
+
+  return slots;
+};
+
+/**
+ * Bir Date objesinden saat ve dakikayı alır
+ * @param {Date} date - Date objesi
+ * @returns {Object} - {hour, minute, totalMinutes}
+ */
+export const getTimeFromDate = (date) => {
+  if (!(date instanceof Date)) {
+    date = new Date(date);
+  }
+  const hour = date.getHours();
+  const minute = date.getMinutes();
+  return {
+    hour,
+    minute,
+    totalMinutes: hour * 60 + minute,
+  };
+};
+
+/**
+ * Saat ve dakikadan toplam dakikayı hesaplar
+ * @param {number} hour - Saat (0-23)
+ * @param {number} minute - Dakika (0-59)
+ * @returns {number} - Toplam dakika
+ */
+export const timeToMinutes = (hour, minute = 0) => {
+  return hour * 60 + minute;
+};
+
+/**
+ * Toplam dakikayı saat ve dakikaya çevirir
+ * @param {number} totalMinutes - Toplam dakika
+ * @returns {Object} - {hour, minute}
+ */
+export const minutesToTime = (totalMinutes) => {
+  const hour = Math.floor(totalMinutes / 60);
+  const minute = totalMinutes % 60;
+  return { hour, minute };
+};
+
+/**
+ * Bir event'in saat bazlı pozisyonunu hesaplar
+ * @param {Date} startDate - Başlangıç tarihi ve saati
+ * @param {Date} endDate - Bitiş tarihi ve saati
+ * @param {Date} dayStart - Günün başlangıcı (00:00)
+ * @param {number} startHour - Timeline başlangıç saati
+ * @param {number} endHour - Timeline bitiş saati
+ * @param {number} intervalMinutes - Slot aralığı
+ * @returns {Object} - {top, height, isVisible, startMinutes, endMinutes}
+ */
+export const calculateTimePosition = (
+  startDate,
+  endDate,
+  dayStart,
+  startHour = 0,
+  endHour = 24,
+  intervalMinutes = 60
+) => {
+  // Günün başlangıç ve bitiş zamanlarını oluştur
+  const dayStartTime = new Date(dayStart);
+  dayStartTime.setHours(startHour, 0, 0, 0);
+  
+  const dayEndTime = new Date(dayStart);
+  if (endHour === 24) {
+    dayEndTime.setHours(23, 59, 59, 999);
+  } else {
+    dayEndTime.setHours(endHour, 0, 0, 0);
+  }
+  
+  // Event başlangıç ve bitiş zamanları
+  const eventStart = new Date(startDate);
+  const eventEnd = new Date(endDate);
+  
+  // Event bu gün içinde mi kontrol et
+  const dayDateStr = dayStartTime.toDateString();
+  const eventStartDateStr = eventStart.toDateString();
+  const eventEndDateStr = eventEnd.toDateString();
+  
+  // Event bu günü kapsamıyorsa görünmez
+  if (eventEndDateStr < dayDateStr || eventStartDateStr > dayDateStr) {
+    return { isVisible: false, top: 0, height: 0, startMinutes: 0, endMinutes: 0 };
+  }
+  
+  // Gün içindeki dakika aralığını hesapla
+  const dayStartMinutes = startHour * 60;
+  const dayEndMinutes = endHour === 24 ? 24 * 60 : endHour * 60;
+  const dayTotalMinutes = dayEndMinutes - dayStartMinutes;
+  
+  // Event'in gün içindeki başlangıç ve bitiş dakikaları
+  let eventStartMinutes = 0;
+  let eventEndMinutes = 0;
+  
+  if (eventStartDateStr === dayDateStr) {
+    // Event bugün başlıyor
+    const time = getTimeFromDate(eventStart);
+    eventStartMinutes = time.totalMinutes;
+  } else {
+    // Event daha önce başlamış, günün başından itibaren göster
+    eventStartMinutes = dayStartMinutes;
+  }
+  
+  if (eventEndDateStr === dayDateStr) {
+    // Event bugün bitiyor
+    const time = getTimeFromDate(eventEnd);
+    eventEndMinutes = time.totalMinutes;
+  } else {
+    // Event daha sonra bitiyor, günün sonuna kadar göster
+    eventEndMinutes = dayEndMinutes;
+  }
+  
+  // Timeline sınırlarına göre ayarla
+  const effectiveStartMinutes = Math.max(eventStartMinutes, dayStartMinutes);
+  const effectiveEndMinutes = Math.min(eventEndMinutes, dayEndMinutes);
+  
+  // Eğer etkili süre yoksa görünmez
+  if (effectiveEndMinutes <= effectiveStartMinutes) {
+    return { isVisible: false, top: 0, height: 0, startMinutes: 0, endMinutes: 0 };
+  }
+  
+  // Pozisyon hesaplama (yüzde olarak)
+  const topPercentage = ((effectiveStartMinutes - dayStartMinutes) / dayTotalMinutes) * 100;
+  const heightPercentage = ((effectiveEndMinutes - effectiveStartMinutes) / dayTotalMinutes) * 100;
+  
+  return {
+    isVisible: true,
+    top: `${Math.max(0, topPercentage)}%`,
+    height: `${Math.min(100, heightPercentage)}%`,
+    startMinutes: effectiveStartMinutes,
+    endMinutes: effectiveEndMinutes,
+  };
+};
+
+/**
+ * Bir tarih ve saati birleştirir
+ * @param {Date} date - Tarih
+ * @param {number} hour - Saat
+ * @param {number} minute - Dakika
+ * @returns {Date} - Birleştirilmiş Date objesi
+ */
+export const combineDateAndTime = (date, hour, minute = 0) => {
+  const newDate = new Date(date);
+  newDate.setHours(hour, minute, 0, 0);
+  return newDate;
+};
+

package/dist/{dist/utils → utils}/timelineUtils.js

@@ -1,40 +1,40 @@
-// src/utils/timelineUtils.js
-
-export const generateTimelineData = (startYear, endYear) => {
-    const dayNames = ["Paz", "Pzt", "Sal", "Çar", "Per", "Cum", "Cmt"];
-    const monthNames = [
-      "Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran",
-      "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık",
-    ];
-  
-    const dates = [];
-    const monthHeaders = [];
-  
-    for (let year = startYear; year <= endYear; year++) {
-      for (let month = 1; month <= 12; month++) {
-        const daysInMonth = new Date(year, month, 0).getDate();
-        const startIndex = dates.length;
-  
-        for (let day = 1; day <= daysInMonth; day++) {
-          const date = new Date(year, month - 1, day);
-          const dayName = dayNames[date.getDay()];
-          dates.push({
-            fullDate: date,
-            display: `${day} ${dayName}`,
-          });
-        }
-  
-        const endIndex = dates.length - 1;
-        monthHeaders.push({
-          monthName: monthNames[month - 1],
-          year,
-          startIndex,
-          endIndex,
-          totalDays: endIndex - startIndex + 1,
-        });
-      }
-    }
-  
-    return { dates, monthHeaders };
-  };
+// src/utils/timelineUtils.js
+
+export const generateTimelineData = (startYear, endYear) => {
+    const dayNames = ["Paz", "Pzt", "Sal", "Çar", "Per", "Cum", "Cmt"];
+    const monthNames = [
+      "Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran",
+      "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık",
+    ];
+  
+    const dates = [];
+    const monthHeaders = [];
+  
+    for (let year = startYear; year <= endYear; year++) {
+      for (let month = 1; month <= 12; month++) {
+        const daysInMonth = new Date(year, month, 0).getDate();
+        const startIndex = dates.length;
+  
+        for (let day = 1; day <= daysInMonth; day++) {
+          const date = new Date(year, month - 1, day);
+          const dayName = dayNames[date.getDay()];
+          dates.push({
+            fullDate: date,
+            display: `${day} ${dayName}`,
+          });
+        }
+  
+        const endIndex = dates.length - 1;
+        monthHeaders.push({
+          monthName: monthNames[month - 1],
+          year,
+          startIndex,
+          endIndex,
+          totalDays: endIndex - startIndex + 1,
+        });
+      }
+    }
+  
+    return { dates, monthHeaders };
+  };
   

package/dist/utils/viewModeUtils.js

@@ -0,0 +1,54 @@
+// src/utils/viewModeUtils.js
+
+/**
+ * View mode'a göre hücre genişliğini hesaplar
+ * @param {string} viewMode - "day" | "week" | "month"
+ * @param {number} containerWidth - Container genişliği
+ * @param {number} dayRange - Gün aralığı
+ * @returns {number} - Hücre genişliği (px)
+ */
+export const calculateCellWidth = (viewMode, containerWidth, dayRange) => {
+  switch (viewMode) {
+    case 'day':
+      // Gün görünümü: Her gün için geniş hücreler
+      return Math.max(containerWidth / Math.min(dayRange, 7), 150);
+    case 'week':
+      // Hafta görünümü: Orta genişlik
+      return Math.max(containerWidth / Math.min(dayRange, 14), 80);
+    case 'month':
+      // Ay görünümü: Dar hücreler
+      return Math.max(containerWidth / dayRange, 40);
+    default:
+      return 56.95; // Varsayılan
+  }
+};
+
+/**
+ * View mode'a göre varsayılan dayRange'i döndürür
+ * @param {string} viewMode - "day" | "week" | "month"
+ * @returns {number} - Varsayılan dayRange
+ */
+export const getDefaultDayRange = (viewMode) => {
+  switch (viewMode) {
+    case 'day':
+      return 7; // 1 hafta
+    case 'week':
+      return 14; // 2 hafta
+    case 'month':
+      return 30; // 1 ay
+    default:
+      return 30;
+  }
+};
+
+/**
+ * View mode'a göre container genişliğini hesaplar
+ * @param {string} viewMode - "day" | "week" | "month"
+ * @param {number} dayRange - Gün aralığı
+ * @param {number} cellWidth - Hücre genişliği
+ * @returns {number} - Container genişliği (px)
+ */
+export const calculateContainerWidth = (viewMode, dayRange, cellWidth) => {
+  return dayRange * cellWidth;
+};
+

package/package.json

@@ -1,21 +1,88 @@
 {
   "name": "akfatimeline",
-  "version": "1.0.6",
+  "version": "1.2.0",
   "description": "A customizable timeline component for React applications",
-  "main": "dist/Timeline.js",
-  "module": "dist/Timeline.js",
+  "main": "./src/library.js",
+  "module": "./src/library.js",
+  "types": "./src/library.js",
+  "files": [
+    "dist",
+    "src",
+    "README.md",
+    "CHANGELOG.md"
+  ],
+  "exports": {
+    ".": {
+      "types": "./src/library.js",
+      "import": "./src/library.js",
+      "require": "./dist/Timeline.js",
+      "default": "./src/library.js"
+    },
+    "./css": "./src/components/Timeline/Timeline.css",
+    "./components/Timeline/Timeline.css": "./src/components/Timeline/Timeline.css",
+    "./Timeline": {
+      "types": "./src/components/Timeline/Timeline.js",
+      "import": "./src/components/Timeline/Timeline.js",
+      "require": "./dist/components/Timeline/Timeline.js",
+      "default": "./src/components/Timeline/Timeline.js"
+    },
+    "./DailyView": {
+      "types": "./src/components/Timeline/DailyView.js",
+      "import": "./src/components/Timeline/DailyView.js",
+      "require": "./dist/components/Timeline/DailyView.js",
+      "default": "./src/components/Timeline/DailyView.js"
+    },
+    "./ContextMenu": {
+      "types": "./src/components/Timeline/ContextMenu.js",
+      "import": "./src/components/Timeline/ContextMenu.js",
+      "require": "./dist/components/Timeline/ContextMenu.js",
+      "default": "./src/components/Timeline/ContextMenu.js"
+    },
+    "./EventDetailModal": {
+      "types": "./src/components/Timeline/EventDetailModal.js",
+      "import": "./src/components/Timeline/EventDetailModal.js",
+      "require": "./dist/components/Timeline/EventDetailModal.js",
+      "default": "./src/components/Timeline/EventDetailModal.js"
+    },
+    "./EventIcon": {
+      "types": "./src/components/Timeline/EventIcon.js",
+      "import": "./src/components/Timeline/EventIcon.js",
+      "require": "./dist/components/Timeline/EventIcon.js",
+      "default": "./src/components/Timeline/EventIcon.js"
+    },
+    "./EventBadge": {
+      "types": "./src/components/Timeline/EventBadge.js",
+      "import": "./src/components/Timeline/EventBadge.js",
+      "require": "./dist/components/Timeline/EventBadge.js",
+      "default": "./src/components/Timeline/EventBadge.js"
+    },
+    "./LoadingSpinner": {
+      "types": "./src/components/Timeline/LoadingSpinner.js",
+      "import": "./src/components/Timeline/LoadingSpinner.js",
+      "require": "./dist/components/Timeline/LoadingSpinner.js",
+      "default": "./src/components/Timeline/LoadingSpinner.js"
+    },
+    "./AutocompleteSelect": {
+      "types": "./src/components/Timeline/AutocompleteSelect.js",
+      "import": "./src/components/Timeline/AutocompleteSelect.js",
+      "require": "./dist/components/Timeline/AutocompleteSelect.js",
+      "default": "./src/components/Timeline/AutocompleteSelect.js"
+    }
+  },
   "dependencies": {
-    "cra-template": "1.2.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "react-scripts": "5.0.1",
-    "react-window": "^1.8.11",
-    "uuid": "^11.0.3",
-    "web-vitals": "^4.2.4"
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "react-scripts": "^5.0.1",
+    "react-window": "^2.2.3",
+    "uuid": "^13.0.0"
   },
   "scripts": {
+    "dev": "react-scripts start",
     "start": "react-scripts start",
-    "build": "react-scripts build",
+    "dev:clean": "react-scripts start --reset-cache",
+    "build": "webpack --mode production",
+    "build:dev": "webpack --mode development",
+    "build:watch": "webpack --mode development --watch",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
@@ -49,21 +116,24 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/AKFAPLUS/akfatimeline.git"
+    "url": "git+https://github.com/AKFAPLUS/akfatimeline.git"
   },
   "bugs": {
     "url": "https://github.com/AKFAPLUS/akfatimeline/issues"
   },
-  "homepage": "https://github.com/AKFAPLUS/akfatimeline#readme",
+  "homepage": ".",
   "devDependencies": {
-    "@babel/core": "^7.26.0",
-    "@babel/preset-env": "^7.26.0",
-    "@babel/preset-react": "^7.26.3",
-    "babel-loader": "^9.2.1",
-    "copy-webpack-plugin": "^12.0.2",
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5",
+    "autoprefixer": "^10.4.20",
+    "babel-loader": "^10.0.0",
+    "copy-webpack-plugin": "^13.0.1",
     "css-loader": "^7.1.2",
+    "postcss": "^8.4.47",
     "style-loader": "^4.0.0",
-    "webpack": "^5.97.1",
+    "tailwindcss": "^3.4.13",
+    "webpack": "^5.104.1",
     "webpack-cli": "^6.0.1"
   }
 }