@haoxin-web/excalidraw 1.0.22 → 1.0.24

package/dist/dev/{chunk-6O5AECJT.js → chunk-LXPD2I2F.js}

@@ -1,6 +1,6 @@
 import {
   define_import_meta_env_default
-} from "./chunk-3WZZNNEO.js";
+} from "./chunk-QJETCZL3.js";
 import {
   __publicField
 } from "./chunk-XDFCUUT6.js";
@@ -5296,7 +5296,7 @@ var parseFileContents = async (blob) => {
   let contents;
   if (blob.type === MIME_TYPES6.png) {
     try {
-      return await (await import("./data/image-WA2QOHGD.js")).decodePngMetadata(blob);
+      return await (await import("./data/image-UN6QNPQO.js")).decodePngMetadata(blob);
     } catch (error) {
       if (error.message === "INVALID") {
         throw new ImageSceneDataError(
@@ -5746,4 +5746,4 @@ export {
   createFile,
   normalizeFile
 };
-//# sourceMappingURL=chunk-6O5AECJT.js.map
+//# sourceMappingURL=chunk-LXPD2I2F.js.map

package/dist/dev/{chunk-3WZZNNEO.js → chunk-QJETCZL3.js}

@@ -1,7 +1,7 @@
 // <define:import.meta.env>
-var define_import_meta_env_default = { MODE: "development", VITE_APP_BACKEND_V2_GET_URL: "https://json-dev.excalidraw.com/api/v2/", VITE_APP_BACKEND_V2_POST_URL: "https://json-dev.excalidraw.com/api/v2/post/", VITE_APP_LIBRARY_URL: "https://libraries.excalidraw.com", VITE_APP_LIBRARY_BACKEND: "https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries", VITE_APP_WS_SERVER_URL: "http://localhost:3002", VITE_APP_PLUS_LP: "https://plus.excalidraw.com", VITE_APP_PLUS_APP: "http://localhost:3000", VITE_APP_AI_BACKEND: "http://localhost:3015", VITE_APP_FIREBASE_CONFIG: '{"apiKey":"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8","authDomain":"excalidraw-oss-dev.firebaseapp.com","projectId":"excalidraw-oss-dev","storageBucket":"excalidraw-oss-dev.appspot.com","messagingSenderId":"664559512677","appId":"1:664559512677:web:a385181f2928d328a7aa8c"}', VITE_APP_DEV_DISABLE_LIVE_RELOAD: "", VITE_APP_ENABLE_TRACKING: "true", FAST_REFRESH: "false", VITE_APP_PORT: "3000", VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX: "", VITE_APP_COLLAPSE_OVERLAY: "true", VITE_APP_ENABLE_ESLINT: "true", VITE_APP_ENABLE_PWA: "false", VITE_APP_PLUS_EXPORT_PUBLIC_KEY: "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAm2g5T+Rub6Kbf1Mf57t0\n7r2zeHuVg4dla3r5ryXMswtzz6x767octl6oLThn33mQsPSy3GKglFZoCTXJR4ij\nba8SxB04sL/N8eRrKja7TFWjCVtRwTTfyy771NYYNFVJclkxHyE5qw4m27crHF1y\nUNWEjuqNMi/lwAErS9fFa2oJlWyT8U7zzv/5kQREkxZI6y9v0AF3qcbsy2731FnD\ns9ChJvOUW9toIab2gsIdrKW8ZNpu084ZFVKb6LNjvIXI1Se4oMTHeszXzNptzlot\nkdxxjOoaQMAyfljFSot1F1FlU6MQlag7UnFGvFjRHN1JI5q4K+n3a67DX+TMyRqS\nHQIDAQAB", VITE_APP_DISABLE_PREVENT_UNLOAD: "", PKG_NAME: "@haoxin-web/excalidraw", PKG_VERSION: "1.0.22", DEV: true };
+var define_import_meta_env_default = { MODE: "development", VITE_APP_BACKEND_V2_GET_URL: "https://json-dev.excalidraw.com/api/v2/", VITE_APP_BACKEND_V2_POST_URL: "https://json-dev.excalidraw.com/api/v2/post/", VITE_APP_LIBRARY_URL: "https://libraries.excalidraw.com", VITE_APP_LIBRARY_BACKEND: "https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries", VITE_APP_WS_SERVER_URL: "http://localhost:3002", VITE_APP_PLUS_LP: "https://plus.excalidraw.com", VITE_APP_PLUS_APP: "http://localhost:3000", VITE_APP_AI_BACKEND: "http://localhost:3015", VITE_APP_FIREBASE_CONFIG: '{"apiKey":"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8","authDomain":"excalidraw-oss-dev.firebaseapp.com","projectId":"excalidraw-oss-dev","storageBucket":"excalidraw-oss-dev.appspot.com","messagingSenderId":"664559512677","appId":"1:664559512677:web:a385181f2928d328a7aa8c"}', VITE_APP_DEV_DISABLE_LIVE_RELOAD: "", VITE_APP_ENABLE_TRACKING: "true", FAST_REFRESH: "false", VITE_APP_PORT: "3000", VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX: "", VITE_APP_COLLAPSE_OVERLAY: "true", VITE_APP_ENABLE_ESLINT: "true", VITE_APP_ENABLE_PWA: "false", VITE_APP_PLUS_EXPORT_PUBLIC_KEY: "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAm2g5T+Rub6Kbf1Mf57t0\n7r2zeHuVg4dla3r5ryXMswtzz6x767octl6oLThn33mQsPSy3GKglFZoCTXJR4ij\nba8SxB04sL/N8eRrKja7TFWjCVtRwTTfyy771NYYNFVJclkxHyE5qw4m27crHF1y\nUNWEjuqNMi/lwAErS9fFa2oJlWyT8U7zzv/5kQREkxZI6y9v0AF3qcbsy2731FnD\ns9ChJvOUW9toIab2gsIdrKW8ZNpu084ZFVKb6LNjvIXI1Se4oMTHeszXzNptzlot\nkdxxjOoaQMAyfljFSot1F1FlU6MQlag7UnFGvFjRHN1JI5q4K+n3a67DX+TMyRqS\nHQIDAQAB", VITE_APP_DISABLE_PREVENT_UNLOAD: "", PKG_NAME: "@haoxin-web/excalidraw", PKG_VERSION: "1.0.24", DEV: true };
 
 export {
   define_import_meta_env_default
 };
-//# sourceMappingURL=chunk-3WZZNNEO.js.map
+//# sourceMappingURL=chunk-QJETCZL3.js.map

package/dist/dev/data/{image-WA2QOHGD.js → image-UN6QNPQO.js}

@@ -2,12 +2,12 @@ import {
   decodePngMetadata,
   encodePngMetadata,
   getTEXtChunk
-} from "../chunk-6O5AECJT.js";
-import "../chunk-3WZZNNEO.js";
+} from "../chunk-LXPD2I2F.js";
+import "../chunk-QJETCZL3.js";
 import "../chunk-XDFCUUT6.js";
 export {
   decodePngMetadata,
   encodePngMetadata,
   getTEXtChunk
 };
-//# sourceMappingURL=image-WA2QOHGD.js.map
+//# sourceMappingURL=image-UN6QNPQO.js.map

package/dist/dev/index.js

@@ -69,10 +69,10 @@ import {
   serializeLibraryAsJSON,
   strokeEllipseWithRotation,
   strokeRectWithRotation
-} from "./chunk-6O5AECJT.js";
+} from "./chunk-LXPD2I2F.js";
 import {
   define_import_meta_env_default
-} from "./chunk-3WZZNNEO.js";
+} from "./chunk-QJETCZL3.js";
 import {
   en_default
 } from "./chunk-ZSSURRA2.js";
@@ -9223,7 +9223,7 @@ var exportCanvas = async (type, elements, appState, files, {
     let blob = canvasToBlob(tempCanvas);
     if (appState.exportEmbedScene) {
       blob = blob.then(
-        (blob2) => import("./data/image-WA2QOHGD.js").then(
+        (blob2) => import("./data/image-UN6QNPQO.js").then(
           ({ encodePngMetadata: encodePngMetadata2 }) => encodePngMetadata2({
             blob: blob2,
             metadata: serializeAsJSON(elements, appState, files, "local")
@@ -23959,13 +23959,44 @@ import {
 import { mutateElement as mutateElement5 } from "@haoxin-web/excalidraw-element";
 import { ShapeCache as ShapeCache3 } from "@haoxin-web/excalidraw-element";
 
+// components/HandButton.tsx
+import clsx34 from "clsx";
+import { KEYS as KEYS45 } from "@haoxin-web/excalidraw-common";
+import { jsx as jsx83 } from "react/jsx-runtime";
+var HandButton = (props) => {
+  if (props.visible === false) {
+    return null;
+  }
+  const showKeyShortcut = props.showKeyShortcut !== false;
+  const handTitle = props.title ?? t("toolBar.hand");
+  const title = showKeyShortcut ? `${handTitle} \u2014 H` : handTitle;
+  return /* @__PURE__ */ jsx83(
+    ToolButton,
+    {
+      className: clsx34("Shape", { fillable: false }),
+      type: "radio",
+      icon: handIcon,
+      name: "editor-current-shape",
+      checked: props.checked,
+      title,
+      keyBindingLabel: showKeyShortcut && !props.isMobile ? KEYS45.H.toLocaleUpperCase() : void 0,
+      "aria-label": title,
+      "aria-keyshortcuts": showKeyShortcut ? KEYS45.H : void 0,
+      "data-testid": `toolbar-hand`,
+      onChange: () => props.onChange?.()
+    }
+  );
+};
+
 // components/LeftMainToolbar.tsx
 import { TOOL_TYPE as TOOL_TYPE2 } from "@haoxin-web/excalidraw-common";
-import { jsx as jsx83, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx84, jsxs as jsxs45 } from "react/jsx-runtime";
 var LeftMainToolbar = ({
   appState,
   app,
-  visible = true
+  visible = true,
+  onHandToolToggle,
+  showPanActions
 }) => {
   if (!visible) {
     return null;
@@ -24033,8 +24064,8 @@ var LeftMainToolbar = ({
     } catch {
     }
   };
-  return /* @__PURE__ */ jsx83(Island, { className: "App-toolbar App-toolbar--vertical", children: /* @__PURE__ */ jsxs45(Stack_default.Col, { align: "center", gap: 1, style: { padding: "4px 0" }, children: [
-    /* @__PURE__ */ jsx83(
+  return /* @__PURE__ */ jsx84(Island, { className: "App-toolbar App-toolbar--vertical", children: /* @__PURE__ */ jsxs45(Stack_default.Col, { align: "center", gap: 1, style: { padding: "4px 0" }, children: [
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "selection",
@@ -24046,7 +24077,18 @@ var LeftMainToolbar = ({
         onChange: () => app.setActiveTool({ type: TOOL_TYPE2.selection })
       }
     ),
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
+      HandButton,
+      {
+        checked: isHandToolActive(appState),
+        onChange: () => onHandToolToggle?.(),
+        title: t("toolBar.hand"),
+        isMobile: true,
+        showKeyShortcut: false,
+        visible: showPanActions !== false
+      }
+    ),
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "freedraw",
@@ -24059,7 +24101,7 @@ var LeftMainToolbar = ({
         onChange: () => app.setActiveTool({ type: TOOL_TYPE2.freedraw })
       }
     ),
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "line",
@@ -24072,7 +24114,7 @@ var LeftMainToolbar = ({
         onChange: () => app.setActiveTool({ type: TOOL_TYPE2.line })
       }
     ),
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "shapes",
@@ -24085,7 +24127,7 @@ var LeftMainToolbar = ({
         onChange: () => app.setActiveTool({ type: TOOL_TYPE2.rectangle })
       }
     ),
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "text",
@@ -24098,7 +24140,7 @@ var LeftMainToolbar = ({
         onChange: () => app.setActiveTool({ type: TOOL_TYPE2.text })
       }
     ),
-    /* @__PURE__ */ jsx83(
+    /* @__PURE__ */ jsx84(
       ToolButton,
       {
         "aria-label": "eraser",
@@ -24115,10 +24157,10 @@ var LeftMainToolbar = ({
 var LeftMainToolbar_default = LeftMainToolbar;
 
 // components/LoadingMessage.tsx
-import clsx34 from "clsx";
+import clsx35 from "clsx";
 import { useState as useState24, useEffect as useEffect30 } from "react";
 import { THEME as THEME13 } from "@haoxin-web/excalidraw-common";
-import { jsx as jsx84, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx85, jsxs as jsxs46 } from "react/jsx-runtime";
 var LoadingMessage = ({
   delay,
   theme
@@ -24139,12 +24181,12 @@ var LoadingMessage = ({
   return /* @__PURE__ */ jsxs46(
     "div",
     {
-      className: clsx34("LoadingMessage", {
+      className: clsx35("LoadingMessage", {
         "LoadingMessage--dark": theme === THEME13.DARK
       }),
       children: [
-        /* @__PURE__ */ jsx84("div", { children: /* @__PURE__ */ jsx84(Spinner_default, {}) }),
-        /* @__PURE__ */ jsx84("div", { className: "LoadingMessage-text", children: t("labels.loadingScene") })
+        /* @__PURE__ */ jsx85("div", { children: /* @__PURE__ */ jsx85(Spinner_default, {}) }),
+        /* @__PURE__ */ jsx85("div", { className: "LoadingMessage-text", children: t("labels.loadingScene") })
       ]
     }
   );
@@ -24155,16 +24197,16 @@ import { useEffect as useEffect31 } from "react";
 import { showSelectedShapeActions as showSelectedShapeActions2 } from "@haoxin-web/excalidraw-element";
 
 // components/FixedSideContainer.tsx
-import clsx35 from "clsx";
-import { jsx as jsx85 } from "react/jsx-runtime";
+import clsx36 from "clsx";
+import { jsx as jsx86 } from "react/jsx-runtime";
 var FixedSideContainer = ({
   children,
   side,
   className
-}) => /* @__PURE__ */ jsx85(
+}) => /* @__PURE__ */ jsx86(
   "div",
   {
-    className: clsx35(
+    className: clsx36(
       "FixedSideContainer",
       `FixedSideContainer_side_${side}`,
       className
@@ -24173,32 +24215,6 @@ var FixedSideContainer = ({
   }
 );
 
-// components/HandButton.tsx
-import clsx36 from "clsx";
-import { KEYS as KEYS45 } from "@haoxin-web/excalidraw-common";
-import { jsx as jsx86 } from "react/jsx-runtime";
-var HandButton = (props) => {
-  if (props.visible === false) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx86(
-    ToolButton,
-    {
-      className: clsx36("Shape", { fillable: false }),
-      type: "radio",
-      icon: handIcon,
-      name: "editor-current-shape",
-      checked: props.checked,
-      title: `${props.title} \u2014 H`,
-      keyBindingLabel: !props.isMobile ? KEYS45.H.toLocaleUpperCase() : void 0,
-      "aria-label": `${props.title} \u2014 H`,
-      "aria-keyshortcuts": KEYS45.H,
-      "data-testid": `toolbar-hand`,
-      onChange: () => props.onChange?.()
-    }
-  );
-};
-
 // components/HintViewer.tsx
 import { CANVAS_SEARCH_TAB as CANVAS_SEARCH_TAB2, DEFAULT_SIDEBAR as DEFAULT_SIDEBAR4 } from "@haoxin-web/excalidraw-common";
 import {
@@ -26110,7 +26126,7 @@ var LeftToolFlyouts = ({
     app.setState({ currentItemOpacity: enable ? 50 : 100 });
   };
   return /* @__PURE__ */ jsxs60("div", { className: "LeftToolFlyouts", children: [
-    openForLineGroup && /* @__PURE__ */ jsx108(Island, { className: "left-flyout left-flyout--line", children: /* @__PURE__ */ jsxs60(Stack_default.Col, { gap: 2, align: "center", children: [
+    openForLineGroup && /* @__PURE__ */ jsx108(Island, { className: "left-flyout left-flyout--line", children: /* @__PURE__ */ jsxs60(Stack_default.Col, { gap: 2, align: "start", children: [
       /* @__PURE__ */ jsxs60("div", { className: "arrow-row", children: [
         /* @__PURE__ */ jsx108(
           ToolButton,
@@ -26155,7 +26171,7 @@ var LeftToolFlyouts = ({
         "div",
         {
           className: "buttonList",
-          style: { display: "flex", gap: 6, justifyContent: "center" },
+          style: { display: "flex", gap: 6, justifyContent: "flex-start" },
           children: [
             /* @__PURE__ */ jsx108(
               ToolButton,
@@ -26397,7 +26413,7 @@ var LeftToolFlyouts = ({
         "div",
         {
           className: "buttonList",
-          style: { display: "flex", gap: 6, justifyContent: "center" },
+          style: { display: "flex", gap: 6, justifyContent: "flex-start" },
           children: [
             /* @__PURE__ */ jsx108(
               ToolButton,
@@ -26455,7 +26471,7 @@ var LeftToolFlyouts = ({
         "div",
         {
           className: "buttonList",
-          style: { display: "flex", gap: 6, justifyContent: "center" },
+          style: { display: "flex", gap: 6, justifyContent: "flex-start" },
           children: [
             /* @__PURE__ */ jsx108(
               ToolButton,
@@ -26509,7 +26525,7 @@ var LeftToolFlyouts = ({
         }
       )
     ] }),
-    openForText && /* @__PURE__ */ jsx108(Island, { className: "left-flyout left-flyout--text", children: /* @__PURE__ */ jsxs60(Stack_default.Col, { gap: 2, align: "center", children: [
+    openForText && /* @__PURE__ */ jsx108(Island, { className: "left-flyout left-flyout--text", children: /* @__PURE__ */ jsxs60(Stack_default.Col, { gap: 2, align: "start", children: [
       /* @__PURE__ */ jsx108("div", { className: "left-flyout__title", children: "\u6837\u5F0F" }),
       /* @__PURE__ */ jsxs60("div", { className: "text-style-row", style: { display: "flex", gap: 8 }, children: [
         /* @__PURE__ */ jsx108(
@@ -26598,7 +26614,7 @@ var LeftToolFlyouts = ({
             display: "flex",
             gap: 6,
             alignItems: "center",
-            justifyContent: "center"
+            justifyContent: "flex-start"
           },
           children: [10, 12, 16, 24, 36].map((size) => {
             const selected2 = appState.currentItemFontSize === size;
@@ -26643,7 +26659,7 @@ var LeftToolFlyouts = ({
         "div",
         {
           className: "text-align-row",
-          style: { display: "flex", gap: 6, justifyContent: "center" },
+          style: { display: "flex", gap: 6, justifyContent: "flex-start" },
           children: [
             /* @__PURE__ */ jsx108(
               ToolButton,
@@ -32187,7 +32203,8 @@ var LayerUI = ({
   generateLinkForSelection,
   showZoomActions,
   showPanActions,
-  showToolBar = true
+  showToolBar = true,
+  showTopLeftToolbar = true
 }) => {
   const device = useDevice();
   const tunnels = useInitializeTunnels();
@@ -32243,7 +32260,9 @@ var LayerUI = ({
           {
             appState,
             app,
-            visible: showToolBar
+            visible: showToolBar,
+            onHandToolToggle,
+            showPanActions
           }
         ),
         isCollaborating && /* @__PURE__ */ jsx145(
@@ -32502,7 +32521,7 @@ var LayerUI = ({
         showToolBar
       }
     ),
-    !device.editor.isMobile && !appState.viewModeEnabled && showToolBar && /* @__PURE__ */ jsx145(
+    !device.editor.isMobile && !appState.viewModeEnabled && showTopLeftToolbar && /* @__PURE__ */ jsx145(
       TopLeftToolbar,
       {
         appState,
@@ -38491,6 +38510,7 @@ var App = class _App extends React46.Component {
                             showZoomActions: this.props.showZoomActions,
                             showPanActions: this.props.showPanActions,
                             showToolBar: this.props.showToolBar,
+                            showTopLeftToolbar: this.props.showTopLeftToolbar,
                             children: this.props.children
                           }
                         ),
@@ -41992,7 +42012,8 @@ var ExcalidrawBase = (props) => {
     renderScrollbars,
     showZoomActions,
     showPanActions,
-    showToolBar
+    showToolBar,
+    showTopLeftToolbar
   } = props;
   const canvasActions = props.UIOptions?.canvasActions;
   const UIOptions = {
@@ -42067,6 +42088,7 @@ var ExcalidrawBase = (props) => {
       showZoomActions,
       showPanActions,
       showToolBar,
+      showTopLeftToolbar,
       children
     }
   ) }) });