purify getDefaultAppState by removing name

Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
Co-authored-by: dwelle <luzar.david@gmail.com>

.env

@@ -1,5 +1,5 @@
 REACT_APP_BACKEND_V1_GET_URL=https://json.excalidraw.com/api/v1/
 REACT_APP_BACKEND_V2_GET_URL=https://json.excalidraw.com/api/v2/
 REACT_APP_BACKEND_V2_POST_URL=https://json.excalidraw.com/api/v2/post/
-REACT_APP_SOCKET_SERVER_URL=https://excalidraw-socket.herokuapp.com
+REACT_APP_SOCKET_SERVER_URL=https://portal.excalidraw.com
 REACT_APP_FIREBASE_CONFIG='{"apiKey":"AIzaSyAd15pYlMci_xIp9ko6wkEsDzAAA0Dn0RU","authDomain":"excalidraw-room-persistence.firebaseapp.com","databaseURL":"https://excalidraw-room-persistence.firebaseio.com","projectId":"excalidraw-room-persistence","storageBucket":"excalidraw-room-persistence.appspot.com","messagingSenderId":"654800341332","appId":"1:654800341332:web:4a692de832b55bd57ce0c1"}'

.github/dependabot.yml

@@ -0,0 +1,37 @@
+version: 2
+updates:
+  - package-ecosystem: npm
+    directory: "/"
+    schedule:
+      interval: weekly
+      day: sunday
+      time: "01:00"
+    open-pull-requests-limit: 99
+    reviewers:
+      - lipis
+    assignees:
+      - lipis
+
+  - package-ecosystem: npm
+    directory: "/src/packages/excalidraw/"
+    schedule:
+      interval: weekly
+      day: sunday
+      time: "01:00"
+    open-pull-requests-limit: 99
+    reviewers:
+      - ad1992
+    assignees:
+      - ad1992
+
+  - package-ecosystem: npm
+    directory: "/src/packages/utils/"
+    schedule:
+      interval: weekly
+      day: sunday
+      time: "01:00"
+    open-pull-requests-limit: 99
+    reviewers:
+      - ad1992
+    assignees:
+      - ad1992

.github/workflows/build-docker.yml

@@ -4,7 +4,6 @@ on:
   push:
     branches:
       - master
-  pull_request:
 
 jobs:
   build-docker:

.github/workflows/codeql-analysis.yml

@@ -1,33 +0,0 @@
-name: "CodeQL"
-
-on:
-  push:
-    branches: [master]
-  pull_request:
-    branches: [master]
-  schedule:
-    - cron: "18 7 * * 0"
-
-jobs:
-  analyze:
-    name: Analyze
-    runs-on: ubuntu-latest
-
-    strategy:
-      fail-fast: false
-      matrix:
-        language: ["typescript"]
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Initialize CodeQL
-        uses: github/codeql-action/init@v1
-        with:
-          languages: ${{ matrix.language }}
-      - name: Autobuild
-        uses: github/codeql-action/autobuild@v1
-
-      - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v1

.github/workflows/locales-coverage.yml

@@ -30,3 +30,18 @@ jobs:
             git commit -am "Auto commit: Calculate translation coverage"
             git push
           fi
+      - name: Construct comment body
+        id: getCommentBody
+        run: |
+          body=$(npm run locales-coverage:description | grep '^[^>]')
+          body="${body//'%'/'%25'}"
+          body="${body//$'\n'/'%0A'}"
+          body="${body//$'\r'/'%0D'}"
+          echo ::set-output name=body::$body
+
+      - name: Update description with coverage
+        uses: kt3k/update-pr-description@v1.0.1
+        with:
+          pr_body: ${{ steps.getCommentBody.outputs.body }}
+          pr_title: "chore: New Crowdin updates"
+          github_token: ${{ secrets.PUSH_TRANSLATIONS_COVERAGE_PAT }}

.github/workflows/semantic-pr-title.yml

@@ -0,0 +1,16 @@
+name: "Semantic PR title"
+
+on:
+  pull_request_target:
+    types:
+      - opened
+      - edited
+      - synchronize
+
+jobs:
+  main:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: amannn/action-semantic-pull-request@v2.1.0
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

package.json

@@ -19,18 +19,18 @@
     ]
   },
   "dependencies": {
-    "@sentry/browser": "5.28.0",
+    "@sentry/browser": "5.29.2",
-    "@sentry/integrations": "5.28.0",
+    "@sentry/integrations": "5.29.2",
-    "@testing-library/jest-dom": "5.11.6",
+    "@testing-library/jest-dom": "5.11.8",
     "@testing-library/react": "11.2.2",
-    "@types/jest": "26.0.16",
+    "@types/jest": "26.0.19",
     "@types/nanoid": "2.1.0",
     "@types/react": "17.0.0",
     "@types/react-dom": "17.0.0",
     "@types/socket.io-client": "1.4.34",
-    "browser-nativefs": "0.11.1",
+    "browser-nativefs": "0.12.0",
     "clsx": "1.1.1",
-    "firebase": "8.1.2",
+    "firebase": "8.2.1",
     "i18next-browser-languagedetector": "6.0.1",
     "lodash.throttle": "4.1.1",
     "nanoid": "2.1.11",
@@ -47,19 +47,18 @@
     "react-scripts": "4.0.1",
     "roughjs": "4.3.1",
     "socket.io-client": "2.3.1",
-    "typescript": "4.0.5"
+    "typescript": "4.1.3"
   },
   "devDependencies": {
     "@types/lodash.throttle": "4.1.6",
     "@types/pako": "1.0.1",
-    "asar": "3.0.3",
+    "eslint-config-prettier": "7.1.0",
-    "eslint-config-prettier": "7.0.0",
+    "eslint-plugin-prettier": "3.3.0",
-    "eslint-plugin-prettier": "3.1.4",
+    "firebase-tools": "9.1.0",
-    "firebase-tools": "8.17.0",
+    "husky": "4.3.6",
-    "husky": "4.3.0",
     "jest-canvas-mock": "2.3.0",
     "lint-staged": "10.5.3",
-    "pepjs": "0.5.2",
+    "pepjs": "0.5.3",
     "prettier": "2.2.1",
     "rewire": "5.0.0"
   },
@@ -84,13 +83,14 @@
     "build-node": "node ./scripts/build-node.js",
     "build:app:docker": "REACT_APP_INCLUDE_GTAG=false REACT_APP_DISABLE_SENTRY=true react-scripts build",
     "build:app": "REACT_APP_INCLUDE_GTAG=true REACT_APP_GIT_SHA=$NOW_GITHUB_COMMIT_SHA react-scripts build",
-    "build:zip": "node ./scripts/build-version.js",
+    "build:version": "node ./scripts/build-version.js",
-    "build": "npm run build:app && npm run build:zip",
+    "build": "npm run build:app && npm run build:version",
     "eject": "react-scripts eject",
     "fix:code": "npm run test:code -- --fix",
     "fix:other": "npm run prettier -- --write",
     "fix": "npm run fix:other && npm run fix:code",
     "locales-coverage": "node scripts/build-locales-coverage.js",
+    "locales-coverage:description": "node scripts/locales-coverage-description.js",
     "prettier": "prettier \"**/*.{css,scss,json,md,html,yml}\" --ignore-path=.eslintignore",
     "start": "react-scripts start",
     "test:all": "npm run test:typecheck && npm run test:code && npm run test:other && npm run test:app -- --watchAll=false",

public/index.html

@@ -55,6 +55,8 @@
     <meta name="twitter:image" content="https://excalidraw.com/og-image.png" />
     <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
 
+    <!-- Excalidraw version -->
+    <meta name="version" content="{version}" />
     <link
       rel="preload"
       href="FG_Virgil.woff2"

public/manifest.json

@@ -25,5 +25,6 @@
         "application/vnd.excalidraw+json": [".excalidraw"]
       }
     }
-  ]
+  ],
+  "capture_links": "new_client"
 }

scripts/build-version.js

@@ -2,7 +2,8 @@
 
 const fs = require("fs");
 const path = require("path");
-const asar = require("asar");
+const versionFile = path.join("build", "version.json");
+const indexFile = path.join("build", "index.html");
 
 const zero = (digit) => `0${digit}`.slice(-2);
 
@@ -20,18 +21,24 @@ const now = new Date();
 
 const data = JSON.stringify(
   {
-    asar: "excalidraw.asar",
     version: versionDate(now),
   },
   undefined,
   2,
 );
 
-fs.writeFileSync(path.join("build", "version.json"), data);
+fs.writeFileSync(versionFile, data);
 
-(async () => {
+// https://stackoverflow.com/a/14181136/8418
-  const src = "build/";
+fs.readFile(indexFile, "utf8", (error, data) => {
-  const dest = path.join("build", `excalidraw.asar`);
+  if (error) {
+    return console.error(error);
+  }
+  const result = data.replace(/{version}/g, versionDate(now));
 
-  await asar.createPackage(src, dest);
+  fs.writeFile(indexFile, result, "utf8", (error) => {
-})();
+    if (error) {
+      return console.error(error);
+    }
+  });
+});

scripts/locales-coverage-description.js

@@ -0,0 +1,155 @@
+const fs = require("fs");
+
+const THRESSHOLD = 85;
+
+const crowdinMap = {
+  "ar-SA": "en-ar",
+  "el-GR": "en-el",
+  "fi-FI": "en-fi",
+  "ja-JP": "en-ja",
+  "bg-BG": "en-bg",
+  "ca-ES": "en-ca",
+  "de-DE": "en-de",
+  "es-ES": "en-es",
+  "fa-IR": "en-fa",
+  "fr-FR": "en-fr",
+  "he-IL": "en-he",
+  "hi-IN": "en-hi",
+  "hu-HU": "en-hu",
+  "id-ID": "en-id",
+  "it-IT": "en-it",
+  "ko-KR": "en-ko",
+  "my-MM": "en-my",
+  "nb-NO": "en-nb",
+  "nl-NL": "en-nl",
+  "nn-NO": "en-nnno",
+  "pl-PL": "en-pl",
+  "pt-BR": "en-ptbr",
+  "pt-PT": "en-pt",
+  "ro-RO": "en-ro",
+  "ru-RU": "en-ru",
+  "sk-SK": "en-sk",
+  "sv-SE": "en-sv",
+  "tr-TR": "en-tr",
+  "uk-UA": "en-uk",
+  "zh-CN": "en-zhcn",
+  "zh-TW": "en-zhtw",
+};
+
+const flags = {
+  "ar-SA": "🇸🇦",
+  "bg-BG": "🇧🇬",
+  "ca-ES": "🇪🇸",
+  "de-DE": "🇩🇪",
+  "el-GR": "🇬🇷",
+  "es-ES": "🇪🇸",
+  "fa-IR": "🇮🇷",
+  "fi-FI": "🇫🇮",
+  "fr-FR": "🇫🇷",
+  "he-IL": "🇮🇱",
+  "hi-IN": "🇮🇳",
+  "hu-HU": "🇭🇺",
+  "id-ID": "🇮🇩",
+  "it-IT": "🇮🇹",
+  "ja-JP": "🇯🇵",
+  "ko-KR": "🇰🇷",
+  "my-MM": "🇲🇲",
+  "nb-NO": "🇳🇴",
+  "nl-NL": "🇳🇱",
+  "nn-NO": "🇳🇴",
+  "pl-PL": "🇵🇱",
+  "pt-BR": "🇧🇷",
+  "pt-PT": "🇵🇹",
+  "ro-RO": "🇷🇴",
+  "ru-RU": "🇷🇺",
+  "sk-SK": "🇸🇰",
+  "sv-SE": "🇸🇪",
+  "tr-TR": "🇹🇷",
+  "uk-UA": "🇺🇦",
+  "zh-CN": "🇨🇳",
+  "zh-TW": "🇹🇼",
+};
+
+const languages = {
+  "ar-SA": "العربية",
+  "bg-BG": "Български",
+  "ca-ES": "Catalan",
+  "de-DE": "Deutsch",
+  "el-GR": "Ελληνικά",
+  "es-ES": "Español",
+  "fa-IR": "فارسی",
+  "fi-FI": "Suomi",
+  "fr-FR": "Français",
+  "he-IL": "עברית",
+  "hi-IN": "हिन्दी",
+  "hu-HU": "Magyar",
+  "id-ID": "Bahasa Indonesia",
+  "it-IT": "Italiano",
+  "ja-JP": "日本語",
+  "ko-KR": "한국어",
+  "my-MM": "Burmese",
+  "nb-NO": "Norsk bokmål",
+  "nl-NL": "Nederlands",
+  "nn-NO": "Norsk nynorsk",
+  "pl-PL": "Polski",
+  "pt-BR": "Português Brasileiro",
+  "pt-PT": "Português",
+  "ro-RO": "Română",
+  "ru-RU": "Русский",
+  "sk-SK": "Slovenčina",
+  "sv-SE": "Svenska",
+  "tr-TR": "Türkçe",
+  "uk-UA": "Українська",
+  "zh-CN": "简体中文",
+  "zh-TW": "繁體中文",
+};
+
+const percentages = fs.readFileSync(
+  `${__dirname}/../src/locales/percentages.json`,
+);
+const rowData = JSON.parse(percentages);
+
+const coverages = Object.entries(rowData)
+  .sort(([, a], [, b]) => b - a)
+  .reduce((r, [k, v]) => ({ ...r, [k]: v }), {});
+
+const boldIf = (text, condition) => (condition ? `**${text}**` : text);
+
+const printHeader = () => {
+  let result = "| | Flag | Locale | % |\n";
+  result += "| :--: | :--: | -- | :--: |";
+  return result;
+};
+
+const printRow = (id, locale, coverage) => {
+  const isOver = coverage >= THRESSHOLD;
+  let result = `| ${isOver ? id : "..."} | `;
+  result += `${locale in flags ? flags[locale] : ""} | `;
+  const language = locale in languages ? languages[locale] : locale;
+  if (locale in crowdinMap && crowdinMap[locale]) {
+    result += `[${boldIf(
+      language,
+      isOver,
+    )}](https://crowdin.com/translate/excalidraw/10/${crowdinMap[locale]}) | `;
+  } else {
+    result += `${boldIf(language, isOver)} | `;
+  }
+  result += `${coverage === 100 ? "✅" : boldIf(coverage, isOver)} |`;
+  return result;
+};
+
+console.info(
+  `Each language must be at least **${THRESSHOLD}%** translated in order to appear on Excalidraw. Join us on [Crowdin](https://crowdin.com/project/excalidraw) and help us translate your own language. **Can't find yours yet?** Open an [issue](https://github.com/excalidraw/excalidraw/issues/new) and we'll add it to the list.`,
+);
+console.info("\n\r");
+console.info(printHeader());
+let index = 1;
+for (const coverage in coverages) {
+  if (coverage === "en") {
+    continue;
+  }
+  console.info(printRow(index, coverage, coverages[coverage]));
+  index++;
+}
+console.info("\n\r");
+console.info("\\* Languages in **bold** are going to appear on production.");

src/actions/actionCanvas.tsx

@@ -1,21 +1,22 @@
 import React from "react";
-import { ColorPicker } from "../components/ColorPicker";
-import { getDefaultAppState } from "../appState";
-import { trash, zoomIn, zoomOut, resetZoom } from "../components/icons";
-import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
-import { getNormalizedZoom } from "../scene";
-import { CODES, KEYS } from "../keys";
-import { getShortcutKey } from "../utils";
-import useIsMobile from "../is-mobile";
-import { register } from "./register";
-import { newElementWith } from "../element/mutateElement";
-import { AppState, NormalizedZoomValue } from "../types";
-import { getCommonBounds } from "../element";
-import { getNewZoom } from "../scene/zoom";
-import { centerScrollOn } from "../scene/scroll";
 import { EVENT_ACTION, EVENT_CHANGE, trackEvent } from "../analytics";
+import { getDefaultAppState } from "../appState";
 import colors from "../colors";
+import { ColorPicker } from "../components/ColorPicker";
+import { resetZoom, trash, zoomIn, zoomOut } from "../components/icons";
+import { ToolButton } from "../components/ToolButton";
+import { getCommonBounds, getNonDeletedElements } from "../element";
+import { newElementWith } from "../element/mutateElement";
+import { ExcalidrawElement } from "../element/types";
+import { t } from "../i18n";
+import useIsMobile from "../is-mobile";
+import { CODES, KEYS } from "../keys";
+import { getNormalizedZoom, getSelectedElements } from "../scene";
+import { centerScrollOn } from "../scene/scroll";
+import { getNewZoom } from "../scene/zoom";
+import { AppState, NormalizedZoomValue } from "../types";
+import { getNewSceneName, getShortcutKey } from "../utils";
+import { register } from "./register";
 
 export const actionChangeViewBackgroundColor = register({
   name: "changeViewBackgroundColor",
@@ -58,6 +59,7 @@ export const actionClearCanvas = register({
       ),
       appState: {
         ...getDefaultAppState(),
+        name: getNewSceneName(),
         appearance: appState.appearance,
         elementLocked: appState.elementLocked,
         exportBackground: appState.exportBackground,
@@ -65,6 +67,7 @@ export const actionClearCanvas = register({
         gridSize: appState.gridSize,
         shouldAddWatermark: appState.shouldAddWatermark,
         showStats: appState.showStats,
+        pasteDialog: appState.pasteDialog,
       },
       commitToHistory: true,
     };
@@ -93,6 +96,7 @@ export const actionZoomIn = register({
     const zoom = getNewZoom(
       getNormalizedZoom(appState.zoom.value + ZOOM_STEP),
       appState.zoom,
+      { left: appState.offsetLeft, top: appState.offsetTop },
       { x: appState.width / 2, y: appState.height / 2 },
     );
     trackEvent(EVENT_ACTION, "zoom", "in", zoom.value * 100);
@@ -126,6 +130,7 @@ export const actionZoomOut = register({
     const zoom = getNewZoom(
       getNormalizedZoom(appState.zoom.value - ZOOM_STEP),
       appState.zoom,
+      { left: appState.offsetLeft, top: appState.offsetTop },
       { x: appState.width / 2, y: appState.height / 2 },
     );
 
@@ -161,10 +166,15 @@ export const actionResetZoom = register({
     return {
       appState: {
         ...appState,
-        zoom: getNewZoom(1 as NormalizedZoomValue, appState.zoom, {
+        zoom: getNewZoom(
-          x: appState.width / 2,
+          1 as NormalizedZoomValue,
-          y: appState.height / 2,
+          appState.zoom,
-        }),
+          { left: appState.offsetLeft, top: appState.offsetTop },
+          {
+            x: appState.width / 2,
+            y: appState.height / 2,
+          },
+        ),
       },
       commitToHistory: false,
     };
@@ -204,38 +214,63 @@ const zoomValueToFitBoundsOnViewport = (
   return clampedZoomValueToFitElements as NormalizedZoomValue;
 };
 
+const zoomToFitElements = (
+  elements: readonly ExcalidrawElement[],
+  appState: Readonly<AppState>,
+  zoomToSelection: boolean,
+) => {
+  const nonDeletedElements = getNonDeletedElements(elements);
+  const selectedElements = getSelectedElements(nonDeletedElements, appState);
+
+  const commonBounds =
+    zoomToSelection && selectedElements.length > 0
+      ? getCommonBounds(selectedElements)
+      : getCommonBounds(nonDeletedElements);
+
+  const zoomValue = zoomValueToFitBoundsOnViewport(commonBounds, {
+    width: appState.width,
+    height: appState.height,
+  });
+  const newZoom = getNewZoom(zoomValue, appState.zoom, {
+    left: appState.offsetLeft,
+    top: appState.offsetTop,
+  });
+  const action = zoomToSelection ? "selection" : "fit";
+
+  const [x1, y1, x2, y2] = commonBounds;
+  const centerX = (x1 + x2) / 2;
+  const centerY = (y1 + y2) / 2;
+  trackEvent(EVENT_ACTION, "zoom", action, newZoom.value * 100);
+  return {
+    appState: {
+      ...appState,
+      ...centerScrollOn({
+        scenePoint: { x: centerX, y: centerY },
+        viewportDimensions: {
+          width: appState.width,
+          height: appState.height,
+        },
+        zoom: newZoom,
+      }),
+      zoom: newZoom,
+    },
+    commitToHistory: false,
+  };
+};
+
+export const actionZoomToSelected = register({
+  name: "zoomToSelection",
+  perform: (elements, appState) => zoomToFitElements(elements, appState, true),
+  keyTest: (event) =>
+    event.code === CODES.TWO &&
+    event.shiftKey &&
+    !event.altKey &&
+    !event[KEYS.CTRL_OR_CMD],
+});
+
 export const actionZoomToFit = register({
   name: "zoomToFit",
-  perform: (elements, appState) => {
+  perform: (elements, appState) => zoomToFitElements(elements, appState, false),
-    const nonDeletedElements = elements.filter((element) => !element.isDeleted);
-    const commonBounds = getCommonBounds(nonDeletedElements);
-
-    const zoomValue = zoomValueToFitBoundsOnViewport(commonBounds, {
-      width: appState.width,
-      height: appState.height,
-    });
-    const newZoom = getNewZoom(zoomValue, appState.zoom);
-
-    const [x1, y1, x2, y2] = commonBounds;
-    const centerX = (x1 + x2) / 2;
-    const centerY = (y1 + y2) / 2;
-    trackEvent(EVENT_ACTION, "zoom", "fit", newZoom.value * 100);
-    return {
-      appState: {
-        ...appState,
-        ...centerScrollOn({
-          scenePoint: { x: centerX, y: centerY },
-          viewportDimensions: {
-            width: appState.width,
-            height: appState.height,
-          },
-          zoom: newZoom,
-        }),
-        zoom: newZoom,
-      },
-      commitToHistory: false,
-    };
-  },
   keyTest: (event) =>
     event.code === CODES.ONE &&
     event.shiftKey &&

src/actions/actionDeleteSelected.tsx

@@ -136,7 +136,7 @@ export const actionDeleteSelected = register({
     };
   },
   contextItemLabel: "labels.delete",
-  contextMenuOrder: 3,
+  contextMenuOrder: 999999,
   keyTest: (event) => event.key === KEYS.BACKSPACE || event.key === KEYS.DELETE,
   PanelComponent: ({ elements, appState, updateData }) => (
     <ToolButton

src/actions/actionExport.tsx

@@ -3,12 +3,16 @@ import { EVENT_CHANGE, EVENT_IO, trackEvent } from "../analytics";
 import { load, save, saveAs } from "../components/icons";
 import { ProjectName } from "../components/ProjectName";
 import { ToolButton } from "../components/ToolButton";
+import { Tooltip } from "../components/Tooltip";
+import { questionCircle } from "../components/icons";
 import { loadFromJSON, saveAsJSON } from "../data";
 import { t } from "../i18n";
 import useIsMobile from "../is-mobile";
 import { KEYS } from "../keys";
 import { muteFSAbortError } from "../utils";
 import { register } from "./register";
+import "../components/ToolIcon.scss";
+import { SCENE_NAME_FALLBACK } from "../constants";
 
 export const actionChangeProjectName = register({
   name: "changeProjectName",
@@ -19,7 +23,7 @@ export const actionChangeProjectName = register({
   PanelComponent: ({ appState, updateData }) => (
     <ProjectName
       label={t("labels.fileTitle")}
-      value={appState.name || "Unnamed"}
+      value={appState.name || SCENE_NAME_FALLBACK}
       onChange={(name: string) => updateData(name)}
     />
   ),
@@ -54,13 +58,20 @@ export const actionChangeExportEmbedScene = register({
     };
   },
   PanelComponent: ({ appState, updateData }) => (
-    <label title={t("labels.exportEmbedScene_details")}>
+    <label style={{ display: "flex" }}>
       <input
         type="checkbox"
         checked={appState.exportEmbedScene}
         onChange={(event) => updateData(event.target.checked)}
       />{" "}
       {t("labels.exportEmbedScene")}
+      <Tooltip
+        label={t("labels.exportEmbedScene_details")}
+        position="above"
+        long={true}
+      >
+        <div className="TooltipIcon">{questionCircle}</div>
+      </Tooltip>
     </label>
   ),
 });

src/actions/actionStyles.ts

@@ -1,110 +1,28 @@
 import {
   isTextElement,
+  isExcalidrawElement,
   redrawTextBoundingBox,
-  getNonDeletedElements,
 } from "../element";
 import { CODES, KEYS } from "../keys";
 import { register } from "./register";
-import { newElementWith } from "../element/mutateElement";
+import { mutateElement, newElementWith } from "../element/mutateElement";
 import {
-  ExcalidrawElement,
+  DEFAULT_FONT_SIZE,
-  ExcalidrawElementPossibleProps,
+  DEFAULT_FONT_FAMILY,
-} from "../element/types";
+  DEFAULT_TEXT_ALIGN,
-import { AppState } from "../types";
+} from "../constants";
-import {
-  canChangeSharpness,
-  getSelectedElements,
-  hasBackground,
-  hasStroke,
-  hasText,
-} from "../scene";
-import { isLinearElement, isLinearElementType } from "../element/typeChecks";
-
-type AppStateStyles = {
-  [K in AssertSubset<
-    keyof AppState,
-    typeof copyableStyles[number][0]
-  >]: AppState[K];
-};
-
-type ElementStyles = {
-  [K in AssertSubset<
-    keyof ExcalidrawElementPossibleProps,
-    typeof copyableStyles[number][1]
-  >]: ExcalidrawElementPossibleProps[K];
-};
-
-type ElemelementStylesByType = Record<ExcalidrawElement["type"], ElementStyles>;
 
 // `copiedStyles` is exported only for tests.
-let COPIED_STYLES: {
+export let copiedStyles: string = "{}";
-  appStateStyles: Partial<AppStateStyles>;
-  elementStyles: Partial<ElementStyles>;
-  elementStylesByType: Partial<ElemelementStylesByType>;
-} | null = null;
-
-/* [AppState prop, ExcalidrawElement prop, predicate] */
-const copyableStyles = [
-  ["currentItemOpacity", "opacity", () => true],
-  ["currentItemStrokeColor", "strokeColor", () => true],
-  ["currentItemStrokeStyle", "strokeStyle", hasStroke],
-  ["currentItemStrokeWidth", "strokeWidth", hasStroke],
-  ["currentItemRoughness", "roughness", hasStroke],
-  ["currentItemBackgroundColor", "backgroundColor", hasBackground],
-  ["currentItemFillStyle", "fillStyle", hasBackground],
-  ["currentItemStrokeSharpness", "strokeSharpness", canChangeSharpness],
-  ["currentItemLinearStrokeSharpness", "strokeSharpness", isLinearElementType],
-  ["currentItemStartArrowhead", "startArrowhead", isLinearElementType],
-  ["currentItemEndArrowhead", "endArrowhead", isLinearElementType],
-  ["currentItemFontFamily", "fontFamily", hasText],
-  ["currentItemFontSize", "fontSize", hasText],
-  ["currentItemTextAlign", "textAlign", hasText],
-] as const;
-
-const getCommonStyleProps = (
-  elements: readonly ExcalidrawElement[],
-): Exclude<typeof COPIED_STYLES, null> => {
-  const appStateStyles = {} as AppStateStyles;
-  const elementStyles = {} as ElementStyles;
-
-  const elementStylesByType = elements.reduce((acc, element) => {
-    // only use the first element of given type
-    if (!acc[element.type]) {
-      acc[element.type] = {} as ElementStyles;
-      copyableStyles.forEach(([appStateProp, prop, predicate]) => {
-        const value = (element as any)[prop];
-        if (value !== undefined && predicate(element.type)) {
-          if (appStateStyles[appStateProp] === undefined) {
-            (appStateStyles as any)[appStateProp] = value;
-          }
-          if (elementStyles[prop] === undefined) {
-            (elementStyles as any)[prop] = value;
-          }
-          (acc as any)[element.type][prop] = value;
-        }
-      });
-    }
-    return acc;
-  }, {} as ElemelementStylesByType);
-
-  // clone in case we ever make some of the props into non-primitives
-  return JSON.parse(
-    JSON.stringify({ appStateStyles, elementStyles, elementStylesByType }),
-  );
-};
 
 export const actionCopyStyles = register({
   name: "copyStyles",
   perform: (elements, appState) => {
-    COPIED_STYLES = getCommonStyleProps(
+    const element = elements.find((el) => appState.selectedElementIds[el.id]);
-      getSelectedElements(getNonDeletedElements(elements), appState),
+    if (element) {
-    );
+      copiedStyles = JSON.stringify(element);
-
+    }
     return {
-      appState: {
-        ...appState,
-        ...COPIED_STYLES.appStateStyles,
-      },
       commitToHistory: false,
     };
   },
@@ -117,49 +35,31 @@ export const actionCopyStyles = register({
 export const actionPasteStyles = register({
   name: "pasteStyles",
   perform: (elements, appState) => {
-    if (!COPIED_STYLES) {
+    const pastedElement = JSON.parse(copiedStyles);
+    if (!isExcalidrawElement(pastedElement)) {
       return { elements, commitToHistory: false };
     }
-    const getStyle = <T extends ExcalidrawElement, K extends keyof T>(
-      element: T,
-      prop: K,
-    ) => {
-      return (COPIED_STYLES?.elementStylesByType[element.type]?.[
-        prop as keyof ElementStyles
-      ] ??
-        COPIED_STYLES?.elementStyles[prop as keyof ElementStyles] ??
-        element[prop]) as T[K];
-    };
     return {
       elements: elements.map((element) => {
         if (appState.selectedElementIds[element.id]) {
-          const commonProps = {
+          const newElement = newElementWith(element, {
-            backgroundColor: getStyle(element, "backgroundColor"),
+            backgroundColor: pastedElement?.backgroundColor,
-            strokeWidth: getStyle(element, "strokeWidth"),
+            strokeWidth: pastedElement?.strokeWidth,
-            strokeColor: getStyle(element, "strokeColor"),
+            strokeColor: pastedElement?.strokeColor,
-            strokeStyle: getStyle(element, "strokeStyle"),
+            strokeStyle: pastedElement?.strokeStyle,
-            fillStyle: getStyle(element, "fillStyle"),
+            fillStyle: pastedElement?.fillStyle,
-            opacity: getStyle(element, "opacity"),
+            opacity: pastedElement?.opacity,
-            roughness: getStyle(element, "roughness"),
+            roughness: pastedElement?.roughness,
-            strokeSharpness: getStyle(element, "strokeSharpness"),
+          });
-          };
+          if (isTextElement(newElement)) {
-          if (isTextElement(element)) {
+            mutateElement(newElement, {
-            const newElement = newElementWith(element, {
+              fontSize: pastedElement?.fontSize || DEFAULT_FONT_SIZE,
-              ...commonProps,
+              fontFamily: pastedElement?.fontFamily || DEFAULT_FONT_FAMILY,
-              fontSize: getStyle(element, "fontSize"),
+              textAlign: pastedElement?.textAlign || DEFAULT_TEXT_ALIGN,
-              fontFamily: getStyle(element, "fontFamily"),
-              textAlign: getStyle(element, "textAlign"),
             });
             redrawTextBoundingBox(newElement);
-            return newElement;
-          } else if (isLinearElement(element)) {
-            return newElementWith(element, {
-              ...commonProps,
-              startArrowhead: getStyle(element, "startArrowhead"),
-              endArrowhead: getStyle(element, "endArrowhead"),
-            });
           }
-          return newElementWith(element, commonProps);
+          return newElement;
         }
         return element;
       }),

src/actions/shortcuts.ts

@@ -19,8 +19,8 @@ export type ShortcutName =
   | "copyAsSvg"
   | "group"
   | "ungroup"
-  | "toggleGridMode"
+  | "gridMode"
-  | "toggleStats"
+  | "stats"
   | "addToLibrary";
 
 const shortcutMap: Record<ShortcutName, string[]> = {
@@ -51,8 +51,8 @@ const shortcutMap: Record<ShortcutName, string[]> = {
   copyAsSvg: [],
   group: [getShortcutKey("CtrlOrCmd+G")],
   ungroup: [getShortcutKey("CtrlOrCmd+Shift+G")],
-  toggleGridMode: [getShortcutKey("CtrlOrCmd+'")],
+  gridMode: [getShortcutKey("CtrlOrCmd+'")],
-  toggleStats: [],
+  stats: [],
   addToLibrary: [],
 };
 

src/actions/types.ts

@@ -58,6 +58,7 @@ export type ActionName =
   | "zoomOut"
   | "resetZoom"
   | "zoomToFit"
+  | "zoomToSelection"
   | "changeFontFamily"
   | "changeTextAlign"
   | "toggleFullScreen"

src/analytics.ts

@@ -11,14 +11,17 @@ export const EVENT_SHAPE = "shape";
 export const EVENT_SHARE = "share";
 export const EVENT_MAGIC = "magic";
 
-export const trackEvent = window.gtag
+export const trackEvent =
-  ? (category: string, name: string, label?: string, value?: number) => {
+  typeof window !== "undefined" && window.gtag
-      window.gtag("event", name, {
+    ? (category: string, name: string, label?: string, value?: number) => {
-        event_category: category,
+        window.gtag("event", name, {
-        event_label: label,
+          event_category: category,
-        value,
+          event_label: label,
-      });
+          value,
-    }
+        });
-  : (category: string, name: string, label?: string, value?: number) => {
+      }
-      console.info("Track Event", category, name, label, value);
+    : typeof process !== "undefined" && process?.env?.JEST_WORKER_ID
-    };
+    ? (category: string, name: string, label?: string, value?: number) => {}
+    : (category: string, name: string, label?: string, value?: number) => {
+        console.info("Track Event", category, name, label, value);
+      };

src/appState.ts

@@ -1,79 +1,84 @@
 import oc from "open-color";
-import { AppState, FlooredNumber, NormalizedZoomValue } from "./types";
-import { getDateTime } from "./utils";
-import { t } from "./i18n";
 import {
-  DEFAULT_FONT_SIZE,
   DEFAULT_FONT_FAMILY,
+  DEFAULT_FONT_SIZE,
+  SCENE_NAME_FALLBACK,
   DEFAULT_TEXT_ALIGN,
 } from "./constants";
+import { AppState, FlooredNumber, NormalizedZoomValue } from "./types";
 
-export const getDefaultAppState = (): Omit<
+type DefaultAppState = Omit<AppState, "offsetTop" | "offsetLeft" | "name"> & {
-  AppState,
+  /**
-  "offsetTop" | "offsetLeft"
+   * You should override this with current appState.name, or whatever is
-> => {
+   * applicable at a given place where you get default appState.
+   */
+  name: undefined;
+};
+
+export const getDefaultAppState = (): DefaultAppState => {
   return {
     appearance: "light",
-    isLoading: false,
+    collaborators: new Map(),
-    errorMessage: null,
+    currentChartType: "bar",
+    currentItemBackgroundColor: "transparent",
+    currentItemEndArrowhead: "arrow",
+    currentItemFillStyle: "hachure",
+    currentItemFontFamily: DEFAULT_FONT_FAMILY,
+    currentItemFontSize: DEFAULT_FONT_SIZE,
+    currentItemLinearStrokeSharpness: "round",
+    currentItemOpacity: 100,
+    currentItemRoughness: 1,
+    currentItemStartArrowhead: null,
+    currentItemStrokeColor: oc.black,
+    currentItemStrokeSharpness: "sharp",
+    currentItemStrokeStyle: "solid",
+    currentItemStrokeWidth: 1,
+    currentItemTextAlign: DEFAULT_TEXT_ALIGN,
+    cursorButton: "up",
     draggingElement: null,
-    resizingElement: null,
-    multiElement: null,
     editingElement: null,
-    startBoundElement: null,
+    editingGroupId: null,
     editingLinearElement: null,
-    elementType: "selection",
     elementLocked: false,
+    elementType: "selection",
+    errorMessage: null,
     exportBackground: true,
     exportEmbedScene: false,
-    shouldAddWatermark: false,
+    fileHandle: null,
-    currentItemStrokeColor: oc.black,
+    gridSize: null,
-    currentItemBackgroundColor: "transparent",
+    height: window.innerHeight,
-    currentItemFillStyle: "hachure",
-    currentItemStrokeWidth: 1,
-    currentItemStrokeStyle: "solid",
-    currentItemRoughness: 1,
-    currentItemOpacity: 100,
-    currentItemFontSize: DEFAULT_FONT_SIZE,
-    currentItemFontFamily: DEFAULT_FONT_FAMILY,
-    currentItemTextAlign: DEFAULT_TEXT_ALIGN,
-    currentItemStrokeSharpness: "sharp",
-    currentItemLinearStrokeSharpness: "round",
-    currentItemStartArrowhead: null,
-    currentItemEndArrowhead: "arrow",
-    viewBackgroundColor: oc.white,
-    scrollX: 0 as FlooredNumber,
-    scrollY: 0 as FlooredNumber,
-    cursorX: 0,
-    cursorY: 0,
-    cursorButton: "up",
-    scrolledOutside: false,
-    name: `${t("labels.untitled")}-${getDateTime()}`,
     isBindingEnabled: true,
+    isLibraryOpen: false,
+    isLoading: false,
     isResizing: false,
     isRotating: false,
-    selectionElement: null,
-    zoom: {
-      value: 1 as NormalizedZoomValue,
-      translation: { x: 0, y: 0 },
-    },
-    openMenu: null,
     lastPointerDownWith: "mouse",
-    selectedElementIds: {},
+    multiElement: null,
+    // for safety (because TS mostly doesn't distinguish optional types and
+    //  undefined values), we set `name` to the fallback name, but we cast it to
+    // `undefined` so that TS forces us to explicitly specify it wherever
+    // possible
+    name: (SCENE_NAME_FALLBACK as unknown) as undefined,
+    openMenu: null,
+    pasteDialog: { shown: false, data: null },
     previousSelectedElementIds: {},
+    resizingElement: null,
+    scrolledOutside: false,
+    scrollX: 0 as FlooredNumber,
+    scrollY: 0 as FlooredNumber,
+    selectedElementIds: {},
+    selectedGroupIds: {},
+    selectionElement: null,
+    shouldAddWatermark: false,
     shouldCacheIgnoreZoom: false,
     showShortcutsDialog: false,
-    suggestedBindings: [],
-    zenModeEnabled: false,
-    gridSize: null,
-    editingGroupId: null,
-    selectedGroupIds: {},
-    width: window.innerWidth,
-    height: window.innerHeight,
-    isLibraryOpen: false,
-    fileHandle: null,
-    collaborators: new Map(),
     showStats: false,
+    startBoundElement: null,
+    suggestedBindings: [],
+    viewBackgroundColor: oc.white,
+    width: window.innerWidth,
+    zenModeEnabled: false,
+    zoom: { value: 1 as NormalizedZoomValue, translation: { x: 0, y: 0 } },
   };
 };
 
@@ -93,26 +98,25 @@ const APP_STATE_STORAGE_CONF = (<
   config: { [K in keyof T]: K extends keyof AppState ? T[K] : never },
 ) => config)({
   appearance: { browser: true, export: false },
+  collaborators: { browser: false, export: false },
+  currentChartType: { browser: true, export: false },
   currentItemBackgroundColor: { browser: true, export: false },
+  currentItemEndArrowhead: { browser: true, export: false },
   currentItemFillStyle: { browser: true, export: false },
   currentItemFontFamily: { browser: true, export: false },
   currentItemFontSize: { browser: true, export: false },
+  currentItemLinearStrokeSharpness: { browser: true, export: false },
   currentItemOpacity: { browser: true, export: false },
   currentItemRoughness: { browser: true, export: false },
+  currentItemStartArrowhead: { browser: true, export: false },
   currentItemStrokeColor: { browser: true, export: false },
+  currentItemStrokeSharpness: { browser: true, export: false },
   currentItemStrokeStyle: { browser: true, export: false },
   currentItemStrokeWidth: { browser: true, export: false },
   currentItemTextAlign: { browser: true, export: false },
-  currentItemStrokeSharpness: { browser: true, export: false },
-  currentItemLinearStrokeSharpness: { browser: true, export: false },
-  currentItemStartArrowhead: { browser: true, export: false },
-  currentItemEndArrowhead: { browser: true, export: false },
   cursorButton: { browser: true, export: false },
-  cursorX: { browser: true, export: false },
-  cursorY: { browser: true, export: false },
   draggingElement: { browser: false, export: false },
   editingElement: { browser: false, export: false },
-  startBoundElement: { browser: false, export: false },
   editingGroupId: { browser: true, export: false },
   editingLinearElement: { browser: false, export: false },
   elementLocked: { browser: true, export: false },
@@ -120,6 +124,7 @@ const APP_STATE_STORAGE_CONF = (<
   errorMessage: { browser: false, export: false },
   exportBackground: { browser: true, export: false },
   exportEmbedScene: { browser: true, export: false },
+  fileHandle: { browser: false, export: false },
   gridSize: { browser: true, export: true },
   height: { browser: false, export: false },
   isBindingEnabled: { browser: false, export: false },
@@ -130,7 +135,10 @@ const APP_STATE_STORAGE_CONF = (<
   lastPointerDownWith: { browser: true, export: false },
   multiElement: { browser: false, export: false },
   name: { browser: true, export: false },
+  offsetLeft: { browser: false, export: false },
+  offsetTop: { browser: false, export: false },
   openMenu: { browser: true, export: false },
+  pasteDialog: { browser: false, export: false },
   previousSelectedElementIds: { browser: true, export: false },
   resizingElement: { browser: false, export: false },
   scrolledOutside: { browser: true, export: false },
@@ -142,16 +150,13 @@ const APP_STATE_STORAGE_CONF = (<
   shouldAddWatermark: { browser: true, export: false },
   shouldCacheIgnoreZoom: { browser: true, export: false },
   showShortcutsDialog: { browser: false, export: false },
+  showStats: { browser: true, export: false },
+  startBoundElement: { browser: false, export: false },
   suggestedBindings: { browser: false, export: false },
   viewBackgroundColor: { browser: true, export: true },
   width: { browser: false, export: false },
   zenModeEnabled: { browser: true, export: false },
   zoom: { browser: true, export: false },
-  offsetTop: { browser: false, export: false },
-  offsetLeft: { browser: false, export: false },
-  fileHandle: { browser: false, export: false },
-  collaborators: { browser: false, export: false },
-  showStats: { browser: true, export: false },
 });
 
 const _clearAppStateForStorage = <ExportType extends "export" | "browser">(
@@ -166,11 +171,6 @@ const _clearAppStateForStorage = <ExportType extends "export" | "browser">(
   const stateForExport = {} as { [K in ExportableKeys]?: typeof appState[K] };
   for (const key of Object.keys(appState) as (keyof typeof appState)[]) {
     const propConfig = APP_STATE_STORAGE_CONF[key];
-    if (!propConfig) {
-      console.error(
-        `_clearAppStateForStorage: appState key "${key}" config doesn't exist for "${exportType}" export type`,
-      );
-    }
     if (propConfig?.[exportType]) {
       // @ts-ignore see https://github.com/microsoft/TypeScript/issues/31445
       stateForExport[key] = appState[key];

src/charts.ts

@@ -1,13 +1,16 @@
 import { EVENT_MAGIC, trackEvent } from "./analytics";
 import colors from "./colors";
-import { DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE } from "./constants";
+import { DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, ENV } from "./constants";
-import { newElement, newTextElement, newLinearElement } from "./element";
+import { newElement, newLinearElement, newTextElement } from "./element";
-import { ExcalidrawElement } from "./element/types";
+import { NonDeletedExcalidrawElement } from "./element/types";
 import { randomId } from "./random";
 
+export type ChartElements = readonly NonDeletedExcalidrawElement[];
+
 const BAR_WIDTH = 32;
 const BAR_GAP = 12;
 const BAR_HEIGHT = 256;
+const GRID_OPACITY = 50;
 
 export interface Spreadsheet {
   title: string | null;
@@ -19,15 +22,15 @@ export const NOT_SPREADSHEET = "NOT_SPREADSHEET";
 export const VALID_SPREADSHEET = "VALID_SPREADSHEET";
 
 type ParseSpreadsheetResult =
-  | { type: typeof NOT_SPREADSHEET }
+  | { type: typeof NOT_SPREADSHEET; reason: string }
   | { type: typeof VALID_SPREADSHEET; spreadsheet: Spreadsheet };
 
 const tryParseNumber = (s: string): number | null => {
-  const match = /^[$€£¥₩]?([0-9]+(\.[0-9]+)?)$/.exec(s);
+  const match = /^[$€£¥₩]?([0-9,]+(\.[0-9]+)?)$/.exec(s);
   if (!match) {
     return null;
   }
-  return parseFloat(match[1]);
+  return parseFloat(match[1].replace(/,/g, ""));
 };
 
 const isNumericColumn = (lines: string[][], columnIndex: number) =>
@@ -37,12 +40,12 @@ const tryParseCells = (cells: string[][]): ParseSpreadsheetResult => {
   const numCols = cells[0].length;
 
   if (numCols > 2) {
-    return { type: NOT_SPREADSHEET };
+    return { type: NOT_SPREADSHEET, reason: "More than 2 columns" };
   }
 
   if (numCols === 1) {
     if (!isNumericColumn(cells, 0)) {
-      return { type: NOT_SPREADSHEET };
+      return { type: NOT_SPREADSHEET, reason: "Value is not numeric" };
     }
 
     const hasHeader = tryParseNumber(cells[0][0]) === null;
@@ -51,7 +54,7 @@ const tryParseCells = (cells: string[][]): ParseSpreadsheetResult => {
     );
 
     if (values.length < 2) {
-      return { type: NOT_SPREADSHEET };
+      return { type: NOT_SPREADSHEET, reason: "Less than two rows" };
     }
 
     return {
@@ -67,7 +70,7 @@ const tryParseCells = (cells: string[][]): ParseSpreadsheetResult => {
   const valueColumnIndex = isNumericColumn(cells, 0) ? 0 : 1;
 
   if (!isNumericColumn(cells, valueColumnIndex)) {
-    return { type: NOT_SPREADSHEET };
+    return { type: NOT_SPREADSHEET, reason: "Value is not numeric" };
   }
 
   const labelColumnIndex = (valueColumnIndex + 1) % 2;
@@ -75,7 +78,7 @@ const tryParseCells = (cells: string[][]): ParseSpreadsheetResult => {
   const rows = hasHeader ? cells.slice(1) : cells;
 
   if (rows.length < 2) {
-    return { type: NOT_SPREADSHEET };
+    return { type: NOT_SPREADSHEET, reason: "Less than 2 rows" };
   }
 
   return {
@@ -104,13 +107,13 @@ export const tryParseSpreadsheet = (text: string): ParseSpreadsheetResult => {
   // Copy/paste from excel, spreadhseets, tsv, csv.
   // For now we only accept 2 columns with an optional header
 
-  // Check for tab separeted values
+  // Check for tab separated values
   let lines = text
     .trim()
     .split("\n")
     .map((line) => line.trim().split("\t"));
 
-  // Check for comma separeted files
+  // Check for comma separated files
   if (lines.length && lines[0].length !== 2) {
     lines = text
       .trim()
@@ -119,14 +122,17 @@ export const tryParseSpreadsheet = (text: string): ParseSpreadsheetResult => {
   }
 
   if (lines.length === 0) {
-    return { type: NOT_SPREADSHEET };
+    return { type: NOT_SPREADSHEET, reason: "No values" };
   }
 
   const numColsFirstLine = lines[0].length;
   const isSpreadsheet = lines.every((line) => line.length === numColsFirstLine);
 
   if (!isSpreadsheet) {
-    return { type: NOT_SPREADSHEET };
+    return {
+      type: NOT_SPREADSHEET,
+      reason: "All rows don't have same number of columns",
+    };
   }
 
   const result = tryParseCells(lines);
@@ -136,111 +142,48 @@ export const tryParseSpreadsheet = (text: string): ParseSpreadsheetResult => {
       return transposedResults;
     }
   }
-
   return result;
 };
 
-// For the maths behind it https://excalidraw.com/#json=6320864370884608,O_5xfD-Agh32tytHpRJx1g
+const bgColors = colors.elementBackground.slice(
-export const renderSpreadsheet = (
+  2,
+  colors.elementBackground.length,
+);
+
+// Put all the common properties here so when the whole chart is selected
+// the properties dialog shows the correct selected values
+const commonProps = {
+  fillStyle: "hachure",
+  fontFamily: DEFAULT_FONT_FAMILY,
+  fontSize: DEFAULT_FONT_SIZE,
+  opacity: 100,
+  roughness: 1,
+  strokeColor: colors.elementStroke[0],
+  strokeSharpness: "sharp",
+  strokeStyle: "solid",
+  strokeWidth: 1,
+  verticalAlign: "middle",
+} as const;
+
+const getChartDimentions = (spreadsheet: Spreadsheet) => {
+  const chartWidth =
+    (BAR_WIDTH + BAR_GAP) * spreadsheet.values.length + BAR_GAP;
+  const chartHeight = BAR_HEIGHT + BAR_GAP * 2;
+  return { chartWidth, chartHeight };
+};
+
+const chartXLabels = (
   spreadsheet: Spreadsheet,
   x: number,
   y: number,
-): ExcalidrawElement[] => {
+  groupId: string,
-  const values = spreadsheet.values;
+  backgroundColor: string,
-  const max = Math.max(...values);
+): ChartElements => {
-  const chartHeight = BAR_HEIGHT + BAR_GAP * 2;
+  return (
-  const chartWidth = (BAR_WIDTH + BAR_GAP) * values.length + BAR_GAP;
-  const maxColors = colors.elementBackground.length;
-  const bgColors = colors.elementBackground.slice(2, maxColors);
-
-  // Put all the common properties here so when the whole chart is selected
-  // the properties dialog shows the correct selected values
-  const commonProps = {
-    backgroundColor: bgColors[Math.floor(Math.random() * bgColors.length)],
-    fillStyle: "hachure",
-    fontFamily: DEFAULT_FONT_FAMILY,
-    fontSize: DEFAULT_FONT_SIZE,
-    groupIds: [randomId()],
-    opacity: 100,
-    roughness: 1,
-    strokeColor: colors.elementStroke[0],
-    strokeSharpness: "sharp",
-    strokeStyle: "solid",
-    strokeWidth: 1,
-    verticalAlign: "middle",
-  } as const;
-
-  const minYLabel = newTextElement({
-    ...commonProps,
-    x: x - BAR_GAP,
-    y: y - BAR_GAP,
-    text: "0",
-    textAlign: "right",
-  });
-
-  const maxYLabel = newTextElement({
-    ...commonProps,
-    x: x - BAR_GAP,
-    y: y - BAR_HEIGHT - minYLabel.height / 2,
-    text: max.toLocaleString(),
-    textAlign: "right",
-  });
-
-  const xAxisLine = newLinearElement({
-    type: "line",
-    x,
-    y,
-    startArrowhead: null,
-    endArrowhead: null,
-    points: [
-      [0, 0],
-      [chartWidth, 0],
-    ],
-    ...commonProps,
-  });
-
-  const yAxisLine = newLinearElement({
-    type: "line",
-    x,
-    y,
-    startArrowhead: null,
-    endArrowhead: null,
-    points: [
-      [0, 0],
-      [0, -chartHeight],
-    ],
-    ...commonProps,
-  });
-
-  const maxValueLine = newLinearElement({
-    type: "line",
-    x,
-    y: y - BAR_HEIGHT - BAR_GAP,
-    startArrowhead: null,
-    endArrowhead: null,
-    ...commonProps,
-    strokeStyle: "dotted",
-    points: [
-      [0, 0],
-      [chartWidth, 0],
-    ],
-  });
-
-  const bars = values.map((value, index) => {
-    const barHeight = (value / max) * BAR_HEIGHT;
-    return newElement({
-      ...commonProps,
-      type: "rectangle",
-      x: x + index * (BAR_WIDTH + BAR_GAP) + BAR_GAP,
-      y: y - barHeight - BAR_GAP,
-      width: BAR_WIDTH,
-      height: barHeight,
-    });
-  });
-
-  const xLabels =
     spreadsheet.labels?.map((label, index) => {
       return newTextElement({
+        groupIds: [groupId],
+        backgroundColor,
         ...commonProps,
         text: label.length > 8 ? `${label.slice(0, 5)}...` : label,
         x: x + index * (BAR_WIDTH + BAR_GAP) + BAR_GAP * 2,
@@ -251,29 +194,288 @@ export const renderSpreadsheet = (
         textAlign: "center",
         verticalAlign: "top",
       });
-    }) || [];
+    }) || []
+  );
+};
+
+const chartYLabels = (
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+  groupId: string,
+  backgroundColor: string,
+): ChartElements => {
+  const minYLabel = newTextElement({
+    groupIds: [groupId],
+    backgroundColor,
+    ...commonProps,
+    x: x - BAR_GAP,
+    y: y - BAR_GAP,
+    text: "0",
+    textAlign: "right",
+  });
+
+  const maxYLabel = newTextElement({
+    groupIds: [groupId],
+    backgroundColor,
+    ...commonProps,
+    x: x - BAR_GAP,
+    y: y - BAR_HEIGHT - minYLabel.height / 2,
+    text: Math.max(...spreadsheet.values).toLocaleString(),
+    textAlign: "right",
+  });
+
+  return [minYLabel, maxYLabel];
+};
+
+const chartLines = (
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+  groupId: string,
+  backgroundColor: string,
+): ChartElements => {
+  const { chartWidth, chartHeight } = getChartDimentions(spreadsheet);
+  const xLine = newLinearElement({
+    backgroundColor,
+    groupIds: [groupId],
+    ...commonProps,
+    type: "line",
+    x,
+    y,
+    startArrowhead: null,
+    endArrowhead: null,
+    width: chartWidth,
+    points: [
+      [0, 0],
+      [chartWidth, 0],
+    ],
+  });
+
+  const yLine = newLinearElement({
+    backgroundColor,
+    groupIds: [groupId],
+    ...commonProps,
+    type: "line",
+    x,
+    y,
+    startArrowhead: null,
+    endArrowhead: null,
+    height: chartHeight,
+    points: [
+      [0, 0],
+      [0, -chartHeight],
+    ],
+  });
+
+  const maxLine = newLinearElement({
+    backgroundColor,
+    groupIds: [groupId],
+    ...commonProps,
+    type: "line",
+    x,
+    y: y - BAR_HEIGHT - BAR_GAP,
+    startArrowhead: null,
+    endArrowhead: null,
+    strokeStyle: "dotted",
+    width: chartWidth,
+    opacity: GRID_OPACITY,
+    points: [
+      [0, 0],
+      [chartWidth, 0],
+    ],
+  });
+
+  return [xLine, yLine, maxLine];
+};
+
+// For the maths behind it https://excalidraw.com/#json=6320864370884608,O_5xfD-Agh32tytHpRJx1g
+const chartBaseElements = (
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+  groupId: string,
+  backgroundColor: string,
+  debug?: boolean,
+): ChartElements => {
+  const { chartWidth, chartHeight } = getChartDimentions(spreadsheet);
 
   const title = spreadsheet.title
     ? newTextElement({
+        backgroundColor,
+        groupIds: [groupId],
         ...commonProps,
         text: spreadsheet.title,
         x: x + chartWidth / 2,
-        y: y - BAR_HEIGHT - BAR_GAP * 2 - maxYLabel.height,
+        y: y - BAR_HEIGHT - BAR_GAP * 2 - DEFAULT_FONT_SIZE,
         strokeSharpness: "sharp",
         strokeStyle: "solid",
         textAlign: "center",
       })
     : null;
 
-  trackEvent(EVENT_MAGIC, "chart", "bars", bars.length);
+  const debugRect = debug
+    ? newElement({
+        backgroundColor,
+        groupIds: [groupId],
+        ...commonProps,
+        type: "rectangle",
+        x,
+        y: y - chartHeight,
+        width: chartWidth,
+        height: chartHeight,
+        strokeColor: colors.elementStroke[0],
+        fillStyle: "solid",
+        opacity: 6,
+      })
+    : null;
+
   return [
-    title,
+    ...(debugRect ? [debugRect] : []),
-    ...bars,
+    ...(title ? [title] : []),
-    ...xLabels,
+    ...chartXLabels(spreadsheet, x, y, groupId, backgroundColor),
-    xAxisLine,
+    ...chartYLabels(spreadsheet, x, y, groupId, backgroundColor),
-    yAxisLine,
+    ...chartLines(spreadsheet, x, y, groupId, backgroundColor),
-    maxValueLine,
+  ];
-    minYLabel,
+};
-    maxYLabel,
+
-  ].filter((element) => element !== null) as ExcalidrawElement[];
+const chartTypeBar = (
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+): ChartElements => {
+  const max = Math.max(...spreadsheet.values);
+  const groupId = randomId();
+  const backgroundColor = bgColors[Math.floor(Math.random() * bgColors.length)];
+
+  const bars = spreadsheet.values.map((value, index) => {
+    const barHeight = (value / max) * BAR_HEIGHT;
+    return newElement({
+      backgroundColor,
+      groupIds: [groupId],
+      ...commonProps,
+      type: "rectangle",
+      x: x + index * (BAR_WIDTH + BAR_GAP) + BAR_GAP,
+      y: y - barHeight - BAR_GAP,
+      width: BAR_WIDTH,
+      height: barHeight,
+    });
+  });
+
+  return [
+    ...bars,
+    ...chartBaseElements(
+      spreadsheet,
+      x,
+      y,
+      groupId,
+      backgroundColor,
+      process.env.NODE_ENV === ENV.DEVELOPMENT,
+    ),
+  ];
+};
+
+const chartTypeLine = (
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+): ChartElements => {
+  const max = Math.max(...spreadsheet.values);
+  const groupId = randomId();
+  const backgroundColor = bgColors[Math.floor(Math.random() * bgColors.length)];
+
+  let index = 0;
+  const points = [];
+  for (const value of spreadsheet.values) {
+    const cx = index * (BAR_WIDTH + BAR_GAP);
+    const cy = -(value / max) * BAR_HEIGHT;
+    points.push([cx, cy]);
+    index++;
+  }
+
+  const maxX = Math.max(...points.map((element) => element[0]));
+  const maxY = Math.max(...points.map((element) => element[1]));
+  const minX = Math.min(...points.map((element) => element[0]));
+  const minY = Math.min(...points.map((element) => element[1]));
+
+  const line = newLinearElement({
+    backgroundColor,
+    groupIds: [groupId],
+    ...commonProps,
+    type: "line",
+    x: x + BAR_GAP + BAR_WIDTH / 2,
+    y: y - BAR_GAP,
+    startArrowhead: null,
+    endArrowhead: null,
+    height: maxY - minY,
+    width: maxX - minX,
+    strokeWidth: 2,
+    points: points as any,
+  });
+
+  const dots = spreadsheet.values.map((value, index) => {
+    const cx = index * (BAR_WIDTH + BAR_GAP) + BAR_GAP / 2;
+    const cy = -(value / max) * BAR_HEIGHT + BAR_GAP / 2;
+    return newElement({
+      backgroundColor,
+      groupIds: [groupId],
+      ...commonProps,
+      fillStyle: "solid",
+      strokeWidth: 2,
+      type: "ellipse",
+      x: x + cx + BAR_WIDTH / 2,
+      y: y + cy - BAR_GAP * 2,
+      width: BAR_GAP,
+      height: BAR_GAP,
+    });
+  });
+
+  const lines = spreadsheet.values.map((value, index) => {
+    const cx = index * (BAR_WIDTH + BAR_GAP) + BAR_GAP / 2;
+    const cy = (value / max) * BAR_HEIGHT + BAR_GAP / 2 + BAR_GAP;
+    return newLinearElement({
+      backgroundColor,
+      groupIds: [groupId],
+      ...commonProps,
+      type: "line",
+      x: x + cx + BAR_WIDTH / 2 + BAR_GAP / 2,
+      y: y - cy,
+      startArrowhead: null,
+      endArrowhead: null,
+      height: cy,
+      strokeStyle: "dotted",
+      opacity: GRID_OPACITY,
+      points: [
+        [0, 0],
+        [0, cy],
+      ],
+    });
+  });
+
+  return [
+    ...chartBaseElements(
+      spreadsheet,
+      x,
+      y,
+      groupId,
+      backgroundColor,
+      process.env.NODE_ENV === ENV.DEVELOPMENT,
+    ),
+    line,
+    ...lines,
+    ...dots,
+  ];
+};
+
+export const renderSpreadsheet = (
+  chartType: string,
+  spreadsheet: Spreadsheet,
+  x: number,
+  y: number,
+): ChartElements => {
+  trackEvent(EVENT_MAGIC, "chart", chartType, spreadsheet.values.length);
+  if (chartType === "line") {
+    return chartTypeLine(spreadsheet, x, y);
+  }
+  return chartTypeBar(spreadsheet, x, y);
 };

src/components/App.tsx

@@ -1,180 +1,168 @@
+import { Point, simplify } from "points-on-curve";
 import React from "react";
-
-import rough from "roughjs/bin/rough";
 import { RoughCanvas } from "roughjs/bin/canvas";
-import { simplify, Point } from "points-on-curve";
+import rough from "roughjs/bin/rough";
-
-import {
-  newElement,
-  newTextElement,
-  duplicateElement,
-  isInvisiblySmallElement,
-  isTextElement,
-  textWysiwyg,
-  getCommonBounds,
-  getCursorForResizingElement,
-  getPerfectElementSize,
-  getNormalizedDimensions,
-  newLinearElement,
-  transformElements,
-  getElementWithTransformHandleType,
-  getResizeOffsetXY,
-  getResizeArrowDirection,
-  getTransformHandleTypeFromCoords,
-  isNonDeletedElement,
-  updateTextElement,
-  dragSelectedElements,
-  getDragOffsetXY,
-  dragNewElement,
-  hitTest,
-  isHittingElementBoundingBoxWithoutHittingElement,
-  getNonDeletedElements,
-} from "../element";
-import {
-  getElementsWithinSelection,
-  isOverScrollBars,
-  getElementsAtPosition,
-  getElementContainingPosition,
-  getNormalizedZoom,
-  getSelectedElements,
-  isSomeElementSelected,
-  calculateScrollCenter,
-} from "../scene";
-import { loadFromBlob, exportCanvas } from "../data";
-
-import { renderScene } from "../renderer";
-import {
-  AppState,
-  GestureEvent,
-  Gesture,
-  ExcalidrawProps,
-  SceneData,
-} from "../types";
-import {
-  ExcalidrawElement,
-  ExcalidrawTextElement,
-  NonDeleted,
-  ExcalidrawGenericElement,
-  ExcalidrawLinearElement,
-  ExcalidrawBindableElement,
-} from "../element/types";
-
-import { distance2d, isPathALoop, getGridPoint } from "../math";
-
-import {
-  isWritableElement,
-  isInputLike,
-  isToolIcon,
-  debounce,
-  distance,
-  resetCursor,
-  viewportCoordsToSceneCoords,
-  sceneCoordsToViewportCoords,
-  setCursorForShape,
-  tupleToCoors,
-  ResolvablePromise,
-  resolvablePromise,
-  withBatchedUpdates,
-} from "../utils";
-import {
-  KEYS,
-  isArrowKey,
-  getResizeCenterPointKey,
-  getResizeWithSidesSameLengthKey,
-  getRotateWithDiscreteAngleKey,
-  CODES,
-} from "../keys";
-
-import { findShapeByKey } from "../shapes";
-import { createHistory, SceneHistory } from "../history";
-
-import ContextMenu from "./ContextMenu";
-
-import { ActionManager } from "../actions/manager";
 import "../actions";
+import { actionDeleteSelected, actionFinalize } from "../actions";
+import { createRedoAction, createUndoAction } from "../actions/actionHistory";
+import { ActionManager } from "../actions/manager";
 import { actions } from "../actions/register";
-
 import { ActionResult } from "../actions/types";
-import { getDefaultAppState } from "../appState";
-import { t, getLanguage } from "../i18n";
-
-import {
-  copyToClipboard,
-  parseClipboard,
-  probablySupportsClipboardBlob,
-  probablySupportsClipboardWriteText,
-} from "../clipboard";
-import { normalizeScroll } from "../scene";
-import { getCenter, getDistance } from "../gesture";
-import { createUndoAction, createRedoAction } from "../actions/actionHistory";
-
-import {
-  CURSOR_TYPE,
-  ELEMENT_SHIFT_TRANSLATE_AMOUNT,
-  ELEMENT_TRANSLATE_AMOUNT,
-  POINTER_BUTTON,
-  DRAGGING_THRESHOLD,
-  TEXT_TO_CENTER_SNAP_THRESHOLD,
-  LINE_CONFIRM_THRESHOLD,
-  EVENT,
-  ENV,
-  CANVAS_ONLY_ACTIONS,
-  DEFAULT_VERTICAL_ALIGN,
-  GRID_SIZE,
-  MIME_TYPES,
-  TAP_TWICE_TIMEOUT,
-  TOUCH_CTX_MENU_TIMEOUT,
-} from "../constants";
-
-import LayerUI from "./LayerUI";
-import { ScrollBars, SceneState } from "../scene/types";
-import { mutateElement } from "../element/mutateElement";
-import { invalidateShapeForElement } from "../renderer/renderElement";
-import {
-  isLinearElement,
-  isLinearElementType,
-  isBindingElement,
-  isBindingElementType,
-} from "../element/typeChecks";
-import { actionFinalize, actionDeleteSelected } from "../actions";
-
-import { LinearElementEditor } from "../element/linearElementEditor";
-import {
-  getSelectedGroupIds,
-  isSelectedViaGroup,
-  selectGroupsForSelectedElements,
-  isElementInGroup,
-  getSelectedGroupIdForElement,
-  getElementsInGroup,
-  editGroupForSelectedElement,
-} from "../groups";
-import { Library } from "../data/library";
-import Scene from "../scene/Scene";
-import {
-  getHoveredElementForBinding,
-  maybeBindLinearElement,
-  getEligibleElementsForBinding,
-  bindOrUnbindSelectedElements,
-  unbindLinearElements,
-  fixBindingsAfterDuplication,
-  fixBindingsAfterDeletion,
-  isLinearElementSimpleAndAlreadyBound,
-  isBindingEnabled,
-  updateBoundElements,
-  shouldEnableBindingForPointerEvent,
-} from "../element/binding";
-import { MaybeTransformHandleType } from "../element/transformHandles";
-import { deepCopyElement } from "../element/newElement";
-import { renderSpreadsheet } from "../charts";
-import { isValidLibrary } from "../data/json";
-import { getNewZoom } from "../scene/zoom";
-import { restore } from "../data/restore";
 import {
   EVENT_DIALOG,
   EVENT_LIBRARY,
   EVENT_SHAPE,
   trackEvent,
 } from "../analytics";
+import { getDefaultAppState } from "../appState";
+import {
+  copyToClipboard,
+  parseClipboard,
+  probablySupportsClipboardBlob,
+  probablySupportsClipboardWriteText,
+} from "../clipboard";
+import {
+  APP_NAME,
+  CANVAS_ONLY_ACTIONS,
+  CURSOR_TYPE,
+  DEFAULT_VERTICAL_ALIGN,
+  DRAGGING_THRESHOLD,
+  ELEMENT_SHIFT_TRANSLATE_AMOUNT,
+  ELEMENT_TRANSLATE_AMOUNT,
+  ENV,
+  EVENT,
+  GRID_SIZE,
+  LINE_CONFIRM_THRESHOLD,
+  MIME_TYPES,
+  POINTER_BUTTON,
+  TAP_TWICE_TIMEOUT,
+  TEXT_TO_CENTER_SNAP_THRESHOLD,
+  TOUCH_CTX_MENU_TIMEOUT,
+} from "../constants";
+import { exportCanvas, loadFromBlob } from "../data";
+import { isValidLibrary } from "../data/json";
+import { Library } from "../data/library";
+import { restore } from "../data/restore";
+import {
+  dragNewElement,
+  dragSelectedElements,
+  duplicateElement,
+  getCommonBounds,
+  getCursorForResizingElement,
+  getDragOffsetXY,
+  getElementWithTransformHandleType,
+  getNonDeletedElements,
+  getNormalizedDimensions,
+  getPerfectElementSize,
+  getResizeArrowDirection,
+  getResizeOffsetXY,
+  getTransformHandleTypeFromCoords,
+  hitTest,
+  isHittingElementBoundingBoxWithoutHittingElement,
+  isInvisiblySmallElement,
+  isNonDeletedElement,
+  isTextElement,
+  newElement,
+  newLinearElement,
+  newTextElement,
+  textWysiwyg,
+  transformElements,
+  updateTextElement,
+} from "../element";
+import {
+  bindOrUnbindSelectedElements,
+  fixBindingsAfterDeletion,
+  fixBindingsAfterDuplication,
+  getEligibleElementsForBinding,
+  getHoveredElementForBinding,
+  isBindingEnabled,
+  isLinearElementSimpleAndAlreadyBound,
+  maybeBindLinearElement,
+  shouldEnableBindingForPointerEvent,
+  unbindLinearElements,
+  updateBoundElements,
+} from "../element/binding";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { mutateElement } from "../element/mutateElement";
+import { deepCopyElement } from "../element/newElement";
+import { MaybeTransformHandleType } from "../element/transformHandles";
+import {
+  isBindingElement,
+  isBindingElementType,
+  isLinearElement,
+  isLinearElementType,
+} from "../element/typeChecks";
+import {
+  ExcalidrawBindableElement,
+  ExcalidrawElement,
+  ExcalidrawGenericElement,
+  ExcalidrawLinearElement,
+  ExcalidrawTextElement,
+  NonDeleted,
+} from "../element/types";
+import { getCenter, getDistance } from "../gesture";
+import {
+  editGroupForSelectedElement,
+  getElementsInGroup,
+  getSelectedGroupIdForElement,
+  getSelectedGroupIds,
+  isElementInGroup,
+  isSelectedViaGroup,
+  selectGroupsForSelectedElements,
+} from "../groups";
+import { createHistory, SceneHistory } from "../history";
+import { t, getLanguage, setLanguage, languages, defaultLang } from "../i18n";
+import {
+  CODES,
+  getResizeCenterPointKey,
+  getResizeWithSidesSameLengthKey,
+  getRotateWithDiscreteAngleKey,
+  isArrowKey,
+  KEYS,
+} from "../keys";
+import { distance2d, getGridPoint, isPathALoop } from "../math";
+import { renderScene } from "../renderer";
+import { invalidateShapeForElement } from "../renderer/renderElement";
+import {
+  calculateScrollCenter,
+  getElementContainingPosition,
+  getElementsAtPosition,
+  getElementsWithinSelection,
+  getNormalizedZoom,
+  getSelectedElements,
+  isOverScrollBars,
+  isSomeElementSelected,
+  normalizeScroll,
+} from "../scene";
+import Scene from "../scene/Scene";
+import { SceneState, ScrollBars } from "../scene/types";
+import { getNewZoom } from "../scene/zoom";
+import { findShapeByKey } from "../shapes";
+import {
+  AppState,
+  ExcalidrawProps,
+  Gesture,
+  GestureEvent,
+  SceneData,
+} from "../types";
+import {
+  debounce,
+  distance,
+  getNewSceneName,
+  isInputLike,
+  isToolIcon,
+  isWritableElement,
+  resetCursor,
+  ResolvablePromise,
+  resolvablePromise,
+  sceneCoordsToViewportCoords,
+  setCursorForShape,
+  tupleToCoors,
+  viewportCoordsToSceneCoords,
+  withBatchedUpdates,
+} from "../utils";
+import ContextMenu from "./ContextMenu";
+import LayerUI from "./LayerUI";
 import { Stats } from "./Stats";
 
 const { history } = createHistory();
@@ -294,6 +282,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
     } = props;
     this.state = {
       ...defaultAppState,
+      name: getNewSceneName(),
       isLoading: true,
       width,
       height,
@@ -345,12 +334,15 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       offsetLeft,
     } = this.state;
 
-    const { onCollabButtonClick } = this.props;
+    const { onCollabButtonClick, onExportToBackend, renderFooter } = this.props;
     const canvasScale = window.devicePixelRatio;
 
     const canvasWidth = canvasDOMWidth * canvasScale;
     const canvasHeight = canvasDOMHeight * canvasScale;
 
+    const DEFAULT_PASTE_X = canvasDOMWidth / 2;
+    const DEFAULT_PASTE_Y = canvasDOMHeight / 2;
+
     return (
       <div
         className="excalidraw"
@@ -370,13 +362,19 @@ class App extends React.Component<ExcalidrawProps, AppState> {
           elements={this.scene.getElements()}
           onCollabButtonClick={onCollabButtonClick}
           onLockToggle={this.toggleLock}
-          onInsertShape={(elements) =>
+          onInsertElements={(elements) =>
-            this.addElementsFromPasteOrLibrary(elements)
+            this.addElementsFromPasteOrLibrary(
+              elements,
+              DEFAULT_PASTE_X,
+              DEFAULT_PASTE_Y,
+            )
           }
           zenModeEnabled={zenModeEnabled}
           toggleZenMode={this.toggleZenMode}
-          lng={getLanguage().lng}
+          langCode={getLanguage().code}
           isCollaborating={this.props.isCollaborating || false}
+          onExportToBackend={onExportToBackend}
+          renderCustomFooter={renderFooter}
         />
         {this.state.showStats && (
           <Stats
@@ -494,7 +492,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
   };
 
   private importLibraryFromUrl = async (url: string) => {
-    window.history.replaceState({}, "Excalidraw", window.location.origin);
+    window.history.replaceState({}, APP_NAME, window.location.origin);
     try {
       const request = await fetch(url);
       const blob = await request.blob();
@@ -532,6 +530,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       this.scene.replaceAllElements([]);
       this.setState((state) => ({
         ...getDefaultAppState(),
+        name: getNewSceneName(),
         isLoading: opts?.resetLoadingState ? false : state.isLoading,
         appearance: this.state.appearance,
       }));
@@ -586,6 +585,8 @@ class App extends React.Component<ExcalidrawProps, AppState> {
         scene.elements,
         {
           ...scene.appState,
+          width: this.state.width,
+          height: this.state.height,
           offsetTop: this.state.offsetTop,
           offsetLeft: this.state.offsetLeft,
         },
@@ -741,6 +742,10 @@ class App extends React.Component<ExcalidrawProps, AppState> {
   }
 
   componentDidUpdate(prevProps: ExcalidrawProps, prevState: AppState) {
+    if (prevProps.langCode !== this.props.langCode) {
+      this.updateLanguage();
+    }
+
     if (
       prevProps.width !== this.props.width ||
       prevProps.height !== this.props.height ||
@@ -864,7 +869,16 @@ class App extends React.Component<ExcalidrawProps, AppState> {
 
     history.record(this.state, this.scene.getElementsIncludingDeleted());
 
-    this.props.onChange?.(this.scene.getElementsIncludingDeleted(), this.state);
+    // Do not notify consumers if we're still loading the scene. Among other
+    // potential issues, this fixes a case where the tab isn't focused during
+    // init, which would trigger onChange with empty elements, which would then
+    // override whatever is in localStorage currently.
+    if (!this.state.isLoading) {
+      this.props.onChange?.(
+        this.scene.getElementsIncludingDeleted(),
+        this.state,
+      );
+    }
   }
 
   // Copy/paste
@@ -993,9 +1007,12 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       if (data.errorMessage) {
         this.setState({ errorMessage: data.errorMessage });
       } else if (data.spreadsheet) {
-        this.addElementsFromPasteOrLibrary(
+        this.setState({
-          renderSpreadsheet(data.spreadsheet, cursorX, cursorY),
+          pasteDialog: {
-        );
+            data: data.spreadsheet,
+            shown: true,
+          },
+        });
       } else if (data.elements) {
         this.addElementsFromPasteOrLibrary(data.elements);
       } else if (data.text) {
@@ -1416,13 +1433,27 @@ class App extends React.Component<ExcalidrawProps, AppState> {
 
   private onGestureChange = withBatchedUpdates((event: GestureEvent) => {
     event.preventDefault();
-    this.setState(({ zoom }) => ({
+
-      zoom: getNewZoom(
+    // onGestureChange only has zoom factor but not the center.
-        getNormalizedZoom(gesture.initialScale! * event.scale),
+    // If we're on iPad or iPhone, then we recognize multi-touch and will
-        zoom,
+    // zoom in at the right location on the touchMove handler already.
-        { x: cursorX, y: cursorY },
+    // On Macbook, we don't have those events so will zoom in at the
-      ),
+    // current location instead.
-    }));
+    if (gesture.pointers.size === 2) {
+      return;
+    }
+
+    const initialScale = gesture.initialScale;
+    if (initialScale) {
+      this.setState(({ zoom, offsetLeft, offsetTop }) => ({
+        zoom: getNewZoom(
+          getNormalizedZoom(initialScale * event.scale),
+          zoom,
+          { left: offsetLeft, top: offsetTop },
+          { x: cursorX, y: cursorY },
+        ),
+      }));
+    }
   });
 
   private onGestureEnd = withBatchedUpdates((event: GestureEvent) => {
@@ -1734,21 +1765,28 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       });
     }
 
-    if (gesture.pointers.size === 2) {
+    const initialScale = gesture.initialScale;
+    if (
+      gesture.pointers.size === 2 &&
+      gesture.lastCenter &&
+      initialScale &&
+      gesture.initialDistance
+    ) {
       const center = getCenter(gesture.pointers);
-      const deltaX = center.x - gesture.lastCenter!.x;
+      const deltaX = center.x - gesture.lastCenter.x;
-      const deltaY = center.y - gesture.lastCenter!.y;
+      const deltaY = center.y - gesture.lastCenter.y;
       gesture.lastCenter = center;
 
       const distance = getDistance(Array.from(gesture.pointers.values()));
-      const scaleFactor = distance / gesture.initialDistance!;
+      const scaleFactor = distance / gesture.initialDistance;
 
-      this.setState(({ zoom, scrollX, scrollY }) => ({
+      this.setState(({ zoom, scrollX, scrollY, offsetLeft, offsetTop }) => ({
         scrollX: normalizeScroll(scrollX + deltaX / zoom.value),
         scrollY: normalizeScroll(scrollY + deltaY / zoom.value),
         zoom: getNewZoom(
-          getNormalizedZoom(gesture.initialScale! * scaleFactor),
+          getNormalizedZoom(initialScale * scaleFactor),
           zoom,
+          { left: offsetLeft, top: offsetTop },
           center,
         ),
         shouldCacheIgnoreZoom: true,
@@ -2430,8 +2468,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
           // otherwise, it will trigger selection based on current
           // state of the box
           if (!this.state.selectedElementIds[hitElement.id]) {
-            // if we are currently editing a group, treat all selections outside of the group
+            // if we are currently editing a group, exiting editing mode and deselect the group.
-            // as exiting editing mode.
             if (
               this.state.editingGroupId &&
               !isElementInGroup(hitElement, this.state.editingGroupId)
@@ -2441,7 +2478,6 @@ class App extends React.Component<ExcalidrawProps, AppState> {
                 selectedGroupIds: {},
                 editingGroupId: null,
               });
-              return true;
             }
 
             // Add hit element to selection. At this point if we're not holding
@@ -2579,9 +2615,9 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       );
 
       /* If arrow is pre-arrowheads, it will have undefined for both start and end arrowheads.
-			 If so, we want it to be null for start and "arrow" for end. If the linear item is not 
+      If so, we want it to be null for start and "arrow" for end. If the linear item is not
-			 an arrow, we want it to be null for both. Otherwise, we want it to use the 
+      an arrow, we want it to be null for both. Otherwise, we want it to use the
-			 values from appState. */
+      values from appState. */
 
       const { currentItemStartArrowhead, currentItemEndArrowhead } = this.state;
       const [startArrowhead, endArrowhead] =
@@ -3612,13 +3648,15 @@ class App extends React.Component<ExcalidrawProps, AppState> {
             CANVAS_ONLY_ACTIONS.includes(action.name),
           ),
           {
-            shortcutName: "toggleGridMode",
+            checked: this.state.gridSize !== null,
-            label: t("labels.toggleGridMode"),
+            shortcutName: "gridMode",
+            label: t("labels.gridMode"),
             action: this.toggleGridMode,
           },
           {
-            shortcutName: "toggleStats",
+            checked: this.state.showStats,
-            label: t("labels.toggleStats"),
+            shortcutName: "stats",
+            label: t("stats.title"),
             action: this.toggleStats,
           },
         ],
@@ -3695,11 +3733,16 @@ class App extends React.Component<ExcalidrawProps, AppState> {
         }, 1000);
       }
 
-      this.setState(({ zoom }) => ({
+      this.setState(({ zoom, offsetLeft, offsetTop }) => ({
-        zoom: getNewZoom(getNormalizedZoom(zoom.value - delta / 100), zoom, {
+        zoom: getNewZoom(
-          x: cursorX,
+          getNormalizedZoom(zoom.value - delta / 100),
-          y: cursorY,
+          zoom,
-        }),
+          { left: offsetLeft, top: offsetTop },
+          {
+            x: cursorX,
+            y: cursorY,
+          },
+        ),
         selectedElementIds: {},
         previousSelectedElementIds:
           Object.keys(selectedElementIds).length !== 0
@@ -3814,6 +3857,14 @@ class App extends React.Component<ExcalidrawProps, AppState> {
       offsetTop: typeof offsets?.offsetTop === "number" ? offsets.offsetTop : 0,
     };
   }
+
+  private async updateLanguage() {
+    const currentLang =
+      languages.find((lang) => lang.code === this.props.langCode) ||
+      defaultLang;
+    await setLanguage(currentLang);
+    this.setAppState({});
+  }
 }
 
 // -----------------------------------------------------------------------------

src/components/ColorPicker.scss

@@ -218,7 +218,7 @@
       left: 2px;
     }
 
-    @media #{$media-query} {
+    @media #{$is-mobile-query} {
       display: none;
     }
   }

src/components/ContextMenu.scss

@@ -1,4 +1,4 @@
-@import "open-color/open-color.scss";
+@import "../css/_variables";
 
 .excalidraw {
   .context-menu {
@@ -32,11 +32,26 @@
 
     display: grid;
     grid-template-columns: 1fr 0.2fr;
-    div:nth-child(1) {
+    align-items: center;
+
+    &.checkmark::before {
+      position: absolute;
+      left: 6px;
+      margin-bottom: 1px;
+      content: "\2713";
+    }
+
+    &.dangerous {
+      .context-menu-option__label {
+        color: $oc-red-7;
+      }
+    }
+
+    .context-menu-option__label {
       justify-self: start;
       margin-inline-end: 20px;
     }
-    div:nth-child(2) {
+    .context-menu-option__shortcut {
       justify-self: end;
       opacity: 0.6;
       font-size: 0.7rem;
@@ -46,9 +61,30 @@
   .context-menu-option:hover {
     color: var(--popup-background-color);
     background-color: var(--select-highlight-color);
+
+    &.dangerous {
+      .context-menu-option__label {
+        color: var(--popup-background-color);
+      }
+      background-color: $oc-red-6;
+    }
   }
 
   .context-menu-option:focus {
     z-index: 1;
   }
+
+  @media #{$is-mobile-query} {
+    .context-menu-option {
+      display: block;
+
+      .context-menu-option__label {
+        margin-inline-end: 0;
+      }
+
+      .context-menu-option__shortcut {
+        display: none;
+      }
+    }
+  }
 }

src/components/ContextMenu.tsx

@@ -10,6 +10,7 @@ import {
 } from "../actions/shortcuts";
 
 type ContextMenuOption = {
+  checked?: boolean;
   shortcutName: ShortcutName;
   label: string;
   action(): void;
@@ -26,7 +27,6 @@ const ContextMenu = ({ options, onCloseRequest, top, left }: Props) => {
   const isDarkTheme = !!document
     .querySelector(".excalidraw")
     ?.classList.contains("Appearance_dark");
-
   return (
     <div
       className={clsx("excalidraw", {
@@ -43,11 +43,16 @@ const ContextMenu = ({ options, onCloseRequest, top, left }: Props) => {
           className="context-menu"
           onContextMenu={(event) => event.preventDefault()}
         >
-          {options.map(({ action, shortcutName, label }, idx) => (
+          {options.map(({ action, checked, shortcutName, label }, idx) => (
             <li data-testid={shortcutName} key={idx} onClick={onCloseRequest}>
-              <button className="context-menu-option" onClick={action}>
+              <button
-                <div>{label}</div>
+                className={`context-menu-option 
-                <div>
+                ${shortcutName === "delete" ? "dangerous" : ""}
+                ${checked ? "checkmark" : ""}`}
+                onClick={action}
+              >
+                <div className="context-menu-option__label">{label}</div>
+                <div className="context-menu-option__shortcut">
                   {shortcutName
                     ? getShortcutFromShortcutName(shortcutName)
                     : ""}

src/components/DarkModeToggle.tsx

@@ -14,7 +14,9 @@ export const DarkModeToggle = (props: {
   return (
     <label
       className={`ToolIcon ToolIcon_type_floating ToolIcon_size_M`}
-      title={t("buttons.toggleDarkMode")}
+      title={
+        props.value === "dark" ? t("buttons.lightMode") : t("buttons.darkMode")
+      }
     >
       <input
         className="ToolIcon_type_checkbox ToolIcon_toggle_opaque"
@@ -23,7 +25,11 @@ export const DarkModeToggle = (props: {
           props.onChange(event.target.checked ? "dark" : "light")
         }
         checked={props.value === "dark"}
-        aria-label={t("buttons.toggleDarkMode")}
+        aria-label={
+          props.value === "dark"
+            ? t("buttons.lightMode")
+            : t("buttons.darkMode")
+        }
       />
       <div className="ToolIcon__icon">
         {props.value === "light" ? ICONS.MOON : ICONS.SUN}

src/components/Dialog.scss

@@ -7,6 +7,9 @@
     margin-top: 0;
     grid-template-columns: 1fr calc(var(--space-factor) * 7);
     grid-gap: var(--metric);
+    padding: calc(var(--space-factor) * 2);
+    text-align: center;
+    font-variant: small-caps;
   }
 
   .Dialog__titleContent {
@@ -18,7 +21,11 @@
     margin: 0;
   }
 
-  @media #{$media-query} {
+  .Dialog__content {
+    padding: 0 16px 16px;
+  }
+
+  @media #{$is-mobile-query} {
     .Dialog {
       --metric: calc(var(--space-factor) * 4);
       --inset-left: #{"max(var(--metric), var(--sal))"};
@@ -30,13 +37,8 @@
           var(--space-factor) * 7
         );
       position: sticky;
-      top: calc(-1 * var(--metric));
+      top: 0;
-      margin: calc(-1 * var(--inset-right));
-      margin-top: calc(-1 * var(--metric));
-      margin-bottom: var(--metric);
       padding: calc(var(--space-factor) * 2);
-      padding-left: var(--inset-left);
-      padding-right: var(--inset-right);
       background: var(--bg-color-island);
       font-size: 1.25em;
 

src/components/Dialog.tsx

@@ -1,13 +1,12 @@
-import React, { useCallback, useEffect, useState } from "react";
 import clsx from "clsx";
-import { Modal } from "./Modal";
+import React, { useCallback, useEffect, useState } from "react";
-import { Island } from "./Island";
 import { t } from "../i18n";
 import useIsMobile from "../is-mobile";
-import { back, close } from "./icons";
 import { KEYS } from "../keys";
-
 import "./Dialog.scss";
+import { back, close } from "./icons";
+import { Island } from "./Island";
+import { Modal } from "./Modal";
 
 const useRefState = <T,>() => {
   const [refValue, setRefValue] = useState<T | null>(null);
@@ -20,9 +19,10 @@ const useRefState = <T,>() => {
 export const Dialog = (props: {
   children: React.ReactNode;
   className?: string;
-  maxWidth?: number;
+  small?: boolean;
   onCloseRequest(): void;
   title: React.ReactNode;
+  autofocus?: boolean;
 }) => {
   const [islandNode, setIslandNode] = useRefState<HTMLDivElement>();
 
@@ -33,7 +33,7 @@ export const Dialog = (props: {
 
     const focusableElements = queryFocusableElements(islandNode);
 
-    if (focusableElements.length > 0) {
+    if (focusableElements.length > 0 && props.autofocus !== false) {
       // If there's an element other than close, focus it.
       (focusableElements[1] || focusableElements[0]).focus();
     }
@@ -62,7 +62,7 @@ export const Dialog = (props: {
     islandNode.addEventListener("keydown", handleKeyDown);
 
     return () => islandNode.removeEventListener("keydown", handleKeyDown);
-  }, [islandNode]);
+  }, [islandNode, props.autofocus]);
 
   const queryFocusableElements = (node: HTMLElement) => {
     const focusableElements = node.querySelectorAll<HTMLElement>(
@@ -76,11 +76,11 @@ export const Dialog = (props: {
     <Modal
       className={clsx("Dialog", props.className)}
       labelledBy="dialog-title"
-      maxWidth={props.maxWidth}
+      maxWidth={props.small ? 550 : 800}
       onCloseRequest={props.onCloseRequest}
     >
-      <Island padding={4} ref={setIslandNode}>
+      <Island ref={setIslandNode}>
-        <h2 id="dialog-title" className="Dialog__title">
+        <h3 id="dialog-title" className="Dialog__title">
           <span className="Dialog__titleContent">{props.title}</span>
           <button
             className="Modal__close"
@@ -89,8 +89,8 @@ export const Dialog = (props: {
           >
             {useIsMobile() ? back : close}
           </button>
-        </h2>
+        </h3>
-        {props.children}
+        <div className="Dialog__content">{props.children}</div>
       </Island>
     </Modal>
   );

src/components/ErrorDialog.tsx

@@ -24,11 +24,18 @@ export const ErrorDialog = ({
     <>
       {modalIsShown && (
         <Dialog
-          maxWidth={500}
+          small
           onCloseRequest={handleClose}
           title={t("errorDialog.title")}
         >
-          <div>{message}</div>
+          <div>
+            {message.split("\n").map((line) => (
+              <>
+                {line}
+                <br />
+              </>
+            ))}
+          </div>
         </Dialog>
       )}
     </>

src/components/ExportDialog.scss

@@ -37,7 +37,7 @@
     }
   }
 
-  @media (max-width: 550px) {
+  @media #{$is-mobile-query} {
     .ExportDialog {
       display: flex;
       flex-direction: column;
@@ -51,9 +51,7 @@
     .ExportDialog__actions > * {
       margin-bottom: calc(var(--space-factor) * 3);
     }
-  }
 
-  @media #{$media-query} {
     .ExportDialog__preview canvas {
       max-height: 30vh;
     }

src/components/ExportDialog.tsx

@@ -67,7 +67,7 @@ const ExportModal = ({
   onExportToPng: ExportCB;
   onExportToSvg: ExportCB;
   onExportToClipboard: ExportCB;
-  onExportToBackend: ExportCB;
+  onExportToBackend?: ExportCB;
   onCloseRequest: () => void;
 }) => {
   const someElementIsSelected = isSomeElementSelected(elements, appState);
@@ -155,13 +155,15 @@ const ExportModal = ({
                 onClick={() => onExportToClipboard(exportedElements, scale)}
               />
             )}
-            <ToolButton
+            {onExportToBackend && (
-              type="button"
+              <ToolButton
-              icon={link}
+                type="button"
-              title={t("buttons.getShareableLink")}
+                icon={link}
-              aria-label={t("buttons.getShareableLink")}
+                title={t("buttons.getShareableLink")}
-              onClick={() => onExportToBackend(exportedElements)}
+                aria-label={t("buttons.getShareableLink")}
-            />
+                onClick={() => onExportToBackend(exportedElements)}
+              />
+            )}
           </Stack.Row>
           <div className="ExportDialog__name">
             {actionManager.renderAction("changeProjectName")}
@@ -235,7 +237,7 @@ export const ExportDialog = ({
   onExportToPng: ExportCB;
   onExportToSvg: ExportCB;
   onExportToClipboard: ExportCB;
-  onExportToBackend: ExportCB;
+  onExportToBackend?: ExportCB;
 }) => {
   const [modalIsShown, setModalIsShown] = useState(false);
   const triggerButton = useRef<HTMLButtonElement>(null);
@@ -260,11 +262,7 @@ export const ExportDialog = ({
         ref={triggerButton}
       />
       {modalIsShown && (
-        <Dialog
+        <Dialog onCloseRequest={handleClose} title={t("buttons.export")}>
-          maxWidth={800}
-          onCloseRequest={handleClose}
-          title={t("buttons.export")}
-        >
           <ExportModal
             elements={elements}
             appState={appState}

src/components/HintViewer.scss

@@ -1,5 +1,8 @@
 @import "../css/_variables";
 
+// this is loosely based on the longest hint text
+$wide-viewport-width: 1000px;
+
 .excalidraw {
   .HintViewer {
     pointer-events: none;
@@ -16,12 +19,9 @@
     color: $oc-gray-6;
     font-size: 0.8rem;
 
-    @media (min-width: 1200px) {
+    @media #{$is-mobile-query} {
-      white-space: pre;
-    }
-
-    @media #{$media-query} {
       position: static;
+      padding-right: 2em;
     }
 
     > span {

src/components/HintViewer.tsx

@@ -38,8 +38,8 @@ const getHints = ({ appState, elements }: Hint) => {
     selectedElements.length === 1
   ) {
     const targetElement = selectedElements[0];
-    if (isLinearElement(targetElement) && targetElement.points.length > 2) {
+    if (isLinearElement(targetElement) && targetElement.points.length === 2) {
-      return null;
+      return t("hints.lockAngle");
     }
     return t("hints.resize");
   }

src/components/IconPicker.scss

@@ -93,6 +93,9 @@
     grid-auto-flow: column;
     grid-gap: 0.5rem;
     border-radius: 4px;
+    :root[dir="rtl"] & {
+      padding: 0.4rem;
+    }
   }
 
   .picker-keybinding {
@@ -107,7 +110,7 @@
     :root[dir="rtl"] & {
       left: 2px;
     }
-    @media #{$media-query} {
+    @media #{$is-mobile-query} {
       display: none;
     }
   }

src/components/InitializeApp.tsx

@@ -1,18 +1,29 @@
 import React from "react";
 
 import { LoadingMessage } from "./LoadingMessage";
-import { setLanguageFirstTime } from "../i18n";
+import {
+  defaultLang,
+  Language,
+  languages,
+  setLanguageFirstTime,
+} from "../i18n";
 
-export class InitializeApp extends React.Component<
+interface Props {
-  any,
+  langCode: Language["code"];
-  { isLoading: boolean }
+}
-> {
+interface State {
+  isLoading: boolean;
+}
+export class InitializeApp extends React.Component<Props, State> {
   public state: { isLoading: boolean } = {
     isLoading: true,
   };
 
   async componentDidMount() {
-    await setLanguageFirstTime();
+    const currentLang =
+      languages.find((lang) => lang.code === this.props.langCode) ||
+      defaultLang;
+    await setLanguageFirstTime(currentLang);
     this.setState({
       isLoading: false,
     });

src/components/Island.scss

@@ -4,7 +4,7 @@
     background-color: var(--bg-color-island);
     backdrop-filter: saturate(100%) blur(10px);
     box-shadow: var(--shadow-island);
-    border-radius: var(--border-radius-m);
+    border-radius: 4px;
     padding: calc(var(--padding) * var(--space-factor));
     position: relative;
     transition: box-shadow 0.5s ease-in-out;

src/components/LayerUI.scss

@@ -7,11 +7,23 @@
     align-items: center;
     justify-content: center;
 
-    .browse-libraries {
+    .layer-ui__library-header {
-      position: absolute;
+      display: flex;
-      right: 12px;
+      align-items: center;
-      top: 16px;
+      width: 100%;
-      white-space: nowrap;
+      margin: 2px 0;
+
+      button {
+        // 2px from the left to account for focus border of left-most button
+        margin: 0 2px;
+      }
+
+      a {
+        margin-left: auto;
+        // 17px for scrollbar (needed for overlay scrollbars on Big Sur?) + 1px extra
+        padding-right: 18px;
+        white-space: nowrap;
+      }
     }
   }
 
@@ -39,64 +51,6 @@
         width: 1.2rem;
         height: 1.2rem;
       }
-
-      &.tooltip .tooltip-text {
-        visibility: hidden;
-        width: 20rem;
-        bottom: calc(50% + 0.8rem + 6px);
-
-        :root[dir="ltr"] & {
-          left: -5px;
-        }
-
-        :root[dir="rtl"] & {
-          right: -5px;
-        }
-
-        background-color: $oc-black;
-        color: $oc-white;
-        text-align: center;
-        border-radius: 6px;
-        padding: 5px;
-        position: absolute;
-        z-index: 10;
-        font-size: 13px;
-        line-height: 1.5;
-        white-space: pre-wrap;
-
-        &::after {
-          --size: 6px;
-          content: "";
-          border: var(--size) solid transparent;
-          border-top-color: $oc-black;
-          position: absolute;
-          bottom: calc(-2 * var(--size));
-
-          :root[dir="ltr"] & {
-            left: calc(5px + var(--size) / 2);
-          }
-
-          :root[dir="rtl"] & {
-            right: calc(5px + var(--size) / 2);
-          }
-        }
-      }
-
-      // the following 3 rules ensure that the tooltip doesn't show (nor affect
-      // the cursor) when you drag over when you draw on canvas, but at the same
-      // time it still works when clicking on the link/shield
-
-      body:active &.tooltip:not(:hover) {
-        pointer-events: none;
-      }
-
-      body:not(:active) &.tooltip:hover .tooltip-text {
-        visibility: visible;
-      }
-
-      .tooltip-text:hover {
-        visibility: visible;
-      }
     }
 
     &__github-corner {

src/components/LayerUI.tsx

@@ -19,8 +19,7 @@ import { FixedSideContainer } from "./FixedSideContainer";
 import { UserList } from "./UserList";
 import { LockIcon } from "./LockIcon";
 import { ExportDialog, ExportCB } from "./ExportDialog";
-import { LanguageList } from "./LanguageList";
+import { Language, t } from "../i18n";
-import { t, languages, setLanguage } from "../i18n";
 import { HintViewer } from "./HintViewer";
 import useIsMobile from "../is-mobile";
 
@@ -51,6 +50,7 @@ import {
   EVENT_LIBRARY,
   trackEvent,
 } from "../analytics";
+import { PasteChartDialog } from "./PasteChartDialog";
 
 interface LayerUIProps {
   actionManager: ActionManager;
@@ -60,11 +60,17 @@ interface LayerUIProps {
   elements: readonly NonDeletedExcalidrawElement[];
   onCollabButtonClick?: () => void;
   onLockToggle: () => void;
-  onInsertShape: (elements: LibraryItem) => void;
+  onInsertElements: (elements: readonly NonDeletedExcalidrawElement[]) => void;
   zenModeEnabled: boolean;
   toggleZenMode: () => void;
-  lng: string;
+  langCode: Language["code"];
   isCollaborating: boolean;
+  onExportToBackend?: (
+    exportedElements: readonly NonDeletedExcalidrawElement[],
+    appState: AppState,
+    canvas: HTMLCanvasElement | null,
+  ) => void;
+  renderCustomFooter?: (isMobile: boolean) => JSX.Element;
 }
 
 const useOnClickOutside = (
@@ -118,9 +124,42 @@ const LibraryMenuItems = ({
   let addedPendingElements = false;
 
   rows.push(
-    <>
+    <div className="layer-ui__library-header">
+      <ToolButton
+        key="import"
+        type="button"
+        title={t("buttons.load")}
+        aria-label={t("buttons.load")}
+        icon={load}
+        onClick={() => {
+          importLibraryFromJSON()
+            .then(() => {
+              // Maybe we should close and open the menu so that the items get updated.
+              // But for now we just close the menu.
+              setAppState({ isLibraryOpen: false });
+            })
+            .catch(muteFSAbortError)
+            .catch((error) => {
+              setAppState({ errorMessage: error.message });
+            });
+        }}
+      />
+      <ToolButton
+        key="export"
+        type="button"
+        title={t("buttons.export")}
+        aria-label={t("buttons.export")}
+        icon={exportFile}
+        onClick={() => {
+          saveLibraryAsJSON()
+            .catch(muteFSAbortError)
+            .catch((error) => {
+              setAppState({ errorMessage: error.message });
+            });
+        }}
+      />
+
       <a
-        className="browse-libraries"
         href="https://libraries.excalidraw.com"
         target="_excalidraw_libraries"
         onClick={() => {
@@ -129,48 +168,7 @@ const LibraryMenuItems = ({
       >
         {t("labels.libraries")}
       </a>
-
+    </div>,
-      <Stack.Row
-        align="center"
-        gap={1}
-        key={"actions"}
-        style={{ padding: "2px" }}
-      >
-        <ToolButton
-          key="import"
-          type="button"
-          title={t("buttons.load")}
-          aria-label={t("buttons.load")}
-          icon={load}
-          onClick={() => {
-            importLibraryFromJSON()
-              .then(() => {
-                // Maybe we should close and open the menu so that the items get updated.
-                // But for now we just close the menu.
-                setAppState({ isLibraryOpen: false });
-              })
-              .catch(muteFSAbortError)
-              .catch((error) => {
-                setAppState({ errorMessage: error.message });
-              });
-          }}
-        />
-        <ToolButton
-          key="export"
-          type="button"
-          title={t("buttons.export")}
-          aria-label={t("buttons.export")}
-          icon={exportFile}
-          onClick={() => {
-            saveLibraryAsJSON()
-              .catch(muteFSAbortError)
-              .catch((error) => {
-                setAppState({ errorMessage: error.message });
-              });
-          }}
-        />
-      </Stack.Row>
-    </>,
   );
 
   for (let row = 0; row < numRows; row++) {
@@ -313,14 +311,15 @@ const LayerUI = ({
   elements,
   onCollabButtonClick,
   onLockToggle,
-  onInsertShape,
+  onInsertElements,
   zenModeEnabled,
   toggleZenMode,
   isCollaborating,
+  onExportToBackend,
+  renderCustomFooter,
 }: LayerUIProps) => {
   const isMobile = useIsMobile();
 
-  // TODO: Extend tooltip component and use here.
   const renderEncryptedIcon = () => (
     <a
       className={clsx("encrypted-icon tooltip zen-mode-visibility", {
@@ -333,10 +332,9 @@ const LayerUI = ({
         trackEvent(EVENT_EXIT, "e2ee shield");
       }}
     >
-      <span className="tooltip-text" dir="auto">
+      <Tooltip label={t("encrypted.tooltip")} position="above" long={true}>
-        {t("encrypted.tooltip")}
+        {shield}
-      </span>
+      </Tooltip>
-      {shield}
     </a>
   );
 
@@ -360,6 +358,7 @@ const LayerUI = ({
           });
       }
     };
+
     return (
       <ExportDialog
         elements={elements}
@@ -368,28 +367,14 @@ const LayerUI = ({
         onExportToPng={createExporter("png")}
         onExportToSvg={createExporter("svg")}
         onExportToClipboard={createExporter("clipboard")}
-        onExportToBackend={async (exportedElements) => {
+        onExportToBackend={
-          if (canvas) {
+          onExportToBackend
-            try {
+            ? (elements) => {
-              await exportCanvas(
+                onExportToBackend &&
-                "backend",
+                  onExportToBackend(elements, appState, canvas);
-                exportedElements,
-                {
-                  ...appState,
-                  selectedElementIds: {},
-                },
-                canvas,
-                appState,
-              );
-            } catch (error) {
-              if (error.name !== "AbortError") {
-                const { width, height } = canvas;
-                console.error(error, { width, height });
-                setAppState({ errorMessage: error.message });
               }
-            }
+            : undefined
-          }
+        }
-        }}
       />
     );
   };
@@ -465,7 +450,7 @@ const LayerUI = ({
     <LibraryMenu
       pendingElements={getSelectedElements(elements, appState)}
       onClickOutside={closeLibrary}
-      onInsertShape={onInsertShape}
+      onInsertShape={onInsertElements}
       onAddToLibrary={deselectItems}
       setAppState={setAppState}
     />
@@ -567,14 +552,7 @@ const LayerUI = ({
           "transition-right disable-pointerEvents": zenModeEnabled,
         })}
       >
-        <LanguageList
+        {renderCustomFooter?.(false)}
-          onChange={async (lng) => {
-            await setLanguage(lng);
-            setAppState({});
-          }}
-          languages={languages}
-          floating
-        />
         {actionManager.renderAction("toggleShortcuts")}
       </div>
       <button
@@ -601,21 +579,8 @@ const LayerUI = ({
     </footer>
   );
 
-  return isMobile ? (
+  const dialogs = (
-    <MobileMenu
+    <>
-      appState={appState}
-      elements={elements}
-      actionManager={actionManager}
-      libraryMenu={libraryMenu}
-      exportButton={renderExportDialog()}
-      setAppState={setAppState}
-      onCollabButtonClick={onCollabButtonClick}
-      onLockToggle={onLockToggle}
-      canvas={canvas}
-      isCollaborating={isCollaborating}
-    />
-  ) : (
-    <div className="layer-ui__wrapper">
       {appState.isLoading && <LoadingMessage />}
       {appState.errorMessage && (
         <ErrorDialog
@@ -628,6 +593,41 @@ const LayerUI = ({
           onClose={() => setAppState({ showShortcutsDialog: false })}
         />
       )}
+      {appState.pasteDialog.shown && (
+        <PasteChartDialog
+          setAppState={setAppState}
+          appState={appState}
+          onInsertChart={onInsertElements}
+          onClose={() =>
+            setAppState({
+              pasteDialog: { shown: false, data: null },
+            })
+          }
+        />
+      )}
+    </>
+  );
+
+  return isMobile ? (
+    <>
+      {dialogs}
+      <MobileMenu
+        appState={appState}
+        elements={elements}
+        actionManager={actionManager}
+        libraryMenu={libraryMenu}
+        exportButton={renderExportDialog()}
+        setAppState={setAppState}
+        onCollabButtonClick={onCollabButtonClick}
+        onLockToggle={onLockToggle}
+        canvas={canvas}
+        isCollaborating={isCollaborating}
+        renderCustomFooter={renderCustomFooter}
+      />
+    </>
+  ) : (
+    <div className="layer-ui__wrapper">
+      {dialogs}
       {renderFixedSideContainer()}
       {renderBottomAppMenu()}
       {
@@ -650,8 +650,6 @@ const LayerUI = ({
 const areEqual = (prev: LayerUIProps, next: LayerUIProps) => {
   const getNecessaryObj = (appState: AppState): Partial<AppState> => {
     const {
-      cursorX,
-      cursorY,
       suggestedBindings,
       startBoundElement: boundElement,
       ...ret
@@ -662,9 +660,8 @@ const areEqual = (prev: LayerUIProps, next: LayerUIProps) => {
   const nextAppState = getNecessaryObj(next.appState);
 
   const keys = Object.keys(prevAppState) as (keyof Partial<AppState>)[];
-
   return (
-    prev.lng === next.lng &&
+    prev.langCode === next.langCode &&
     prev.elements === next.elements &&
     keys.every((key) => prevAppState[key] === nextAppState[key])
   );

src/components/LibraryUnit.tsx

@@ -1,13 +1,13 @@
-import React, { useRef, useEffect, useState } from "react";
 import clsx from "clsx";
-import { exportToSvg } from "../scene/export";
+import oc from "open-color";
+import React, { useEffect, useRef, useState } from "react";
 import { close } from "../components/icons";
-
+import { MIME_TYPES } from "../constants";
-import "./LibraryUnit.scss";
 import { t } from "../i18n";
 import useIsMobile from "../is-mobile";
+import { exportToSvg } from "../scene/export";
 import { LibraryItem } from "../types";
-import { MIME_TYPES } from "../constants";
+import "./LibraryUnit.scss";
 
 // fa-plus
 const PLUS_ICON = (
@@ -38,7 +38,7 @@ export const LibraryUnit = ({
     }
     const svg = exportToSvg(elementsToRender, {
       exportBackground: false,
-      viewBackgroundColor: "#fff",
+      viewBackgroundColor: oc.white,
       shouldAddWatermark: false,
     });
     for (const child of ref.current!.children) {

src/components/MobileMenu.tsx

@@ -1,9 +1,8 @@
 import React from "react";
 import { AppState } from "../types";
 import { ActionManager } from "../actions/manager";
-import { t, setLanguage } from "../i18n";
+import { t } from "../i18n";
 import Stack from "./Stack";
-import { LanguageList } from "./LanguageList";
 import { showSelectedShapeActions } from "../element";
 import { NonDeletedExcalidrawElement } from "../element/types";
 import { FixedSideContainer } from "./FixedSideContainer";
@@ -15,7 +14,6 @@ import { Section } from "./Section";
 import CollabButton from "./CollabButton";
 import { SCROLLBAR_WIDTH, SCROLLBAR_MARGIN } from "../scene/scrollbars";
 import { LockIcon } from "./LockIcon";
-import { LoadingMessage } from "./LoadingMessage";
 import { UserList } from "./UserList";
 import { BackgroundPickerAndDarkModeToggle } from "./BackgroundPickerAndDarkModeToggle";
 import { EVENT_ACTION, trackEvent } from "../analytics";
@@ -31,6 +29,7 @@ type MobileMenuProps = {
   onLockToggle: () => void;
   canvas: HTMLCanvasElement | null;
   isCollaborating: boolean;
+  renderCustomFooter?: (isMobile: boolean) => JSX.Element;
 };
 
 export const MobileMenu = ({
@@ -44,9 +43,9 @@ export const MobileMenu = ({
   onLockToggle,
   canvas,
   isCollaborating,
+  renderCustomFooter,
 }: MobileMenuProps) => (
   <>
-    {appState.isLoading && <LoadingMessage />}
     <FixedSideContainer side="top">
       <Section heading="shapes">
         {(heading) => (
@@ -104,15 +103,7 @@ export const MobileMenu = ({
                   appState={appState}
                   setAppState={setAppState}
                 />
-                <fieldset>
+                {renderCustomFooter?.(true)}
-                  <legend>{t("labels.language")}</legend>
-                  <LanguageList
-                    onChange={async (lng) => {
-                      await setLanguage(lng);
-                      setAppState({});
-                    }}
-                  />
-                </fieldset>
                 <fieldset>
                   <legend>{t("labels.collaborators")}</legend>
                   <UserList mobile>

src/components/Modal.scss

@@ -30,18 +30,26 @@
     z-index: 2;
     width: 100%;
     max-width: var(--max-width);
+    max-height: 100%;
 
     opacity: 0;
     transform: translateY(10px);
     animation: Modal__content_fade-in 0.1s ease-out 0.05s forwards;
     position: relative;
+    overflow-y: auto;
 
     // for modals, reset blurry bg
     background: var(--bg-color-island);
     backdrop-filter: none;
 
-    @media #{$media-query} {
+    border: 1px solid var(--dialog-border);
+    box-shadow: 0 2px 10px transparentize($oc-black, 0.75);
+    border-radius: 6px;
+
+    @media #{$is-mobile-query} {
       max-width: 100%;
+      border: 0;
+      border-radius: 0;
     }
   }
 
@@ -68,13 +76,7 @@
     }
   }
 
-  .Modal__close--floating {
+  @media #{$is-mobile-query} {
-    position: absolute;
-    right: calc(var(--space-factor) * 5);
-    top: calc(var(--space-factor) * 5);
-  }
-
-  @media #{$media-query} {
     .Modal {
       padding: 0;
     }

src/components/Modal.tsx

@@ -36,11 +36,7 @@ export const Modal = (props: {
       <div className="Modal__background" onClick={props.onCloseRequest}></div>
       <div
         className="Modal__content"
-        style={{
+        style={{ "--max-width": `${props.maxWidth}px` }}
-          "--max-width": `${props.maxWidth}px`,
-          maxHeight: "100%",
-          overflowY: "scroll",
-        }}
       >
         {props.children}
       </div>

src/components/PasteChartDialog.scss

@@ -0,0 +1,46 @@
+@import "../css/_variables";
+
+.excalidraw {
+  .PasteChartDialog {
+    @media #{$is-mobile-query} {
+      .Island {
+        display: flex;
+        flex-direction: column;
+      }
+    }
+    .container {
+      display: flex;
+      align-items: center;
+      justify-content: space-around;
+      flex-wrap: wrap;
+      @media #{$is-mobile-query} {
+        flex-direction: column;
+        justify-content: center;
+      }
+    }
+    .ChartPreview {
+      margin: 8px;
+      text-align: center;
+      width: 192px;
+      height: 128px;
+      border-radius: 2px;
+      padding: 1px;
+      border: 1px solid $oc-gray-4;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: transparent;
+      div {
+        display: inline-block;
+      }
+      svg {
+        max-height: 120px;
+        max-width: 186px;
+      }
+      &:hover {
+        padding: 0;
+        border: 2px solid $oc-blue-5;
+      }
+    }
+  }
+}

src/components/PasteChartDialog.tsx

@@ -0,0 +1,122 @@
+import oc from "open-color";
+import React, { useLayoutEffect, useRef, useState } from "react";
+import { ChartElements, renderSpreadsheet, Spreadsheet } from "../charts";
+import { ChartType } from "../element/types";
+import { t } from "../i18n";
+import { exportToSvg } from "../scene/export";
+import { AppState, LibraryItem } from "../types";
+import { Dialog } from "./Dialog";
+import "./PasteChartDialog.scss";
+
+type OnInsertChart = (chartType: ChartType, elements: ChartElements) => void;
+
+const ChartPreviewBtn = (props: {
+  spreadsheet: Spreadsheet | null;
+  chartType: ChartType;
+  selected: boolean;
+  onClick: OnInsertChart;
+}) => {
+  const previewRef = useRef<HTMLDivElement | null>(null);
+  const [chartElements, setChartElements] = useState<ChartElements | null>(
+    null,
+  );
+
+  useLayoutEffect(() => {
+    if (!props.spreadsheet) {
+      return;
+    }
+
+    const elements = renderSpreadsheet(
+      props.chartType,
+      props.spreadsheet,
+      0,
+      0,
+    );
+    setChartElements(elements);
+
+    const svg = exportToSvg(elements, {
+      exportBackground: false,
+      viewBackgroundColor: oc.white,
+      shouldAddWatermark: false,
+    });
+
+    const previewNode = previewRef.current!;
+
+    previewNode.appendChild(svg);
+
+    if (props.selected) {
+      (previewNode.parentNode as HTMLDivElement).focus();
+    }
+
+    return () => {
+      previewNode.removeChild(svg);
+    };
+  }, [props.spreadsheet, props.chartType, props.selected]);
+
+  return (
+    <button
+      className="ChartPreview"
+      onClick={() => {
+        if (chartElements) {
+          props.onClick(props.chartType, chartElements);
+        }
+      }}
+    >
+      <div ref={previewRef} />
+    </button>
+  );
+};
+
+export const PasteChartDialog = ({
+  setAppState,
+  appState,
+  onClose,
+  onInsertChart,
+}: {
+  appState: AppState;
+  onClose: () => void;
+  setAppState: React.Component<any, AppState>["setState"];
+  onInsertChart: (elements: LibraryItem) => void;
+}) => {
+  const handleClose = React.useCallback(() => {
+    if (onClose) {
+      onClose();
+    }
+  }, [onClose]);
+
+  const handleChartClick = (chartType: ChartType, elements: ChartElements) => {
+    onInsertChart(elements);
+    setAppState({
+      currentChartType: chartType,
+      pasteDialog: {
+        shown: false,
+        data: null,
+      },
+    });
+  };
+
+  return (
+    <Dialog
+      small
+      onCloseRequest={handleClose}
+      title={t("labels.pasteCharts")}
+      className={"PasteChartDialog"}
+      autofocus={false}
+    >
+      <div className={"container"}>
+        <ChartPreviewBtn
+          chartType="bar"
+          spreadsheet={appState.pasteDialog.data}
+          selected={appState.currentChartType === "bar"}
+          onClick={handleChartClick}
+        />
+        <ChartPreviewBtn
+          chartType="line"
+          spreadsheet={appState.pasteDialog.data}
+          selected={appState.currentChartType === "line"}
+          onClick={handleChartClick}
+        />
+      </div>
+    </Dialog>
+  );
+};

src/components/ShortcutsDialog.tsx

@@ -130,11 +130,7 @@ export const ShortcutsDialog = ({ onClose }: { onClose?: () => void }) => {
 
   return (
     <>
-      <Dialog
+      <Dialog onCloseRequest={handleClose} title={t("shortcutsDialog.title")}>
-        maxWidth={900}
-        onCloseRequest={handleClose}
-        title={t("shortcutsDialog.title")}
-      >
         <Columns>
           <Column>
             <ShortcutIsland caption={t("shortcutsDialog.shapes")}>
@@ -207,15 +203,16 @@ export const ShortcutsDialog = ({ onClose }: { onClose?: () => void }) => {
                 shortcuts={["Shift+1"]}
               />
               <Shortcut
-                label={t("buttons.toggleFullScreen")}
+                label={t("shortcutsDialog.zoomToSelection")}
-                shortcuts={["F"]}
+                shortcuts={["Shift+2"]}
               />
+              <Shortcut label={t("buttons.fullScreen")} shortcuts={["F"]} />
               <Shortcut
-                label={t("buttons.toggleZenMode")}
+                label={t("buttons.zenMode")}
                 shortcuts={[getShortcutKey("Alt+Z")]}
               />
               <Shortcut
-                label={t("labels.toggleGridMode")}
+                label={t("labels.gridMode")}
                 shortcuts={[getShortcutKey("CtrlOrCmd+'")]}
               />
             </ShortcutIsland>

src/components/Stats.scss

@@ -6,8 +6,10 @@
   right: 12px;
   font-size: 12px;
   z-index: 999;
+
   h3 {
     margin: 0 24px 8px 0;
+    white-space: nowrap;
   }
 
   .close {
@@ -29,9 +31,21 @@
     }
     tr {
       td:nth-child(2) {
-        min-width: 48px;
+        min-width: 24px;
         text-align: right;
       }
     }
   }
+
+  :root[dir="rtl"] & {
+    left: 12px;
+    right: initial;
+
+    h3 {
+      margin: 0 0 8px 24px;
+    }
+    .close {
+      float: left;
+    }
+  }
 }

src/components/Stats.tsx

@@ -85,7 +85,6 @@ export const Stats = (props: {
               <td>{t("stats.total")}</td>
               <td>{nFormatter(storageSizes.total, 1)}</td>
             </tr>
-
             {selectedElements.length === 1 && (
               <tr>
                 <th colSpan={2}>{t("stats.element")}</th>

src/components/ToolIcon.scss

@@ -1,4 +1,6 @@
 @import "open-color/open-color.scss";
+@import "../css/variables";
+
 .excalidraw {
   .ToolIcon {
     display: inline-flex;
@@ -140,6 +142,7 @@
     user-select: none;
   }
 
+  // shrink shape icons on small viewports to make them fit
   @media (max-width: 425px) {
     .Shape .ToolIcon__icon {
       width: 2rem;
@@ -151,6 +154,8 @@
     }
   }
 
+  // move the lock button out of the way on small viewports
+  // it begins to collide with the GitHub icon before we switch to mobile mode
   @media (max-width: 760px) {
     .ToolIcon.ToolIcon__lock {
       display: inline-block;
@@ -160,6 +165,7 @@
 
       margin-left: 0;
       border-radius: 20px 0 0 20px;
+      z-index: 1;
 
       background-color: var(--button-gray-1);
 
@@ -181,6 +187,17 @@
     }
   }
 
+  .TooltipIcon {
+    width: 0.9em;
+    height: 0.9em;
+    margin-left: 5px;
+    margin-top: 1px;
+
+    @media #{$is-mobile-query} {
+      display: none;
+    }
+  }
+
   .unlocked-icon {
     :root[dir="ltr"] & {
       left: 2px;

src/components/Tooltip.scss

@@ -7,39 +7,56 @@
   .Tooltip__label {
     --arrow-size: 4px;
     visibility: hidden;
-    width: 10ch;
     background: $oc-black;
     color: $oc-white;
     text-align: center;
-    border-radius: 4px;
+    border-radius: 6px;
-    padding: 4px;
+    padding: 8px;
     position: absolute;
     z-index: 10;
-    font-size: 0.7rem;
+    font-size: 13px;
     line-height: 1.5;
-    top: calc(100% + var(--arrow-size) + 3px);
+    font-weight: 500;
     // extra pixel offset for unknown reasons
-    left: calc(-50% + var(--arrow-size) / 2 - 1px);
+    left: calc(50% + var(--arrow-size) / 2 - 1px);
+    transform: translateX(-50%);
     word-wrap: break-word;
 
     &::after {
       content: "";
       border: var(--arrow-size) solid transparent;
-      border-bottom-color: $oc-black;
       position: absolute;
-      bottom: 100%;
       left: calc(50% - var(--arrow-size));
     }
+
+    &--above {
+      bottom: calc(100% + var(--arrow-size) + 3px);
+
+      &::after {
+        border-top-color: $oc-black;
+        top: 100%;
+      }
+    }
+
+    &--below {
+      top: calc(100% + var(--arrow-size) + 3px);
+
+      &::after {
+        border-bottom-color: $oc-black;
+        bottom: 100%;
+      }
+    }
   }
 
   // the following 3 rules ensure that the tooltip doesn't show (nor affect
   // the cursor) when you drag over when you draw on canvas, but at the same
   // time it still works when clicking on the link/shield
-  body:active .Tooltip:not(:hover) {
+
+  body:active & .Tooltip:not(:hover) {
     pointer-events: none;
   }
 
-  body:not(:active) .Tooltip:hover .Tooltip__label {
+  body:not(:active) & .Tooltip:hover .Tooltip__label {
     visibility: visible;
   }
 

src/components/Tooltip.tsx

@@ -5,11 +5,27 @@ import React from "react";
 type TooltipProps = {
   children: React.ReactNode;
   label: string;
+  position?: "above" | "below";
+  long?: boolean;
 };
 
-export const Tooltip = ({ children, label }: TooltipProps) => (
+export const Tooltip = ({
+  children,
+  label,
+  position = "below",
+  long = false,
+}: TooltipProps) => (
   <div className="Tooltip">
-    <span className="Tooltip__label">{label}</span>
+    <span
+      className={
+        position === "above"
+          ? "Tooltip__label Tooltip__label--above"
+          : "Tooltip__label Tooltip__label--below"
+      }
+      style={{ width: long ? "50ch" : "10ch" }}
+    >
+      {label}
+    </span>
     {children}
   </div>
 );

src/components/icons.tsx

@@ -108,6 +108,11 @@ export const redo = createIcon(
   { mirror: true },
 );
 
+export const questionCircle = createIcon(
+  "M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zM262.655 90c-54.497 0-89.255 22.957-116.549 63.758-3.536 5.286-2.353 12.415 2.715 16.258l34.699 26.31c5.205 3.947 12.621 3.008 16.665-2.122 17.864-22.658 30.113-35.797 57.303-35.797 20.429 0 45.698 13.148 45.698 32.958 0 14.976-12.363 22.667-32.534 33.976C247.128 238.528 216 254.941 216 296v4c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12v-1.333c0-28.462 83.186-29.647 83.186-106.667 0-58.002-60.165-102-116.531-102zM256 338c-25.365 0-46 20.635-46 46 0 25.364 20.635 46 46 46s46-20.636 46-46c0-25.365-20.635-46-46-46z",
+  { mirror: true },
+);
+
 // Icon imported form Storybook
 // Storybook is licensed under MIT https://github.com/storybookjs/storybook/blob/next/LICENSE
 export const resetZoom = createIcon(

src/constants.ts

@@ -1,5 +1,7 @@
 import { FontFamily } from "./element/types";
 
+export const APP_NAME = "Excalidraw";
+
 export const DRAGGING_THRESHOLD = 10; // 10px
 export const LINE_CONFIRM_THRESHOLD = 10; // 10px
 export const ELEMENT_SHIFT_TRANSLATE_AMOUNT = 5;
@@ -85,3 +87,6 @@ export const STORAGE_KEYS = {
 // time in milliseconds
 export const TAP_TWICE_TIMEOUT = 300;
 export const TOUCH_CTX_MENU_TIMEOUT = 500;
+export const TITLE_TIMEOUT = 10000;
+
+export const SCENE_NAME_FALLBACK = "Untitled";

src/css/_variables.scss

@@ -1,3 +1,4 @@
 @import "open-color/open-color.scss";
 
-$media-query: "(max-width: 600px), (max-height: 500px) and (max-width: 1000px)";
+// keep up to date with is-mobile.tsx
+$is-mobile-query: "(max-width: 600px), (max-height: 500px) and (max-width: 1000px)";

src/css/styles.scss

@@ -441,7 +441,7 @@
     }
   }
 
-  @media #{$media-query} {
+  @media #{$is-mobile-query} {
     aside {
       display: none;
     }

src/css/theme.scss

@@ -3,7 +3,6 @@
 :root {
   --bg-color-island: rgba(255, 255, 255, 0.9);
   --popup-background-color: #{$oc-white};
-  --border-radius-m: 4px;
   --space-factor: 0.25rem;
   --button-gray-1: #{$oc-gray-2};
   --button-gray-2: #{$oc-gray-4};
@@ -15,7 +14,6 @@
   --icon-fill-color: #{$oc-black};
   --icon-green-fill-color: #{$oc-green-9};
   --keybinding-color: #{$oc-gray-5};
-  --color-overlay-text-color: #ccc;
   --sat: env(safe-area-inset-top);
   --sab: env(safe-area-inset-bottom);
   --sal: env(safe-area-inset-left);
@@ -23,8 +21,6 @@
   --text-color-primary: #{$oc-gray-8};
   --shadow-island: 0 1px 5px #{transparentize($oc-black, 0.85)};
   --overlay-background-color: #{transparentize($oc-white, 0.12)};
-  --border-radius-m: 4px;
-  --space-factor: 0.25rem;
   --dropdown-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4" viewBox="0 0 292 292"><path d="M287 197L159 69c-4-3-8-5-13-5s-9 2-13 5L5 197c-3 4-5 8-5 13s2 9 5 13c4 4 8 5 13 5h256c5 0 9-1 13-5s5-8 5-13-1-9-5-13z"/></svg>');
   --focus-highlight-color: #{$oc-blue-2};
   --select-highlight-color: #{$oc-blue-5};
@@ -35,6 +31,7 @@
   --popup-secondary-background-color: #{$oc-gray-1};
   --popup-text-color: #{$oc-black};
   --popup-text-inverted-color: #{$oc-white};
+  --dialog-border: #{$oc-gray-6};
 }
 
 .excalidraw {
@@ -60,10 +57,8 @@
     --icon-fill-color: #{$oc-gray-4};
     --icon-green-fill-color: #{$oc-green-4};
     --keybinding-color: #{$oc-gray-6};
-    --color-overlay-text-color: #bbb;
     --shadow-island: 0 1px 5px #{transparentize($oc-black, 0.7)};
     --overlay-background-color: rgba(30, 30, 30, 0.88);
-    // #{$oc-gray-4}; inlined
     --dropdown-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4" viewBox="0 0 292 292"><path fill="%23ced4da" d="M287 197L159 69c-4-3-8-5-13-5s-9 2-13 5L5 197c-3 4-5 8-5 13s2 9 5 13c4 4 8 5 13 5h256c5 0 9-1 13-5s5-8 5-13-1-9-5-13z"/></svg>');
     --focus-highlight-color: #{$oc-blue-6};
     --select-highlight-color: #{$oc-blue-4};
@@ -74,5 +69,6 @@
     --popup-secondary-background-color: #222;
     --popup-text-color: #{$oc-gray-4};
     --popup-text-inverted-color: #2c2c2c;
+    --dialog-border: #{$oc-gray-9};
   }
 }

src/data/blob.ts

@@ -9,7 +9,7 @@ import { AppState } from "../types";
 import { restore } from "./restore";
 import { ImportedDataState, LibraryData } from "./types";
 
-export const parseFileContents = async (blob: Blob | File) => {
+const parseFileContents = async (blob: Blob | File) => {
   let contents: string;
 
   if (blob.type === "image/png") {

src/data/index.ts

@@ -1,14 +1,10 @@
 import { fileSave } from "browser-nativefs";
 import { EVENT_IO, trackEvent } from "../analytics";
-import { getDefaultAppState } from "../appState";
 import {
   copyCanvasToClipboardAsPng,
   copyTextToSystemClipboard,
 } from "../clipboard";
-import {
+import { NonDeletedExcalidrawElement } from "../element/types";
-  ExcalidrawElement,
-  NonDeletedExcalidrawElement,
-} from "../element/types";
 import { t } from "../i18n";
 import { exportToCanvas, exportToSvg } from "../scene/export";
 import { ExportType } from "../scene/types";
@@ -19,65 +15,6 @@ import { serializeAsJSON } from "./json";
 export { loadFromBlob } from "./blob";
 export { loadFromJSON, saveAsJSON } from "./json";
 
-const BACKEND_V2_POST = process.env.REACT_APP_BACKEND_V2_POST_URL;
-
-export const exportToBackend = async (
-  elements: readonly ExcalidrawElement[],
-  appState: AppState,
-) => {
-  const json = serializeAsJSON(elements, appState);
-  const encoded = new TextEncoder().encode(json);
-
-  const key = await window.crypto.subtle.generateKey(
-    {
-      name: "AES-GCM",
-      length: 128,
-    },
-    true, // extractable
-    ["encrypt", "decrypt"],
-  );
-  // The iv is set to 0. We are never going to reuse the same key so we don't
-  // need to have an iv. (I hope that's correct...)
-  const iv = new Uint8Array(12);
-  // We use symmetric encryption. AES-GCM is the recommended algorithm and
-  // includes checks that the ciphertext has not been modified by an attacker.
-  const encrypted = await window.crypto.subtle.encrypt(
-    {
-      name: "AES-GCM",
-      iv,
-    },
-    key,
-    encoded,
-  );
-  // We use jwk encoding to be able to extract just the base64 encoded key.
-  // We will hardcode the rest of the attributes when importing back the key.
-  const exportedKey = await window.crypto.subtle.exportKey("jwk", key);
-
-  try {
-    const response = await fetch(BACKEND_V2_POST, {
-      method: "POST",
-      body: encrypted,
-    });
-    const json = await response.json();
-    if (json.id) {
-      const url = new URL(window.location.href);
-      // We need to store the key (and less importantly the id) as hash instead
-      // of queryParam in order to never send it to the server
-      url.hash = `json=${json.id},${exportedKey.k!}`;
-      const urlString = url.toString();
-      window.prompt(`🔒${t("alerts.uploadedSecurly")}`, urlString);
-      trackEvent(EVENT_IO, "export", "backend");
-    } else if (json.error_class === "RequestTooLargeError") {
-      window.alert(t("alerts.couldNotCreateShareableLinkTooBig"));
-    } else {
-      window.alert(t("alerts.couldNotCreateShareableLink"));
-    }
-  } catch (error) {
-    console.error(error);
-    window.alert(t("alerts.couldNotCreateShareableLink"));
-  }
-};
-
 export const exportCanvas = async (
   type: ExportType,
   elements: readonly NonDeletedExcalidrawElement[],
@@ -169,13 +106,6 @@ export const exportCanvas = async (
       }
       throw new Error(t("alerts.couldNotCopyToClipboard"));
     }
-  } else if (type === "backend") {
-    exportToBackend(elements, {
-      ...appState,
-      viewBackgroundColor: exportBackground
-        ? appState.viewBackgroundColor
-        : getDefaultAppState().viewBackgroundColor,
-    });
   }
 
   // clean up the DOM

src/data/restore.ts

@@ -15,6 +15,7 @@ import {
   DEFAULT_VERTICAL_ALIGN,
 } from "../constants";
 import { getDefaultAppState } from "../appState";
+import { getNewSceneName } from "../utils";
 
 const getFontFamilyByName = (fontFamilyName: string): FontFamily => {
   for (const [id, fontFamilyString] of Object.entries(FONT_FAMILY)) {
@@ -166,6 +167,7 @@ const restoreAppState = (
 
   return {
     ...nextAppState,
+    name: appState.name ?? localAppState?.name ?? getNewSceneName(),
     offsetLeft: appState.offsetLeft || 0,
     offsetTop: appState.offsetTop || 0,
     // Migrates from previous version where appState.zoom was a number

src/element/mutateElement.ts

@@ -24,13 +24,13 @@ export const mutateElement = <TElement extends Mutable<ExcalidrawElement>>(
   // (see https://github.com/microsoft/TypeScript/issues/21732)
   const { points } = updates as any;
 
-  if (points !== undefined) {
+  if (typeof points !== "undefined") {
     updates = { ...getSizeFromPoints(points), ...updates };
   }
 
   for (const key in updates) {
     const value = (updates as any)[key];
-    if (value !== undefined) {
+    if (typeof value !== "undefined") {
       if (
         (element as any)[key] === value &&
         // if object, always update in case its deep prop was mutated
@@ -72,9 +72,9 @@ export const mutateElement = <TElement extends Mutable<ExcalidrawElement>>(
   }
 
   if (
-    updates.height !== undefined ||
+    typeof updates.height !== "undefined" ||
-    updates.width !== undefined ||
+    typeof updates.width !== "undefined" ||
-    points !== undefined
+    typeof points !== "undefined"
   ) {
     invalidateShapeForElement(element);
   }
@@ -84,12 +84,9 @@ export const mutateElement = <TElement extends Mutable<ExcalidrawElement>>(
   Scene.getScene(element)?.informMutation();
 };
 
-export const newElementWith = <
+export const newElementWith = <TElement extends ExcalidrawElement>(
-  TElement extends ExcalidrawElement,
-  K extends keyof Omit<TElement, "id" | "version" | "versionNonce">
->(
   element: TElement,
-  updates: Pick<TElement, K>,
+  updates: ElementUpdate<TElement>,
 ): TElement => ({
   ...element,
   ...updates,

src/element/types.ts

@@ -1,6 +1,7 @@
 import { Point } from "../types";
 import { FONT_FAMILY } from "../constants";
 
+export type ChartType = "bar" | "line";
 export type FillStyle = "hachure" | "cross-hatch" | "solid";
 export type FontFamily = keyof typeof FONT_FAMILY;
 export type FontString = string & { _brand: "fontString" };
@@ -21,16 +22,26 @@ type _ExcalidrawElementBase = Readonly<{
   strokeWidth: number;
   strokeStyle: StrokeStyle;
   strokeSharpness: StrokeSharpness;
-  roughness: 0 | 1 | 2;
+  roughness: number;
   opacity: number;
   width: number;
   height: number;
   angle: number;
+  /** Random integer used to seed shape generation so that the roughjs shape
+      doesn't differ across renders. */
   seed: number;
+  /** Integer that is sequentially incremented on each change. Used to reconcile
+      elements during collaboration or when saving to server. */
   version: number;
+  /** Random integer that is regenerated on each change.
+      Used for deterministic reconciliation of updates during collaboration,
+      in case the versions (see above) are identical. */
   versionNonce: number;
   isDeleted: boolean;
+  /** List of groups the element belongs to.
+      Ordered from deepest to shallowest. */
   groupIds: readonly GroupId[];
+  /** Ids of (linear) elements that are bound to this element. */
   boundElementIds: readonly ExcalidrawLinearElement["id"][] | null;
 }>;
 
@@ -110,16 +121,3 @@ export type ExcalidrawLinearElement = _ExcalidrawElementBase &
     startArrowhead: Arrowhead | null;
     endArrowhead: Arrowhead | null;
   }>;
-
-export type ExcalidrawElementTypes = Pick<ExcalidrawElement, "type">["type"];
-
-/** @private */
-type __ExcalidrawElementPossibleProps_withoutType<T> = T extends any
-  ? { [K in keyof Omit<T, "type">]: T[K] }
-  : never;
-
-/** Do not use for anything unless you really need it for some abstract
-    API types */
-export type ExcalidrawElementPossibleProps = UnionToIntersection<
-  __ExcalidrawElementPossibleProps_withoutType<ExcalidrawElement>
-> & { type: ExcalidrawElementTypes };

src/excalidraw-app/collab/CollabWrapper.tsx

@@ -1,7 +1,7 @@
 import React, { PureComponent } from "react";
 import throttle from "lodash.throttle";
 
-import { ENV, EVENT } from "../../constants";
+import { APP_NAME, ENV, EVENT } from "../../constants";
 
 import {
   decryptAESGEM,
@@ -157,11 +157,7 @@ class CollabWrapper extends PureComponent<Props, CollabState> {
   };
 
   openPortal = async () => {
-    window.history.pushState(
+    window.history.pushState({}, APP_NAME, await generateCollaborationLink());
-      {},
-      "Excalidraw",
-      await generateCollaborationLink(),
-    );
     const elements = this.excalidrawRef.current!.getSceneElements();
     // remove deleted elements from elements array & history to ensure we don't
     // expose potentially sensitive user data in case user manually deletes
@@ -178,7 +174,7 @@ class CollabWrapper extends PureComponent<Props, CollabState> {
 
   closePortal = () => {
     this.saveCollabRoomToFirebase();
-    window.history.pushState({}, "Excalidraw", window.location.origin);
+    window.history.pushState({}, APP_NAME, window.location.origin);
     this.destroySocketClient();
     trackEvent(EVENT_SHARE, "session end");
   };

src/excalidraw-app/collab/RoomDialog.tsx

@@ -123,11 +123,7 @@ const RoomDialog = ({
     );
   };
   return (
-    <Dialog
+    <Dialog small onCloseRequest={handleClose} title={t("labels.createRoom")}>
-      maxWidth={800}
-      onCloseRequest={handleClose}
-      title={t("labels.createRoom")}
-    >
       {renderRoomDialog()}
     </Dialog>
   );

src/excalidraw-app/components/LanguageList.tsx

@@ -1,16 +1,16 @@
 import React from "react";
 import clsx from "clsx";
-import * as i18n from "../i18n";
+import * as i18n from "../../i18n";
 
 export const LanguageList = ({
   onChange,
   languages = i18n.languages,
-  currentLanguage = i18n.getLanguage().lng,
+  currentLangCode = i18n.getLanguage().code,
   floating,
 }: {
-  languages?: { lng: string; label: string }[];
+  languages?: { code: string; label: string }[];
-  onChange: (value: string) => void;
+  onChange: (langCode: i18n.Language["code"]) => void;
-  currentLanguage?: string;
+  currentLangCode?: i18n.Language["code"];
   floating?: boolean;
 }) => (
   <React.Fragment>
@@ -19,12 +19,12 @@ export const LanguageList = ({
         "dropdown-select--floating": floating,
       })}
       onChange={({ target }) => onChange(target.value)}
-      value={currentLanguage}
+      value={currentLangCode}
       aria-label={i18n.t("buttons.selectLanguage")}
     >
-      {languages.map((language) => (
+      {languages.map((lang) => (
-        <option key={language.lng} value={language.lng}>
+        <option key={lang.code} value={lang.code}>
-          {language.label}
+          {lang.label}
         </option>
       ))}
     </select>

src/excalidraw-app/data/index.ts

@@ -3,12 +3,14 @@ import { ExcalidrawElement } from "../../element/types";
 import { AppState } from "../../types";
 import { ImportedDataState } from "../../data/types";
 import { restore } from "../../data/restore";
-import { EVENT_ACTION, trackEvent } from "../../analytics";
+import { EVENT_ACTION, EVENT_IO, trackEvent } from "../../analytics";
+import { serializeAsJSON } from "../../data/json";
 
 const byteToHex = (byte: number): string => `0${byte.toString(16)}`.slice(-2);
 
 const BACKEND_GET = process.env.REACT_APP_BACKEND_V1_GET_URL;
 const BACKEND_V2_GET = process.env.REACT_APP_BACKEND_V2_GET_URL;
+const BACKEND_V2_POST = process.env.REACT_APP_BACKEND_V2_POST_URL;
 
 const generateRandomID = async () => {
   const arr = new Uint8Array(10);
@@ -228,3 +230,60 @@ export const loadScene = async (
     commitToHistory: false,
   };
 };
+
+export const exportToBackend = async (
+  elements: readonly ExcalidrawElement[],
+  appState: AppState,
+) => {
+  const json = serializeAsJSON(elements, appState);
+  const encoded = new TextEncoder().encode(json);
+
+  const key = await window.crypto.subtle.generateKey(
+    {
+      name: "AES-GCM",
+      length: 128,
+    },
+    true, // extractable
+    ["encrypt", "decrypt"],
+  );
+  // The iv is set to 0. We are never going to reuse the same key so we don't
+  // need to have an iv. (I hope that's correct...)
+  const iv = new Uint8Array(12);
+  // We use symmetric encryption. AES-GCM is the recommended algorithm and
+  // includes checks that the ciphertext has not been modified by an attacker.
+  const encrypted = await window.crypto.subtle.encrypt(
+    {
+      name: "AES-GCM",
+      iv,
+    },
+    key,
+    encoded,
+  );
+  // We use jwk encoding to be able to extract just the base64 encoded key.
+  // We will hardcode the rest of the attributes when importing back the key.
+  const exportedKey = await window.crypto.subtle.exportKey("jwk", key);
+
+  try {
+    const response = await fetch(BACKEND_V2_POST, {
+      method: "POST",
+      body: encrypted,
+    });
+    const json = await response.json();
+    if (json.id) {
+      const url = new URL(window.location.href);
+      // We need to store the key (and less importantly the id) as hash instead
+      // of queryParam in order to never send it to the server
+      url.hash = `json=${json.id},${exportedKey.k!}`;
+      const urlString = url.toString();
+      window.prompt(`🔒${t("alerts.uploadedSecurly")}`, urlString);
+      trackEvent(EVENT_IO, "export", "backend");
+    } else if (json.error_class === "RequestTooLargeError") {
+      window.alert(t("alerts.couldNotCreateShareableLinkTooBig"));
+    } else {
+      window.alert(t("alerts.couldNotCreateShareableLink"));
+    }
+  } catch (error) {
+    console.error(error);
+    window.alert(t("alerts.couldNotCreateShareableLink"));
+  }
+};

src/excalidraw-app/data/localStorage.ts

@@ -6,6 +6,7 @@ import {
 } from "../../appState";
 import { clearElementsForLocalStorage } from "../../element";
 import { STORAGE_KEYS as APP_STORAGE_KEYS } from "../../constants";
+import { ImportedDataState } from "../../data/types";
 
 export const STORAGE_KEYS = {
   LOCAL_STORAGE_ELEMENTS: "excalidraw",
@@ -81,7 +82,7 @@ export const importFromLocalStorage = () => {
     }
   }
 
-  let appState = null;
+  let appState: ImportedDataState["appState"] = null;
   if (savedState) {
     try {
       appState = {

src/excalidraw-app/index.tsx

@@ -1,6 +1,16 @@
-import React, { useState, useLayoutEffect, useEffect, useRef } from "react";
+import React, {
+  useState,
+  useLayoutEffect,
+  useEffect,
+  useRef,
+  useCallback,
+} from "react";
+import LanguageDetector from "i18next-browser-languagedetector";
 
-import Excalidraw from "../packages/excalidraw/index";
+import Excalidraw, {
+  languages,
+  defaultLang,
+} from "../packages/excalidraw/index";
 
 import {
   getTotalStorageSize,
@@ -12,17 +22,33 @@ import {
 import { ImportedDataState } from "../data/types";
 import CollabWrapper, { CollabAPI } from "./collab/CollabWrapper";
 import { TopErrorBoundary } from "../components/TopErrorBoundary";
-import { t } from "../i18n";
+import { Language, t } from "../i18n";
-import { loadScene } from "./data";
+import { exportToBackend, loadScene } from "./data";
 import { getCollaborationLinkData } from "./data";
 import { EVENT } from "../constants";
 import { loadFromFirebase } from "./data/firebase";
 import { ExcalidrawImperativeAPI } from "../components/App";
 import { debounce, ResolvablePromise, resolvablePromise } from "../utils";
 import { AppState, ExcalidrawAPIRefValue } from "../types";
-import { ExcalidrawElement } from "../element/types";
+import {
+  ExcalidrawElement,
+  NonDeletedExcalidrawElement,
+} from "../element/types";
 import { SAVE_TO_LOCAL_STORAGE_TIMEOUT } from "./app_constants";
 import { EVENT_LOAD, EVENT_SHARE, trackEvent } from "../analytics";
+import { ErrorDialog } from "../components/ErrorDialog";
+import { getDefaultAppState } from "../appState";
+import { APP_NAME, TITLE_TIMEOUT } from "../constants";
+import { LanguageList } from "./components/LanguageList";
+
+const languageDetector = new LanguageDetector();
+languageDetector.init({
+  languageUtils: {
+    formatLanguageCode: (langCode: Language["code"]) => langCode,
+    isWhitelisted: () => true,
+  },
+  checkWhitelist: false,
+});
 
 const excalidrawRef: React.MutableRefObject<
   MarkRequired<ExcalidrawAPIRefValue, "ready" | "readyPromise">
@@ -87,7 +113,6 @@ type Scene = ImportedDataState & { commitToHistory: boolean };
 const initializeScene = async (opts: {
   resetScene: ExcalidrawImperativeAPI["resetScene"];
   initializeSocketClient: CollabAPI["initializeSocketClient"];
-  onLateInitialization?: (scene: Scene) => void;
 }): Promise<Scene | null> => {
   const searchParams = new URLSearchParams(window.location.search);
   const id = searchParams.get("id");
@@ -113,26 +138,24 @@ const initializeScene = async (opts: {
         scene = await loadScene(jsonMatch[1], jsonMatch[2], initialData);
       }
       if (!isCollabScene) {
-        window.history.replaceState({}, "Excalidraw", window.location.origin);
+        window.history.replaceState({}, APP_NAME, window.location.origin);
       }
     } else {
       // https://github.com/excalidraw/excalidraw/issues/1919
       if (document.hidden) {
-        window.addEventListener(
+        return new Promise((resolve, reject) => {
-          "focus",
+          window.addEventListener(
-          () =>
+            "focus",
-            initializeScene(opts).then((_scene) => {
+            () => initializeScene(opts).then(resolve).catch(reject),
-              opts?.onLateInitialization?.(_scene || scene);
+            {
-            }),
+              once: true,
-          {
+            },
-            once: true,
+          );
-          },
+        });
-        );
-        return null;
       }
 
       isCollabScene = false;
-      window.history.replaceState({}, "Excalidraw", window.location.origin);
+      window.history.replaceState({}, APP_NAME, window.location.origin);
     }
   }
   if (isCollabScene) {
@@ -178,6 +201,9 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) {
     width: window.innerWidth,
     height: window.innerHeight,
   });
+  const [errorMessage, setErrorMessage] = useState("");
+  const currentLangCode = languageDetector.detect() || defaultLang.code;
+  const [langCode, setLangCode] = useState(currentLangCode);
 
   useLayoutEffect(() => {
     const onResize = () => {
@@ -215,9 +241,6 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) {
       initializeScene({
         resetScene: excalidrawApi.resetScene,
         initializeSocketClient: collab.initializeSocketClient,
-        onLateInitialization: (scene) => {
-          initialStatePromiseRef.current.promise.resolve(scene);
-        },
       }).then((scene) => {
         initialStatePromiseRef.current.promise.resolve(scene);
       });
@@ -240,6 +263,10 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) {
       }
     };
 
+    const titleTimeout = setTimeout(
+      () => (document.title = APP_NAME),
+      TITLE_TIMEOUT,
+    );
     window.addEventListener(EVENT.HASHCHANGE, onHashChange, false);
     window.addEventListener(EVENT.UNLOAD, onBlur, false);
     window.addEventListener(EVENT.BLUR, onBlur, false);
@@ -247,9 +274,14 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) {
       window.removeEventListener(EVENT.HASHCHANGE, onHashChange, false);
       window.removeEventListener(EVENT.UNLOAD, onBlur, false);
       window.removeEventListener(EVENT.BLUR, onBlur, false);
+      clearTimeout(titleTimeout);
     };
   }, [collab.initializeSocketClient]);
 
+  useEffect(() => {
+    languageDetector.cacheUserLanguage(langCode);
+  }, [langCode]);
+
   const onChange = (
     elements: readonly ExcalidrawElement[],
     appState: AppState,
@@ -260,18 +292,80 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) {
     }
   };
 
+  const onExportToBackend = async (
+    exportedElements: readonly NonDeletedExcalidrawElement[],
+    appState: AppState,
+    canvas: HTMLCanvasElement | null,
+  ) => {
+    if (exportedElements.length === 0) {
+      return window.alert(t("alerts.cannotExportEmptyCanvas"));
+    }
+    if (canvas) {
+      try {
+        await exportToBackend(exportedElements, {
+          ...appState,
+          viewBackgroundColor: appState.exportBackground
+            ? appState.viewBackgroundColor
+            : getDefaultAppState().viewBackgroundColor,
+        });
+      } catch (error) {
+        if (error.name !== "AbortError") {
+          const { width, height } = canvas;
+          console.error(error, { width, height });
+          setErrorMessage(error.message);
+        }
+      }
+    }
+  };
+
+  const renderFooter = useCallback(
+    (isMobile: boolean) => {
+      const renderLanguageList = () => (
+        <LanguageList
+          onChange={(langCode) => {
+            setLangCode(langCode);
+          }}
+          languages={languages}
+          floating={!isMobile}
+          currentLangCode={langCode}
+        />
+      );
+      if (isMobile) {
+        return (
+          <fieldset>
+            <legend>{t("labels.language")}</legend>
+            {renderLanguageList()}
+          </fieldset>
+        );
+      }
+      return renderLanguageList();
+    },
+    [langCode],
+  );
+
   return (
-    <Excalidraw
+    <>
-      ref={excalidrawRef}
+      <Excalidraw
-      onChange={onChange}
+        ref={excalidrawRef}
-      width={dimensions.width}
+        onChange={onChange}
-      height={dimensions.height}
+        width={dimensions.width}
-      initialData={initialStatePromiseRef.current.promise}
+        height={dimensions.height}
-      user={{ name: collab.username }}
+        initialData={initialStatePromiseRef.current.promise}
-      onCollabButtonClick={collab.onCollabButtonClick}
+        user={{ name: collab.username }}
-      isCollaborating={collab.isCollaborating}
+        onCollabButtonClick={collab.onCollabButtonClick}
-      onPointerUpdate={collab.onPointerUpdate}
+        isCollaborating={collab.isCollaborating}
-    />
+        onPointerUpdate={collab.onPointerUpdate}
+        onExportToBackend={onExportToBackend}
+        renderFooter={renderFooter}
+        langCode={langCode}
+      />
+      {errorMessage && (
+        <ErrorDialog
+          message={errorMessage}
+          onClose={() => setErrorMessage("")}
+        />
+      )}
+    </>
   );
 }
 

src/global.d.ts

@@ -46,15 +46,6 @@ type MarkOptional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
 type MarkRequired<T, RK extends keyof T> = Exclude<T, RK> &
   Required<Pick<T, RK>>;
 
-type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (
-  x: infer R,
-) => any
-  ? R
-  : never;
-
-/** Assert K is a subset of T, and returns K */
-type AssertSubset<T, K extends T> = K;
-
 // PNG encoding/decoding
 // -----------------------------------------------------------------------------
 type TEXtChunk = { name: "tEXt"; data: Uint8Array };

src/i18n.ts

@@ -1,93 +1,85 @@
-import LanguageDetector from "i18next-browser-languagedetector";
 import { EVENT_CHANGE, trackEvent } from "./analytics";
 
-import fallbackLanguageData from "./locales/en.json";
+import fallbackLangData from "./locales/en.json";
 import percentages from "./locales/percentages.json";
 
-const COMPLETION_THRESHOLD_TO_EXCEED = 85;
+const COMPLETION_THRESHOLD = 85;
 
-interface Language {
+export interface Language {
-  lng: string;
+  code: string;
   label: string;
   rtl?: boolean;
 }
 
 const allLanguages: Language[] = [
-  { lng: "ar-SA", label: "العربية", rtl: true },
+  { code: "ar-SA", label: "العربية", rtl: true },
-  { lng: "bg-BG", label: "Български" },
+  { code: "bg-BG", label: "Български" },
-  { lng: "ca-ES", label: "Catalan" },
+  { code: "ca-ES", label: "Catalan" },
-  { lng: "de-DE", label: "Deutsch" },
+  { code: "de-DE", label: "Deutsch" },
-  { lng: "el-GR", label: "Ελληνικά" },
+  { code: "el-GR", label: "Ελληνικά" },
-  { lng: "es-ES", label: "Español" },
+  { code: "es-ES", label: "Español" },
-  { lng: "fa-IR", label: "فارسی", rtl: true },
+  { code: "fa-IR", label: "فارسی", rtl: true },
-  { lng: "fi-FI", label: "Suomi" },
+  { code: "fi-FI", label: "Suomi" },
-  { lng: "fr-FR", label: "Français" },
+  { code: "fr-FR", label: "Français" },
-  { lng: "he-IL", label: "עברית", rtl: true },
+  { code: "he-IL", label: "עברית", rtl: true },
-  { lng: "hi-IN", label: "हिन्दी" },
+  { code: "hi-IN", label: "हिन्दी" },
-  { lng: "hu-HU", label: "Magyar" },
+  { code: "hu-HU", label: "Magyar" },
-  { lng: "id-ID", label: "Bahasa Indonesia" },
+  { code: "id-ID", label: "Bahasa Indonesia" },
-  { lng: "it-IT", label: "Italiano" },
+  { code: "it-IT", label: "Italiano" },
-  { lng: "ja-JP", label: "日本語" },
+  { code: "ja-JP", label: "日本語" },
-  { lng: "ko-KR", label: "한국어" },
+  { code: "ko-KR", label: "한국어" },
-  { lng: "my-MM", label: "Burmese" },
+  { code: "my-MM", label: "Burmese" },
-  { lng: "nb-NO", label: "Norsk bokmål" },
+  { code: "nb-NO", label: "Norsk bokmål" },
-  { lng: "nl-NL", label: "Nederlands" },
+  { code: "nl-NL", label: "Nederlands" },
-  { lng: "nn-NO", label: "Norsk nynorsk" },
+  { code: "nn-NO", label: "Norsk nynorsk" },
-  { lng: "pl-PL", label: "Polski" },
+  { code: "pl-PL", label: "Polski" },
-  { lng: "pt-PT", label: "Português" },
+  { code: "pt-BR", label: "Português Brasileiro" },
-  { lng: "ro-RO", label: "Română" },
+  { code: "pt-PT", label: "Português" },
-  { lng: "ru-RU", label: "Русский" },
+  { code: "ro-RO", label: "Română" },
-  { lng: "sk-SK", label: "Slovenčina" },
+  { code: "ru-RU", label: "Русский" },
-  { lng: "sv-SE", label: "Svenska" },
+  { code: "sk-SK", label: "Slovenčina" },
-  { lng: "tr-TR", label: "Türkçe" },
+  { code: "sv-SE", label: "Svenska" },
-  { lng: "uk-UA", label: "Українська" },
+  { code: "tr-TR", label: "Türkçe" },
-  { lng: "zh-CN", label: "简体中文" },
+  { code: "uk-UA", label: "Українська" },
-  { lng: "zh-TW", label: "繁體中文" },
+  { code: "zh-CN", label: "简体中文" },
+  { code: "zh-TW", label: "繁體中文" },
 ];
 
-export const languages: Language[] = [{ lng: "en", label: "English" }]
+export const defaultLang = { code: "en", label: "English" };
+
+export const languages: Language[] = [defaultLang]
   .concat(
     allLanguages.sort((left, right) => (left.label > right.label ? 1 : -1)),
   )
   .filter(
     (lang) =>
-      (percentages as Record<string, number>)[lang.lng] >
+      (percentages as Record<string, number>)[lang.code] >=
-      COMPLETION_THRESHOLD_TO_EXCEED,
+      COMPLETION_THRESHOLD,
   );
 
-let currentLanguage = languages[0];
+let currentLang: Language = defaultLang;
-let currentLanguageData = {};
+let currentLangData = {};
-const fallbackLanguage = languages[0];
 
-export const setLanguage = async (newLng: string | undefined) => {
+export const setLanguage = async (lang: Language) => {
-  currentLanguage =
+  currentLang = lang;
-    languages.find((language) => language.lng === newLng) || fallbackLanguage;
+  document.documentElement.dir = currentLang.rtl ? "rtl" : "ltr";
 
-  document.documentElement.dir = currentLanguage.rtl ? "rtl" : "ltr";
+  currentLangData = await import(
-
+    /* webpackChunkName: "i18n-[request]" */ `./locales/${currentLang.code}.json`
-  currentLanguageData = await import(
-    /* webpackChunkName: "i18n-[request]" */ `./locales/${currentLanguage.lng}.json`
   );
-  languageDetector.cacheUserLanguage(currentLanguage.lng);
+  trackEvent(EVENT_CHANGE, "language", currentLang.code);
-  trackEvent(EVENT_CHANGE, "language", currentLanguage.lng);
 };
 
-export const setLanguageFirstTime = async () => {
+export const setLanguageFirstTime = async (lang: Language) => {
-  const newLng: string | undefined = languageDetector.detect();
+  currentLang = lang;
+  document.documentElement.dir = currentLang.rtl ? "rtl" : "ltr";
 
-  currentLanguage =
+  currentLangData = await import(
-    languages.find((language) => language.lng === newLng) || fallbackLanguage;
+    /* webpackChunkName: "i18n-[request]" */ `./locales/${currentLang.code}.json`
-
-  document.documentElement.dir = currentLanguage.rtl ? "rtl" : "ltr";
-
-  currentLanguageData = await import(
-    /* webpackChunkName: "i18n-[request]" */ `./locales/${currentLanguage.lng}.json`
   );
-
-  languageDetector.cacheUserLanguage(currentLanguage.lng);
 };
 
-export const getLanguage = () => currentLanguage;
+export const getLanguage = () => currentLang;
 
 const findPartsForData = (data: any, parts: string[]) => {
   for (let index = 0; index < parts.length; ++index) {
@@ -106,8 +98,8 @@ const findPartsForData = (data: any, parts: string[]) => {
 export const t = (path: string, replacement?: { [key: string]: string }) => {
   const parts = path.split(".");
   let translation =
-    findPartsForData(currentLanguageData, parts) ||
+    findPartsForData(currentLangData, parts) ||
-    findPartsForData(fallbackLanguageData, parts);
+    findPartsForData(fallbackLangData, parts);
   if (translation === undefined) {
     throw new Error(`Can't find translation for ${path}`);
   }
@@ -119,12 +111,3 @@ export const t = (path: string, replacement?: { [key: string]: string }) => {
   }
   return translation;
 };
-
-const languageDetector = new LanguageDetector();
-languageDetector.init({
-  languageUtils: {
-    formatLanguageCode: (lng: string) => lng,
-    isWhitelisted: () => true,
-  },
-  checkWhitelist: false,
-});

src/index-node.ts

@@ -1,5 +1,6 @@
 import { exportToCanvas } from "./scene/export";
 import { getDefaultAppState } from "./appState";
+import { SCENE_NAME_FALLBACK } from "./constants";
 
 const { registerFont, createCanvas } = require("canvas");
 
@@ -61,6 +62,7 @@ const canvas = exportToCanvas(
   elements as any,
   {
     ...getDefaultAppState(),
+    name: SCENE_NAME_FALLBACK,
     offsetTop: 0,
     offsetLeft: 0,
   },

src/is-mobile.tsx

@@ -11,6 +11,7 @@ export const IsMobileProvider = ({
   if (!query.current) {
     query.current = window.matchMedia
       ? window.matchMedia(
+          // keep up to date with _variables.scss
           "(max-width: 640px), (max-height: 500px) and (max-width: 1000px)",
         )
       : (({

src/keys.ts

@@ -9,6 +9,7 @@ export const CODES = {
   BRACKET_RIGHT: "BracketRight",
   BRACKET_LEFT: "BracketLeft",
   ONE: "Digit1",
+  TWO: "Digit2",
   NINE: "Digit9",
   QUOTE: "Quote",
   ZERO: "Digit0",

src/locales/ar-SA.json

@@ -4,6 +4,7 @@
     "selectAll": "تحديد الكل",
     "multiSelect": "إضافة عنصر للتحديد",
     "moveCanvas": "نقل لوح رسم",
+    "cut": "",
     "copy": "نسخ",
     "copyAsPng": "نسخ إلى الحافظة بصيغة PNG",
     "copyAsSvg": "نسخ بصيغة SVG",
@@ -28,10 +29,15 @@
     "edges": "الحواف",
     "sharp": "حادة",
     "round": "دائرية",
+    "arrowheads": "",
+    "arrowhead_none": "",
+    "arrowhead_arrow": "",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "حجم الخط",
     "fontFamily": "نوع الخط",
     "onlySelected": "المحدد فقط",
-    "withBackground": "مع الخلفية",
+    "withBackground": "",
     "exportEmbedScene": "تضمين المشهد في ملف التصدير",
     "exportEmbedScene_details": "سيتم حفظ بيانات المشهد في ملف PNG/SVG المصدّر بحيث يمكن استعادة المشهد منه.\nسيزيد حجم الملف المصدر.",
     "addWatermark": "إضافة \"مصنوعة بواسطة Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "تحديد مجموعة",
     "ungroup": "إلغاء تحديد مجموعة",
     "collaborators": "المتعاونون",
-    "toggleGridMode": "التبديل إلى وضع الشبكة",
+    "gridMode": "",
     "addToLibrary": "أضف إلى المكتبة",
     "removeFromLibrary": "حذف من المكتبة",
     "libraryLoadingMessage": "جارٍ تحميل المكتبة...",
+    "libraries": "",
     "loadingScene": "جاري تحميل المشهد...",
     "align": "محاذاة",
     "alignTop": "محاذاة إلى اﻷعلى",
@@ -110,9 +117,10 @@
     "redo": "إعادة تنفيذ",
     "roomDialog": "بدء المشاركة الحية",
     "createNewRoom": "إنشاء غرفة جديدة",
-    "toggleFullScreen": "التبديل لوضع ملء الشاشة",
+    "fullScreen": "",
-    "toggleDarkMode": "تبديل الوضع الليلي",
+    "darkMode": "",
-    "toggleZenMode": "تبديل الوضع الليلي",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "إلغاء الوضع الليلى"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "تحميل الرسم الخارجي سيحل محل المحتوى الموجود لديك. هل ترغب في المتابعة؟",
     "errorLoadingLibrary": "حصل خطأ أثناء تحميل مكتبة الطرف الثالث.",
     "confirmAddLibrary": "هذا سيضيف {{numShapes}} شكل إلى مكتبتك. هل أنت متأكد؟",
-    "imageDoesNotContainScene": "لا يحتوي ملف الصورة على بيانات المشهد. هل قمت بتمكين هذا أثناء التصدير؟",
+    "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": "تعذر استعادة المشهد من ملف الصورة"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "انقر واسحب، افرج عند الانتهاء",
     "text": "نصيحة: يمكنك أيضًا إضافة نص بالنقر المزدوج في أي مكان بأداة الاختيار",
     "linearElementMulti": "انقر فوق النقطة الأخيرة أو اضغط على Esc أو Enter للإنهاء",
+    "lockAngle": "",
     "resize": "يمكنك تقييد النسب بالضغط على SHIFT أثناء تغيير الحجم،\nاضغط على ALT لتغيير الحجم من المركز",
     "rotate": "يمكنك تقييد الزوايا من خلال الضغط على SHIFT أثناء الدوران",
     "lineEditor_info": "انقر نقراً مزدوجاً أو اضغط Enter لتعديل النقاط",
@@ -205,13 +214,22 @@
     "textNewLine": "إضافة سطر جديد (نص)",
     "textFinish": "الانتهاء من تحرير (النص)",
     "zoomToFit": "تكبير لتلائم جميع العناصر",
+    "zoomToSelection": "",
     "preventBinding": "منع ربط السهم"
   },
   "encrypted": {
     "tooltip": "رسوماتك مشفرة من النهاية إلى النهاية حتى أن خوادم Excalidraw لن تراها أبدا."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "قمت بلصق جدول بيانات دون عمود رقمي.",
+    "angle": "",
-    "tooManyColumns": "قمت بلصق جدول بيانات دون عمود رقمي."
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/bg-BG.json

@@ -4,6 +4,7 @@
     "selectAll": "Маркирай всичко",
     "multiSelect": "",
     "moveCanvas": "",
+    "cut": "",
     "copy": "Копирай",
     "copyAsPng": "Копиране в клипборда",
     "copyAsSvg": "Копиране в клипборда",
@@ -28,10 +29,15 @@
     "edges": "",
     "sharp": "",
     "round": "",
+    "arrowheads": "",
+    "arrowhead_none": "",
+    "arrowhead_arrow": "Стрелка",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "Размер на шрифта",
     "fontFamily": "Семейство шрифтове",
     "onlySelected": "Само избраното",
-    "withBackground": "С фон",
+    "withBackground": "",
     "exportEmbedScene": "",
     "exportEmbedScene_details": "",
     "addWatermark": "",
@@ -70,10 +76,11 @@
     "group": "",
     "ungroup": "",
     "collaborators": "",
-    "toggleGridMode": "",
+    "gridMode": "",
     "addToLibrary": "",
     "removeFromLibrary": "",
     "libraryLoadingMessage": "",
+    "libraries": "",
     "loadingScene": "",
     "align": "",
     "alignTop": "",
@@ -110,9 +117,10 @@
     "redo": "Повтори",
     "roomDialog": "Започнете сътрудничество на живо",
     "createNewRoom": "Създай нова стая",
-    "toggleFullScreen": "Превключване на цял екран",
+    "fullScreen": "",
-    "toggleDarkMode": "",
+    "darkMode": "",
-    "toggleZenMode": "",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": ""
   },
   "alerts": {
@@ -153,6 +161,7 @@
     "freeDraw": "",
     "text": "",
     "linearElementMulti": "Кликнете върху последната точка или натиснете Escape или Enter, за да завършите",
+    "lockAngle": "",
     "resize": "",
     "rotate": "Можете да ограничите ъглите, като държите SHIFT, докато се въртите",
     "lineEditor_info": "",
@@ -205,13 +214,22 @@
     "textNewLine": "Добавяне на нов ред (текст)",
     "textFinish": "Завършете редактиране (текст)",
     "zoomToFit": "",
+    "zoomToSelection": "",
     "preventBinding": ""
   },
   "encrypted": {
     "tooltip": ""
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "",
+    "angle": "",
-    "tooManyColumns": ""
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/ca-ES.json

@@ -4,6 +4,7 @@
     "selectAll": "Seleccionar tot",
     "multiSelect": "Afegir element a la selecció",
     "moveCanvas": "Moure el llenç",
+    "cut": "",
     "copy": "Copiar",
     "copyAsPng": "Copiar al porta-retalls com a PNG",
     "copyAsSvg": "Copiar al porta-retalls com a SVG",
@@ -28,10 +29,15 @@
     "edges": "Vores",
     "sharp": "Agut",
     "round": "Arrodonit",
+    "arrowheads": "",
+    "arrowhead_none": "",
+    "arrowhead_arrow": "",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "Mida de lletra",
     "fontFamily": "Tipus de lletra",
     "onlySelected": "Només seleccionats",
-    "withBackground": "Amb fons",
+    "withBackground": "",
     "exportEmbedScene": "",
     "exportEmbedScene_details": "",
     "addWatermark": "Afegir \"Fet amb Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "Agrupar la selecció",
     "ungroup": "Desagrupar la selecció",
     "collaborators": "Col·laboradors",
-    "toggleGridMode": "Commutar línies de graella",
+    "gridMode": "",
     "addToLibrary": "Afegir a la biblioteca",
     "removeFromLibrary": "Eliminar de la biblioteca",
     "libraryLoadingMessage": "Carregant la biblioteca...",
+    "libraries": "",
     "loadingScene": "Carregant escena ...",
     "align": "",
     "alignTop": "",
@@ -110,9 +117,10 @@
     "redo": "Refer",
     "roomDialog": "Començar col·laboració en directe",
     "createNewRoom": "Crear sala nova",
-    "toggleFullScreen": "Commutar pantalla completa",
+    "fullScreen": "",
-    "toggleDarkMode": "Commutar modo fosc",
+    "darkMode": "",
-    "toggleZenMode": "Commutar modo zen",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "Sortir de modo zen"
   },
   "alerts": {
@@ -153,6 +161,7 @@
     "freeDraw": "Fer clic i arrosegar, deixar anar al punt final",
     "text": "Consell: també pots afegir text fent doble clic a qualsevol lloc amb l'eina de selecció",
     "linearElementMulti": "Fer clic a l'ultim punt, o polsar Escape o Enter per acabar",
+    "lockAngle": "",
     "resize": "Per restringir les proporcions mentres es canvia la mida, mantenir premut el majúscul (SHIFT); per canviar la mida des del centre, mantenir premut ALT",
     "rotate": "Per restringir els angles mentre gira, mantenir premut el majúscul (SHIFT)",
     "lineEditor_info": "Fes doble clic o premi Enter per editar punts",
@@ -205,13 +214,22 @@
     "textNewLine": "Afegir línea nova (text)",
     "textFinish": "Acabar d'editar (text)",
     "zoomToFit": "Zoom per veure tots els elements",
+    "zoomToSelection": "",
     "preventBinding": "Prevenir vinculació de la fletxa"
   },
   "encrypted": {
     "tooltip": "Els vostres dibuixos estan xifrats de punta a punta de manera que els servidors d’Excalidraw no els veuran mai."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Has enganxat un full de càlcul sense columna numèrica.",
+    "angle": "",
-    "tooManyColumns": "Has enganxat un full de càlcul amb més de dues columnes."
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/de-DE.json

@@ -4,6 +4,7 @@
     "selectAll": "Alle auswählen",
     "multiSelect": "Element zur Auswahl hinzufügen",
     "moveCanvas": "Leinwand verschieben",
+    "cut": "Ausschneiden",
     "copy": "Kopieren",
     "copyAsPng": "In Zwischenablage kopieren (PNG)",
     "copyAsSvg": "In Zwischenablage kopieren (SVG)",
@@ -28,6 +29,11 @@
     "edges": "Kanten",
     "sharp": "Eckig",
     "round": "Rund",
+    "arrowheads": "Pfeilspitzen",
+    "arrowhead_none": "Keine",
+    "arrowhead_arrow": "Pfeil",
+    "arrowhead_bar": "Balken",
+    "arrowhead_dot": "Punkt",
     "fontSize": "Schriftgröße",
     "fontFamily": "Schriftfamilie",
     "onlySelected": "Nur ausgewählte",
@@ -70,10 +76,11 @@
     "group": "Auswahl gruppieren",
     "ungroup": "Gruppierung aufheben",
     "collaborators": "Mitarbeitende",
-    "toggleGridMode": "Gitterlinien ein-/ausschalten",
+    "gridMode": "Rastermodus",
     "addToLibrary": "Zur Bibliothek hinzufügen",
     "removeFromLibrary": "Aus Bibliothek entfernen",
     "libraryLoadingMessage": "Lade Bibliothek...",
+    "libraries": "Bibliotheken durchsuchen",
     "loadingScene": "Lade Zeichnung...",
     "align": "Ausrichten",
     "alignTop": "Obere Kanten",
@@ -110,9 +117,10 @@
     "redo": "Wiederholen",
     "roomDialog": "Live-Kollaborationssitzung starten",
     "createNewRoom": "Neuen Raum erstellen",
-    "toggleFullScreen": "Vollbild umschalten",
+    "fullScreen": "Vollbildanzeige",
-    "toggleDarkMode": "Dunkles Design umschalten",
+    "darkMode": "Dunkles Design",
-    "toggleZenMode": "Zen-Modus umschalten",
+    "lightMode": "Helles Design",
+    "zenMode": "Zen-Modus",
     "exitZenMode": "Zen-Modus verlassen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Das Laden der externen Zeichnung ersetzt den vorhandenen Inhalt. Möchtest Du fortfahren?",
     "errorLoadingLibrary": "Beim Laden der Drittanbieter-Bibliothek ist ein Fehler aufgetreten.",
     "confirmAddLibrary": "Dieses fügt {{numShapes}} Form(en) zu deiner Bibliothek hinzu. Bist du sicher?",
-    "imageDoesNotContainScene": "Bilddatei enthält keine Zeichnungsdaten. Hast du das Einbetten beim Export aktiviert?",
+    "imageDoesNotContainScene": "Das Importieren von Bildern wird derzeit nicht unterstützt.\n\nMöchtest du eine Szene importieren? Dieses Bild scheint keine Zeichnungsdaten zu enthalten. Hast du dies beim Exportieren aktiviert?",
     "cannotRestoreFromImage": "Die Zeichnung konnte aus dieser Bilddatei nicht wiederhergestellt werden"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Klicke und ziehe. Lass los, wenn du fertig bist",
     "text": "Tipp: Du kannst auch Text hinzufügen indem Du mit dem Auswahlwerkzeug auf eine beliebige Stelle doppelklickst",
     "linearElementMulti": "Zum Beenden auf den letzten Punkt klicken oder Escape oder Eingabe drücken",
+    "lockAngle": "Du kannst Winkel einschränken, indem du SHIFT gedrückt hältst",
     "resize": "Du kannst die Proportionen einschränken, indem du SHIFT während der Größenänderung gedrückt hältst. Halte ALT gedrückt, um die Größe vom Zentrum aus zu ändern",
     "rotate": "Du kannst Winkel einschränken, indem du SHIFT während der Drehung gedrückt hältst",
     "lineEditor_info": "Doppelklicken oder Eingabetaste drücken, um Punkte zu bearbeiten",
@@ -205,13 +214,22 @@
     "textNewLine": "Neue Zeile hinzufügen (Text)",
     "textFinish": "Bearbeiten beenden (Text)",
     "zoomToFit": "Zoomen um alle Elemente einzupassen",
+    "zoomToSelection": "Zoomauswahl",
     "preventBinding": "Pfeil-Bindung verhindern"
   },
   "encrypted": {
     "tooltip": "Da deine Zeichnungen Ende-zu-Ende verschlüsselt werden, sehen auch unsere Excalidraw-Server sie niemals."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Du hast eine Tabelle ohne numerische Spalte eingefügt.",
+    "angle": "Winkel",
-    "tooManyColumns": "Du hast eine Tabelle mit mehr als zwei Spalten eingefügt."
+    "element": "Element",
+    "elements": "Elemente",
+    "height": "Höhe",
+    "scene": "Zeichnung",
+    "selected": "Ausgewählt",
+    "storage": "Speicher",
+    "title": "Statistiken für Nerds",
+    "total": "Gesamt",
+    "width": "Breite"
   }
 }

src/locales/el-GR.json

@@ -4,6 +4,7 @@
     "selectAll": "Επιλογή όλων",
     "multiSelect": "Προσθέστε το στοιχείο στην επιλογή",
     "moveCanvas": "Μετακίνηση καμβά",
+    "cut": "Αποκοπή",
     "copy": "Αντιγραφή",
     "copyAsPng": "Αντιγραφή στο πρόχειρο ως PNG",
     "copyAsSvg": "Αντιγραφή στο πρόχειρο ως SVG",
@@ -28,10 +29,15 @@
     "edges": "Άκρες",
     "sharp": "Οξύ",
     "round": "Στρογγυλό",
+    "arrowheads": "Σύμβολα βελών",
+    "arrowhead_none": "Κανένα",
+    "arrowhead_arrow": "Βέλος",
+    "arrowhead_bar": "Μπάρα",
+    "arrowhead_dot": "Τελεία",
     "fontSize": "Μέγεθος γραμματοσειράς",
     "fontFamily": "Γραμματοσειρά",
     "onlySelected": "Μόνο τα Επιλεγμένα",
-    "withBackground": "Με Φόντο",
+    "withBackground": "Με φόντο",
     "exportEmbedScene": "Ενσωμάτωση της σκηνής στο αρχείο προς εξαγωγή",
     "exportEmbedScene_details": "Τα δεδομένα σκηνής θα αποθηκευτούν στο αρχείο PNG/SVG προς εξαγωγή ώστε η σκηνή να είναι δυνατό να αποκατασταθεί από αυτό.\nΘα αυξήσει το μέγεθος του αρχείου προς εξαγωγή.",
     "addWatermark": "Προσθήκη \"Φτιαγμένο με Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "Δημιουργία ομάδας από επιλογή",
     "ungroup": "Κατάργηση ομάδας από επιλογή",
     "collaborators": "Συνεργάτες",
-    "toggleGridMode": "Εναλλαγή λειτουργίας πλέγματος",
+    "gridMode": "Εμφάνιση σε πλέγμα",
     "addToLibrary": "Προσθήκη στη βιβλιοθήκη",
     "removeFromLibrary": "Αφαίρεση από τη βιβλιοθήκη",
     "libraryLoadingMessage": "Φόρτωση βιβλιοθήκης...",
+    "libraries": "Άλλες βιβλιοθήκες",
     "loadingScene": "Φόρτωση σκηνής...",
     "align": "Στοίχιση",
     "alignTop": "Στοίχιση πάνω",
@@ -110,9 +117,10 @@
     "redo": "Επαναφορά",
     "roomDialog": "Έναρξη ζωντανής συνεργασίας",
     "createNewRoom": "Δημιουργία νέου χώρου",
-    "toggleFullScreen": "Εναλλαγή πλήρους οθόνης",
+    "fullScreen": "Πλήρης οθόνη",
-    "toggleDarkMode": "Εναλλαγή εμφάνισης σε dark",
+    "darkMode": "Σκοτεινή λειτουργία",
-    "toggleZenMode": "Εναλλαγή λειτουργίας Zen",
+    "lightMode": "Φωτεινή λειτουργία",
+    "zenMode": "Λειτουργία Zεν",
     "exitZenMode": "Έξοδος απο την λειτουργία Zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Η φόρτωση εξωτερικού σχεδίου θα αντικαταστήσει το υπάρχον περιεχόμενο. Επιθυμείτε να συνεχίσετε;",
     "errorLoadingLibrary": "Υπήρξε ένα σφάλμα κατά τη φόρτωση της βιβλιοθήκης τρίτου μέρους.",
     "confirmAddLibrary": "Αυτό θα προσθέσει {{numShapes}} σχήμα(τα) στη βιβιλιοθήκη σας. Είστε σίγουροι;",
-    "imageDoesNotContainScene": "Το αρχείο εικόνας δεν έχει δεδομένα σκηνής. Το είχατε ενεργοποιήσει αυτό κατά την εξαγωγή;",
+    "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": "Η σκηνή δεν ήταν δυνατό να αποκατασταθεί από αυτό το αρχείο εικόνας"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Κάντε κλικ και σύρατε, απελευθερώσατε όταν έχετε τελειώσει",
     "text": "Tip: μπορείτε επίσης να προσθέστε κείμενο με διπλό-κλικ οπουδήποτε με το εργαλείο επιλογών",
     "linearElementMulti": "Κάνε κλικ στο τελευταίο σημείο ή πάτησε Escape ή Enter για να τελειώσεις",
+    "lockAngle": "",
     "resize": "Μπορείς να περιορίσεις τις αναλογίες κρατώντας το SHIFT ενώ αλλάζεις μέγεθος,\nκράτησε πατημένο το ALT για αλλαγή μεγέθους από το κέντρο",
     "rotate": "Μπορείς να περιορίσεις τις γωνίες κρατώντας πατημένο το πλήκτρο SHIFT κατά την περιστροφή",
     "lineEditor_info": "Διπλό-κλικ ή πιέστε Enter για να επεξεργαστείτε τα σημεία",
@@ -161,7 +170,7 @@
   },
   "canvasError": {
     "cannotShowPreview": "",
-    "canvasTooBig": "",
+    "canvasTooBig": "Ο καμβάς μπορεί να είναι μεγάλος.",
     "canvasTooBigTip": ""
   },
   "errorSplash": {
@@ -205,13 +214,22 @@
     "textNewLine": "Προσθήκη νέας γραμμής (κείμενο)",
     "textFinish": "Ολοκλήρωση επεξεργασίας (κείμενο)",
     "zoomToFit": "Zoom ώστε να χωρέσουν όλα τα στοιχεία",
+    "zoomToSelection": "",
     "preventBinding": "Αποτροπή δέσμευσης βέλων"
   },
   "encrypted": {
     "tooltip": "Τα σχέδιά σου είναι κρυπτογραφημένα από άκρο σε άκρο, έτσι δεν θα έιναι ποτέ ορατά μέσα από τους διακομιστές του Excalidraw."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Επικόλλησες ένα υπολογιστικό φύλλο χωρίς αριθμητική στήλη.",
+    "angle": "Γωνία",
-    "tooManyColumns": "Επικόλλησες ένα υπολογιστικό φύλλο με περισσότερες από δύο στήλες."
+    "element": "Στοιχείο",
+    "elements": "Στοιχεία",
+    "height": "Ύψος",
+    "scene": "Σκηνή",
+    "selected": "Επιλεγμένα",
+    "storage": "Χώρος",
+    "title": "Στατιστικά για σπασίκλες",
+    "total": "Σύνολο ",
+    "width": "Πλάτος"
   }
 }

src/locales/en.json

@@ -1,6 +1,7 @@
 {
   "labels": {
     "paste": "Paste",
+    "pasteCharts": "Paste charts",
     "selectAll": "Select all",
     "multiSelect": "Add element to selection",
     "moveCanvas": "Move canvas",
@@ -37,7 +38,7 @@
     "fontSize": "Font size",
     "fontFamily": "Font family",
     "onlySelected": "Only selected",
-    "withBackground": "With Background",
+    "withBackground": "With background",
     "exportEmbedScene": "Embed scene into exported file",
     "exportEmbedScene_details": "Scene data will be saved into the exported PNG/SVG file so that the scene can be restored from it.\nWill increase exported file size.",
     "addWatermark": "Add \"Made with Excalidraw\"",
@@ -76,8 +77,7 @@
     "group": "Group selection",
     "ungroup": "Ungroup selection",
     "collaborators": "Collaborators",
-    "toggleGridMode": "Toggle grid mode",
+    "gridMode": "Grid mode",
-    "toggleStats": "Toggle stats for nerds",
     "addToLibrary": "Add to library",
     "removeFromLibrary": "Remove from library",
     "libraryLoadingMessage": "Loading library...",
@@ -118,9 +118,10 @@
     "redo": "Redo",
     "roomDialog": "Start live collaboration",
     "createNewRoom": "Create new room",
-    "toggleFullScreen": "Toggle full screen",
+    "fullScreen": "Full screen",
-    "toggleDarkMode": "Toggle dark mode",
+    "darkMode": "Dark mode",
-    "toggleZenMode": "Toggle zen mode",
+    "lightMode": "Light mode",
+    "zenMode": "Zen mode",
     "exitZenMode": "Exit zen mode"
   },
   "alerts": {
@@ -136,7 +137,7 @@
     "loadSceneOverridePrompt": "Loading external drawing will replace your existing content. Do you wish to continue?",
     "errorLoadingLibrary": "There was an error loading the third party library.",
     "confirmAddLibrary": "This will add {{numShapes}} shape(s) to your library. Are you sure?",
-    "imageDoesNotContainScene": "Image file doesn't contain scene data. Have you enabled this during export?",
+    "imageDoesNotContainScene": "Importing images isn't supported at the moment.\n\nDid you want to import a scene? This image does not seem to contain any scene data. Have you enabled this during export?",
     "cannotRestoreFromImage": "Scene couldn't be restored from this image file"
   },
   "toolBar": {
@@ -161,6 +162,7 @@
     "freeDraw": "Click and drag, release when you're finished",
     "text": "Tip: you can also add text by double-clicking anywhere with the selection tool",
     "linearElementMulti": "Click on last point or press Escape or Enter to finish",
+    "lockAngle": "You can constrain angle by holding SHIFT",
     "resize": "You can constrain proportions by holding SHIFT while resizing,\nhold ALT to resize from the center",
     "rotate": "You can constrain angles by holding SHIFT while rotating",
     "lineEditor_info": "Double-click or press Enter to edit points",
@@ -213,6 +215,7 @@
     "textNewLine": "Add new line (text)",
     "textFinish": "Finish editing (text)",
     "zoomToFit": "Zoom to fit all elements",
+    "zoomToSelection": "Zoom to selection",
     "preventBinding": "Prevent arrow binding"
   },
   "encrypted": {

src/locales/es-ES.json

@@ -4,6 +4,7 @@
     "selectAll": "Seleccionar todo",
     "multiSelect": "Añadir elemento a la selección",
     "moveCanvas": "Mover el lienzo",
+    "cut": "Cortar",
     "copy": "Copiar",
     "copyAsPng": "Copiar al portapapeles como PNG",
     "copyAsSvg": "Copiar al portapapeles como SVG",
@@ -28,12 +29,17 @@
     "edges": "Bordes",
     "sharp": "Afilado",
     "round": "Redondo",
+    "arrowheads": "Puntas de flecha",
+    "arrowhead_none": "Vacía",
+    "arrowhead_arrow": "Flecha",
+    "arrowhead_bar": "Barra",
+    "arrowhead_dot": "Punto",
     "fontSize": "Tamaño de la fuente",
     "fontFamily": "Tipo de fuente",
     "onlySelected": "Sólo seleccionados",
     "withBackground": "Con fondo",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Insertar escena en el archivo exportado",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "Los datos de escena se guardarán en el archivo PNG/SVG exportado para que la escena pueda ser restaurada de ella.\nIncrementará el tamaño del archivo exportado.",
     "addWatermark": "Agregar \"Hecho con Excalidraw\"",
     "handDrawn": "Dibujado a mano",
     "normal": "Normal",
@@ -54,7 +60,7 @@
     "architect": "Arquitecto",
     "artist": "Artista",
     "cartoonist": "Caricatura",
-    "fileTitle": "",
+    "fileTitle": "Título del archivo",
     "colorPicker": "Selector de color",
     "canvasBackground": "Fondo del lienzo",
     "drawingCanvas": "Lienzo de dibujo",
@@ -63,27 +69,28 @@
     "language": "Idioma",
     "createRoom": "Compartir una sesión de colaboración en vivo",
     "duplicateSelection": "Duplicar",
-    "untitled": "",
+    "untitled": "Sin título",
     "name": "Nombre",
     "yourName": "Tu nombre",
     "madeWithExcalidraw": "Hecho con Excalidraw",
     "group": "Selección de grupo",
     "ungroup": "Desagrupar",
     "collaborators": "Colaboradores",
-    "toggleGridMode": "Alternar modo cuadrícula",
+    "gridMode": "Modo cuadrícula",
     "addToLibrary": "Añadir a la biblioteca",
     "removeFromLibrary": "Eliminar de la biblioteca",
     "libraryLoadingMessage": "Cargando biblioteca...",
+    "libraries": "Explorar librerías",
     "loadingScene": "Cargando escena...",
-    "align": "",
+    "align": "Alinear",
-    "alignTop": "",
+    "alignTop": "Alinear arriba",
-    "alignBottom": "",
+    "alignBottom": "Alinear abajo",
-    "alignLeft": "",
+    "alignLeft": "Alinear a la izquierda",
-    "alignRight": "",
+    "alignRight": "Alinear a la derecha",
-    "centerVertically": "",
+    "centerVertically": "Centrar verticalmente",
-    "centerHorizontally": "",
+    "centerHorizontally": "Centrar horizontalmente",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Distribuir horizontalmente",
-    "distributeVertically": ""
+    "distributeVertically": "Distribuir verticalmente"
   },
   "buttons": {
     "clearReset": "Limpiar lienzo y reiniciar el color de fondo",
@@ -110,15 +117,16 @@
     "redo": "Rehacer",
     "roomDialog": "Iniciar colaboración en vivo",
     "createNewRoom": "Crear nueva sala",
-    "toggleFullScreen": "Alternar pantalla completa",
+    "fullScreen": "Pantalla completa",
-    "toggleDarkMode": "Cambiar a modo oscuro",
+    "darkMode": "Modo oscuro",
-    "toggleZenMode": "Alternar modo zen",
+    "lightMode": "Modo claro",
+    "zenMode": "Modo Zen",
     "exitZenMode": "Salir del modo Zen"
   },
   "alerts": {
     "clearReset": "Esto limpiará todo el lienzo. Estás seguro?",
     "couldNotCreateShareableLink": "No se pudo crear un enlace para compartir.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "No se pudo crear el enlace para compartir: la escena es demasiado grande",
     "couldNotLoadInvalidFile": "No se pudo cargar el archivo inválido",
     "importBackendFailed": "La importación falló.",
     "cannotExportEmptyCanvas": "No se puede exportar un lienzo vació",
@@ -128,8 +136,8 @@
     "loadSceneOverridePrompt": "Si carga este dibujo externo, reemplazará el que tiene. ¿Desea continuar?",
     "errorLoadingLibrary": "Se ha producido un error al cargar la biblioteca de terceros.",
     "confirmAddLibrary": "Esto añadirá {{numShapes}} forma(s) a tu biblioteca. ¿Estás seguro?",
-    "imageDoesNotContainScene": "",
+    "imageDoesNotContainScene": "La importación de imágenes no está soportada en este momento.\n\n¿Querías importar una escena? Esta imagen no parece contener ningún dato de escena. ¿Lo ha activado durante la exportación?",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "No se pudo restaurar la escena desde este archivo de imagen"
   },
   "toolBar": {
     "selection": "Selección",
@@ -153,6 +161,7 @@
     "freeDraw": "Haz clic y arrastra, suelta al terminar",
     "text": "Consejo: también puedes añadir texto haciendo doble clic en cualquier lugar con la herramienta de selección",
     "linearElementMulti": "Haga clic en el último punto o pulse Escape o Enter para finalizar",
+    "lockAngle": "",
     "resize": "Para mantener las proporciones mantén SHIFT presionado mientras modificas el tamaño, \nmantén presionado ALT para modificar el tamaño desde el centro",
     "rotate": "Puede restringir los ángulos manteniendo presionado SHIFT mientras gira",
     "lineEditor_info": "haga doble clic o pulse Enter para editar puntos",
@@ -160,9 +169,9 @@
     "lineEditor_nothingSelected": "Seleccione un punto para mover o eliminar, o mantenga pulsado Alt y haga clic para añadir nuevos puntos"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "No se puede mostrar la vista previa",
-    "canvasTooBig": "",
+    "canvasTooBig": "El lienzo podría ser demasiado grande.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Sugerencia: intenta acercar un poco los elementos más lejanos."
   },
   "errorSplash": {
     "headingMain_pre": "Se encontró un error. Intente ",
@@ -205,13 +214,22 @@
     "textNewLine": "Añadir nueva línea (texto)",
     "textFinish": "Finalizar edición (texto)",
     "zoomToFit": "Ajustar para mostrar todos los elementos",
+    "zoomToSelection": "Hacer zoom a la selección",
     "preventBinding": "Evitar enlace de flecha"
   },
   "encrypted": {
     "tooltip": "Tus dibujos están cifrados de punto a punto, por lo que los servidores de Excalidraw nunca los verán."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Pegaste una hoja de cálculo sin una columna numérica.",
+    "angle": "Ángulo",
-    "tooManyColumns": "Pegaste una hoja de cálculo con más de dos columnas."
+    "element": "Elemento",
+    "elements": "Elementos",
+    "height": "Alto",
+    "scene": "Escena",
+    "selected": "Seleccionado",
+    "storage": "Almacenamiento",
+    "title": "",
+    "total": "Total",
+    "width": "Ancho"
   }
 }

src/locales/fa-IR.json

@@ -4,6 +4,7 @@
     "selectAll": "انتخاب همه",
     "multiSelect": "یک ایتم به انتخاب شده ها اضافه کنید.",
     "moveCanvas": "بوم را حرکت بدهید",
+    "cut": "",
     "copy": "کپی",
     "copyAsPng": "کپی در حافطه موقت به صورت PNG",
     "copyAsSvg": "کپی در حافطه موقت به صورت SVG",
@@ -28,10 +29,15 @@
     "edges": "لبه ها",
     "sharp": "تیز",
     "round": "دور",
+    "arrowheads": "",
+    "arrowhead_none": "",
+    "arrowhead_arrow": "",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "اندازه قلم",
     "fontFamily": "نوع قلم",
     "onlySelected": "فقط انتخاب شده ها",
-    "withBackground": "با پس زمینه",
+    "withBackground": "",
     "exportEmbedScene": "قرار دادن صحنه در فایل خروجی",
     "exportEmbedScene_details": "متحوای صحنه به فایل خروجی SVG/PNG اضافه خواهد شد برای بازیابی صحنه به آن اضافه خواهد شد.\nباعث افزایش حجم فایل خروجی میشود.",
     "addWatermark": "\"ساخته شده با Excalidraw\" را اضافه کن",
@@ -70,10 +76,11 @@
     "group": "گروهبندی انتخابها",
     "ungroup": "حذف گروهبندی انتخابها",
     "collaborators": "همکاران",
-    "toggleGridMode": "سويچ خطوط راهنما",
+    "gridMode": "",
     "addToLibrary": "افزودن به کتابخانه",
     "removeFromLibrary": "حذف از کتابخانه",
     "libraryLoadingMessage": "بارگذاری کتابخانه...",
+    "libraries": "",
     "loadingScene": "باگذاری صحنه...",
     "align": "تراز",
     "alignTop": "تراز به بالا",
@@ -110,9 +117,10 @@
     "redo": "از سر",
     "roomDialog": "همکاری آنلاین را شروع کنید",
     "createNewRoom": "ایجاد یک اتاق جدید",
-    "toggleFullScreen": "تغییر به حالت تمام صفحه",
+    "fullScreen": "",
-    "toggleDarkMode": "تغییر به حالت تاریک",
+    "darkMode": "",
-    "toggleZenMode": "تغییر به حالت تمرکز",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "خروج از حالت تمرکز"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "بارگزاری یک طرح خارجی محتوای فعلی رو از بین میبرد. آیا میخواهید ادامه دهید؟",
     "errorLoadingLibrary": "خطایی در بارگذاری کتابخانه ثالث وجود داشت.",
     "confirmAddLibrary": "{{numShapes}} از اشکال به کتابخانه شما اضافه خواهد شد. مطمئن هستید؟",
-    "imageDoesNotContainScene": "فایل تصویر دارای محتوای صحنه نیست. آیا در هنگام خروجی گرفتن آن را فعال کرده‌اید؟",
+    "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": "صحنه را نمی توان از این فایل تصویری بازیابی کرد"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "کلیک کنید و بکشید و وقتی کار تمام شد رها کنید",
     "text": "نکته: با برنامه انتخاب شده شما میتوانید با دوبار کلیک کردن هرکجا میخواید متن اظاف کنید",
     "linearElementMulti": "روی آخرین نقطه کلیک کنید یا کلید ESC را بزنید یا کلید Enter را بزنید برای اتمام کار",
+    "lockAngle": "",
     "resize": "می توانید با نگه داشتن SHIFT در هنگام تغییر اندازه، نسبت ها را محدود کنید،ALT را برای تغییر اندازه از مرکز نگه دارید",
     "rotate": "با نگه داشتن SHIFT هنگام چرخش می توانید زاویه ها را محدود کنید",
     "lineEditor_info": "دوبار کلیک کنید یا Enter را فشار دهید تا نقاط را ویرایش کنید",
@@ -205,13 +214,22 @@
     "textNewLine": "یک خط جدید اضافه کنید (متن)",
     "textFinish": "پایان ویرایش (متن)",
     "zoomToFit": "بزرگنمایی برای دیدن تمام آیتم ها",
+    "zoomToSelection": "",
     "preventBinding": "مانع شدن از چسبیدن فلش ها"
   },
   "encrypted": {
     "tooltip": "شما در یک محیط رمزگزاری شده دو طرفه در حال طراحی هستید پس Excalidraw هرگز طرح های شما را نمیبند."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "شما یک صفحه گسترده را بدون ستون عددی کپی کرده اید.",
+    "angle": "",
-    "tooManyColumns": "شما یک صفحه گسترده را با بیش از دو ستون کپی کرده اید."
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/fi-FI.json

@@ -4,6 +4,7 @@
     "selectAll": "Valitse kaikki",
     "multiSelect": "Lisää kohde valintaan",
     "moveCanvas": "Siirrä piirtoaluetta",
+    "cut": "Leikkaa",
     "copy": "Kopioi",
     "copyAsPng": "Kopioi leikepöydälle PNG-tiedostona",
     "copyAsSvg": "Kopioi leikepöydälle SVG-tiedostona",
@@ -28,6 +29,11 @@
     "edges": "Reunat",
     "sharp": "Terävä",
     "round": "Pyöreä",
+    "arrowheads": "Nuolenkärjet",
+    "arrowhead_none": "Ei mitään",
+    "arrowhead_arrow": "Nuoli",
+    "arrowhead_bar": "Tasapää",
+    "arrowhead_dot": "Piste",
     "fontSize": "Kirjasinkoko",
     "fontFamily": "Kirjasintyyppi",
     "onlySelected": "Vain valitut",
@@ -70,10 +76,11 @@
     "group": "Ryhmitä valinta",
     "ungroup": "Pura valittu ryhmä",
     "collaborators": "Yhteistyökumppanit",
-    "toggleGridMode": "Ruudukko päälle/pois",
+    "gridMode": "Ruudukkotila",
     "addToLibrary": "Lisää kirjastoon",
     "removeFromLibrary": "Poista kirjastosta",
     "libraryLoadingMessage": "Ladataan kirjastoa...",
+    "libraries": "Selaa kirjastoja",
     "loadingScene": "Ladataan työtä...",
     "align": "Tasaa",
     "alignTop": "Tasaa ylös",
@@ -110,9 +117,10 @@
     "redo": "Tee uudelleen",
     "roomDialog": "Aloita live-yhteistyö",
     "createNewRoom": "Luo huone",
-    "toggleFullScreen": "Koko näytön tila päälle/pois",
+    "fullScreen": "Koko näyttö",
-    "toggleDarkMode": "Pimeä tila päälle/pois",
+    "darkMode": "Tumma tila",
-    "toggleZenMode": "Zen-tila päälle",
+    "lightMode": "Vaalea tila",
+    "zenMode": "Zen-tila",
     "exitZenMode": "Poistu zen-tilasta"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Ulkopuolisen piirroksen lataaminen korvaa nykyisen sisältösi. Haluatko jatkaa?",
     "errorLoadingLibrary": "Kolmannen osapuolen kirjastoa ladattaessa tapahtui virhe.",
     "confirmAddLibrary": "Tämä lisää {{numShapes}} muotoa kirjastoosi. Oletko varma?",
-    "imageDoesNotContainScene": "Kuvatiedosto ei sisällä teostietoja. Valitsitko sisällyttää ne tallennusvaiheessa?",
+    "imageDoesNotContainScene": "Kuvien lisääminen ei ole tällä hetkellä mahdollista.\n\nHaluatko tuoda piirroksen? Tämä kuva ei näytä sisältävän tarvittavia tietoja. Oletko ottanut piirrostietojen tallennuksen käyttöön viennin aikana?",
     "cannotRestoreFromImage": "Teosta ei voitu palauttaa tästä kuvatiedostosta"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Paina ja raahaa, päästä irti kun olet valmis",
     "text": "Vinkki: voit myös lisätä tekstiä kaksoisnapsauttamalla mihin tahansa valintatyökalulla",
     "linearElementMulti": "Klikkaa viimeistä pistettä, paina Escape tai paina Enter lopettaaksesi",
+    "lockAngle": "Voit rajoittaa kulmaa pitämällä SHIFT pohjassa",
     "resize": "Voit rajoittaa mittasuhteet pitämällä SHIFT pohjassa kun muutat kokoa, pidä ALT pohjassa muuttaaksesi kokoa keskipisteen suhteen",
     "rotate": "Voit rajoittaa kulman pitämällä SHIFT pohjassa pyörittäessäsi",
     "lineEditor_info": "Kaksoisnapauta tai paina Enter muokataksesi pisteitä",
@@ -205,13 +214,22 @@
     "textNewLine": "Lisää uusi rivi (teksti)",
     "textFinish": "Lopeta muokkaus (teksti)",
     "zoomToFit": "Zoomaa kaikki elementit näkyviin",
+    "zoomToSelection": "Zoomaa valintaan",
     "preventBinding": "Estä nuolten sitominen"
   },
   "encrypted": {
     "tooltip": "Piirroksesi ovat päästä päähän salattuja, joten Excalidrawin palvelimet eivät koskaan näe niitä."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Liitit taulukon ilman lukuja sisältävää saraketta.",
+    "angle": "Kulma",
-    "tooManyColumns": "Liitit taulukon, jossa on enemmän kuin kaksi saraketta."
+    "element": "Elementti",
+    "elements": "Elementit",
+    "height": "Korkeus",
+    "scene": "Teos",
+    "selected": "Valitut",
+    "storage": "Tallennustila",
+    "title": "Nörttien tilastot",
+    "total": "Yhteensä",
+    "width": "Leveys"
   }
 }

src/locales/fr-FR.json

@@ -4,6 +4,7 @@
     "selectAll": "Tout sélectionner",
     "multiSelect": "Ajouter l'élément à la sélection",
     "moveCanvas": "Déplacer le canvas",
+    "cut": "Couper",
     "copy": "Copier",
     "copyAsPng": "Copier dans le presse-papier en PNG",
     "copyAsSvg": "Copier dans le presse-papier en SVG",
@@ -28,6 +29,11 @@
     "edges": "Angles",
     "sharp": "Aigu",
     "round": "Rond",
+    "arrowheads": "Extrémités de ligne",
+    "arrowhead_none": "Aucun",
+    "arrowhead_arrow": "Flèche",
+    "arrowhead_bar": "Barre",
+    "arrowhead_dot": "Point",
     "fontSize": "Taille de la police",
     "fontFamily": "Police",
     "onlySelected": "Uniquement la sélection",
@@ -70,20 +76,21 @@
     "group": "Grouper la sélection",
     "ungroup": "Dégrouper la sélection",
     "collaborators": "Collaborateurs",
-    "toggleGridMode": "Basculer le mode grille",
+    "gridMode": "Mode grille",
     "addToLibrary": "Ajouter à la bibliothèque",
     "removeFromLibrary": "Supprimer de la bibliothèque",
     "libraryLoadingMessage": "Chargement de la bibliothèque...",
+    "libraries": "Explorer les bibliothèques",
     "loadingScene": "Chargement de la scène...",
-    "align": "Aligner",
+    "align": "Alignement",
     "alignTop": "Aligner en haut",
     "alignBottom": "Aligner en bas",
     "alignLeft": "Aligner à gauche",
     "alignRight": "Aligner à droite",
     "centerVertically": "Centrer verticalement",
     "centerHorizontally": "Centrer horizontalement",
-    "distributeHorizontally": "Répartir horizontalement",
+    "distributeHorizontally": "Distribuer horizontalement",
-    "distributeVertically": "Répartir verticalement"
+    "distributeVertically": "Distribuer verticalement"
   },
   "buttons": {
     "clearReset": "Effacer le canvas & réinitialiser la couleur d'arrière-plan",
@@ -110,9 +117,10 @@
     "redo": "Rétablir",
     "roomDialog": "Démarrer le collaboration en temps réel",
     "createNewRoom": "Créer un nouveau salon",
-    "toggleFullScreen": "Activer/désactiver le mode plein écran",
+    "fullScreen": "Plein écran",
-    "toggleDarkMode": "Activer/désactiver le mode sombre",
+    "darkMode": "Mode sombre",
-    "toggleZenMode": "Activer/désactiver le mode zen",
+    "lightMode": "Mode Clair",
+    "zenMode": "Mode Zen",
     "exitZenMode": "Quitter le mode zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Le chargement d'un dessin externe remplacera votre contenu actuel. Souhaitez-vous continuer ?",
     "errorLoadingLibrary": "Une erreur s'est produite lors du chargement de la bibliothèque tierce.",
     "confirmAddLibrary": "Cela va ajouter {{numShapes}} forme(s) à votre bibliothèque. Êtes-vous sûr(e) ?",
-    "imageDoesNotContainScene": "Le fichier image ne contient pas de données de scène. L'avez-vous activé lors de l'export ?",
+    "imageDoesNotContainScene": "L'importation des images n'est pas prise en charge pour le moment.\n\nVoulez-vous importer une scène ? Cette image ne semble pas contenir de données de scène. Avez-vous activé cette option lors de l'exportation ?",
     "cannotRestoreFromImage": "Impossible de restaurer la scène depuis ce fichier image"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Cliquez et faites glissez, relâchez quand vous avez terminé",
     "text": "Astuce : vous pouvez également ajouter du texte en double-cliquant n'importe où avec l'outil de sélection",
     "linearElementMulti": "Cliquez sur le dernier point ou appuyez sur Échap ou Entrée pour terminer",
+    "lockAngle": "Vous pouvez contraindre l'angle en maintenant SHIFT",
     "resize": "Vous pouvez conserver les proportions en maintenant la touche SHIFT pendant le redimensionnement,\nen maintenant la touche ALT pour redimensionner par rapport au centre",
     "rotate": "Vous pouvez contraindre les angles en maintenant MAJ enfoncé pendant la rotation",
     "lineEditor_info": "Double-cliquez ou appuyez sur Entrée pour éditer les points",
@@ -161,8 +170,8 @@
   },
   "canvasError": {
     "cannotShowPreview": "Impossible d’afficher l’aperçu",
-    "canvasTooBig": "Le tableau peut être trop grand.",
+    "canvasTooBig": "Le dessin est peut-être trop grand.",
-    "canvasTooBigTip": "Astuce : essayez de rapprocher un peu les éléments les plus éloignés ensemble."
+    "canvasTooBigTip": "Conseil : essayez de rapprocher un peu plus les éléments les plus éloignés."
   },
   "errorSplash": {
     "headingMain_pre": "Une erreur est survenue. Essayez ",
@@ -205,13 +214,22 @@
     "textNewLine": "Ajouter une nouvelle ligne (texte)",
     "textFinish": "Terminer l'édition (texte)",
     "zoomToFit": "Zoomer pour visualiser tous les éléments",
+    "zoomToSelection": "Zoom sur la sélection",
     "preventBinding": "Empêcher la liaison de la flèche"
   },
   "encrypted": {
     "tooltip": "Vos dessins sont chiffrés de bout en bout, les serveurs d'Excalidraw ne les verront jamais."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Vous avez collé une feuille de calcul sans données numérique.",
+    "angle": "Angle",
-    "tooManyColumns": "Vous avez collé une feuille de calcul avec plus de deux colonnes."
+    "element": "Élément",
+    "elements": "Éléments",
+    "height": "Hauteur",
+    "scene": "Scène",
+    "selected": "Sélectionné",
+    "storage": "Stockage",
+    "title": "Stats pour les nerds",
+    "total": "Total",
+    "width": "Largeur"
   }
 }

src/locales/he-IL.json

@@ -2,8 +2,9 @@
   "labels": {
     "paste": "הדבק",
     "selectAll": "בחר הכל",
-    "multiSelect": "",
+    "multiSelect": "הוסף אובייקט לבחירה",
-    "moveCanvas": "",
+    "moveCanvas": "הזז את הקנבס",
+    "cut": "חתוך",
     "copy": "העתק",
     "copyAsPng": "העתק ללוח כ PNG",
     "copyAsSvg": "העתק ללוח כ SVG",
@@ -25,15 +26,20 @@
     "sloppiness": "סגנון",
     "opacity": "אטימות",
     "textAlign": "יישור טקסט",
-    "edges": "",
+    "edges": "קצוות",
-    "sharp": "",
+    "sharp": "חד",
-    "round": "",
+    "round": "עגול",
+    "arrowheads": "ראשי חצים",
+    "arrowhead_none": "ללא",
+    "arrowhead_arrow": "חץ",
+    "arrowhead_bar": "שורה",
+    "arrowhead_dot": "נקודה",
     "fontSize": "גודל גופן",
     "fontFamily": "סוג הגופן",
     "onlySelected": "רק מה שנבחר",
     "withBackground": "עם רקע",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "שלב את התצוגה בקובץ המיוצא",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "מידע התצוגה יישמר לקובץ המיוצא מסוג PNG/SVG כך שיהיה ניתן לשחזרה ממנו.\nהפעולה תגדיל את גודל הקובץ המיוצא.",
     "addWatermark": "הוסף \"נוצר באמצעות Excalidraw\"",
     "handDrawn": "כתב יד",
     "normal": "רגיל",
@@ -54,7 +60,7 @@
     "architect": "ארכיטקט",
     "artist": "אמן",
     "cartoonist": "קריקטוריסט",
-    "fileTitle": "",
+    "fileTitle": "כותרת הקובץ",
     "colorPicker": "בחירת צבע",
     "canvasBackground": "רקע הלוח",
     "drawingCanvas": "לוח ציור",
@@ -63,27 +69,28 @@
     "language": "שפה",
     "createRoom": "התחל שיתוף פעולה חי",
     "duplicateSelection": "שכפל",
-    "untitled": "",
+    "untitled": "ללא כותרת",
     "name": "שם",
     "yourName": "שם",
     "madeWithExcalidraw": "נוצר באמצעות Excalidraw",
     "group": "אחד לקבוצה",
     "ungroup": "פרק קבוצה",
-    "collaborators": "",
+    "collaborators": "שותפים",
-    "toggleGridMode": "",
+    "gridMode": "",
-    "addToLibrary": "",
+    "addToLibrary": "הוסף לספריה",
-    "removeFromLibrary": "",
+    "removeFromLibrary": "הסר מספריה",
-    "libraryLoadingMessage": "",
+    "libraryLoadingMessage": "טוען ספריה...",
-    "loadingScene": "",
+    "libraries": "דפדף בספריות",
-    "align": "",
+    "loadingScene": "טוען תצוגה...",
-    "alignTop": "",
+    "align": "יישר",
-    "alignBottom": "",
+    "alignTop": "יישר למעלה",
-    "alignLeft": "",
+    "alignBottom": "יישר למטה",
-    "alignRight": "",
+    "alignLeft": "יישר לשמאל",
-    "centerVertically": "",
+    "alignRight": "יישר לימין",
-    "centerHorizontally": "",
+    "centerVertically": "מרכז אנכית",
-    "distributeHorizontally": "",
+    "centerHorizontally": "מרכז אופקית",
-    "distributeVertically": ""
+    "distributeHorizontally": "חלוקה אופקית",
+    "distributeVertically": "חלוקה אנכית"
   },
   "buttons": {
     "clearReset": "אפס את הלוח",
@@ -92,9 +99,9 @@
     "exportToSvg": "יצא ל SVG",
     "copyToClipboard": "העתק ללוח",
     "copyPngToClipboard": "העתק PNG ללוח",
-    "scale": "",
+    "scale": "קנה מידה",
     "save": "שמור",
-    "saveAs": "",
+    "saveAs": "שמירה בשם",
     "load": "טען",
     "getShareableLink": "קבל קישור לשיתוף",
     "close": "סגור",
@@ -110,26 +117,27 @@
     "redo": "בצע מחדש",
     "roomDialog": "התחל שיתוף חי",
     "createNewRoom": "צור חדר",
-    "toggleFullScreen": "הפעל/הפסק מסך מלא",
+    "fullScreen": "",
-    "toggleDarkMode": "",
+    "darkMode": "",
-    "toggleZenMode": "התחל/הפסק מצב תפריט מרחף",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "צא ממצב תפריט מרחף"
   },
   "alerts": {
     "clearReset": "פעולה זו תנקה את כל הלוח. אתה בטוח?",
     "couldNotCreateShareableLink": "לא ניתן לייצר לינק לשיתוף.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "לא הצלחנו לייצר קישור לשיתוף: התצוגה גדולה מדי",
     "couldNotLoadInvalidFile": "לא ניתן לטעון קובץ שאיננו תואם",
     "importBackendFailed": "ייבוא מהשרת נכשל.",
     "cannotExportEmptyCanvas": "לא ניתן לייצא לוח ריק.",
     "couldNotCopyToClipboard": "לא ניתן להעתיק ללוח. נסה להשתמש בדפדפן Chrome.",
     "decryptFailed": "לא ניתן לפענח מידע.",
     "uploadedSecurly": "ההעלאה הוצפנה מקצה לקצה, ולכן שרת Excalidraw וצד שלישי לא יכולים לקרוא את התוכן.",
-    "loadSceneOverridePrompt": "",
+    "loadSceneOverridePrompt": "טעינה של ציור חיצוני תחליף את התוכן הקיים שלך. האם תרצה להמשיך?",
-    "errorLoadingLibrary": "",
+    "errorLoadingLibrary": "קרתה שגיאה בטעינת הספריה החיצונית.",
-    "confirmAddLibrary": "",
+    "confirmAddLibrary": "הפעולה תוסיף {{numShapes}} צורה(ות) לספריה שלך. האם אתה בטוח?",
     "imageDoesNotContainScene": "",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "לא הצלחנו לשחזר את התצוגה מקובץ התמונה"
   },
   "toolBar": {
     "selection": "בחירה",
@@ -140,7 +148,7 @@
     "arrow": "חץ",
     "line": "קו",
     "text": "טקסט",
-    "library": "",
+    "library": "ספריה",
     "lock": "השאר את הכלי הנבחר פעיל גם לאחר סיום הציור"
   },
   "headings": {
@@ -151,18 +159,19 @@
   "hints": {
     "linearElement": "הקלק בשביל לבחור נקודות מרובות, גרור בשביל קו בודד",
     "freeDraw": "לחץ וגרור, שחרר כשסיימת",
-    "text": "",
+    "text": "טיפ: אפשר להוסיף טקסט על ידי לחיצה כפולה בכל מקום עם כלי הבחירה",
     "linearElementMulti": "הקלק על הנקודה האחרונה או הקש Escape או Enter לסיום",
+    "lockAngle": "",
     "resize": "ניתן להגביל פרופורציות על ידי לחיצה על SHIFT תוך כדי שינוי גודל,\nהחזק ALT בשביל לשנות גודל ביחס למרכז",
     "rotate": "ניתן להגביל זוויות על ידי לחיצה על SHIFT תוך כדי סיבוב",
-    "lineEditor_info": "",
+    "lineEditor_info": "לחץ לחיצה כפולה או אנטר לעריכת הנקודות",
-    "lineEditor_pointSelected": "",
+    "lineEditor_pointSelected": "לחץ על Delete להסרת נקודה, CtrlOrCmd+D לשכפל, או גרור להזזה",
-    "lineEditor_nothingSelected": ""
+    "lineEditor_nothingSelected": "בחר נקודה להזזה או הסרה, או החזק את כפתור Alt והקלק להוספת נקודות חדשות"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "לא הצלחנו להציג את התצוגה המקדימה",
-    "canvasTooBig": "",
+    "canvasTooBig": "הקנבס עלול להיות גדול מדי.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "טיפ: נסה להזיז את האלמנטים הרחוקים ביותר מעט קרוב יותר יחד."
   },
   "errorSplash": {
     "headingMain_pre": "אירעה שגיאה. נסה ",
@@ -205,13 +214,22 @@
     "textNewLine": "הוסף שורה חדשה (טקסט)",
     "textFinish": "סיים עריכה (טקסט)",
     "zoomToFit": "זום להתאמת כל האלמנטים למסך",
-    "preventBinding": ""
+    "zoomToSelection": "התמקד בבחירה",
+    "preventBinding": "מנע השתלבות חצים"
   },
   "encrypted": {
     "tooltip": "הרישומים שלך מוצפנים מקצה לקצה כך שהשרתים של Excalidraw לא יראו אותם לעולם."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "",
+    "angle": "זווית",
-    "tooManyColumns": ""
+    "element": "אלמנט",
+    "elements": "אלמנטים",
+    "height": "גובה",
+    "scene": "תצוגה",
+    "selected": "נבחר/ים",
+    "storage": "אחסון",
+    "title": "סטטיסטיקות לחנונים",
+    "total": "סה״כ",
+    "width": "רוחב"
   }
 }

src/locales/hi-IN.json

@@ -4,6 +4,7 @@
     "selectAll": "सभी चुनें",
     "multiSelect": "आकार को चयन में जोड़ें",
     "moveCanvas": "कैनवास को स्थानांतरित करें",
+    "cut": "काटें",
     "copy": "प्रतिलिपि",
     "copyAsPng": "क्लिपबोर्ड पर कॉपी करें ,पीएनजी के रूप में",
     "copyAsSvg": "क्लिपबोर्ड पर कॉपी करें,एसवीजी के रूप में",
@@ -28,6 +29,11 @@
     "edges": "किनारा",
     "sharp": "नुकीला",
     "round": "गोल",
+    "arrowheads": "तीर शीर्ष",
+    "arrowhead_none": "कोई भी नहीं",
+    "arrowhead_arrow": "तीर",
+    "arrowhead_bar": "बार",
+    "arrowhead_dot": "बिंदु",
     "fontSize": "फ़ॉन्ट का आकार",
     "fontFamily": "फ़ॉन्ट का परिवार",
     "onlySelected": "केवल चयनित",
@@ -63,17 +69,18 @@
     "language": "भाषा",
     "createRoom": "अधिवेशन",
     "duplicateSelection": "डुप्लिकेट",
-    "untitled": "",
+    "untitled": "अशीर्षित",
     "name": "नाम",
     "yourName": "आपका नाम",
     "madeWithExcalidraw": "मेड विथ एक्सकैलिडराव",
     "group": "समूह चयन",
     "ungroup": "समूह चयन असमूहीकृत करें",
     "collaborators": "सहयोगी",
-    "toggleGridMode": "टॉगल ग्रिड मोड",
+    "gridMode": "",
     "addToLibrary": "लाइब्रेरी से जोड़ें",
     "removeFromLibrary": "लाइब्रेरी से निकालें",
     "libraryLoadingMessage": "लाइब्रेरी खुल रही है",
+    "libraries": "",
     "loadingScene": "दृश्य खुल रहा है",
     "align": "",
     "alignTop": "",
@@ -110,9 +117,10 @@
     "redo": "फिर से करें",
     "roomDialog": "लाइव सहयोग शुरू करें",
     "createNewRoom": "एक नया कमरा बनाएं",
-    "toggleFullScreen": "पूर्णस्क्रीन चालू करें",
+    "fullScreen": "",
-    "toggleDarkMode": "",
+    "darkMode": "",
-    "toggleZenMode": "टॉगल ज़ेन मोड",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "जेन मोड से बाहर निकलें"
   },
   "alerts": {
@@ -153,6 +161,7 @@
     "freeDraw": "क्लिक करें और खींचें। समाप्त करने के लिए, छोड़ो",
     "text": "",
     "linearElementMulti": "अंतिम बिंदु पर क्लिक करें या समाप्त होने के लिए एस्केप या एंटर दबाएं",
+    "lockAngle": "",
     "resize": "आकार बदलते समय आप SHIFT को पकड़ कर अनुपात में कमी कर सकते हैं,\nकेंद्र से आकार बदलने के लिए ALT दबाए रखें",
     "rotate": "आप घूर्णन करते समय SHIFT पकड़कर कोणों को विवश कर सकते हैं",
     "lineEditor_info": "बिंदुओं को संपादित करने के लिए Enter पर डबल-क्लिक करें या दबाएँ",
@@ -205,13 +214,22 @@
     "textNewLine": "नई पंक्ति (पाठ) जोड़ें",
     "textFinish": "संपादन समाप्त करें (पाठ)",
     "zoomToFit": "सभी तत्वों को फिट करने के लिए ज़ूम करें",
+    "zoomToSelection": "",
     "preventBinding": ""
   },
   "encrypted": {
     "tooltip": "आपके चित्र अंत-से-अंत एन्क्रिप्टेड हैं, इसलिए एक्सक्लूसिव्रॉव के सर्वर उन्हें कभी नहीं देखेंगे।"
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "आपने एक संख्यात्मक कॉलम के बिना एक स्प्रेडशीट चिपकाई।",
+    "angle": "कोण",
-    "tooManyColumns": "आपने दो से अधिक कॉलम के साथ एक स्प्रेडशीट चिपकाई।"
+    "element": "",
+    "elements": "",
+    "height": "ऊंचाई",
+    "scene": "दृश्य",
+    "selected": "चयनित",
+    "storage": "संग्रह",
+    "title": "",
+    "total": "कुल",
+    "width": "चौड़ाई"
   }
 }

src/locales/hu-HU.json

@@ -2,88 +2,95 @@
   "labels": {
     "paste": "Beillesztés",
     "selectAll": "Összes kijelölése",
-    "multiSelect": "",
+    "multiSelect": "Elem hozzáadása a kiválasztáshoz",
-    "moveCanvas": "",
+    "moveCanvas": "Vászon mozgatása",
+    "cut": "Kivágás",
     "copy": "Másolás",
     "copyAsPng": "Vágólapra másolás mint PNG",
     "copyAsSvg": "Vágólapra másolás mint SVG",
     "bringForward": "Előrébb hozás",
-    "sendToBack": "",
+    "sendToBack": "Hátraküldés",
-    "bringToFront": "",
+    "bringToFront": "Előrehozás",
-    "sendBackward": "",
+    "sendBackward": "Hátrébb küldés",
     "delete": "Törlés",
-    "copyStyles": "",
+    "copyStyles": "Stílus másolása",
-    "pasteStyles": "",
+    "pasteStyles": "Stílus beillesztése",
     "stroke": "Körvonal",
     "background": "Háttér",
     "fill": "Kitöltés",
-    "strokeWidth": "",
+    "strokeWidth": "Körvonal vastagsága",
-    "strokeStyle": "",
+    "strokeStyle": "Körvonal stílusa",
-    "strokeStyle_solid": "",
+    "strokeStyle_solid": "Kitöltött",
-    "strokeStyle_dashed": "",
+    "strokeStyle_dashed": "Szaggatott",
-    "strokeStyle_dotted": "",
+    "strokeStyle_dotted": "Pontozott",
     "sloppiness": "Stílus",
     "opacity": "Áttetszőség",
-    "textAlign": "",
+    "textAlign": "Szöveg igazítása",
-    "edges": "",
+    "edges": "Szélek",
-    "sharp": "",
+    "sharp": "Éles",
-    "round": "",
+    "round": "Kerek",
-    "fontSize": "",
+    "arrowheads": "Nyílhegyek",
-    "fontFamily": "",
+    "arrowhead_none": "Nincs",
+    "arrowhead_arrow": "Nyíl",
+    "arrowhead_bar": "Oszlop",
+    "arrowhead_dot": "Pont",
+    "fontSize": "Betűméret",
+    "fontFamily": "Betűkészlet család",
     "onlySelected": "Csak a kiválasztott",
-    "withBackground": "Háttérrel együtt",
+    "withBackground": "",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Jelenet beágyazása az exportált fájlba",
     "exportEmbedScene_details": "",
-    "addWatermark": "",
+    "addWatermark": "Add hozzá, hogy \"Excalidraw-val készült\"",
-    "handDrawn": "",
+    "handDrawn": "Kézzel rajzolt",
     "normal": "Normál",
     "code": "Code",
     "small": "Kicsi",
     "medium": "Közepes",
     "large": "Nagy",
-    "veryLarge": "",
+    "veryLarge": "Nagyon nagy",
     "solid": "Kitöltött",
     "hachure": "Vonalkázott",
-    "crossHatch": "",
+    "crossHatch": "Keresztcsíkozott",
     "thin": "Vékony",
     "bold": "Félkövér",
     "left": "Bal",
-    "center": "",
+    "center": "Közép",
-    "right": "",
+    "right": "Jobb",
-    "extraBold": "",
+    "extraBold": "Extra Félkövér",
     "architect": "Tervezői",
     "artist": "Művészi",
     "cartoonist": "Karikatúrás",
-    "fileTitle": "",
+    "fileTitle": "Fájl címe",
     "colorPicker": "Színválasztó",
     "canvasBackground": "Vászon háttérszíne",
-    "drawingCanvas": "",
+    "drawingCanvas": "Rajzvászon",
     "layers": "Rétegek",
     "actions": "Műveletek",
     "language": "Nyelv",
     "createRoom": "Élő együttmüködés megosztása",
-    "duplicateSelection": "",
+    "duplicateSelection": "Duplikálás",
-    "untitled": "",
+    "untitled": "Névtelen",
     "name": "Név",
-    "yourName": "",
+    "yourName": "Neved",
-    "madeWithExcalidraw": "",
+    "madeWithExcalidraw": "Excalidraw-val készült",
-    "group": "",
+    "group": "Csoportosítás",
-    "ungroup": "",
+    "ungroup": "Csoportbontás",
-    "collaborators": "",
+    "collaborators": "Közreműködők",
-    "toggleGridMode": "",
+    "gridMode": "",
-    "addToLibrary": "",
+    "addToLibrary": "Hozzáadás a könyvtárhoz",
-    "removeFromLibrary": "",
+    "removeFromLibrary": "Eltávólítás a könyvtárból",
-    "libraryLoadingMessage": "",
+    "libraryLoadingMessage": "Könyvtár betöltése...",
-    "loadingScene": "",
+    "libraries": "Könyvtárak böngészése",
-    "align": "",
+    "loadingScene": "Jelenet betöltése...",
-    "alignTop": "",
+    "align": "Igazítás",
-    "alignBottom": "",
+    "alignTop": "Felülre igazítás",
-    "alignLeft": "",
+    "alignBottom": "Alulra igazítás",
-    "alignRight": "",
+    "alignLeft": "Balra igazítás",
-    "centerVertically": "",
+    "alignRight": "Jobbra igazítás",
-    "centerHorizontally": "",
+    "centerVertically": "Függőlegesen középre igazított",
-    "distributeHorizontally": "",
+    "centerHorizontally": "Vízszintesen középre igazított",
-    "distributeVertically": ""
+    "distributeHorizontally": "Vízszintes elosztás",
+    "distributeVertically": "Függőleges elosztás"
   },
   "buttons": {
     "clearReset": "Vászon törlése",
@@ -92,13 +99,13 @@
     "exportToSvg": "Exportálás SVG-be",
     "copyToClipboard": "Vágólapra másolás",
     "copyPngToClipboard": "PNG másolása a vágólapra",
-    "scale": "",
+    "scale": "Nagyítás",
     "save": "Mentés",
-    "saveAs": "",
+    "saveAs": "Mentés másként",
     "load": "Betöltés",
     "getShareableLink": "Megosztható link létrehozása",
     "close": "Bezárás",
-    "selectLanguage": "",
+    "selectLanguage": "Nyelv kiválasztása",
     "scrollBackToContent": "Visszagörgetés a tartalomhoz",
     "zoomIn": "Nagyítás",
     "zoomOut": "Kicsinyítés",
@@ -110,37 +117,38 @@
     "redo": "Újra végrehajtás",
     "roomDialog": "Élő együttműködés indítása",
     "createNewRoom": "Új szoba létrehozása",
-    "toggleFullScreen": "",
+    "fullScreen": "",
-    "toggleDarkMode": "",
+    "darkMode": "",
-    "toggleZenMode": "",
+    "lightMode": "",
-    "exitZenMode": ""
+    "zenMode": "",
+    "exitZenMode": "Zen mód elhagyása"
   },
   "alerts": {
     "clearReset": "Ez a művelet törli a vászont. Biztos benne?",
     "couldNotCreateShareableLink": "Nem sikerült megosztható linket létrehozni.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "Nem sikerült megosztható linket látrehozni: túl nagy a jelenet",
-    "couldNotLoadInvalidFile": "",
+    "couldNotLoadInvalidFile": "Nem sikerült betölteni a helytelen fájlt",
     "importBackendFailed": "Nem sikerült betölteni a szerverről.",
     "cannotExportEmptyCanvas": "Üres vászont nem lehet exportálni.",
     "couldNotCopyToClipboard": "Nem sikerült vágólapra menteni. Próbálja meg Chrome böngészővel.",
-    "decryptFailed": "Nem sikerült dekódolni az adatot.",
+    "decryptFailed": "Nem sikerült visszafejteni a titkosított adatot.",
     "uploadedSecurly": "A feltöltést végpontok közötti titkosítással biztosítottuk, ami azt jelenti, hogy az Excalidraw szerver és harmadik felek nem tudják elolvasni a feltöltés tartalmát.",
-    "loadSceneOverridePrompt": "",
+    "loadSceneOverridePrompt": "A betöltött külső rajz felül fogja írnia meglévőt. Szeretnéd folytatni?",
-    "errorLoadingLibrary": "",
+    "errorLoadingLibrary": "Hibába ütközött a harmarmadik féltől származó könyvtár betöltése.",
-    "confirmAddLibrary": "",
+    "confirmAddLibrary": "Ez a művelet {{numShapes}} formát fog hozzáadni a könyvtáradhoz. Biztos vagy benne?",
     "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": ""
   },
   "toolBar": {
     "selection": "Kiválasztás",
-    "draw": "",
+    "draw": "Szabadkézi rajz",
     "rectangle": "Téglalap",
     "diamond": "Rombusz",
     "ellipse": "Ellipszis",
     "arrow": "Nyíl",
     "line": "Vonal",
     "text": "Szöveg",
-    "library": "",
+    "library": "Könyvtár",
     "lock": "Rajzolás után az aktív eszközt tartsa kiválasztva"
   },
   "headings": {
@@ -150,19 +158,20 @@
   },
   "hints": {
     "linearElement": "Kattintson a több pont elindításához, húzza az egyenes vonalhoz",
-    "freeDraw": "",
+    "freeDraw": "Kattints és húzd, majd engedd el, amikor végeztél",
-    "text": "",
+    "text": "Tipp: A kiválasztó eszközzel bárhol létrehozhatsz szöveget dupla kattintással",
     "linearElementMulti": "Kattintson az utolsó pontra, vagy nyomja meg az Escape vagy az Enter billentyűt a befejezéshez",
+    "lockAngle": "",
     "resize": "",
     "rotate": "A SHIFT billentyű lenyomva tartásával korlátozhatja a szögek illesztését",
-    "lineEditor_info": "",
+    "lineEditor_info": "Kattints duplán, vagy nyomj entert a pontok szerkesztéséhez",
-    "lineEditor_pointSelected": "",
+    "lineEditor_pointSelected": "Nyomd meg a delete gombot a pont eltávolításához, Ctrl vagy Cmd + D-t a duplikáláshoz, vagy húzva mozgasd",
-    "lineEditor_nothingSelected": ""
+    "lineEditor_nothingSelected": "Válassz ki egy pontot a mozgatáshoz vagy törtléshez, vagy az Alt lenyomása mellett kattintva hozz létre új pontokat"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Előnézet nem jeleníthető meg",
-    "canvasTooBig": "",
+    "canvasTooBig": "A vászon talán túl nagy.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Tipp: próbáld meg a legtávolabbi elemeket közelebb mozgazni egy máshoz."
   },
   "errorSplash": {
     "headingMain_pre": "Hiba történt. Próbálja ",
@@ -184,34 +193,43 @@
     "button_stopSession": "Munkamenet leállítása",
     "desc_inProgressIntro": "Az élő együttműködési munkamenet folyamatban van.",
     "desc_shareLink": "Ossza meg ezt a linket bárkivel, akivel együtt szeretne működni:",
-    "desc_exitSession": ""
+    "desc_exitSession": "Az munkamenet leállítása kilépteti önt a szobából, de folytathatja a munkát a saját gépén. Vegye figyelembe, hogy ez nem érinti más emberek munkáját és ők továbbra is együttműködhetnek a saját változatukon."
   },
   "errorDialog": {
-    "title": ""
+    "title": "Hiba"
   },
   "shortcutsDialog": {
-    "title": "",
+    "title": "Gyorsbillentyűk",
-    "shapes": "",
+    "shapes": "Formák",
-    "or": "",
+    "or": "vagy",
-    "click": "",
+    "click": "klikk",
-    "drag": "",
+    "drag": "húzd",
-    "curvedArrow": "",
+    "curvedArrow": "Ívelt nyíl",
-    "curvedLine": "",
+    "curvedLine": "Ívelt vonal",
-    "editor": "",
+    "editor": "Szerkesztő",
-    "view": "",
+    "view": "Nézet",
-    "blog": "",
+    "blog": "Olvasd a blogunkat",
-    "howto": "",
+    "howto": "Kövesd az útmutatóinkat",
-    "github": "",
+    "github": "Hibát találtál? Küld be",
-    "textNewLine": "",
+    "textNewLine": "Új sor hozzáadása (szöveg)",
-    "textFinish": "",
+    "textFinish": "Szerkesztés befejezése (szöveg)",
     "zoomToFit": "",
+    "zoomToSelection": "Kijelölésre nagyítás",
     "preventBinding": ""
   },
   "encrypted": {
     "tooltip": ""
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "",
+    "angle": "Szög",
-    "tooManyColumns": ""
+    "element": "Elem",
+    "elements": "Elemek",
+    "height": "Magasság",
+    "scene": "",
+    "selected": "Kiválasztott",
+    "storage": "Tárhely",
+    "title": "",
+    "total": "Összesen",
+    "width": "Szélesség"
   }
 }

src/locales/id-ID.json

@@ -4,6 +4,7 @@
     "selectAll": "Pilih semua",
     "multiSelect": "Tambahkan elemen ke pilihan",
     "moveCanvas": "Pindahkan kanvas",
+    "cut": "Potong",
     "copy": "Salin",
     "copyAsPng": "Salin ke papan klip sebagai PNG",
     "copyAsSvg": "Salin ke papan klip sebagai SVG",
@@ -28,10 +29,15 @@
     "edges": "Tepi",
     "sharp": "Tajam",
     "round": "Bulat",
+    "arrowheads": "Mata panah",
+    "arrowhead_none": "Tidak ada",
+    "arrowhead_arrow": "Panah",
+    "arrowhead_bar": "Batang",
+    "arrowhead_dot": "Titik",
     "fontSize": "Ukuran font",
     "fontFamily": "Jenis font",
     "onlySelected": "Hanya yang Dipilih",
-    "withBackground": "Dengan Latar",
+    "withBackground": "Dengan latar",
     "exportEmbedScene": "Sematkan pemandangan ke dalam file yang diekspor",
     "exportEmbedScene_details": "Data pemandangan akan disimpan dalam file PNG/SVG yang diekspor, sehingga pemandangan itu dapat dipulihkan darinya.\nAkan membesarkan ukuran file yang diekspor.",
     "addWatermark": "Tambahkan \"Dibuat dengan Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "Kelompokan pilihan",
     "ungroup": "Pisahkan pilihan",
     "collaborators": "Kolaborator",
-    "toggleGridMode": "Aktifkan/Matikan mode kisi",
+    "gridMode": "Mode grid",
     "addToLibrary": "Tambahkan ke pustaka",
     "removeFromLibrary": "Hapus dari pustaka",
     "libraryLoadingMessage": "Memuat pustaka...",
+    "libraries": "Telusur pustaka",
     "loadingScene": "Memuat pemandangan...",
     "align": "Perataan",
     "alignTop": "Rata atas",
@@ -110,9 +117,10 @@
     "redo": "Ulangi",
     "roomDialog": "Mulai kolaborasi langsung",
     "createNewRoom": "Buat ruang baru",
-    "toggleFullScreen": "Beralih ke layar penuh",
+    "fullScreen": "Layar penuh",
-    "toggleDarkMode": "Aktifkan/Matikan mode gelap",
+    "darkMode": "Mode gelap",
-    "toggleZenMode": "Aktifkan/Matikan mode zen",
+    "lightMode": "Mode terang",
+    "zenMode": "Mode zen",
     "exitZenMode": "Keluar dari mode zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Memuat gambar external akan mengganti konten Anda yang ada. Apakah Anda ingin melanjutkan?",
     "errorLoadingLibrary": "Terdapat kesalahan dalam memuat pustaka pihak ketiga.",
     "confirmAddLibrary": "Ini akan menambahkan {{numShapes}} bentuk ke pustaka Anda. Anda yakin?",
-    "imageDoesNotContainScene": "File gambar tidak berisi data pemandangan. Apa Anda sudah aktifkan ini selama ekspor?",
+    "imageDoesNotContainScene": "Mengimpor gambar tidak didukung saat ini.\n\nApakah Anda ingin impor pemandangan? Gambar ini tidak berisi data pemandangan. Sudah ka Anda aktifkan ini ketika ekspor?",
     "cannotRestoreFromImage": "Pemandangan tidak dapat dipulihkan dari file gambar ini"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Klik dan seret, lepaskan jika Anda selesai",
     "text": "Tip: Anda juga dapat menambahkan teks dengan klik ganda di mana saja dengan alat pemilihan",
     "linearElementMulti": "Klik pada titik akhir atau tekan Escape atau Enter untuk menyelesaikan",
+    "lockAngle": "Anda dapat menjaga sudut dengan menahan SHIFT",
     "resize": "Anda dapat menjaga proposi dengan menekan SHIFT sambil mengubah ukuran,\ntekan AlT untuk mengubah ukuran dari tengah",
     "rotate": "Anda dapat menjaga sudut dengan menahan SHIFT sambil memutar",
     "lineEditor_info": "Klik ganda atau tekan Enter untuk mengedit titik",
@@ -205,13 +214,22 @@
     "textNewLine": "Tambahkan baris baru (teks)",
     "textFinish": "Selesai mengedit (teks)",
     "zoomToFit": "Perbesar agar sesuai dengan semua elemen",
+    "zoomToSelection": "Perbesar ke seleksi",
     "preventBinding": "Cegah pengikatan panah"
   },
   "encrypted": {
     "tooltip": "Gambar anda terenkripsi end-to-end sehingga server Excalidraw tidak akan pernah dapat melihatnya."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Anda menempelkan sebuah lembar bentang tanpa sebuah kolom numerik.",
+    "angle": "Sudut",
-    "tooManyColumns": "Anda menempelkan sebuah lembar bentang dengan lebih dari dua kolom."
+    "element": "Elemen",
+    "elements": "Elemen",
+    "height": "Tinggi",
+    "scene": "Pemandangan",
+    "selected": "Terpilih",
+    "storage": "Penyimpanan",
+    "title": "Statistik untuk nerd",
+    "total": "Total",
+    "width": "Lebar"
   }
 }

src/locales/it-IT.json

@@ -4,6 +4,7 @@
     "selectAll": "Seleziona tutto",
     "multiSelect": "Aggiungi elemento alla selezione",
     "moveCanvas": "Sposta tela",
+    "cut": "Taglia",
     "copy": "Copia",
     "copyAsPng": "Copia negli appunti come PNG",
     "copyAsSvg": "Copia negli appunti come SVG",
@@ -28,10 +29,15 @@
     "edges": "Bordi",
     "sharp": "Acuto",
     "round": "Rotondo",
+    "arrowheads": "Punta della freccia",
+    "arrowhead_none": "Nessuno",
+    "arrowhead_arrow": "Freccia",
+    "arrowhead_bar": "Barra",
+    "arrowhead_dot": "Punto",
     "fontSize": "Dimensione carattere",
     "fontFamily": "Carattere",
     "onlySelected": "Solo selezionati",
-    "withBackground": "Con Sfondo",
+    "withBackground": "Con sfondo",
     "exportEmbedScene": "Incorpora la scena nel file esportato",
     "exportEmbedScene_details": "I dati della scena saranno salvati nel file PNG/SVG esportato in modo che la scena possa essere ripristinata da esso.\nQuesto aumenterà la dimensione del file esportato.",
     "addWatermark": "Aggiungi \"Creato con Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "Crea gruppo da selezione",
     "ungroup": "Dividi gruppo da selezione",
     "collaborators": "Collaboratori",
-    "toggleGridMode": "Attiva/disattiva modalità quadrícula",
+    "gridMode": "Modalità griglia",
     "addToLibrary": "Aggiungi alla biblioteca",
     "removeFromLibrary": "Rimuovi dalla biblioteca",
     "libraryLoadingMessage": "Caricamento della biblioteca...",
+    "libraries": "Sfoglia librerie",
     "loadingScene": "Caricamento della scena...",
     "align": "Allinea",
     "alignTop": "Allinea in alto",
@@ -110,13 +117,14 @@
     "redo": "Ripeti",
     "roomDialog": "Inizia collaborazione in diretta",
     "createNewRoom": "Crea nuova stanza",
-    "toggleFullScreen": "Attiva/Disattiva schermo intero",
+    "fullScreen": "Schermo intero",
-    "toggleDarkMode": "Attiva tema scuro",
+    "darkMode": "Tema scuro",
-    "toggleZenMode": "Attiva/Disattiva modalità zen",
+    "lightMode": "Tema chiaro",
+    "zenMode": "Modalità Zen",
     "exitZenMode": "Uscire dalla modalità zen"
   },
   "alerts": {
-    "clearReset": "Questo cancellerà l'intera tela. Sei sicuro?",
+    "clearReset": "Questa azione cancellerà l'intera tela. Sei sicuro?",
     "couldNotCreateShareableLink": "Non riesco a creare un link condivisibile.",
     "couldNotCreateShareableLinkTooBig": "Impossibile creare il link condivisibile: la scena è troppo grande",
     "couldNotLoadInvalidFile": "Impossibile caricare un file no valido",
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Se carichi questo disegno esterno, sostituirà quello che hai. Vuoi continuare?",
     "errorLoadingLibrary": "Si è verificato un errore nel caricamento della libreria di terze parti.",
     "confirmAddLibrary": "Questo aggiungerà {{numShapes}} forma(e) alla tua biblioteca. Sei sicuro?",
-    "imageDoesNotContainScene": "Il file immagine non contiene dati di scena. È stato abilitato durante l'esportazione?",
+    "imageDoesNotContainScene": "L'importazione di immagini al momento non è supportata.\n\nVuoi importare una scena? Questa immagine non sembra contenere alcun dato di scena. Hai abilitato questa opzione durante l'esportazione?",
     "cannotRestoreFromImage": "Impossibile ripristinare la scena da questo file immagine"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Clicca e trascina, rilascia quando avrai finito",
     "text": "Suggerimento: puoi anche aggiungere del testo facendo doppio clic ovunque con lo strumento di selezione",
     "linearElementMulti": "Clicca sull'ultimo punto o premi Esc o Invio per finire",
+    "lockAngle": "Puoi limitare l'angolo tenendo premuto SHIFT",
     "resize": "Per vincolare le proporzioni, tenir premuto MAIUSC durante il ridimensionamento;\nper ridimensionare dal centro, tenir premuto ALT",
     "rotate": "Puoi mantenere gli angoli tenendo premuto SHIFT durante la rotazione",
     "lineEditor_info": "Fai doppio click o premi invio per modificare i punti",
@@ -205,13 +214,22 @@
     "textNewLine": "Aggiungi nuova riga (testo)",
     "textFinish": "Completa la modifica (testo)",
     "zoomToFit": "Adatta zoom per mostrare tutti gli elementi",
+    "zoomToSelection": "Zoom alla selezione",
     "preventBinding": "Prevenire l'associazione freccia"
   },
   "encrypted": {
     "tooltip": "I tuoi disegni sono crittografati end-to-end in modo che i server di Excalidraw non li possano mai vedere."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Hai incollato un foglio di calcolo senza una colonna numerica.",
+    "angle": "Angolo",
-    "tooManyColumns": "Hai incollato un foglio di calcolo con più di due colonne."
+    "element": "Elemento",
+    "elements": "Elementi",
+    "height": "Altezza",
+    "scene": "Scena",
+    "selected": "Selezionato",
+    "storage": "Memoria",
+    "title": "Statistiche per nerd",
+    "total": "Totale",
+    "width": "Larghezza"
   }
 }

src/locales/ja-JP.json

@@ -4,6 +4,7 @@
     "selectAll": "すべて選択",
     "multiSelect": "複数選択",
     "moveCanvas": "キャンバスを移動",
+    "cut": "",
     "copy": "コピー",
     "copyAsPng": "PNGとしてクリップボードへコピー",
     "copyAsSvg": "SVGとしてクリップボードへコピー",
@@ -28,10 +29,15 @@
     "edges": "角",
     "sharp": "四角",
     "round": "丸",
+    "arrowheads": "",
+    "arrowhead_none": "",
+    "arrowhead_arrow": "",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "フォントの大きさ",
     "fontFamily": "フォントの種類",
     "onlySelected": "選択中のみ",
-    "withBackground": "背景を含める",
+    "withBackground": "",
     "exportEmbedScene": "エクスポートされたファイルにシーンを埋め込みます",
     "exportEmbedScene_details": "シーンデータはエクスポートされたPNG/SVGファイルに保存され、シーンを復元することができます。\nエクスポートされたファイルのサイズは増加します。",
     "addWatermark": "\"Made with Excalidraw\"と表示",
@@ -70,10 +76,11 @@
     "group": "図形のグループ化",
     "ungroup": "グループ化を解除",
     "collaborators": "共同編集者",
-    "toggleGridMode": "グリッドモードに切り替える",
+    "gridMode": "",
     "addToLibrary": "ライブラリに追加",
     "removeFromLibrary": "ライブラリから削除",
     "libraryLoadingMessage": "ライブラリを読み込み中...",
+    "libraries": "",
     "loadingScene": "シーンを読み込み中...",
     "align": "整列",
     "alignTop": "上揃え",
@@ -110,9 +117,10 @@
     "redo": "やり直し",
     "roomDialog": "共同編集を開始する",
     "createNewRoom": "新しい部屋を作成する",
-    "toggleFullScreen": "全画面表示に切り替える",
+    "fullScreen": "",
-    "toggleDarkMode": "ダークモードに切り替える",
+    "darkMode": "",
-    "toggleZenMode": "集中モードに切り替える",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "集中モードをやめる"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "外部図面を読み込むと、既存のコンテンツが置き換わります。続行しますか？",
     "errorLoadingLibrary": "サードパーティライブラリの読み込み中にエラーが発生しました。",
     "confirmAddLibrary": "{{numShapes}} 個の図形をライブラリに追加します。よろしいですか？",
-    "imageDoesNotContainScene": "画像ファイルにシーンデータが含まれていません。エクスポート中にこれを有効にしましたか？",
+    "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": "このイメージファイルからシーンを復元できませんでした"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "クリックしてドラッグします。離すと終了します",
     "text": "ヒント: 選択ツールを使用して任意の場所をダブルクリックしてテキストを追加することもできます",
     "linearElementMulti": "最後のポイントをクリックするか、エスケープまたはEnterを押して終了します",
+    "lockAngle": "",
     "resize": "サイズを変更中にSHIFTを押しすと比率を制御できます。Altを押すと中央からサイズを変更できます。",
     "rotate": "回転中にSHIFT キーを押すと角度を制限することができます",
     "lineEditor_info": "ポイントを編集するには、ダブルクリックまたはEnterキーを押します",
@@ -205,13 +214,22 @@
     "textNewLine": "テキストの改行",
     "textFinish": "テキストの編集を終える",
     "zoomToFit": "すべての図形が収まるよう拡大/縮小",
+    "zoomToSelection": "",
     "preventBinding": "矢印を結合しない"
   },
   "encrypted": {
     "tooltip": "描画内容はエンドツーエンド暗号化が施されており、Excalidrawサーバーが内容を見ることはできません。"
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "数値の列が存在しないスプレッドシートをペーストしました。",
+    "angle": "",
-    "tooManyColumns": "2列以上のスプレッドシートを貼り付けました．"
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/ko-KR.json

@@ -4,6 +4,7 @@
     "selectAll": "전체 선택",
     "multiSelect": "선택 영역에 추가하기",
     "moveCanvas": "캔버스 이동",
+    "cut": "잘라내기",
     "copy": "복사하기",
     "copyAsPng": "클립보드로 PNG 이미지 복사",
     "copyAsSvg": "클립보드로 SVG 이미지 복사",
@@ -28,10 +29,15 @@
     "edges": "가장자리",
     "sharp": "선명하게",
     "round": "둥글게",
+    "arrowheads": "화살표 모양",
+    "arrowhead_none": "없음",
+    "arrowhead_arrow": "화살표",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "폰트 크기",
     "fontFamily": "폰트 스타일",
     "onlySelected": "선택한 항목만",
-    "withBackground": "배경 포함",
+    "withBackground": "",
     "exportEmbedScene": "",
     "exportEmbedScene_details": "",
     "addWatermark": "\"Made with Excalidraw\" 추가",
@@ -70,10 +76,11 @@
     "group": "그룹 생성",
     "ungroup": "그룹 해제",
     "collaborators": "공동 작업자",
-    "toggleGridMode": "격자 모드 켜기/끄기",
+    "gridMode": "",
     "addToLibrary": "라이브러리에 추가",
     "removeFromLibrary": "라이브러리에서 제거",
     "libraryLoadingMessage": "라이브러리 불러오는 중...",
+    "libraries": "",
     "loadingScene": "화면 불러오는 중...",
     "align": "",
     "alignTop": "",
@@ -110,9 +117,10 @@
     "redo": "다시 실행",
     "roomDialog": "실시간 협업 시작하기",
     "createNewRoom": "방 만들기",
-    "toggleFullScreen": "전체화면",
+    "fullScreen": "",
-    "toggleDarkMode": "다크 모드 켜기/끄기",
+    "darkMode": "",
-    "toggleZenMode": "젠 모드 켜기/끄기",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "젠 모드 종료하기"
   },
   "alerts": {
@@ -153,6 +161,7 @@
     "freeDraw": "클릭 후 드래그하세요. 완료되면 놓으세요.",
     "text": "",
     "linearElementMulti": "마지막 지점을 클릭하거나 Esc 또는 Enter 키를 눌러 완료하세요.",
+    "lockAngle": "",
     "resize": "",
     "rotate": "SHIFT 키를 누르면서 회전하면 각도를 제한할 수 있습니다.",
     "lineEditor_info": "포인트를 수정하려면 두 번 클릭하거나 엔터 키를 누르세요.",
@@ -205,13 +214,22 @@
     "textNewLine": "줄바꾸기",
     "textFinish": "편집 완료",
     "zoomToFit": "",
+    "zoomToSelection": "",
     "preventBinding": ""
   },
   "encrypted": {
     "tooltip": ""
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "",
+    "angle": "",
-    "tooManyColumns": ""
+    "element": "",
+    "elements": "",
+    "height": "",
+    "scene": "",
+    "selected": "",
+    "storage": "",
+    "title": "",
+    "total": "",
+    "width": ""
   }
 }

src/locales/my-MM.json

@@ -4,6 +4,7 @@
     "selectAll": "အကုန်ရွေး",
     "multiSelect": "ရွေးထားသည့်ထဲပုံထည့်",
     "moveCanvas": "ကားချပ်ရွှေ့",
+    "cut": "",
     "copy": "ကူး",
     "copyAsPng": "PNG အနေဖြင့်ကူး",
     "copyAsSvg": "SVG အနေဖြင့်ကူး",
@@ -28,10 +29,15 @@
     "edges": "အစွန်း",
     "sharp": "ထောင့်ချွန်",
     "round": "ထောင့်ဝိုင်း",
+    "arrowheads": "မြှားခေါင်း",
+    "arrowhead_none": "ဘာမျှမရှိ",
+    "arrowhead_arrow": "မြှား",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "",
     "fontSize": "စာလုံးအရွယ်",
     "fontFamily": "စာလုံးပုံစံ",
     "onlySelected": "ရွေးထားသလောက်",
-    "withBackground": "နောက်ခံပါထည့်",
+    "withBackground": "",
     "exportEmbedScene": "မြင်ကွင်းပါမြှုပ်နှံ၍ထုတ်ပါ",
     "exportEmbedScene_details": "ထုတ်ယူလိုက်သော PNG/SVG ထဲမြင်ကွင်းအချက်အလက်များပါဝင်သဖြင့် ပြန်လည်ရယူနိုင်သော်လည်း ဖိုင်အရွယ်အစားကြီးပါမည်။",
     "addWatermark": "\"Excalidraw ဖြင့်ဖန်တီးသည်။\" စာသားထည့်",
@@ -54,7 +60,7 @@
     "architect": "ဗိသုကာ",
     "artist": "ပန်းချီ",
     "cartoonist": "ကာတွန်း",
-    "fileTitle": "",
+    "fileTitle": "ခေါင်းစဉ်",
     "colorPicker": "အရောင်ရွေး",
     "canvasBackground": "ကားချပ်နောက်ခံ",
     "drawingCanvas": "ပုံဆွဲကားချပ်",
@@ -63,17 +69,18 @@
     "language": "ဘာသာစကား",
     "createRoom": "တိုက်ရိုက်ပူးပေါင်းဆောင်ရွက်ရန်အဖွဲ့ဖွဲ့",
     "duplicateSelection": "ပွား",
-    "untitled": "",
+    "untitled": "အမည်မရှိ",
     "name": "အမည်",
     "yourName": "သင့်အမည်",
     "madeWithExcalidraw": "Excalidraw ဖြင့်ဖန်တီးသည်။",
     "group": "အုပ်စုဖွဲ့",
     "ungroup": "အုပ်စုဖျက်သိမ်း",
     "collaborators": "ပူးပေါင်းပါဝင်သူများ",
-    "toggleGridMode": "ဇယားကွက်ဖော်/ဖျောက်",
+    "gridMode": "",
     "addToLibrary": "မှတ်တမ်းတင်",
     "removeFromLibrary": "မှတ်တမ်းမှထုတ်",
     "libraryLoadingMessage": "မှတ်တမ်းအား တင်သွင်းနေသည်...",
+    "libraries": "စာကြည့်တိုက်တွင်ရှာဖွေပါ",
     "loadingScene": "မြင်ကွင်းဖော်နေသည်...",
     "align": "ချိန်ညှိ",
     "alignTop": "ထိပ်ညှိ",
@@ -82,8 +89,8 @@
     "alignRight": "ညာညှိ",
     "centerVertically": "ဒေါင်လိုက်အလယ်ညှိ",
     "centerHorizontally": "အလျားလိုက်အလယ်ညှိ",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "အလျားလိုက်",
-    "distributeVertically": ""
+    "distributeVertically": "ထောင်လိုက်"
   },
   "buttons": {
     "clearReset": "ကားချပ်ရှင်းလင်း",
@@ -110,9 +117,10 @@
     "redo": "ထပ်လုပ်",
     "roomDialog": "တိုက်ရိုက်ပူးပေါင်းမှုစတင်",
     "createNewRoom": "အခန်းသစ်ဖွဲ့",
-    "toggleFullScreen": "မြင်ကွင်းကျယ်ဖွင့်/ပိတ်",
+    "fullScreen": "",
-    "toggleDarkMode": "အလင်း/အမှောင်",
+    "darkMode": "",
-    "toggleZenMode": "ဇင်မြင်ကွင်းဖွင့်/ပိတ်",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "ဇင်မြင်ကွင်းမှထွက်"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "လက်ရှိရေးဆွဲထားသမျှအား ပြင်ပမှတင်သွင်းသောပုံနှင့်အစားထိုးပါမည်။ ဆက်လက်ဆောင်ရွက်လိုပါသလား။",
     "errorLoadingLibrary": "ပြင်ပမှမှတ်တမ်းအားတင်သွင်းရာတွင်အမှားအယွင်းရှိနေသည်။",
     "confirmAddLibrary": "{{numShapes}} ခုသောပုံသဏ္ဌာန်အားမှတ်တမ်းတင်ပါမည်။ အတည်ပြုပါ။",
-    "imageDoesNotContainScene": "ပုံတွင် မြင်ကွင်းအချက်အလက်များမပါဝင်ပါ။ ပုံထုတ်ယူချိန်တွင်ထည့်သွင်းခဲ့ပါသလား။",
+    "imageDoesNotContainScene": "",
     "cannotRestoreFromImage": "ဤပုံဖြင့်မြင်ကွင်းပြန်လည်မရယူနိုင်ပါ။"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "ကလစ်နှိပ်၍ တရွတ်ဆွဲပါ၊ ပြီးလျှင်လွှတ်ပါ။",
     "text": "မှတ်ချက်။ ။မည်သည့်ကိရိယာရွေးထားသည်ဖြစ်စေ ကလစ်နှစ်ချက်နှိပ်၍စာသားထည့်နိုင်သည်",
     "linearElementMulti": "နောက်ဆုံးအမှတ်ပေါ်တွင်ကလစ်နှိပ်ခြင်း၊ Escape (သို့) Enter နှိပ်ခြင်းတို့ဖြင့်အဆုံးသတ်နိုင်",
+    "lockAngle": "",
     "resize": "အချိုးအစားကန့်သတ်ရန် Shift နှင့် ဗဟိုမှချိန်ညှိရန် Alt တို့ကိုနှိပ်ထားနိုင်သည်",
     "rotate": "Shift ကိုနှိပ်ထားခြင်းဖြင့် ထောင့်အလိုက်လှည့်နိုင်သည်",
     "lineEditor_info": "အမှတ်များပြင်ဆင်သတ်မှတ်ရင် ကလစ်နှစ်ချက် (သို့) Enter ကိုနှိပ်ပါ",
@@ -205,13 +214,22 @@
     "textNewLine": "စာသားဖြည့်သွင်း",
     "textFinish": "စာသားဖြည့်သွင်းပြီး",
     "zoomToFit": "ကားချပ်အပြည့်ဖေါ်",
+    "zoomToSelection": "",
     "preventBinding": "မြှားများမပေါင်းစေရန်"
   },
   "encrypted": {
     "tooltip": "ရေးဆွဲထားသောပုံများအား နှစ်ဘက်စွန်းတိုင်လျှို့ဝှက်ထားသဖြင့် Excalidraw ၏ဆာဗာများပင်လျှင်မြင်တွေ့ရမည်မဟုတ်ပါ။"
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "အမှတ်စဉ်ကော်လံမပါဝင်သောဇယားအားထည့်သွင်းလိုက်သည်။",
+    "angle": "ထောင့်",
-    "tooManyColumns": "ကော်လံနှစ်ခုထက်ပိုပါနေသောဇယားအားထည့်သွင်းလိုက်သည်။"
+    "element": "",
+    "elements": "",
+    "height": "အမြင့်",
+    "scene": "မြင်ကွင်း",
+    "selected": "ရွေးချယ်သည်",
+    "storage": "သိုလှောင်ခန်း",
+    "title": "အက္ခရာများအတွက်အချက်အလက်များ",
+    "total": "စုစုပေါင်း",
+    "width": "အကျယ်"
   }
 }

src/locales/nb-NO.json

@@ -4,6 +4,7 @@
     "selectAll": "Velg alt",
     "multiSelect": "Legg til element i utvalg",
     "moveCanvas": "Flytt lerretet",
+    "cut": "Klipp ut",
     "copy": "Kopier",
     "copyAsPng": "Kopier til PNG",
     "copyAsSvg": "Kopier til utklippstavlen som SVG",
@@ -28,10 +29,15 @@
     "edges": "Kanter",
     "sharp": "Skarp",
     "round": "Rund",
+    "arrowheads": "Pilspisser",
+    "arrowhead_none": "Ingen",
+    "arrowhead_arrow": "Pil",
+    "arrowhead_bar": "Søyle",
+    "arrowhead_dot": "Prikk",
     "fontSize": "Skriftstørrelse",
     "fontFamily": "Fontfamilie",
     "onlySelected": "Kun valgte",
-    "withBackground": "Inkluder bakgrunn",
+    "withBackground": "Med bakgrunn",
     "exportEmbedScene": "Bygg inn scenen i den eksporterte filen",
     "exportEmbedScene_details": "Scenedata vil bli lagret i den eksporterte PNG/SVG-filen, slik at scenen kan gjenopprettes fra den.\nDet vil øke den eksporterte filstørrelsen.",
     "addWatermark": "Legg til \"Laget med Excalidraw\"",
@@ -70,10 +76,11 @@
     "group": "Gruppér utvalg",
     "ungroup": "Avgruppér utvalg",
     "collaborators": "Samarbeidspartnere",
-    "toggleGridMode": "Slå av/på rutenett",
+    "gridMode": "Rutevisning",
     "addToLibrary": "Legg til i bibliotek",
     "removeFromLibrary": "Fjern fra bibliotek",
     "libraryLoadingMessage": "Laster bibliotek...",
+    "libraries": "Bla gjennom biblioteker",
     "loadingScene": "Laster inn scene...",
     "align": "Juster",
     "alignTop": "Juster øverst",
@@ -110,9 +117,10 @@
     "redo": "Gjør om",
     "roomDialog": "Start sanntids-samarbeid",
     "createNewRoom": "Opprett et nytt rom",
-    "toggleFullScreen": "Skru fullskjerm av/på",
+    "fullScreen": "Fullskjerm",
-    "toggleDarkMode": "Skru mørk modus av/på",
+    "darkMode": "Mørk modus",
-    "toggleZenMode": "Slå av/på zen-modus",
+    "lightMode": "Lys modus",
+    "zenMode": "Zen-modus",
     "exitZenMode": "Avslutt zen-modus"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Å laste inn ekstern tegning vil erstatte det eksisterende innholdet. Ønsker du å fortsette?",
     "errorLoadingLibrary": "Det oppstod en feil under lasting av tredjepartsbiblioteket.",
     "confirmAddLibrary": "Dette vil legge til {{numShapes}} figur(er) i biblioteket ditt. Er du sikker?",
-    "imageDoesNotContainScene": "Bildefilen inneholder ikke scenedata. Har du aktivert dette under eksport?",
+    "imageDoesNotContainScene": "Importering av bilder støttes ikke for øyeblikket.\n\nVil du importere en scene? Dette bildet ser ikke ut til å inneholde noen scene-data. Har du aktivert dette under eksporten?",
     "cannotRestoreFromImage": "Scenen kunne ikke gjenopprettes fra denne bildefilen"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Klikk og dra, slipp når du er ferdig",
     "text": "Tips: du kan også legge til tekst ved å dobbeltklikke hvor som helst med utvalgsverktøyet",
     "linearElementMulti": "Klikk på siste punkt eller trykk Escape eller Enter for å fullføre",
+    "lockAngle": "Du kan låse vinkelen ved å holde nede SHIFT",
     "resize": "Du kan beholde forholdet ved å trykke SHIFT mens du endrer størrelse,\ntrykk ALT for å endre størrelsen fra midten",
     "rotate": "Du kan låse vinklene ved å holde SHIFT mens du roterer",
     "lineEditor_info": "Dobbeltklikk eller trykk Enter for å redigere punkter",
@@ -205,13 +214,22 @@
     "textNewLine": "Legg til ny linje (tekst)",
     "textFinish": "Fullfør redigering (tekst)",
     "zoomToFit": "Zoom for å passe alle elementene",
+    "zoomToSelection": "Zoom til utvalg",
     "preventBinding": "Forhindre pilbinding"
   },
   "encrypted": {
     "tooltip": "Dine tegninger er ende-til-ende-krypterte slik at Excalidraw sine servere aldri vil se dem."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Du limte inn et regneark uten en numerisk kolonne.",
+    "angle": "Vinkel",
-    "tooManyColumns": "Du limte inn et regneark med mer enn to kolonner."
+    "element": "Element",
+    "elements": "Elementer",
+    "height": "Høyde",
+    "scene": "Scene",
+    "selected": "Valgt",
+    "storage": "Lagring",
+    "title": "Statistikk for nerder",
+    "total": "Totalt",
+    "width": "Bredde"
   }
 }

src/locales/nl-NL.json

@@ -4,11 +4,12 @@
     "selectAll": "Alles selecteren",
     "multiSelect": "Voeg element toe aan selectie",
     "moveCanvas": "Canvas verplaatsen",
+    "cut": "Knip",
     "copy": "Kopiëren",
     "copyAsPng": "Kopieer als PNG",
-    "copyAsSvg": "Kopieer als SVG",
+    "copyAsSvg": "Kopieer naar klembord als SVG",
     "bringForward": "Breng naar voren",
-    "sendToBack": "Breng naar achtergrond",
+    "sendToBack": "Stuur naar achtergrond",
     "bringToFront": "Breng naar voorgrond",
     "sendBackward": "Breng naar achter",
     "delete": "Verwijderen",
@@ -28,12 +29,17 @@
     "edges": "Randen",
     "sharp": "Hoekig",
     "round": "Rond",
+    "arrowheads": "Pijlpunten",
+    "arrowhead_none": "Geen",
+    "arrowhead_arrow": "Pijl",
+    "arrowhead_bar": "Balk",
+    "arrowhead_dot": "Punt",
     "fontSize": "Tekstgrootte",
     "fontFamily": "Lettertype",
     "onlySelected": "Enkel geselecteerde",
     "withBackground": "Met achtergrond",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Scène in geëxporteerd bestand invoegen",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "Scènegegevens worden in het geëxporteerde PNG/SVG-bestand opgeslagen zodat de scène kan worden hersteld.\nDe grootte van de geëxporteerde bestanden zal toenemen.",
     "addWatermark": "Voeg \"Gemaakt met Excalidraw\" toe",
     "handDrawn": "Handgetekend",
     "normal": "Normaal",
@@ -54,7 +60,7 @@
     "architect": "Architect",
     "artist": "Artiest",
     "cartoonist": "Cartoonist",
-    "fileTitle": "",
+    "fileTitle": "Bestandsnaam",
     "colorPicker": "Kleurenkiezer",
     "canvasBackground": "Canvas achtergrond",
     "drawingCanvas": "Canvas",
@@ -63,27 +69,28 @@
     "language": "Taal",
     "createRoom": "Deel een live-samenwerkingssessie",
     "duplicateSelection": "Dupliceer",
-    "untitled": "",
+    "untitled": "Naamloos",
     "name": "Naam",
     "yourName": "Jouw naam",
     "madeWithExcalidraw": "Gemaakt met Excalidraw",
     "group": "Groeperen",
     "ungroup": "Groep opheffen",
     "collaborators": "Deelnemers",
-    "toggleGridMode": "Rasterlijnen in-/uitschakelen",
+    "gridMode": "Rasterweergave",
     "addToLibrary": "Voeg toe aan bibliotheek",
     "removeFromLibrary": "Verwijder uit bibliotheek",
     "libraryLoadingMessage": "Bibliotheek laden...",
+    "libraries": "Blader door bibliotheken",
     "loadingScene": "Scène laden...",
-    "align": "",
+    "align": "Uitlijnen",
-    "alignTop": "",
+    "alignTop": "Boven uitlijnen",
-    "alignBottom": "",
+    "alignBottom": "Onder uitlijnen",
-    "alignLeft": "",
+    "alignLeft": "Links uitlijnen",
-    "alignRight": "",
+    "alignRight": "Rechts uitlijnen",
-    "centerVertically": "",
+    "centerVertically": "Verticaal Centreren",
-    "centerHorizontally": "",
+    "centerHorizontally": "Horizontaal Centreren",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Horizontaal verspreiden",
-    "distributeVertically": ""
+    "distributeVertically": "Verticaal distribueren"
   },
   "buttons": {
     "clearReset": "Canvas opnieuw instellen",
@@ -110,15 +117,16 @@
     "redo": "Herstel ongedaan maken",
     "roomDialog": "Live-samenwerkingssessie starten",
     "createNewRoom": "Creëer live-samenwerkingssessie",
-    "toggleFullScreen": "Volledig scherm in-/uitschakelen",
+    "fullScreen": "Volledig scherm",
-    "toggleDarkMode": "Donkere modus in-/uitschakelen",
+    "darkMode": "Donkere modus",
-    "toggleZenMode": "Zen modus in-/uitschakelen",
+    "lightMode": "Lichte modus",
+    "zenMode": "Zen modus",
     "exitZenMode": "Verlaat zen modus"
   },
   "alerts": {
     "clearReset": "Dit zal het hele canvas verwijderen. Weet je het zeker?",
     "couldNotCreateShareableLink": "Kon geen deelbare link aanmaken.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "Kan geen deelbare link aanmaken: de scène is te groot",
     "couldNotLoadInvalidFile": "Kan ongeldig bestand niet laden",
     "importBackendFailed": "Importeren vanuit backend mislukt.",
     "cannotExportEmptyCanvas": "Kan geen leeg canvas exporteren.",
@@ -128,8 +136,8 @@
     "loadSceneOverridePrompt": "Het laden van externe tekening zal uw bestaande inhoud vervangen. Wil je doorgaan?",
     "errorLoadingLibrary": "Bij het laden van de externe bibliotheek is een fout opgetreden.",
     "confirmAddLibrary": "Hiermee worden {{numShapes}} vorm(n) aan uw bibliotheek toegevoegd. Ben je het zeker?",
-    "imageDoesNotContainScene": "",
+    "imageDoesNotContainScene": "Afbeeldingen importeren wordt op dit moment niet ondersteund.\n\nWil je een scène importeren? Deze afbeelding lijkt geen scène gegevens te bevatten. Heb je dit geactiveerd tijdens het exporteren?",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "Scène kan niet worden hersteld vanuit dit afbeeldingsbestand"
   },
   "toolBar": {
     "selection": "Selectie",
@@ -153,6 +161,7 @@
     "freeDraw": "Klik en sleep, laat los als je klaar bent",
     "text": "Tip: je kunt tekst toevoegen door ergens dubbel te klikken met de selectietool",
     "linearElementMulti": "Klik op het laatste punt of druk op Escape of Enter om te stoppen",
+    "lockAngle": "Je kunt de hoek beperken door SHIFT ingedrukt te houden",
     "resize": "Houd tijdens het vergroten SHIFT ingedrukt om verhoudingen te behouden,\ngebruik ALT om vanuit het midden te vergroten/verkleinen",
     "rotate": "Je kan hoeken beperken door SHIFT ingedrukt te houden wanneer je draait",
     "lineEditor_info": "Dubbelklik of druk op Enter om punten te bewerken",
@@ -160,9 +169,9 @@
     "lineEditor_nothingSelected": "Selecteer een punt om te verplaatsen of te verwijderen, of houd Alt ingedrukt en klik om nieuwe punten toe te voegen"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Kan voorbeeld niet tonen",
-    "canvasTooBig": "",
+    "canvasTooBig": "Het canvas is mogelijk te groot.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Tip: beweeg de verste elementen iets dichter bij elkaar."
   },
   "errorSplash": {
     "headingMain_pre": "Fout opgetreden. Probeer ",
@@ -184,7 +193,7 @@
     "button_stopSession": "Sessie afbreken",
     "desc_inProgressIntro": "De live-samenwerkingssessie is nu gestart.",
     "desc_shareLink": "Deel deze link met iedereen waarmee je wil samenwerken:",
-    "desc_exitSession": ""
+    "desc_exitSession": "Het stoppen van de sessie zal je loskoppelen van de kamer, maar je kunt lokaal doorwerken met de scène.\nPas op: dit heeft geen invloed op andere mensen en dat zij nog steeds in staat zullen zijn om samen te werken aan hun versie."
   },
   "errorDialog": {
     "title": "Fout"
@@ -205,13 +214,22 @@
     "textNewLine": "Nieuwe regel toevoegen (tekst)",
     "textFinish": "Voltooi bewerken (tekst)",
     "zoomToFit": "Zoom in op alle elementen",
-    "preventBinding": ""
+    "zoomToSelection": "Inzoomen op selectie",
+    "preventBinding": "Pijlbinding voorkomen"
   },
   "encrypted": {
     "tooltip": "Je tekeningen zijn beveiligd met end-to-end encryptie, dus Excalidraw's servers zullen nooit zien wat je tekent."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Je hebt een werkblad geplakt zonder een numerieke kolom.",
+    "angle": "Hoek",
-    "tooManyColumns": "Je hebt een werkblad geplakt met meer dan twee kolommen."
+    "element": "Element",
+    "elements": "Elementen",
+    "height": "Hoogte",
+    "scene": "Scene",
+    "selected": "Geselecteerd",
+    "storage": "Opslag",
+    "title": "Statistieken voor nerds",
+    "total": "Totaal",
+    "width": "Breedte"
   }
 }

src/locales/nn-NO.json

@@ -4,6 +4,7 @@
     "selectAll": "Vel alt",
     "multiSelect": "Legg til element i utval",
     "moveCanvas": "Flytt lerretet",
+    "cut": "Klipp ut",
     "copy": "Kopier",
     "copyAsPng": "Kopier til utklippstavla som PNG",
     "copyAsSvg": "Kopier til utklippstavla som SVG",
@@ -28,12 +29,17 @@
     "edges": "Kanter",
     "sharp": "Skarp",
     "round": "Rund",
+    "arrowheads": "Pilhovud",
+    "arrowhead_none": "Ingen",
+    "arrowhead_arrow": "Pil",
+    "arrowhead_bar": "Stolpe",
+    "arrowhead_dot": "Prikk",
     "fontSize": "Skriftstorleik",
     "fontFamily": "Skrifttype",
     "onlySelected": "Kun valde",
-    "withBackground": "Inkluder bakgrunn",
+    "withBackground": "Med bakgrunn",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Bygg scena inn i eksportert fil",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "Scenedataa vert lagra i den eksporterte PNG- eller SVG-fila slik at scena kan bli gjenopprettast frå den. Dette vil auke eksportert filstorleik.",
     "addWatermark": "Legg til «Laga med Excalidraw»",
     "handDrawn": "Handteikna",
     "normal": "Normal",
@@ -54,7 +60,7 @@
     "architect": "Arkitekt",
     "artist": "Kunstnar",
     "cartoonist": "Teiknar",
-    "fileTitle": "",
+    "fileTitle": "Filnamn",
     "colorPicker": "Fargeveljar",
     "canvasBackground": "Lerretsbakgrunn",
     "drawingCanvas": "Lerret",
@@ -63,27 +69,28 @@
     "language": "Språk",
     "createRoom": "Del ei sanntids-samarbeidsøkt",
     "duplicateSelection": "Dupliser",
-    "untitled": "",
+    "untitled": "Utan namn",
     "name": "Namn",
     "yourName": "Namnet ditt",
     "madeWithExcalidraw": "Laga med Excalidraw",
     "group": "Grupper utval",
     "ungroup": "Avgrupper utval",
     "collaborators": "Samarbeidarar",
-    "toggleGridMode": "Sla på/av rutenett",
+    "gridMode": "",
     "addToLibrary": "Legg til i bibliotek",
     "removeFromLibrary": "Fjern frå bibliotek",
     "libraryLoadingMessage": "Laster bibliotek...",
+    "libraries": "Blad gjennom bibliotek",
     "loadingScene": "Laster scene...",
-    "align": "",
+    "align": "Juster",
-    "alignTop": "",
+    "alignTop": "Juster til topp",
-    "alignBottom": "",
+    "alignBottom": "Juster til botn",
-    "alignLeft": "",
+    "alignLeft": "Juster til venstre",
-    "alignRight": "",
+    "alignRight": "Juster til høgre",
-    "centerVertically": "",
+    "centerVertically": "Midtstill vertikalt",
-    "centerHorizontally": "",
+    "centerHorizontally": "Midtstill horisontalt",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Sprei horisontalt",
-    "distributeVertically": ""
+    "distributeVertically": "Sprei vertikalt"
   },
   "buttons": {
     "clearReset": "Tilbakestill lerretet",
@@ -92,7 +99,7 @@
     "exportToSvg": "Eksporter til SVG",
     "copyToClipboard": "Kopier til utklippstavla",
     "copyPngToClipboard": "Kopier PNG til utklippstavla",
-    "scale": "",
+    "scale": "Skaler",
     "save": "Lagre",
     "saveAs": "Lagre som",
     "load": "Opne",
@@ -110,15 +117,16 @@
     "redo": "Gjer om",
     "roomDialog": "Start sanntids-samarbeid",
     "createNewRoom": "Lag nytt rom",
-    "toggleFullScreen": "Slå på/av fullskjerm",
+    "fullScreen": "",
-    "toggleDarkMode": "Skru av/på skumringsmodus",
+    "darkMode": "",
-    "toggleZenMode": "Slå på/av zen-modus",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "Avslutt zen-modus"
   },
   "alerts": {
     "clearReset": "Dette vil tømme lerretet. Er du sikker?",
     "couldNotCreateShareableLink": "Kunne ikkje lage delingslenke.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "Kunne ikkje opprette deleleg lenke: scena er for stor",
     "couldNotLoadInvalidFile": "Kunne ikkje laste inn ugyldig fil",
     "importBackendFailed": "Importering av backend feila.",
     "cannotExportEmptyCanvas": "Kan ikkje eksportere eit tomt lerret.",
@@ -129,7 +137,7 @@
     "errorLoadingLibrary": "Det oppstod ein feil under lastinga av tredjepartsbibliotek.",
     "confirmAddLibrary": "Dette vil legge til {{numShapes}} form(er) i biblioteket ditt. Er du sikker?",
     "imageDoesNotContainScene": "",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "Scena kunne ikkje gjenopprettast frå denne biletfila"
   },
   "toolBar": {
     "selection": "Vel",
@@ -153,6 +161,7 @@
     "freeDraw": "Klikk og drag, slepp når du er ferdig",
     "text": "Tips: du kan òg leggje til tekst ved å dobbeltklikke kor som helst med utvalgsverktyet",
     "linearElementMulti": "Klikk på siste punkt eller trykk Escape eller Enter for å fullføre",
+    "lockAngle": "",
     "resize": "Du kan halde fram med forholdet ved å trykke SHIFT medan du endrar storleik,\ntrykk ALT for å endre storleiken frå midten",
     "rotate": "Du kan låse vinklane ved å halde SHIFT medan du roterer",
     "lineEditor_info": "Dobbeltklikk eller trykk Enter for å redigere punkt",
@@ -160,9 +169,9 @@
     "lineEditor_nothingSelected": "Vel eit punkt å flytte eller fjerne, eller hald Alt og klikk for å legge til nye punkt"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Kan ikkje vise førehandsvising",
-    "canvasTooBig": "",
+    "canvasTooBig": "Lerretet er mogleg for stort.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Tips: prøv å flytte elementa som er lengst frå kvarandre, litt nærare kvarandre."
   },
   "errorSplash": {
     "headingMain_pre": "Ein feil oppstod. Prøv ",
@@ -205,13 +214,22 @@
     "textNewLine": "Legg til ny linje (tekst)",
     "textFinish": "Fullfør redigering (tekst)",
     "zoomToFit": "Zoom for å sjå alle elementa",
+    "zoomToSelection": "Zoom til utval",
     "preventBinding": "Hindre pilkobling"
   },
   "encrypted": {
     "tooltip": "Teikningane dine er ende-til-ende-krypterte slik at Excalidraw sine serverar aldri får sjå dei."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Du limte inn eit rekneark utan ei numerisk kolonne.",
+    "angle": "Vinkel",
-    "tooManyColumns": "Du limte inn eit rekneark med meir enn to kolonnar."
+    "element": "Element",
+    "elements": "Element",
+    "height": "Høgde",
+    "scene": "Scene",
+    "selected": "Valde",
+    "storage": "Lagring",
+    "title": "Statistikk for nerdar",
+    "total": "Totalt",
+    "width": "Breidde"
   }
 }

src/locales/percentages.json

@@ -1,33 +1,34 @@
 {
-  "ar-SA": 98,
+  "ar-SA": 86,
-  "bg-BG": 67,
+  "bg-BG": 60,
-  "ca-ES": 89,
+  "ca-ES": 78,
   "de-DE": 100,
   "el-GR": 96,
   "en": 100,
-  "es-ES": 89,
+  "es-ES": 99,
-  "fa-IR": 98,
+  "fa-IR": 86,
   "fi-FI": 100,
   "fr-FR": 100,
-  "he-IL": 76,
+  "he-IL": 96,
-  "hi-IN": 85,
+  "hi-IN": 82,
-  "hu-HU": 48,
+  "hu-HU": 92,
   "id-ID": 100,
   "it-IT": 100,
-  "ja-JP": 98,
+  "ja-JP": 85,
-  "ko-KR": 75,
+  "ko-KR": 67,
-  "my-MM": 97,
+  "my-MM": 93,
   "nb-NO": 100,
-  "nl-NL": 88,
+  "nl-NL": 100,
-  "nn-NO": 89,
+  "nn-NO": 96,
-  "pl-PL": 88,
+  "pl-PL": 95,
-  "pt-PT": 92,
+  "pt-BR": 100,
+  "pt-PT": 100,
   "ro-RO": 100,
-  "ru-RU": 85,
+  "ru-RU": 97,
   "sk-SK": 100,
   "sv-SE": 100,
-  "tr-TR": 90,
+  "tr-TR": 87,
-  "uk-UA": 100,
+  "uk-UA": 99,
   "zh-CN": 100,
-  "zh-TW": 100
+  "zh-TW": 99
 }

src/locales/pl-PL.json

@@ -4,6 +4,7 @@
     "selectAll": "Zaznacz wszystko",
     "multiSelect": "Dodaj element do zaznaczenia",
     "moveCanvas": "Przesuń obszar roboczy",
+    "cut": "Wytnij",
     "copy": "Kopiuj",
     "copyAsPng": "Skopiuj do schowka jako plik PNG",
     "copyAsSvg": "Skopiuj do schowka jako plik SVG",
@@ -28,12 +29,17 @@
     "edges": "Krawędzie",
     "sharp": "Ostry",
     "round": "Zaokrąglij",
+    "arrowheads": "Groty",
+    "arrowhead_none": "Brak",
+    "arrowhead_arrow": "Strzałka",
+    "arrowhead_bar": "",
+    "arrowhead_dot": "Kropka",
     "fontSize": "Rozmiar tekstu",
     "fontFamily": "Krój pisma",
     "onlySelected": "Tylko wybrane",
-    "withBackground": "Z tłem dokumentu",
+    "withBackground": "",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Osadź scenę w eksportowanym pliku",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "Dane sceny zostaną zapisane w eksportowanym pliku PNG/SVG tak, aby scena mogła zostać z niego przywrócona.\nZwiększy to rozmiar eksportowanego pliku.",
     "addWatermark": "Dodaj \"Zrobione w Excalidraw\"",
     "handDrawn": "Odręczny",
     "normal": "Normalny",
@@ -54,7 +60,7 @@
     "architect": "Dokładny",
     "artist": "Artystyczny",
     "cartoonist": "Rysunkowy",
-    "fileTitle": "",
+    "fileTitle": "Tytuł pliku",
     "colorPicker": "Paleta kolorów",
     "canvasBackground": "Kolor dokumentu",
     "drawingCanvas": "Obszar roboczy",
@@ -63,27 +69,28 @@
     "language": "Język",
     "createRoom": "Udostępnij sesję współpracy na żywo",
     "duplicateSelection": "Powiel",
-    "untitled": "",
+    "untitled": "Bez tytułu",
     "name": "Nazwa",
     "yourName": "Twoje imię",
     "madeWithExcalidraw": "Zrobione w Excalidraw",
     "group": "Zgrupuj wybrane",
     "ungroup": "Rozgrupuj wybrane",
     "collaborators": "Współtwórcy",
-    "toggleGridMode": "Włącz siatkę",
+    "gridMode": "Tryb siatki",
     "addToLibrary": "Dodaj do biblioteki",
     "removeFromLibrary": "Usuń z biblioteki",
     "libraryLoadingMessage": "Wczytywanie biblioteki...",
+    "libraries": "Przeglądaj biblioteki",
     "loadingScene": "Ładowanie sceny...",
-    "align": "",
+    "align": "Wyrównaj",
-    "alignTop": "",
+    "alignTop": "Wyrównaj do góry",
-    "alignBottom": "",
+    "alignBottom": "Wyrównaj do dołu",
-    "alignLeft": "",
+    "alignLeft": "Wyrównaj do lewej",
-    "alignRight": "",
+    "alignRight": "Wyrównaj do prawej",
-    "centerVertically": "",
+    "centerVertically": "Wyśrodkuj w pionie",
-    "centerHorizontally": "",
+    "centerHorizontally": "Wyśrodkuj w poziomie",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Rozłóż poziomo",
-    "distributeVertically": ""
+    "distributeVertically": "Rozłóż pionowo"
   },
   "buttons": {
     "clearReset": "Wyczyść dokument i zresetuj kolor dokumentu",
@@ -110,15 +117,16 @@
     "redo": "Przywróć",
     "roomDialog": "Utwórz nową sesję współpracy na żywo",
     "createNewRoom": "Utwórz nowy pokój",
-    "toggleFullScreen": "Włącz/wyłącz tryb pełnoekranowy",
+    "fullScreen": "",
-    "toggleDarkMode": "Włącz tryb ciemny",
+    "darkMode": "",
-    "toggleZenMode": "Włącz tryb Zen",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "Wyjdź z trybu Zen"
   },
   "alerts": {
     "clearReset": "To spowoduje usunięcie wszystkiego z dokumentu. Czy chcesz kontynuować?",
     "couldNotCreateShareableLink": "Wystąpił błąd przy generowaniu linka do udostępniania.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "Nie można utworzyć udostępnialnego linku: scena jest za duża",
     "couldNotLoadInvalidFile": "Nie udało się otworzyć pliku. Wybrany plik jest nieprawidłowy.",
     "importBackendFailed": "Wystąpił błąd podczas importowania pliku.",
     "cannotExportEmptyCanvas": "Najpierw musisz coś narysować, aby zapisać dokument.",
@@ -126,10 +134,10 @@
     "decryptFailed": "Nie udało się odszyfrować danych.",
     "uploadedSecurly": "By zapewnić Ci prywatność, udostępnianie projektu jest zabezpieczone szyfrowaniem end-to-end, co oznacza, że poza tobą i osobą z którą podzielisz się linkiem, nikt nie ma dostępu do tego co udostępniasz.",
     "loadSceneOverridePrompt": "Wczytanie zewnętrznego rysunku zastąpi istniejącą zawartość. Czy chcesz kontynuować?",
-    "errorLoadingLibrary": "",
+    "errorLoadingLibrary": "Wystąpił błąd podczas ładowania biblioteki stron trzecich.",
-    "confirmAddLibrary": "",
+    "confirmAddLibrary": "To doda {{numShapes}} kształtów do twojej biblioteki. Jesteś pewien?",
     "imageDoesNotContainScene": "",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "Scena nie mogła zostać przywrócona z pliku obrazu"
   },
   "toolBar": {
     "selection": "Zaznaczenie",
@@ -153,6 +161,7 @@
     "freeDraw": "Naciśnij i przeciągnij by rysować, puść kiedy skończysz",
     "text": "Wskazówka: możesz również dodać tekst klikając dwukrotnie gdziekolwiek za pomocą narzędzia zaznaczania",
     "linearElementMulti": "Aby zakończyć krzywą, ponownie kliknij w ostatni punkt, bądź naciśnij Esc albo Enter",
+    "lockAngle": "",
     "resize": "Możesz zachować proporcję trzymająć wcisnięty SHIFT, przytrzymaj ALT by zmienić rozmiar względem środka",
     "rotate": "Możesz obracać element w równych odstępach trzymając wciśnięty SHIFT",
     "lineEditor_info": "Kliknij dwukrotnie lub naciśnij Enter, aby edytować punkty",
@@ -160,9 +169,9 @@
     "lineEditor_nothingSelected": "Naciśnij w punkt by go edytować, przytrzymaj Alt i naciśnij by dodać nowy punkt"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Nie można pokazać podglądu",
-    "canvasTooBig": "",
+    "canvasTooBig": "Płótno może być za duże.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Wskazówka: spróbuj nieco zbliżyć najdalej wysunięte elementy."
   },
   "errorSplash": {
     "headingMain_pre": "Wystąpił błąd. Spróbuj ",
@@ -205,13 +214,22 @@
     "textNewLine": "Dodaj nową linię (tekst)",
     "textFinish": "Zakończ edycję (tekst)",
     "zoomToFit": "Powiększ, aby wyświetlić wszystkie elementy",
+    "zoomToSelection": "Przybliż zaznaczenie",
     "preventBinding": "Zablokuj przywiązanie strzałek do obiektu"
   },
   "encrypted": {
     "tooltip": "Twoje rysunki są zabezpieczone szyfrowaniem end-to-end, tak więc nawet w Excalidraw nie jesteśmy w stanie zobaczyć tego co tworzysz."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Wklejono arkusz kalkulacyjny bez kolumny numerycznej.",
+    "angle": "Kąt",
-    "tooManyColumns": "Wklejono arkusz kalkulacyjny z więcej niż dwoma kolumnami."
+    "element": "Element",
+    "elements": "Elementy",
+    "height": "Wysokość",
+    "scene": "Scena",
+    "selected": "Zaznaczenie",
+    "storage": "Pamięć",
+    "title": "Statystyki dla nerdów",
+    "total": "Suma",
+    "width": "Szerokość"
   }
 }

src/locales/pt-BR.json

@@ -0,0 +1,235 @@
+{
+  "labels": {
+    "paste": "Colar",
+    "selectAll": "Selecionar tudo",
+    "multiSelect": "Adicionar elemento à seleção",
+    "moveCanvas": "Mover tela",
+    "cut": "Cortar",
+    "copy": "Copiar",
+    "copyAsPng": "Copiar para a área de transferência como PNG",
+    "copyAsSvg": "Copiar para a área de transferência como SVG",
+    "bringForward": "Trazer para a frente",
+    "sendToBack": "Enviar para o fundo",
+    "bringToFront": "Trazer para o primeiro plano",
+    "sendBackward": "Enviar para trás",
+    "delete": "Apagar",
+    "copyStyles": "Copiar os estilos",
+    "pasteStyles": "Colar os estilos",
+    "stroke": "Contorno",
+    "background": "Fundo",
+    "fill": "Preenchimento",
+    "strokeWidth": "Espessura do traço",
+    "strokeStyle": "Estilo de traço",
+    "strokeStyle_solid": "Sólido",
+    "strokeStyle_dashed": "Tracejado",
+    "strokeStyle_dotted": "Pontilhado",
+    "sloppiness": "Precisão do traço",
+    "opacity": "Opacidade",
+    "textAlign": "Alinhamento do texto",
+    "edges": "Arestas",
+    "sharp": "Pontudo",
+    "round": "Arredondado",
+    "arrowheads": "Pontas",
+    "arrowhead_none": "Nenhuma",
+    "arrowhead_arrow": "Flecha",
+    "arrowhead_bar": "Barra",
+    "arrowhead_dot": "Ponto",
+    "fontSize": "Tamanho da fonte",
+    "fontFamily": "Família da fonte",
+    "onlySelected": "Somente a seleção",
+    "withBackground": "Com fundo",
+    "exportEmbedScene": "Incorporar a cena no arquivo exportado",
+    "exportEmbedScene_details": "Os dados da cena serão salvos no arquivo PNG/SVG exportado para que a cena possa ser restaurada.\nIrá aumentar o tamanho do arquivo exportado.",
+    "addWatermark": "Adicionar \"Feito com Excalidraw\"",
+    "handDrawn": "Manuscrito",
+    "normal": "Normal",
+    "code": "Código",
+    "small": "Pequeno",
+    "medium": "Médio",
+    "large": "Grande",
+    "veryLarge": "Muito grande",
+    "solid": "Sólido",
+    "hachure": "Hachura",
+    "crossHatch": "Hachura cruzada",
+    "thin": "Fino",
+    "bold": "Espesso",
+    "left": "Esquerda",
+    "center": "Centralizar",
+    "right": "Direita",
+    "extraBold": "Muito espesso",
+    "architect": "Arquiteto",
+    "artist": "Artista",
+    "cartoonist": "Cartunista",
+    "fileTitle": "Título do arquivo",
+    "colorPicker": "Seletor de cores",
+    "canvasBackground": "Fundo da tela",
+    "drawingCanvas": "Tela de desenho",
+    "layers": "Camadas",
+    "actions": "Ações",
+    "language": "Idioma",
+    "createRoom": "Compartilhar uma sessão de colaboração ao vivo",
+    "duplicateSelection": "Duplicar",
+    "untitled": "Sem título",
+    "name": "Nome",
+    "yourName": "Seu nome",
+    "madeWithExcalidraw": "Feito com Excalidraw",
+    "group": "Agrupar seleção",
+    "ungroup": "Desagrupar seleção",
+    "collaborators": "Colaboradores",
+    "gridMode": "Modo grade",
+    "addToLibrary": "Adicionar à biblioteca",
+    "removeFromLibrary": "Remover da biblioteca",
+    "libraryLoadingMessage": "Carregando biblioteca...",
+    "libraries": "Procurar bibliotecas",
+    "loadingScene": "Carregando cena...",
+    "align": "Alinhamento",
+    "alignTop": "Alinhar ao topo",
+    "alignBottom": "Alinhar embaixo",
+    "alignLeft": "Alinhar à esquerda",
+    "alignRight": "Alinhar à direita",
+    "centerVertically": "Centralizar verticalmente",
+    "centerHorizontally": "Centralizar horizontalmente",
+    "distributeHorizontally": "Distribuir horizontalmente",
+    "distributeVertically": "Distribuir verticalmente"
+  },
+  "buttons": {
+    "clearReset": "Limpar o canvas e redefinir a cor de fundo",
+    "export": "Exportar",
+    "exportToPng": "Exportar em PNG",
+    "exportToSvg": "Exportar em SVG",
+    "copyToClipboard": "Copiar para o clipboard",
+    "copyPngToClipboard": "Copiar PNG para área de transferência",
+    "scale": "Escala",
+    "save": "Salvar",
+    "saveAs": "Salvar como",
+    "load": "Carregar",
+    "getShareableLink": "Obter um link de compartilhamento",
+    "close": "Fechar",
+    "selectLanguage": "Selecionar idioma",
+    "scrollBackToContent": "Voltar para o conteúdo",
+    "zoomIn": "Aumentar zoom",
+    "zoomOut": "Diminuir zoom",
+    "resetZoom": "Redefinir zoom",
+    "menu": "Menu",
+    "done": "Concluído",
+    "edit": "Editar",
+    "undo": "Desfazer",
+    "redo": "Refazer",
+    "roomDialog": "Iniciar colaboração ao vivo",
+    "createNewRoom": "Criar nova sala",
+    "fullScreen": "Tela cheia",
+    "darkMode": "Modo escuro",
+    "lightMode": "Modo claro",
+    "zenMode": "Modo Zen",
+    "exitZenMode": "Sair do modo zen"
+  },
+  "alerts": {
+    "clearReset": "Isto irá limpar toda a tela. Você tem certeza?",
+    "couldNotCreateShareableLink": "Não foi possível criar um link de compartilhamento.",
+    "couldNotCreateShareableLinkTooBig": "Não foi possível criar um link compartilhável: a cena é muito grande",
+    "couldNotLoadInvalidFile": "Não foi possível carregar o arquivo inválido",
+    "importBackendFailed": "A importação do servidor falhou.",
+    "cannotExportEmptyCanvas": "Não é possível exportar um canvas vazio.",
+    "couldNotCopyToClipboard": "Não foi possível copiar para a área de transferência. Experimente usando o navegador Chrome.",
+    "decryptFailed": "Não foi possível descriptografar os dados.",
+    "uploadedSecurly": "O upload foi protegido com criptografia de ponta a ponta, o que significa que o servidor do Excalidraw e terceiros não podem ler o conteúdo.",
+    "loadSceneOverridePrompt": "Carregar um desenho externo substituirá o seu conteúdo existente. Deseja continuar?",
+    "errorLoadingLibrary": "Houve um erro ao carregar a biblioteca de terceiros.",
+    "confirmAddLibrary": "Isso adicionará {{numShapes}} forma(s) à sua biblioteca. Tem certeza?",
+    "imageDoesNotContainScene": "A importação de imagens não é suportada no momento.\n\nVocê deseja importar uma cena? Esta imagem parece não conter dados de cena. Você ativou isto durante a exportação?",
+    "cannotRestoreFromImage": "Não foi possível restaurar a cena deste arquivo de imagem"
+  },
+  "toolBar": {
+    "selection": "Seleção",
+    "draw": "Desenho livre",
+    "rectangle": "Retângulo",
+    "diamond": "Losango",
+    "ellipse": "Elipse",
+    "arrow": "Flecha",
+    "line": "Linha",
+    "text": "Texto",
+    "library": "Biblioteca",
+    "lock": "Manter ativa a ferramenta selecionada após desenhar"
+  },
+  "headings": {
+    "canvasActions": "Ações da tela",
+    "selectedShapeActions": "Ações das formas selecionadas",
+    "shapes": "Formas"
+  },
+  "hints": {
+    "linearElement": "Clique para iniciar vários pontos, arraste para uma única linha",
+    "freeDraw": "Toque e arraste, solte quando terminar",
+    "text": "Dica: você também pode adicionar texto clicando duas vezes em qualquer lugar com a ferramenta de seleção",
+    "linearElementMulti": "Clique no último ponto ou pressione Escape ou Enter para terminar",
+    "lockAngle": "Você pode restringir o ângulo segurando o SHIFT",
+    "resize": "Você pode restringir proporções segurando SHIFT enquanto redimensiona,\nsegure ALT para redimensionar do centro",
+    "rotate": "Você pode restringir os ângulos segurando SHIFT enquanto gira",
+    "lineEditor_info": "Clique duas vezes ou pressione Enter para editar os pontos",
+    "lineEditor_pointSelected": "Pressione Deletar para remover o ponto, CtrlOuCmd+D para duplicar ou arraste para mover",
+    "lineEditor_nothingSelected": "Selecione um ponto para mover ou remover, ou segure Alt e clique para adicionar novos pontos"
+  },
+  "canvasError": {
+    "cannotShowPreview": "Não é possível mostrar pré-visualização",
+    "canvasTooBig": "A tela pode ser muito grande.",
+    "canvasTooBigTip": "Dica: tente aproximar um pouco os elementos mais distantes."
+  },
+  "errorSplash": {
+    "headingMain_pre": "Foi encontrado um erro. Tente ",
+    "headingMain_button": "recarregar a página.",
+    "clearCanvasMessage": "Se recarregar a página não funcionar, tente ",
+    "clearCanvasMessage_button": "limpando a tela.",
+    "clearCanvasCaveat": " Isso resultará em perda de trabalho ",
+    "trackedToSentry_pre": "O erro com o identificador ",
+    "trackedToSentry_post": " foi rastreado no nosso sistema.",
+    "openIssueMessage_pre": "Fomos muito cautelosos para não incluir suas informações de cena no erro. Se sua cena não for privada, por favor, considere seguir nosso ",
+    "openIssueMessage_button": "rastreador de bugs.",
+    "openIssueMessage_post": " Por favor, inclua informações abaixo, copiando e colando para a issue do GitHub.",
+    "sceneContent": "Conteúdo da cena:"
+  },
+  "roomDialog": {
+    "desc_intro": "Você pode convidar pessoas para sua cena atual para colaborar com você.",
+    "desc_privacy": "Não se preocupe, a sessão usa criptografia de ponta a ponta; portanto, o que você desenhar permanecerá privado. Nem mesmo nosso servidor poderá ver o que você cria.",
+    "button_startSession": "Iniciar sessão",
+    "button_stopSession": "Parar sessão",
+    "desc_inProgressIntro": "A sessão de colaboração ao vivo está agora em andamento.",
+    "desc_shareLink": "Compartilhe este link com qualquer pessoa com quem você queira colaborar:",
+    "desc_exitSession": "Interrompendo a sessão você irá se desconectar da sala, mas você poderá continuar trabalhando com a cena localmente. Observe que isso não afetará outras pessoas, e elas ainda poderão colaborar em suas versões."
+  },
+  "errorDialog": {
+    "title": "Erro"
+  },
+  "shortcutsDialog": {
+    "title": "Atalhos de teclado",
+    "shapes": "Formas",
+    "or": "ou",
+    "click": "clicar",
+    "drag": "arrastar",
+    "curvedArrow": "Seta curva",
+    "curvedLine": "Linha curva",
+    "editor": "Editor",
+    "view": "Visualizar",
+    "blog": "Leia o nosso blog",
+    "howto": "Siga os nossos guias",
+    "github": "Encontrou algum problema? Nos informe",
+    "textNewLine": "Adicionar nova linha (texto)",
+    "textFinish": "Finalizar edição (texto)",
+    "zoomToFit": "Ajustar para caber todos os elementos",
+    "zoomToSelection": "Ampliar a seleção",
+    "preventBinding": "Prevenir fixação de seta"
+  },
+  "encrypted": {
+    "tooltip": "Seus desenhos são criptografados de ponta a ponta, então os servidores do Excalidraw nunca os verão."
+  },
+  "stats": {
+    "angle": "Ângulo",
+    "element": "Elemento",
+    "elements": "Elementos",
+    "height": "Altura",
+    "scene": "Cena",
+    "selected": "Selecionado",
+    "storage": "Armazenamento",
+    "title": "Estatísticas para nerds",
+    "total": "Total",
+    "width": "Largura"
+  }
+}

src/locales/pt-PT.json

@@ -4,6 +4,7 @@
     "selectAll": "Selecionar tudo",
     "multiSelect": "Adicionar elemento à seleção",
     "moveCanvas": "Mover tela",
+    "cut": "Cortar",
     "copy": "Copiar",
     "copyAsPng": "Copiar para a área de transferência como PNG",
     "copyAsSvg": "Copiar para a área de transferência como SVG",
@@ -28,6 +29,11 @@
     "edges": "Arestas",
     "sharp": "Aguçado",
     "round": "Redondo",
+    "arrowheads": "Pontas",
+    "arrowhead_none": "Nenhuma",
+    "arrowhead_arrow": "Seta",
+    "arrowhead_bar": "Barra",
+    "arrowhead_dot": "Ponto",
     "fontSize": "Tamanho da fonte",
     "fontFamily": "Família da fontes",
     "onlySelected": "Somente a seleção",
@@ -54,7 +60,7 @@
     "architect": "Arquitecto",
     "artist": "Artista",
     "cartoonist": "Caricaturista",
-    "fileTitle": "",
+    "fileTitle": "Título do ficheiro",
     "colorPicker": "Seletor de cores",
     "canvasBackground": "Fundo da tela",
     "drawingCanvas": "Tela de desenho",
@@ -63,27 +69,28 @@
     "language": "Idioma",
     "createRoom": "Compartilhar uma sessão de colaboração ao vivo",
     "duplicateSelection": "Duplicar",
-    "untitled": "",
+    "untitled": "Sem título",
     "name": "Nome",
     "yourName": "Seu nome",
     "madeWithExcalidraw": "Feito com Excalidraw",
     "group": "Agrupar seleção",
     "ungroup": "Desagrupar seleção",
     "collaborators": "Colaboradores",
-    "toggleGridMode": "Alternar modo de grade",
+    "gridMode": "Modo grade",
     "addToLibrary": "Adicionar à biblioteca",
     "removeFromLibrary": "Remover da biblioteca",
     "libraryLoadingMessage": "Carregando biblioteca...",
+    "libraries": "Procurar bibliotecas",
     "loadingScene": "Carregando cena...",
-    "align": "",
+    "align": "Alinhamento",
-    "alignTop": "",
+    "alignTop": "Alinhar ao topo",
-    "alignBottom": "",
+    "alignBottom": "Alinhar ao fundo",
-    "alignLeft": "",
+    "alignLeft": "Alinhar à esquerda",
-    "alignRight": "",
+    "alignRight": "Alinhar à direita",
-    "centerVertically": "",
+    "centerVertically": "Centralizar verticalmente",
-    "centerHorizontally": "",
+    "centerHorizontally": "Centralizar horizontalmente",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Distribuir horizontalmente",
-    "distributeVertically": ""
+    "distributeVertically": "Distribuir verticalmente"
   },
   "buttons": {
     "clearReset": "Limpar o canvas e redefinir a cor de fundo",
@@ -110,9 +117,10 @@
     "redo": "Refazer",
     "roomDialog": "Iniciar colaboração ao vivo",
     "createNewRoom": "Criar nova sala",
-    "toggleFullScreen": "Alternar tela cheia",
+    "fullScreen": "Tela cheia",
-    "toggleDarkMode": "Alternar modo escuro",
+    "darkMode": "Modo escuro",
-    "toggleZenMode": "Alternar modo zen",
+    "lightMode": "Modo claro",
+    "zenMode": "Modo Zen",
     "exitZenMode": "Sair do modo zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Carregar um desenho externo substituirá o seu conteúdo existente. Deseja continuar?",
     "errorLoadingLibrary": "Houve um erro ao carregar a biblioteca de terceiros.",
     "confirmAddLibrary": "Isso adicionará {{numShapes}} forma(s) à sua biblioteca. Tem certeza?",
-    "imageDoesNotContainScene": "O arquivo de imagem não contém dados de cena. Você ativou durante a exportação?",
+    "imageDoesNotContainScene": "A importação de imagens não é suportada no momento.\n\nVocê deseja importar uma cena? Esta imagem parece não conter dados de cena. Você ativou isto durante a exportação?",
     "cannotRestoreFromImage": "Não foi possível restaurar a cena deste arquivo de imagem"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Toque e arraste, solte quando terminar",
     "text": "Dica: você também pode adicionar texto clicando duas vezes em qualquer lugar com a ferramenta de seleção",
     "linearElementMulti": "Clique no último ponto ou pressione Escape ou Enter para terminar",
+    "lockAngle": "Você pode restringir o ângulo segurando SHIFT",
     "resize": "Você pode restringir proporções segurando SHIFT enquanto redimensiona,\nsegure ALT para redimensionar do centro",
     "rotate": "Você pode restringir os ângulos segurando SHIFT enquanto gira",
     "lineEditor_info": "Clique duas vezes ou pressione Enter para editar os pontos",
@@ -160,9 +169,9 @@
     "lineEditor_nothingSelected": "Selecione um ponto para mover ou remover, ou segure Alt e clique para adicionar novos pontos"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Não é possível mostrar pré-visualização",
-    "canvasTooBig": "",
+    "canvasTooBig": "A tela pode ser muito grande.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Dica: tente aproximar um pouco os elementos mais distantes."
   },
   "errorSplash": {
     "headingMain_pre": "Foi encontrado um erro. Tente ",
@@ -205,13 +214,22 @@
     "textNewLine": "Adicionar nova linha (texto)",
     "textFinish": "Finalizar edição (texto)",
     "zoomToFit": "Ajustar para caber todos os elementos",
+    "zoomToSelection": "Ampliar a seleção",
     "preventBinding": "Prevenir fixação de seta"
   },
   "encrypted": {
     "tooltip": "Seus desenhos são criptografados de ponta a ponta, então os servidores do Excalidraw nunca os verão."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Você colou uma planilha sem uma coluna numérica.",
+    "angle": "Ângulo",
-    "tooManyColumns": "Você colou uma planilha com mais de duas colunas."
+    "element": "Elemento",
+    "elements": "Elementos",
+    "height": "Altura",
+    "scene": "Cena",
+    "selected": "Selecionado",
+    "storage": "Armazenamento",
+    "title": "Estatísticas para nerds",
+    "total": "Total",
+    "width": "Largura"
   }
 }

src/locales/ro-RO.json

@@ -4,6 +4,7 @@
     "selectAll": "Selectare totală",
     "multiSelect": "Adaugă element la selecție",
     "moveCanvas": "Mutare pânză",
+    "cut": "Decupare",
     "copy": "Copiere",
     "copyAsPng": "Copiere în memoria temporară ca PNG",
     "copyAsSvg": "Copiere în memoria temporară ca SVG",
@@ -28,6 +29,11 @@
     "edges": "Margini",
     "sharp": "Ascuțite",
     "round": "Rotunde",
+    "arrowheads": "Vârfuri de săgeată",
+    "arrowhead_none": "Niciunul",
+    "arrowhead_arrow": "Săgeată",
+    "arrowhead_bar": "Bară",
+    "arrowhead_dot": "Bulină",
     "fontSize": "Dimensiune font",
     "fontFamily": "Familia de fonturi",
     "onlySelected": "Numai selecția",
@@ -70,10 +76,11 @@
     "group": "Grupare selecție",
     "ungroup": "Degrupare selecție",
     "collaborators": "Colaboratori",
-    "toggleGridMode": "Comută modul grilă",
+    "gridMode": "Mod grilă",
     "addToLibrary": "Adăugare la bibliotecă",
     "removeFromLibrary": "Eliminare din bibliotecă",
     "libraryLoadingMessage": "Se încarcă biblioteca...",
+    "libraries": "Răsfoiește bibliotecile",
     "loadingScene": "Se încarcă scena...",
     "align": "Aliniere",
     "alignTop": "Aliniere sus",
@@ -110,9 +117,10 @@
     "redo": "Refacere",
     "roomDialog": "Colaborare în direct",
     "createNewRoom": "Creare cameră nouă",
-    "toggleFullScreen": "Comută modul ecran complet",
+    "fullScreen": "Ecran complet",
-    "toggleDarkMode": "Comută modul întunecat",
+    "darkMode": "Mod întunecat",
-    "toggleZenMode": "Comută modul zen",
+    "lightMode": "Mod luminos",
+    "zenMode": "Mod zen",
     "exitZenMode": "Ieșire din modul zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Încărcarea desenului extern va înlocui conținutul existent. Dorești să continui?",
     "errorLoadingLibrary": "A apărut o eroare la încărcarea bibliotecii terțe.",
     "confirmAddLibrary": "Această acțiune va adăuga {{numShapes}} formă(e) la biblioteca ta. Confirmi?",
-    "imageDoesNotContainScene": "Fișierul de imagine nu conține date de scenă. Ai activat această opțiune pe durata exportării?",
+    "imageDoesNotContainScene": "Importarea imaginilor nu este acceptată în acest moment.\n\nVoiai să imporți o scenă? Această imagine nu pare să conțină date de scenă. Ai activat această opțiune pe durata exportării?",
     "cannotRestoreFromImage": "Scena nu a putut fi restaurată din acest fișier de imagine"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Dă clic pe pânză și glisează cursorul, apoi eliberează-l când ai terminat",
     "text": "Sfat: poți adăuga text și dând dublu clic oriunde cu instrumentul de selecție",
     "linearElementMulti": "Dă clic pe ultimul punct sau apasă tasta Escape sau tasta Enter pentru a termina",
+    "lockAngle": "Poți constrânge unghiul prin ținerea apăsată a tastei SHIFT",
     "resize": "Poți constrânge proporțiile, ținând apăsată tasta SHIFT în timp ce redimensionezi,\nține apăsată tasta ALT pentru a redimensiona de la centru",
     "rotate": "Poți constrânge unghiurile, ținând apăsată tasta SHIFT în timp ce rotești",
     "lineEditor_info": "Dă dublu clic sau apasă tasta Enter pentru a edita punctele",
@@ -205,13 +214,22 @@
     "textNewLine": "Adaugă o linie nouă (text)",
     "textFinish": "Finalizează editarea (text)",
     "zoomToFit": "Apropiere/depărtare pentru a cuprinde totul",
+    "zoomToSelection": "Panoramare la selecție",
     "preventBinding": "Împiedică legarea săgeții"
   },
   "encrypted": {
     "tooltip": "Desenele tale sunt criptate integral, astfel că serverele Excalidraw nu le vor vedea niciodată."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Ai inserat o foaie de calcul fără o coloană numerică.",
+    "angle": "Unghi",
-    "tooManyColumns": "Ai inserat o foaie de calcul cu mai mult de două coloane."
+    "element": "Element",
+    "elements": "Elemente",
+    "height": "Înălțime",
+    "scene": "Scenă",
+    "selected": "Selectate",
+    "storage": "Stocare",
+    "title": "Statistici pentru pasionați",
+    "total": "Total",
+    "width": "Lățime"
   }
 }

src/locales/ru-RU.json

@@ -2,8 +2,9 @@
   "labels": {
     "paste": "Вставить",
     "selectAll": "Выбрать все",
-    "multiSelect": "Добавить элемент к выбору",
+    "multiSelect": "Добавить элемент в выделенный фрагмент",
     "moveCanvas": "Переместить холст",
+    "cut": "Вырезать",
     "copy": "Копировать",
     "copyAsPng": "Скопировать в буфер обмена как PNG",
     "copyAsSvg": "Скопировать в буфер обмена как SVG",
@@ -28,12 +29,17 @@
     "edges": "Края",
     "sharp": "Острые",
     "round": "Скругленные",
+    "arrowheads": "Стрелка",
+    "arrowhead_none": "Без стрелки",
+    "arrowhead_arrow": "Cтрелка",
+    "arrowhead_bar": "Столбец",
+    "arrowhead_dot": "Точка",
     "fontSize": "Размер шрифта",
     "fontFamily": "Семейство шрифтов",
     "onlySelected": "Только выбранные",
     "withBackground": "С фоном",
-    "exportEmbedScene": "",
+    "exportEmbedScene": "Встроить информацию о сцене в экспортируемый файл",
-    "exportEmbedScene_details": "",
+    "exportEmbedScene_details": "Сцена будет сохранена в PNG/SVG файл так, чтобы всю сцену можно будет восстановить из этого файла. Это увеличит размер файла.",
     "addWatermark": "Добавить \"Сделано с Excalidraw\"",
     "handDrawn": "Нарисованный от руки",
     "normal": "Обычный",
@@ -69,21 +75,22 @@
     "madeWithExcalidraw": "Сделано в Excalidraw",
     "group": "Сгруппировать выделение",
     "ungroup": "Разделить выделение",
-    "collaborators": "Сотрудники",
+    "collaborators": "Участники",
-    "toggleGridMode": "Переключить режим сетки",
+    "gridMode": "",
     "addToLibrary": "Добавить в библиотеку",
     "removeFromLibrary": "Удалить из библиотеки",
     "libraryLoadingMessage": "Загрузка библиотеки...",
+    "libraries": "Просмотреть библиотеки",
     "loadingScene": "Загрузка сцены...",
-    "align": "",
+    "align": "Выровнять",
-    "alignTop": "",
+    "alignTop": "Выровнять по верхнему краю",
-    "alignBottom": "",
+    "alignBottom": "Выровнять по нижнему краю",
-    "alignLeft": "",
+    "alignLeft": "Выровнять по левому краю",
-    "alignRight": "",
+    "alignRight": "Выровнять по правому краю",
-    "centerVertically": "",
+    "centerVertically": "Центрировать по вертикали",
-    "centerHorizontally": "",
+    "centerHorizontally": "Центрировать по горизонтали",
-    "distributeHorizontally": "",
+    "distributeHorizontally": "Распределить по горизонтали",
-    "distributeVertically": ""
+    "distributeVertically": "Распределить по вертикали"
   },
   "buttons": {
     "clearReset": "Очистить холст и сбросить цвет фона",
@@ -92,7 +99,7 @@
     "exportToSvg": "Экспорт в SVG",
     "copyToClipboard": "Скопировать в буфер обмена",
     "copyPngToClipboard": "Скопировать PNG в буфер обмена",
-    "scale": "Шкала",
+    "scale": "Масштаб",
     "save": "Сохранить",
     "saveAs": "Сохранить как",
     "load": "Загрузить",
@@ -110,26 +117,27 @@
     "redo": "Шаг вперед",
     "roomDialog": "Начать совместную работу",
     "createNewRoom": "Создать новую комнату",
-    "toggleFullScreen": "Переключить полноэкранный режим",
+    "fullScreen": "Полный экран",
-    "toggleDarkMode": "Переключить тёмную тему",
+    "darkMode": "",
-    "toggleZenMode": "Переключить режим концентрации внимания",
+    "lightMode": "",
+    "zenMode": "",
     "exitZenMode": "Выключить режим концентрации внимания"
   },
   "alerts": {
     "clearReset": "Это очистит весь холст. Вы уверены?",
     "couldNotCreateShareableLink": "Не удалось создать общедоступную ссылку.",
-    "couldNotCreateShareableLinkTooBig": "",
+    "couldNotCreateShareableLinkTooBig": "Нельзя создать ссылку, чтобы поделиться. Сцена слишком большая",
     "couldNotLoadInvalidFile": "Не удалось загрузить недопустимый файл",
     "importBackendFailed": "Не удалось импортировать из бэкэнда.",
     "cannotExportEmptyCanvas": "Не может экспортировать пустой холст.",
     "couldNotCopyToClipboard": "Не удалось скопировать в буфер обмена. Попробуйте использовать веб-браузер Chrome.",
-    "decryptFailed": "Не удалось декодировать данные.",
+    "decryptFailed": "Не удалось расшифровать данные.",
     "uploadedSecurly": "Загружаемые данные защищена сквозным шифрованием, что означает, что сервер Excalidraw и третьи стороны не могут прочитать содержимое.",
-    "loadSceneOverridePrompt": "",
+    "loadSceneOverridePrompt": "Загрузка рисунка приведёт к замене имеющегося содержимого. Вы хотите продолжить?",
-    "errorLoadingLibrary": "",
+    "errorLoadingLibrary": "Произошла ошибка при загрузке сторонней библиотеки.",
-    "confirmAddLibrary": "",
+    "confirmAddLibrary": "Будет добавлено {{numShapes}} фигур в вашу библиотеку. Продолжить?",
     "imageDoesNotContainScene": "",
-    "cannotRestoreFromImage": ""
+    "cannotRestoreFromImage": "Сцена не может быть восстановлена из этого изображения"
   },
   "toolBar": {
     "selection": "Выделение области",
@@ -151,18 +159,19 @@
   "hints": {
     "linearElement": "Нажмите, чтобы начать несколько точек, перетащите для одной линии",
     "freeDraw": "Нажмите и перетаскивайте, отпустите по завершении",
-    "text": "",
+    "text": "Совет: при выбранном инструменте выделения дважды щёлкните в любом месте, чтобы добавить текст",
     "linearElementMulti": "Кликните на последней точке или нажмите Escape или Enter чтобы закончить",
+    "lockAngle": "",
     "resize": "Вы можете ограничить пропорции, удерживая SHIFT во время изменения размеров,\nудерживайте ALT чтобы изменить размер из центра",
     "rotate": "Вы можете ограничить углы, удерживая SHIFT во время вращения",
     "lineEditor_info": "Дважды кликните или нажмите Enter, чтобы редактировать точки",
-    "lineEditor_pointSelected": "",
+    "lineEditor_pointSelected": "Нажмите Delete для удаления точки, Ctrl или Cmd + D для дублирования, перетащите для перемещения",
-    "lineEditor_nothingSelected": ""
+    "lineEditor_nothingSelected": "Выберите точку для перемещения или удаления. Alt + клик чтобы добавить новые точки"
   },
   "canvasError": {
-    "cannotShowPreview": "",
+    "cannotShowPreview": "Не удается отобразить предпросмотр",
-    "canvasTooBig": "",
+    "canvasTooBig": "Сцена слишком большая.",
-    "canvasTooBigTip": ""
+    "canvasTooBigTip": "Совет: попробуйте сблизить элементы рисунка."
   },
   "errorSplash": {
     "headingMain_pre": "Возникла ошибка. Попробуйте ",
@@ -180,11 +189,11 @@
   "roomDialog": {
     "desc_intro": "Вы можете пригласить людей в текущую сцену для совместной работы.",
     "desc_privacy": "Не беспокойтесь, сессия использует сквозное шифрование, поэтому всё что вы нарисуете останется приватным. Ваша информация не будет доступна даже на наших серверах.",
-    "button_startSession": "Начать сессию",
+    "button_startSession": "Начать сеанс",
-    "button_stopSession": "Закончить сессию",
+    "button_stopSession": "Завершить сеанс",
     "desc_inProgressIntro": "Совместная сессия теперь активна.",
     "desc_shareLink": "Поделитесь этой ссылкой со всеми участниками:",
-    "desc_exitSession": ""
+    "desc_exitSession": "Завершив сеанс, вы выйдете из комнаты, но сможете продолжить работать с документом локально. Это не повлияет на работу других пользователей — они смогут продолжить совместную работу с их версией документа."
   },
   "errorDialog": {
     "title": "Ошибка"
@@ -204,14 +213,23 @@
     "github": "Нашли проблему? Отправьте",
     "textNewLine": "Добавить новую строку (текст)",
     "textFinish": "Закончить редактирование (текст)",
-    "zoomToFit": "",
+    "zoomToFit": "Отмастштабировать, чтобы поместились все элементы",
+    "zoomToSelection": "Перейти к выделенному",
     "preventBinding": "Предотвратить привязку стрелок"
   },
   "encrypted": {
-    "tooltip": ""
+    "tooltip": "Ваши данные защищены сквозным (End-to-end) шифрованием. Серверы Excalidraw никогда не получат доступ к ним."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "",
+    "angle": "Угол",
-    "tooManyColumns": "Вы вставили таблицу с более чем двумя столбцами."
+    "element": "Элемент",
+    "elements": "Элементы",
+    "height": "Высота",
+    "scene": "Сцены",
+    "selected": "Выбран",
+    "storage": "Хранилище",
+    "title": "Статистика для ботаников",
+    "total": "Всего",
+    "width": "Ширина"
   }
 }

src/locales/sk-SK.json

@@ -4,6 +4,7 @@
     "selectAll": "Vybrať všetko",
     "multiSelect": "Pridať prvok do výberu",
     "moveCanvas": "Pohyb plátna",
+    "cut": "Vystrihnúť",
     "copy": "Kopírovať",
     "copyAsPng": "Kopírovať do schránky ako PNG",
     "copyAsSvg": "Kopírovať do schránky ako SVG",
@@ -28,6 +29,11 @@
     "edges": "Okraje",
     "sharp": "Ostré",
     "round": "Zaokrúhlené",
+    "arrowheads": "Zakončenie šípky",
+    "arrowhead_none": "Žiadne",
+    "arrowhead_arrow": "Šípka",
+    "arrowhead_bar": "Čiara",
+    "arrowhead_dot": "Bod",
     "fontSize": "Veľkosť písma",
     "fontFamily": "Písmo",
     "onlySelected": "Iba vybrané",
@@ -70,10 +76,11 @@
     "group": "Zoskupiť",
     "ungroup": "Zrušiť zoskupenie",
     "collaborators": "Spolupracovníci",
-    "toggleGridMode": "Prepnúť mriežku",
+    "gridMode": "Režim mriežky",
     "addToLibrary": "Pridať do knižnice",
     "removeFromLibrary": "Odstrániť z knižnice",
     "libraryLoadingMessage": "Načítavanie knižnice...",
+    "libraries": "Prehliadať knižnice",
     "loadingScene": "Načítavanie scény...",
     "align": "Zarovnanie",
     "alignTop": "Zarovnať nahor",
@@ -110,9 +117,10 @@
     "redo": "Znova",
     "roomDialog": "Začať živú spoluprácu",
     "createNewRoom": "Vytvoriť novú miestnosť",
-    "toggleFullScreen": "Prepnúť režim celej obrazovky",
+    "fullScreen": "Celá obrazovka",
-    "toggleDarkMode": "Prepnúť tmavý režim",
+    "darkMode": "Tmavý režim",
-    "toggleZenMode": "Prepnúť režim zen",
+    "lightMode": "Svetlý režim",
+    "zenMode": "Režim zen",
     "exitZenMode": "Zrušiť režim zen"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Nahratie externej kresby nahradí existujúci obsah. Prajete si pokračovať?",
     "errorLoadingLibrary": "Nepodarilo sa načítať externú knižnicu.",
     "confirmAddLibrary": "Týmto sa pridá {{numShapes}} tvar(ov) do vašej knižnice. Ste si istí?",
-    "imageDoesNotContainScene": "Obrázkový súbor neobsahuje údaje scény. Povolili ste ich pri exportovaní?",
+    "imageDoesNotContainScene": "Importovanie obrázku v tomto momente nie je možné.\n\nChceli ste importovať scénu? Tento obrázok neobsahuje žiadne údaje scény. Povolili ste túto možnosť počas exportovania?",
     "cannotRestoreFromImage": "Nepodarilo sa obnoviť scénu z tohto obrázkového súboru"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Kliknite a ťahajte, pustite na ukončenie",
     "text": "Tip: text môžete pridať aj dvojklikom kdekoľvek, ak je zvolený nástroj výber",
     "linearElementMulti": "Kliknite na počiatočný bod alebo stlačte Escape alebo Enter na ukončenie",
+    "lockAngle": "Počas rotácie obmedzíte uhol podržaním SHIFT",
     "resize": "Počas zmeny veľkosti zachováte proporcie podržaním SHIFT,\\npodržaním ALT meníte veľkosť so zachovaním stredu",
     "rotate": "Počas rotácie obmedzíte uhol podržaním SHIFT",
     "lineEditor_info": "Použite dvojklik alebo stlačte Enter na editáciu bodov",
@@ -205,13 +214,22 @@
     "textNewLine": "Vložiť nový riadok (text)",
     "textFinish": "Ukončenie editovania (text)",
     "zoomToFit": "Priblížiť aby boli zahrnuté všetky prvky",
+    "zoomToSelection": "Priblížiť na výber",
     "preventBinding": "Zakázať pripájanie šípky"
   },
   "encrypted": {
     "tooltip": "Vaše kresby používajú end-to-end šifrovanie, takže ich Excalidraw server nedokáže prečítať."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Prilepili ste tabuľku bez číselného stĺpca.",
+    "angle": "Uhol",
-    "tooManyColumns": "Prilepili ste tabuľku s viac ako dvoma stĺpcami."
+    "element": "Prvok",
+    "elements": "Prvky",
+    "height": "Výška",
+    "scene": "Scéna",
+    "selected": "Vybrané",
+    "storage": "Úložisko",
+    "title": "Štatistiky",
+    "total": "Celkom",
+    "width": "Šírka"
   }
 }

src/locales/sv-SE.json

@@ -4,6 +4,7 @@
     "selectAll": "Markera alla",
     "multiSelect": "Lägg till element till markering",
     "moveCanvas": "Flytta canvas",
+    "cut": "Klipp ut",
     "copy": "Kopiera",
     "copyAsPng": "Kopiera till urklipp som PNG",
     "copyAsSvg": "Kopiera till urklipp som SVG",
@@ -28,6 +29,11 @@
     "edges": "Kanter",
     "sharp": "Skarp",
     "round": "Rund",
+    "arrowheads": "Pilhuvuden",
+    "arrowhead_none": "Inga",
+    "arrowhead_arrow": "Pil",
+    "arrowhead_bar": "Stolpe",
+    "arrowhead_dot": "Punkt",
     "fontSize": "Teckenstorlek",
     "fontFamily": "Teckensnitt",
     "onlySelected": "Endast markering",
@@ -70,10 +76,11 @@
     "group": "Gruppera markering",
     "ungroup": "Avgruppera markering",
     "collaborators": "Medarbetare",
-    "toggleGridMode": "Växla rutnätsläge",
+    "gridMode": "Rutnätsläge",
     "addToLibrary": "Lägg till i biblioteket",
     "removeFromLibrary": "Ta bort från bibliotek",
     "libraryLoadingMessage": "Laddar bibliotek...",
+    "libraries": "Bläddra i bibliotek",
     "loadingScene": "Laddar scen...",
     "align": "Justera",
     "alignTop": "Justera överkant",
@@ -110,9 +117,10 @@
     "redo": "Gör om",
     "roomDialog": "Starta live-samarbete",
     "createNewRoom": "Skapa ett nytt rum",
-    "toggleFullScreen": "Växla fullskärmsläge",
+    "fullScreen": "Helskärm",
-    "toggleDarkMode": "Växla mörkt läge",
+    "darkMode": "Mörkt läge",
-    "toggleZenMode": "Växla zen-läge",
+    "lightMode": "Ljust läge",
+    "zenMode": "Zen-läge",
     "exitZenMode": "Gå ur zen-läge"
   },
   "alerts": {
@@ -128,7 +136,7 @@
     "loadSceneOverridePrompt": "Laddning av extern skiss kommer att ersätta ditt befintliga innehåll. Vill du fortsätta?",
     "errorLoadingLibrary": "Fel vid inläsning av tredjeparts bibliotek.",
     "confirmAddLibrary": "Detta kommer att lägga till {{numShapes}} form(er) till ditt bibliotek. Är du säker?",
-    "imageDoesNotContainScene": "Bildfilen innehåller inte skissdata. Har du aktiverat detta under export?",
+    "imageDoesNotContainScene": "Importering av bilder stöds inte just nu.\n\nVill du importera en skiss? Den här bilden verkar inte innehålla någon skissdata. Har du aktiverat detta under export?",
     "cannotRestoreFromImage": "Skiss kunde inte återställas från denna bildfil"
   },
   "toolBar": {
@@ -153,6 +161,7 @@
     "freeDraw": "Klicka och dra, släpp när du är klar",
     "text": "Tips: du kan också lägga till text genom att dubbelklicka var som helst med markeringsverktyget",
     "linearElementMulti": "Klicka på sista punkten eller tryck Escape eller Enter för att avsluta",
+    "lockAngle": "Du kan begränsa vinkeln genom att hålla SKIFT",
     "resize": "Du kan behålla proportioner genom att hålla SHIFT medan du ändrar storlek,\nhåller du ALT ändras storlek relativt mitten",
     "rotate": "Du kan begränsa vinklar genom att hålla SHIFT medan du roterar",
     "lineEditor_info": "Dubbelklicka eller tryck på Enter för att redigera punkter",
@@ -205,13 +214,22 @@
     "textNewLine": "Lägg till ny rad (text)",
     "textFinish": "Slutför redigering (text)",
     "zoomToFit": "Zooma för att rymma alla element",
+    "zoomToSelection": "Zooma till markering",
     "preventBinding": "Förhindra pilbindning"
   },
   "encrypted": {
     "tooltip": "Dina skisser är krypterade från ände till ände så Excalidraws servrar kommer aldrig att se dem."
   },
-  "charts": {
+  "stats": {
-    "noNumericColumn": "Du klistrade in ett kalkylblad utan en numerisk kolumn.",
+    "angle": "Vinkel",
-    "tooManyColumns": "Du klistrade in ett kalkylblad med mer än två kolumner."
+    "element": "Element",
+    "elements": "Element",
+    "height": "Höjd",
+    "scene": "Skiss",
+    "selected": "Valda",
+    "storage": "Lagring",
+    "title": "Statistik för nördar",
+    "total": "Totalt",
+    "width": "Bredd"
   }
 }