@thanh01.pmt/presentation-kit 0.2.9 → 0.2.10

package/dist/react/index.js

@@ -1,6 +1,6 @@
 import { renderSlide, renderMermaidDiagrams } from '../chunk-NYLDRVHZ.js';
 export { defineTheme, extractMaxClicks, generateClickCss, postprocessClicks, preprocessClicks, renderSlide, renderSlideAsync, resolveTheme } from '../chunk-NYLDRVHZ.js';
-import { SLIDE_LAYOUT_PRESETS, updateSlideLayoutInMarkdown } from '../chunk-ZPASRL75.js';
+import { SLIDE_LAYOUT_PRESETS, updateSlideLayoutInMarkdown } from '../chunk-V6X7D44H.js';
 import { useState, useRef, useMemo, useEffect, useCallback } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -610,10 +610,12 @@ function SlideDesignOverlay({
     setBoxes(layout?.boxes ?? []);
   }, [layout, slideIndex]);
   const selectedBox = boxes.find((b) => b.id === selectedId) ?? null;
+  const hasMovedRef = useRef(false);
   const [dragging, setDragging] = useState(null);
   const handleMouseDown = (e, box, type) => {
     e.preventDefault();
     e.stopPropagation();
+    hasMovedRef.current = false;
     setSelectedId(box.id);
     setDragging({
       type,
@@ -630,6 +632,9 @@ function SlideDesignOverlay({
     const scaleY = 720 / rect.height;
     const dx = (e.clientX - dragging.startX) * scaleX;
     const dy = (e.clientY - dragging.startY) * scaleY;
+    if (Math.abs(dx) > 1 || Math.abs(dy) > 1) {
+      hasMovedRef.current = true;
+    }
     const [origX, origY, origW, origH] = dragging.startPos;
     setBoxes((prev) => {
       const updated = prev.map((b) => {
@@ -682,9 +687,10 @@ function SlideDesignOverlay({
     });
   }, [dragging, onLayoutChange]);
   const handleMouseUp = useCallback(() => {
-    if (dragging && onSave) {
+    if (dragging && hasMovedRef.current && onSave) {
       onSave({ boxes });
     }
+    hasMovedRef.current = false;
     setDragging(null);
   }, [dragging, boxes, onSave]);
   useEffect(() => {
@@ -913,8 +919,9 @@ function SlideDesignOverlay({
                         style: {
                           width: "100%",
                           height: "100%",
-                          background: "transparent",
-                          border: "none",
+                          backgroundColor: isLight ? "#ffffff" : isNavy ? "#0b132b" : "#181920",
+                          border: isLight ? "1px solid #0284c7" : "1px solid #38bdf8",
+                          borderRadius: "4px",
                           outline: "none",
                           resize: "none",
                           fontSize: box.fontSize ?? (box.target === "h1" ? "2.2rem" : "1.1rem"),
@@ -923,8 +930,9 @@ function SlideDesignOverlay({
                           fontFamily: "Inter, sans-serif",
                           fontWeight: box.target === "h1" ? 700 : 400,
                           lineHeight: 1.25,
-                          padding: 0,
-                          margin: 0
+                          padding: "4px 6px",
+                          margin: 0,
+                          boxShadow: "0 4px 16px rgba(0,0,0,0.25)"
                         }
                       }
                     ) : /* @__PURE__ */ jsx(
@@ -938,20 +946,9 @@ function SlideDesignOverlay({
                         style: {
                           width: "100%",
                           height: "100%",
-                          fontSize: box.fontSize ?? (box.target === "h1" ? "2.2rem" : "1.1rem"),
-                          color: box.color ?? (isLight ? "#0f172a" : "#f8fafc"),
-                          textAlign: box.textAlign ?? "left",
-                          fontFamily: "Inter, sans-serif",
-                          fontWeight: box.target === "h1" ? 700 : 400,
-                          lineHeight: 1.25,
-                          wordBreak: "break-word",
-                          userSelect: "none",
-                          cursor: "pointer",
-                          display: "flex",
-                          alignItems: "center"
+                          cursor: "pointer"
                         },
-                        title: "Click \u0111\xFAp \u0111\u1EC3 s\u1EEDa ch\u1EEF",
-                        children: box.content ? /* @__PURE__ */ jsx("span", { children: box.content }) : /* @__PURE__ */ jsx("span", { style: { opacity: 0.45, fontStyle: "italic", fontSize: "12px" }, children: box.target === "h1" ? "Ti\xEAu \u0111\u1EC1 (Click \u0111\xFAp \u0111\u1EC3 s\u1EEDa)..." : "N\u1ED9i dung (Click \u0111\xFAp \u0111\u1EC3 s\u1EEDa)..." })
+                        title: "Click \u0111\xFAp \u0111\u1EC3 s\u1EEDa ch\u1EEF"
                       }
                     )
                   }