akfatimeline 2.2.5 → 2.2.7

package/dist/Timeline.js

@@ -3145,7 +3145,9 @@ const MasterHeader = _ref => {
     zoomStep = 0.25,
     showDefaultButtons = true,
     // Varsayılan butonları göster/gizle
-    customButtons = [] // Özel butonlar: [{ id, label, onClick, icon?, disabled?, className? }]
+    customButtons = [],
+    // Özel butonlar: [{ id, label, onClick, icon?, disabled?, className? }]
+    onCustomButtonClick // Custom button'a tıklandığında tarih string'i geçildiğinde çağrılacak fonksiyon
   } = _ref;
   const formattedDate = new Date(selectedDate.getTime() + 24 * 60 * 60 * 1000 - selectedDate.getTimezoneOffset() * 60000).toISOString().split("T")[0]; // YYYY-MM-DD formatı
 
@@ -3179,7 +3181,16 @@ const MasterHeader = _ref => {
   }, "Bug\xFCn")), customButtons && customButtons.length > 0 && customButtons.map(button => /*#__PURE__*/external_react_default().createElement("button", {
     key: button.id,
     className: button.className ? "master-header-btn ".concat(button.className) : "master-header-btn",
-    onClick: button.onClick,
+    onClick: () => {
+      if (button.onClick) {
+        const result = button.onClick();
+        // Eğer onClick bir tarih string'i döndürüyorsa, onCustomButtonClick'i çağır
+        if (typeof result === 'string' && onCustomButtonClick) {
+          onCustomButtonClick(result);
+        }
+        // Normal onClick davranışı da çalışır (eğer result undefined ise)
+      }
+    },
     disabled: button.disabled,
     title: button.tooltip || button.label
   }, button.icon && /*#__PURE__*/external_react_default().createElement("span", {
@@ -4241,7 +4252,6 @@ const TimelineContent = _ref => {
     if (!createNewEventOn) return;
     if (!isCreating) return;
     if (mode === "extend") {
-      console.log(">>> 'extend' mode, skip new event creation");
       return;
     }
     const handleMouseMove = e => {
@@ -4399,16 +4409,10 @@ const TimelineContent = _ref => {
 
   // ------------------- Drag Logic -------------------
   const handleDragStartSafe = (e, eventId) => {
-    console.log("[TimelineContent] handleDragStartSafe called:", {
-      eventId,
-      eventsDragOn
-    });
     if (!eventsDragOn) {
-      console.log("[TimelineContent] Events drag is disabled, preventing drag start");
       e.preventDefault();
       return;
     }
-    console.log("[TimelineContent] Calling handleDragStart...");
     handleDragStart(e, eventId);
   };
   const handleDragEndSafe = e => {
@@ -4423,7 +4427,6 @@ const TimelineContent = _ref => {
   const handleMouseDownExtend = (mouseEvent, event) => {
     if (!eventsExtendOn) return;
     mouseEvent.stopPropagation();
-    console.log(">>> Extend start ID:", event.id);
     setMode("extend");
     setExtendingEvent(event);
     setOriginalEndDate(event.endDate);
@@ -4443,7 +4446,6 @@ const TimelineContent = _ref => {
     }) : evt));
   }, [mode, extendingEvent, eventsExtendOn, originalEndDate, startMouseX, setEvents]);
   const handleMouseUpExtend = (0,external_react_.useCallback)(() => {
-    console.log(">>> Extend finished ID:", extendingEvent === null || extendingEvent === void 0 ? void 0 : extendingEvent.id);
     if (onExtendInfo && extendingEvent) {
       // callback
       const updatedEvent = events.find(ev => ev.id === extendingEvent.id);
@@ -4590,15 +4592,6 @@ const TimelineContent = _ref => {
       const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
       const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
       isPastDate = cellDateOnly < preventPastEventsDateOnly;
-      // Debug: İlk birkaç hücre için log
-      if (colIndex < 3 && groupIndex === 0) {
-        console.log('[TimelineContent] Past date check:', {
-          cellDate: cellDateOnly.toISOString().split('T')[0],
-          preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-          isPastDate,
-          preventPastEvents
-        });
-      }
     }
 
     // Disabled tarih kontrolü
@@ -4712,7 +4705,6 @@ const TimelineContent = _ref => {
             e.preventDefault();
             return;
           }
-          console.log("[TimelineContent] Event drag start:", event.id);
           handleDragStart(e, event.id);
           e.stopPropagation();
 
@@ -4781,15 +4773,6 @@ const TimelineContent = _ref => {
         const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
         const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
         isPastDate = cellDateOnly < preventPastEventsDateOnly;
-        // Debug: İlk birkaç hücre için log
-        if (colIndex < 3 && rowIndex === 0 && groupIndex === 0) {
-          console.log('[TimelineContent] Cell past date check:', {
-            cellDate: cellDateOnly.toISOString().split('T')[0],
-            preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-            isPastDate,
-            preventPastEvents
-          });
-        }
       }
 
       // Hafta sonu kontrolü
@@ -4871,7 +4854,6 @@ const TimelineContent = _ref => {
           }
           e.preventDefault();
           e.stopPropagation();
-          console.log("[TimelineContent] onDragOver called for resource:", resource.id);
           handleDragOver(e);
         },
         onDrop: e => {
@@ -4884,7 +4866,6 @@ const TimelineContent = _ref => {
           }
           e.preventDefault();
           e.stopPropagation();
-          console.log("[TimelineContent] onDrop called for resource:", resource.id, "date:", dateObj.fullDate);
           handleDrop(e, resource.id, parseDate(dateObj.fullDate));
         }
       });
@@ -6022,11 +6003,31 @@ const Timeline_Timeline_Timeline = _ref => {
     }
   }, [programDate]);
 
+  // onToday prop'u değiştiğinde (tarih string'i ise) selectedDate'i güncelle
+  // Bu, customHeaderButtons'un onClick'inde tarih geçildiğinde kullanılır
+  (0,external_react_.useEffect)(() => {
+    // onToday bir string (tarih) ise, o tarihe git
+    if (onToday && typeof onToday === 'string') {
+      const date = new Date(onToday);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, [onToday]);
+
   // ---------------------------------------------------------
   // 2) local state
   // ---------------------------------------------------------
   const [collapsedGroups, setCollapsedGroups] = (0,external_react_.useState)({});
 
+  // Internal zoom state - eğer setZoomLevel prop'u yoksa kullanılır
+  const [internalZoomLevel, setInternalZoomLevel] = (0,external_react_.useState)(zoomLevel);
+
+  // Effective zoom level - prop varsa prop'u kullan, yoksa internal state'i kullan
+  const effectiveZoomLevel = setZoomLevel ? zoomLevel : internalZoomLevel;
+  const effectiveSetZoomLevel = setZoomLevel || setInternalZoomLevel;
+
   // Event Management
   const eventManagement = hooks_useEventManagement(events, newEvents => {
     setLocalEvents(newEvents);
@@ -6077,9 +6078,17 @@ const Timeline_Timeline_Timeline = _ref => {
   //    Container genişliği = dayRange * cellWidth
   // ---------------------------------------------------------
   const baseCellWidth = 56.95; // Temel hücre genişliği (zoom = 1.0 için)
-  const cellWidth = baseCellWidth * zoomLevel; // Zoom seviyesine göre hücre genişliği
+  const cellWidth = baseCellWidth * effectiveZoomLevel; // Zoom seviyesine göre hücre genişliği
   const containerWidth = dayRange * cellWidth;
 
+  // Internal zoom state'i prop'tan gelen zoomLevel ile senkronize et
+  (0,external_react_.useEffect)(() => {
+    if (setZoomLevel) {
+      // Prop'tan gelen zoomLevel kullanılıyor, internal state'i güncelle
+      setInternalZoomLevel(zoomLevel);
+    }
+  }, [zoomLevel, setZoomLevel]);
+
   // ---------------------------------------------------------
   // 4) Touch Gestures (Mobil desteği)
   // ---------------------------------------------------------
@@ -6175,12 +6184,29 @@ const Timeline_Timeline_Timeline = _ref => {
   const handleDateChange = newDate => {
     setSelectedDate(new Date(newDate));
   };
+
+  // CustomHeaderButtons için tarih değiştirme fonksiyonu
+  // Bu fonksiyon customHeaderButtons'un onClick'inde kullanılabilir
+  const handleCustomDateChange = (0,external_react_.useCallback)(dateString => {
+    if (dateString) {
+      const date = new Date(dateString);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, []);
   const handleToday = () => {
-    const today = programDate ? new Date(programDate) : new Date();
-    today.setDate(today.getDate() - 3); // Program tarihinden 3 gün öncesini ayarla
+    // Bugünün tarihini al
+    const today = new Date();
+    today.setDate(today.getDate() - 3); // Bugünden 3 gün öncesini ayarla
     setSelectedDate(today);
-    // App.js'teki callback'i de çağır
-    if (onToday) onToday();
+
+    // onToday callback'i bir fonksiyon ise çağır
+    // Eğer onToday bir string (tarih) ise veya başka bir değer ise, sadece setSelectedDate yeterli
+    if (typeof onToday === 'function') {
+      onToday();
+    }
   };
   const handleAdvance = () => {
     setSelectedDate(prev => new Date(prev.getTime() + 5 * 24 * 60 * 60 * 1000));
@@ -6219,15 +6245,15 @@ const Timeline_Timeline_Timeline = _ref => {
   // 8.5) Zoom handlers
   // ---------------------------------------------------------
   const handleZoomIn = (0,external_react_.useCallback)(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel(prev => Math.min(maxZoomLevel, prev + zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel(prev => Math.min(maxZoomLevel, prev + zoomStep));
     }
-  }, [setZoomLevel, zoomOn, maxZoomLevel, zoomStep]);
+  }, [zoomOn, maxZoomLevel, zoomStep, effectiveSetZoomLevel]);
   const handleZoomOut = (0,external_react_.useCallback)(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel(prev => Math.max(minZoomLevel, prev - zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel(prev => Math.max(minZoomLevel, prev - zoomStep));
     }
-  }, [setZoomLevel, zoomOn, minZoomLevel, zoomStep]);
+  }, [zoomOn, minZoomLevel, zoomStep, effectiveSetZoomLevel]);
 
   // ---------------------------------------------------------
   // 8.6) Keyboard Shortcuts
@@ -6279,14 +6305,15 @@ const Timeline_Timeline_Timeline = _ref => {
     onMonthRetreat: handleMonthRetreat,
     dayRange: dayRange,
     setDayRange: setDayRange,
-    zoomLevel: zoomLevel,
-    setZoomLevel: setZoomLevel,
+    zoomLevel: effectiveZoomLevel,
+    setZoomLevel: effectiveSetZoomLevel,
     zoomOn: zoomOn,
     minZoomLevel: minZoomLevel,
     maxZoomLevel: maxZoomLevel,
     zoomStep: zoomStep,
     showDefaultButtons: showDefaultHeaderButtons,
-    customButtons: customHeaderButtons
+    customButtons: customHeaderButtons,
+    onCustomButtonClick: handleCustomDateChange
   })), /*#__PURE__*/external_react_default().createElement("div", {
     className: "timeline-body"
   }, /*#__PURE__*/external_react_default().createElement("div", {

package/dist/components/Timeline/MasterHeader.jsx

@@ -19,6 +19,7 @@ const MasterHeader = ({
   zoomStep = 0.25,
   showDefaultButtons = true, // Varsayılan butonları göster/gizle
   customButtons = [], // Özel butonlar: [{ id, label, onClick, icon?, disabled?, className? }]
+  onCustomButtonClick, // Custom button'a tıklandığında tarih string'i geçildiğinde çağrılacak fonksiyon
 }) => {
   const formattedDate = new Date(
     selectedDate.getTime() + 24 * 60 * 60 * 1000 - selectedDate.getTimezoneOffset() * 60000
@@ -67,7 +68,16 @@ const MasterHeader = ({
           <button
             key={button.id}
             className={button.className ? `master-header-btn ${button.className}` : "master-header-btn"}
-            onClick={button.onClick}
+            onClick={() => {
+              if (button.onClick) {
+                const result = button.onClick();
+                // Eğer onClick bir tarih string'i döndürüyorsa, onCustomButtonClick'i çağır
+                if (typeof result === 'string' && onCustomButtonClick) {
+                  onCustomButtonClick(result);
+                }
+                // Normal onClick davranışı da çalışır (eğer result undefined ise)
+              }
+            }}
             disabled={button.disabled}
             title={button.tooltip || button.label}
           >

package/dist/components/Timeline/Timeline.jsx

@@ -154,10 +154,30 @@ const Timeline = ({
     }
   }, [programDate]);
   
+  // onToday prop'u değiştiğinde (tarih string'i ise) selectedDate'i güncelle
+  // Bu, customHeaderButtons'un onClick'inde tarih geçildiğinde kullanılır
+  useEffect(() => {
+    // onToday bir string (tarih) ise, o tarihe git
+    if (onToday && typeof onToday === 'string') {
+      const date = new Date(onToday);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, [onToday]);
+  
   // ---------------------------------------------------------
   // 2) local state
   // ---------------------------------------------------------
   const [collapsedGroups, setCollapsedGroups] = useState({});
+  
+  // Internal zoom state - eğer setZoomLevel prop'u yoksa kullanılır
+  const [internalZoomLevel, setInternalZoomLevel] = useState(zoomLevel);
+  
+  // Effective zoom level - prop varsa prop'u kullan, yoksa internal state'i kullan
+  const effectiveZoomLevel = setZoomLevel ? zoomLevel : internalZoomLevel;
+  const effectiveSetZoomLevel = setZoomLevel || setInternalZoomLevel;
 
   // Event Management
   const eventManagement = useEventManagement(
@@ -212,9 +232,17 @@ const Timeline = ({
   //    Container genişliği = dayRange * cellWidth
   // ---------------------------------------------------------
   const baseCellWidth = 56.95; // Temel hücre genişliği (zoom = 1.0 için)
-  const cellWidth = baseCellWidth * zoomLevel; // Zoom seviyesine göre hücre genişliği
+  const cellWidth = baseCellWidth * effectiveZoomLevel; // Zoom seviyesine göre hücre genişliği
   const containerWidth = dayRange * cellWidth;
   
+  // Internal zoom state'i prop'tan gelen zoomLevel ile senkronize et
+  useEffect(() => {
+    if (setZoomLevel) {
+      // Prop'tan gelen zoomLevel kullanılıyor, internal state'i güncelle
+      setInternalZoomLevel(zoomLevel);
+    }
+  }, [zoomLevel, setZoomLevel]);
+  
   // ---------------------------------------------------------
   // 4) Touch Gestures (Mobil desteği)
   // ---------------------------------------------------------
@@ -325,13 +353,30 @@ const Timeline = ({
   const handleDateChange = (newDate) => {
     setSelectedDate(new Date(newDate));
   };
+  
+  // CustomHeaderButtons için tarih değiştirme fonksiyonu
+  // Bu fonksiyon customHeaderButtons'un onClick'inde kullanılabilir
+  const handleCustomDateChange = useCallback((dateString) => {
+    if (dateString) {
+      const date = new Date(dateString);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, []);
 
   const handleToday = () => {
-    const today = programDate ? new Date(programDate) : new Date();
-    today.setDate(today.getDate() - 3); // Program tarihinden 3 gün öncesini ayarla
+    // Bugünün tarihini al
+    const today = new Date();
+    today.setDate(today.getDate() - 3); // Bugünden 3 gün öncesini ayarla
     setSelectedDate(today);
-    // App.js'teki callback'i de çağır
-    if (onToday) onToday();
+    
+    // onToday callback'i bir fonksiyon ise çağır
+    // Eğer onToday bir string (tarih) ise veya başka bir değer ise, sadece setSelectedDate yeterli
+    if (typeof onToday === 'function') {
+      onToday();
+    }
   };
   
 
@@ -376,16 +421,16 @@ const Timeline = ({
   // 8.5) Zoom handlers
   // ---------------------------------------------------------
   const handleZoomIn = useCallback(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel((prev) => Math.min(maxZoomLevel, prev + zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel((prev) => Math.min(maxZoomLevel, prev + zoomStep));
     }
-  }, [setZoomLevel, zoomOn, maxZoomLevel, zoomStep]);
+  }, [zoomOn, maxZoomLevel, zoomStep, effectiveSetZoomLevel]);
 
   const handleZoomOut = useCallback(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel((prev) => Math.max(minZoomLevel, prev - zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel((prev) => Math.max(minZoomLevel, prev - zoomStep));
     }
-  }, [setZoomLevel, zoomOn, minZoomLevel, zoomStep]);
+  }, [zoomOn, minZoomLevel, zoomStep, effectiveSetZoomLevel]);
 
   // ---------------------------------------------------------
   // 8.6) Keyboard Shortcuts
@@ -443,14 +488,15 @@ const Timeline = ({
           onMonthRetreat={handleMonthRetreat}
           dayRange={dayRange}
           setDayRange={setDayRange}
-          zoomLevel={zoomLevel}
-          setZoomLevel={setZoomLevel}
+          zoomLevel={effectiveZoomLevel}
+          setZoomLevel={effectiveSetZoomLevel}
           zoomOn={zoomOn}
           minZoomLevel={minZoomLevel}
           maxZoomLevel={maxZoomLevel}
           zoomStep={zoomStep}
           showDefaultButtons={showDefaultHeaderButtons}
           customButtons={customHeaderButtons}
+          onCustomButtonClick={handleCustomDateChange}
         />
       </div>
 )}

package/dist/components/Timeline/TimelineContent.jsx

@@ -308,7 +308,6 @@ const TimelineContent = ({
     if (!createNewEventOn) return;
     if (!isCreating) return;
     if (mode === "extend") {
-      console.log(">>> 'extend' mode, skip new event creation");
       return;
     }
 
@@ -474,13 +473,10 @@ const TimelineContent = ({
 
   // ------------------- Drag Logic -------------------
   const handleDragStartSafe = (e, eventId) => {
-    console.log("[TimelineContent] handleDragStartSafe called:", { eventId, eventsDragOn });
     if (!eventsDragOn) {
-      console.log("[TimelineContent] Events drag is disabled, preventing drag start");
       e.preventDefault();
       return;
     }
-    console.log("[TimelineContent] Calling handleDragStart...");
     handleDragStart(e, eventId);
   };
   const handleDragEndSafe = (e) => {
@@ -499,7 +495,6 @@ const TimelineContent = ({
   const handleMouseDownExtend = (mouseEvent, event) => {
     if (!eventsExtendOn) return;
     mouseEvent.stopPropagation();
-    console.log(">>> Extend start ID:", event.id);
     setMode("extend");
     setExtendingEvent(event);
     setOriginalEndDate(event.endDate);
@@ -525,7 +520,6 @@ const TimelineContent = ({
   }, [mode, extendingEvent, eventsExtendOn, originalEndDate, startMouseX, setEvents]);
 
   const handleMouseUpExtend = useCallback(() => {
-    console.log(">>> Extend finished ID:", extendingEvent?.id);
     if (onExtendInfo && extendingEvent) {
       // callback
       const updatedEvent = events.find((ev) => ev.id === extendingEvent.id);
@@ -686,15 +680,6 @@ const TimelineContent = ({
             const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
             const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
             isPastDate = cellDateOnly < preventPastEventsDateOnly;
-            // Debug: İlk birkaç hücre için log
-            if (colIndex < 3 && groupIndex === 0) {
-              console.log('[TimelineContent] Past date check:', {
-                cellDate: cellDateOnly.toISOString().split('T')[0],
-                preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-                isPastDate,
-                preventPastEvents
-              });
-            }
           }
           
           // Disabled tarih kontrolü
@@ -821,7 +806,6 @@ const TimelineContent = ({
                           e.preventDefault();
                           return;
                         }
-                        console.log("[TimelineContent] Event drag start:", event.id);
                         handleDragStart(e, event.id);
                         e.stopPropagation();
                         
@@ -912,15 +896,6 @@ const TimelineContent = ({
                 const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
                 const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
                 isPastDate = cellDateOnly < preventPastEventsDateOnly;
-                // Debug: İlk birkaç hücre için log
-                if (colIndex < 3 && rowIndex === 0 && groupIndex === 0) {
-                  console.log('[TimelineContent] Cell past date check:', {
-                    cellDate: cellDateOnly.toISOString().split('T')[0],
-                    preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-                    isPastDate,
-                    preventPastEvents
-                  });
-                }
               }
               
               // Hafta sonu kontrolü
@@ -1008,7 +983,6 @@ const TimelineContent = ({
                   }
                   e.preventDefault();
                   e.stopPropagation();
-                  console.log("[TimelineContent] onDragOver called for resource:", resource.id);
                   handleDragOver(e);
                 }}
                 onDrop={(e) => {
@@ -1020,8 +994,7 @@ const TimelineContent = ({
                     return false;
                   }
                   e.preventDefault();
-                  e.stopPropagation();
-                  console.log("[TimelineContent] onDrop called for resource:", resource.id, "date:", dateObj.fullDate);
+                  e.stopPropagation();                  
                   handleDrop(e, resource.id, parseDate(dateObj.fullDate));
                 }}
               ></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "akfatimeline",
-  "version": "2.2.5",
+  "version": "2.2.7",
   "description": "A customizable timeline component for React applications with disableDates, custom header buttons, and past date protection features",
   "main": "./src/library.js",
   "module": "./src/library.js",

package/src/components/Timeline/MasterHeader.jsx

@@ -19,6 +19,7 @@ const MasterHeader = ({
   zoomStep = 0.25,
   showDefaultButtons = true, // Varsayılan butonları göster/gizle
   customButtons = [], // Özel butonlar: [{ id, label, onClick, icon?, disabled?, className? }]
+  onCustomButtonClick, // Custom button'a tıklandığında tarih string'i geçildiğinde çağrılacak fonksiyon
 }) => {
   const formattedDate = new Date(
     selectedDate.getTime() + 24 * 60 * 60 * 1000 - selectedDate.getTimezoneOffset() * 60000
@@ -67,7 +68,16 @@ const MasterHeader = ({
           <button
             key={button.id}
             className={button.className ? `master-header-btn ${button.className}` : "master-header-btn"}
-            onClick={button.onClick}
+            onClick={() => {
+              if (button.onClick) {
+                const result = button.onClick();
+                // Eğer onClick bir tarih string'i döndürüyorsa, onCustomButtonClick'i çağır
+                if (typeof result === 'string' && onCustomButtonClick) {
+                  onCustomButtonClick(result);
+                }
+                // Normal onClick davranışı da çalışır (eğer result undefined ise)
+              }
+            }}
             disabled={button.disabled}
             title={button.tooltip || button.label}
           >

package/src/components/Timeline/Timeline.jsx

@@ -154,10 +154,30 @@ const Timeline = ({
     }
   }, [programDate]);
   
+  // onToday prop'u değiştiğinde (tarih string'i ise) selectedDate'i güncelle
+  // Bu, customHeaderButtons'un onClick'inde tarih geçildiğinde kullanılır
+  useEffect(() => {
+    // onToday bir string (tarih) ise, o tarihe git
+    if (onToday && typeof onToday === 'string') {
+      const date = new Date(onToday);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, [onToday]);
+  
   // ---------------------------------------------------------
   // 2) local state
   // ---------------------------------------------------------
   const [collapsedGroups, setCollapsedGroups] = useState({});
+  
+  // Internal zoom state - eğer setZoomLevel prop'u yoksa kullanılır
+  const [internalZoomLevel, setInternalZoomLevel] = useState(zoomLevel);
+  
+  // Effective zoom level - prop varsa prop'u kullan, yoksa internal state'i kullan
+  const effectiveZoomLevel = setZoomLevel ? zoomLevel : internalZoomLevel;
+  const effectiveSetZoomLevel = setZoomLevel || setInternalZoomLevel;
 
   // Event Management
   const eventManagement = useEventManagement(
@@ -212,9 +232,17 @@ const Timeline = ({
   //    Container genişliği = dayRange * cellWidth
   // ---------------------------------------------------------
   const baseCellWidth = 56.95; // Temel hücre genişliği (zoom = 1.0 için)
-  const cellWidth = baseCellWidth * zoomLevel; // Zoom seviyesine göre hücre genişliği
+  const cellWidth = baseCellWidth * effectiveZoomLevel; // Zoom seviyesine göre hücre genişliği
   const containerWidth = dayRange * cellWidth;
   
+  // Internal zoom state'i prop'tan gelen zoomLevel ile senkronize et
+  useEffect(() => {
+    if (setZoomLevel) {
+      // Prop'tan gelen zoomLevel kullanılıyor, internal state'i güncelle
+      setInternalZoomLevel(zoomLevel);
+    }
+  }, [zoomLevel, setZoomLevel]);
+  
   // ---------------------------------------------------------
   // 4) Touch Gestures (Mobil desteği)
   // ---------------------------------------------------------
@@ -325,13 +353,30 @@ const Timeline = ({
   const handleDateChange = (newDate) => {
     setSelectedDate(new Date(newDate));
   };
+  
+  // CustomHeaderButtons için tarih değiştirme fonksiyonu
+  // Bu fonksiyon customHeaderButtons'un onClick'inde kullanılabilir
+  const handleCustomDateChange = useCallback((dateString) => {
+    if (dateString) {
+      const date = new Date(dateString);
+      if (!isNaN(date.getTime())) {
+        date.setDate(date.getDate() - 3); // Tarihten 3 gün öncesini al
+        setSelectedDate(date);
+      }
+    }
+  }, []);
 
   const handleToday = () => {
-    const today = programDate ? new Date(programDate) : new Date();
-    today.setDate(today.getDate() - 3); // Program tarihinden 3 gün öncesini ayarla
+    // Bugünün tarihini al
+    const today = new Date();
+    today.setDate(today.getDate() - 3); // Bugünden 3 gün öncesini ayarla
     setSelectedDate(today);
-    // App.js'teki callback'i de çağır
-    if (onToday) onToday();
+    
+    // onToday callback'i bir fonksiyon ise çağır
+    // Eğer onToday bir string (tarih) ise veya başka bir değer ise, sadece setSelectedDate yeterli
+    if (typeof onToday === 'function') {
+      onToday();
+    }
   };
   
 
@@ -376,16 +421,16 @@ const Timeline = ({
   // 8.5) Zoom handlers
   // ---------------------------------------------------------
   const handleZoomIn = useCallback(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel((prev) => Math.min(maxZoomLevel, prev + zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel((prev) => Math.min(maxZoomLevel, prev + zoomStep));
     }
-  }, [setZoomLevel, zoomOn, maxZoomLevel, zoomStep]);
+  }, [zoomOn, maxZoomLevel, zoomStep, effectiveSetZoomLevel]);
 
   const handleZoomOut = useCallback(() => {
-    if (setZoomLevel && zoomOn) {
-      setZoomLevel((prev) => Math.max(minZoomLevel, prev - zoomStep));
+    if (zoomOn) {
+      effectiveSetZoomLevel((prev) => Math.max(minZoomLevel, prev - zoomStep));
     }
-  }, [setZoomLevel, zoomOn, minZoomLevel, zoomStep]);
+  }, [zoomOn, minZoomLevel, zoomStep, effectiveSetZoomLevel]);
 
   // ---------------------------------------------------------
   // 8.6) Keyboard Shortcuts
@@ -443,14 +488,15 @@ const Timeline = ({
           onMonthRetreat={handleMonthRetreat}
           dayRange={dayRange}
           setDayRange={setDayRange}
-          zoomLevel={zoomLevel}
-          setZoomLevel={setZoomLevel}
+          zoomLevel={effectiveZoomLevel}
+          setZoomLevel={effectiveSetZoomLevel}
           zoomOn={zoomOn}
           minZoomLevel={minZoomLevel}
           maxZoomLevel={maxZoomLevel}
           zoomStep={zoomStep}
           showDefaultButtons={showDefaultHeaderButtons}
           customButtons={customHeaderButtons}
+          onCustomButtonClick={handleCustomDateChange}
         />
       </div>
 )}

package/src/components/Timeline/TimelineContent.jsx

@@ -308,7 +308,6 @@ const TimelineContent = ({
     if (!createNewEventOn) return;
     if (!isCreating) return;
     if (mode === "extend") {
-      console.log(">>> 'extend' mode, skip new event creation");
       return;
     }
 
@@ -474,13 +473,10 @@ const TimelineContent = ({
 
   // ------------------- Drag Logic -------------------
   const handleDragStartSafe = (e, eventId) => {
-    console.log("[TimelineContent] handleDragStartSafe called:", { eventId, eventsDragOn });
     if (!eventsDragOn) {
-      console.log("[TimelineContent] Events drag is disabled, preventing drag start");
       e.preventDefault();
       return;
     }
-    console.log("[TimelineContent] Calling handleDragStart...");
     handleDragStart(e, eventId);
   };
   const handleDragEndSafe = (e) => {
@@ -499,7 +495,6 @@ const TimelineContent = ({
   const handleMouseDownExtend = (mouseEvent, event) => {
     if (!eventsExtendOn) return;
     mouseEvent.stopPropagation();
-    console.log(">>> Extend start ID:", event.id);
     setMode("extend");
     setExtendingEvent(event);
     setOriginalEndDate(event.endDate);
@@ -525,7 +520,6 @@ const TimelineContent = ({
   }, [mode, extendingEvent, eventsExtendOn, originalEndDate, startMouseX, setEvents]);
 
   const handleMouseUpExtend = useCallback(() => {
-    console.log(">>> Extend finished ID:", extendingEvent?.id);
     if (onExtendInfo && extendingEvent) {
       // callback
       const updatedEvent = events.find((ev) => ev.id === extendingEvent.id);
@@ -686,15 +680,6 @@ const TimelineContent = ({
             const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
             const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
             isPastDate = cellDateOnly < preventPastEventsDateOnly;
-            // Debug: İlk birkaç hücre için log
-            if (colIndex < 3 && groupIndex === 0) {
-              console.log('[TimelineContent] Past date check:', {
-                cellDate: cellDateOnly.toISOString().split('T')[0],
-                preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-                isPastDate,
-                preventPastEvents
-              });
-            }
           }
           
           // Disabled tarih kontrolü
@@ -821,7 +806,6 @@ const TimelineContent = ({
                           e.preventDefault();
                           return;
                         }
-                        console.log("[TimelineContent] Event drag start:", event.id);
                         handleDragStart(e, event.id);
                         e.stopPropagation();
                         
@@ -912,15 +896,6 @@ const TimelineContent = ({
                 const cellDateOnly = new Date(cellDate.getFullYear(), cellDate.getMonth(), cellDate.getDate());
                 const preventPastEventsDateOnly = new Date(preventPastEventsDateObj.getFullYear(), preventPastEventsDateObj.getMonth(), preventPastEventsDateObj.getDate());
                 isPastDate = cellDateOnly < preventPastEventsDateOnly;
-                // Debug: İlk birkaç hücre için log
-                if (colIndex < 3 && rowIndex === 0 && groupIndex === 0) {
-                  console.log('[TimelineContent] Cell past date check:', {
-                    cellDate: cellDateOnly.toISOString().split('T')[0],
-                    preventPastEventsDateValue: preventPastEventsDateOnly.toISOString().split('T')[0],
-                    isPastDate,
-                    preventPastEvents
-                  });
-                }
               }
               
               // Hafta sonu kontrolü
@@ -1008,7 +983,6 @@ const TimelineContent = ({
                   }
                   e.preventDefault();
                   e.stopPropagation();
-                  console.log("[TimelineContent] onDragOver called for resource:", resource.id);
                   handleDragOver(e);
                 }}
                 onDrop={(e) => {
@@ -1020,8 +994,7 @@ const TimelineContent = ({
                     return false;
                   }
                   e.preventDefault();
-                  e.stopPropagation();
-                  console.log("[TimelineContent] onDrop called for resource:", resource.id, "date:", dateObj.fullDate);
+                  e.stopPropagation();                  
                   handleDrop(e, resource.id, parseDate(dateObj.fullDate));
                 }}
               ></div>