@mhamz.01/easyflow-whiteboard 2.94.0 → 2.95.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/toolbar/layers-control.d.ts +0 -6
- package/dist/components/toolbar/layers-control.d.ts.map +1 -1
- package/dist/components/toolbar/layers-control.js +67 -29
- package/dist/store/whiteboard-store.d.ts +1 -5
- package/dist/store/whiteboard-store.d.ts.map +1 -1
- package/dist/store/whiteboard-store.js +0 -29
- package/package.json +1 -1
|
@@ -1,7 +1 @@
|
|
|
1
|
-
import { Canvas } from "fabric";
|
|
2
|
-
interface LayerControlsProps {
|
|
3
|
-
fabricCanvas: React.RefObject<Canvas | null>;
|
|
4
|
-
}
|
|
5
|
-
export default function LayerControls({ fabricCanvas }: LayerControlsProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
-
export {};
|
|
7
1
|
//# sourceMappingURL=layers-control.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layers-control.d.ts","sourceRoot":"","sources":["../../../src/components/toolbar/layers-control.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"layers-control.d.ts","sourceRoot":"","sources":["../../../src/components/toolbar/layers-control.tsx"],"names":[],"mappings":""}
|
|
@@ -1,29 +1,67 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import { ArrowUp, ArrowDown, MoveUp, MoveDown } from "lucide-react";
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
// // components/toolbar/layer-controls.tsx
|
|
3
|
+
// "use client";
|
|
4
|
+
// import { ArrowUp, ArrowDown, MoveUp, MoveDown } from "lucide-react";
|
|
5
|
+
// import { Canvas } from "fabric";
|
|
6
|
+
// import { useWhiteboardStore } from "../../store/whiteboard-store";
|
|
7
|
+
// interface LayerControlsProps {
|
|
8
|
+
// fabricCanvas: React.RefObject<Canvas | null>;
|
|
9
|
+
// }
|
|
10
|
+
// export default function LayerControls({ fabricCanvas }: LayerControlsProps) {
|
|
11
|
+
// // const { bringToFront, sendToBack, bringForward, sendBackward } = useWhiteboardStore();
|
|
12
|
+
// const handleBringToFront = () => {
|
|
13
|
+
// const canvas = fabricCanvas.current;
|
|
14
|
+
// if (canvas) bringToFront(canvas);
|
|
15
|
+
// };
|
|
16
|
+
// const handleSendToBack = () => {
|
|
17
|
+
// const canvas = fabricCanvas.current;
|
|
18
|
+
// if (canvas) sendToBack(canvas);
|
|
19
|
+
// };
|
|
20
|
+
// const handleBringForward = () => {
|
|
21
|
+
// const canvas = fabricCanvas.current;
|
|
22
|
+
// if (canvas) bringForward(canvas);
|
|
23
|
+
// };
|
|
24
|
+
// const handleSendBackward = () => {
|
|
25
|
+
// const canvas = fabricCanvas.current;
|
|
26
|
+
// if (canvas) sendBackward(canvas);
|
|
27
|
+
// };
|
|
28
|
+
// return (
|
|
29
|
+
// <div className="flex flex-col gap-1 p-2 bg-black/90 rounded-lg border border-white/10">
|
|
30
|
+
// <p className="text-xs text-white/60 mb-1">Layer Order</p>
|
|
31
|
+
// <div className="flex gap-1">
|
|
32
|
+
// {/* Bring to Front */}
|
|
33
|
+
// <button
|
|
34
|
+
// onClick={handleBringToFront}
|
|
35
|
+
// className="p-2 hover:bg-white/10 rounded transition-colors"
|
|
36
|
+
// title="Bring to Front"
|
|
37
|
+
// >
|
|
38
|
+
// <MoveUp size={16} className="text-white" />
|
|
39
|
+
// </button>
|
|
40
|
+
// {/* Bring Forward */}
|
|
41
|
+
// <button
|
|
42
|
+
// onClick={handleBringForward}
|
|
43
|
+
// className="p-2 hover:bg-white/10 rounded transition-colors"
|
|
44
|
+
// title="Bring Forward"
|
|
45
|
+
// >
|
|
46
|
+
// <ArrowUp size={16} className="text-white" />
|
|
47
|
+
// </button>
|
|
48
|
+
// {/* Send Backward */}
|
|
49
|
+
// <button
|
|
50
|
+
// onClick={handleSendBackward}
|
|
51
|
+
// className="p-2 hover:bg-white/10 rounded transition-colors"
|
|
52
|
+
// title="Send Backward"
|
|
53
|
+
// >
|
|
54
|
+
// <ArrowDown size={16} className="text-white" />
|
|
55
|
+
// </button>
|
|
56
|
+
// {/* Send to Back */}
|
|
57
|
+
// <button
|
|
58
|
+
// onClick={handleSendToBack}
|
|
59
|
+
// className="p-2 hover:bg-white/10 rounded transition-colors"
|
|
60
|
+
// title="Send to Back"
|
|
61
|
+
// >
|
|
62
|
+
// <MoveDown size={16} className="text-white" />
|
|
63
|
+
// </button>
|
|
64
|
+
// </div>
|
|
65
|
+
// </div>
|
|
66
|
+
// );
|
|
67
|
+
// }
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { FabricObject } from "fabric";
|
|
2
2
|
export type Tool = "select" | "pan" | "pen" | "rectangle" | "circle" | "line" | "arrow" | "frame" | "text" | "image" | "eraser" | "connector" | "undo" | "redo";
|
|
3
3
|
export type ActiveDropdown = "task" | "document" | null;
|
|
4
4
|
export interface ToolOptions {
|
|
@@ -53,10 +53,6 @@ export interface ToolOptions {
|
|
|
53
53
|
}
|
|
54
54
|
interface WhiteboardState {
|
|
55
55
|
activeTool: Tool;
|
|
56
|
-
bringToFront: (canvas: Canvas) => void;
|
|
57
|
-
sendToBack: (canvas: Canvas) => void;
|
|
58
|
-
bringForward: (canvas: Canvas) => void;
|
|
59
|
-
sendBackward: (canvas: Canvas) => void;
|
|
60
56
|
setActiveTool: (tool: Tool) => void;
|
|
61
57
|
activeDropdown: ActiveDropdown;
|
|
62
58
|
setActiveDropdown: (id: ActiveDropdown) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"whiteboard-store.d.ts","sourceRoot":"","sources":["../../src/store/whiteboard-store.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"whiteboard-store.d.ts","sourceRoot":"","sources":["../../src/store/whiteboard-store.ts"],"names":[],"mappings":"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"}
|
|
@@ -81,33 +81,4 @@ export const useWhiteboardStore = create()((set, get) => ({
|
|
|
81
81
|
// ── Zoom ──────────────────────────────────────────────────────────────────
|
|
82
82
|
zoom: 1,
|
|
83
83
|
setZoom: (zoom) => set({ zoom }),
|
|
84
|
-
// ── Layer ordering ─────────────────────────────────────────────────────
|
|
85
|
-
bringToFront: (canvas) => {
|
|
86
|
-
const active = canvas.getActiveObject();
|
|
87
|
-
if (active) {
|
|
88
|
-
canvas.bringObjectToFront(active);
|
|
89
|
-
canvas.requestRenderAll();
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
sendToBack: (canvas) => {
|
|
93
|
-
const active = canvas.getActiveObject();
|
|
94
|
-
if (active) {
|
|
95
|
-
canvas.sendObjectToBack(active);
|
|
96
|
-
canvas.requestRenderAll();
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
|
-
bringForward: (canvas) => {
|
|
100
|
-
const active = canvas.getActiveObject();
|
|
101
|
-
if (active) {
|
|
102
|
-
canvas.bringObjectForward(active);
|
|
103
|
-
canvas.requestRenderAll();
|
|
104
|
-
}
|
|
105
|
-
},
|
|
106
|
-
sendBackward: (canvas) => {
|
|
107
|
-
const active = canvas.getActiveObject();
|
|
108
|
-
if (active) {
|
|
109
|
-
canvas.sendObjectBackwards(active);
|
|
110
|
-
canvas.requestRenderAll();
|
|
111
|
-
}
|
|
112
|
-
},
|
|
113
84
|
}));
|