fix: typos (#540)

src/bug-issue-template.js

@@ -1,5 +1,5 @@
 export default `
-### Stack strace
+### Stack trace
 
 \`\`\`
 // paste stack trace here

src/components/ExportDialog.tsx

@@ -52,7 +52,7 @@ export function ExportDialog({
   const [modalIsShown, setModalIsShown] = useState(false);
   const [scale, setScale] = useState(defaultScale);
   const [exportSelected, setExportSelected] = useState(someElementIsSelected);
-  const previeRef = useRef<HTMLDivElement>(null);
+  const previewRef = useRef<HTMLDivElement>(null);
   const { exportBackground, viewBackgroundColor } = appState;
 
   const exportedElements = exportSelected
@@ -64,7 +64,7 @@ export function ExportDialog({
   }, [someElementIsSelected]);
 
   useEffect(() => {
-    const previewNode = previeRef.current;
+    const previewNode = previewRef.current;
     const canvas = getExportCanvasPreview(exportedElements, {
       exportBackground,
       viewBackgroundColor,
@@ -106,7 +106,7 @@ export function ExportDialog({
                 ╳
               </button>
               <h2>{t("buttons.export")}</h2>
-              <div className="ExportDialog__preview" ref={previeRef}></div>
+              <div className="ExportDialog__preview" ref={previewRef}></div>
               <div className="ExportDialog__actions">
                 <Stack.Row gap={2}>
                   <ToolIcon

src/index.tsx

@@ -800,7 +800,7 @@ export class App extends React.Component<any, AppState> {
             type ResizeTestType = ReturnType<typeof resizeTest>;
             let resizeHandle: ResizeTestType = false;
             let isResizingElements = false;
-            let draggingOccured = false;
+            let draggingOccurred = false;
             let hitElement: ExcalidrawElement | null = null;
             let elementIsAddedToSelection = false;
             if (this.state.elementType === "selection") {
@@ -1047,7 +1047,7 @@ export class App extends React.Component<any, AppState> {
               if (hitElement?.isSelected) {
                 // Marking that click was used for dragging to check
                 // if elements should be deselected on mouseup
-                draggingOccured = true;
+                draggingOccurred = true;
                 const selectedElements = elements.filter(el => el.isSelected);
                 if (selectedElements.length) {
                   const { x, y } = viewportCoordsToSceneCoords(e, this.state);
@@ -1152,17 +1152,17 @@ export class App extends React.Component<any, AppState> {
                 elements = elements.filter(el => el.id !== resizingElement.id);
               }
 
-              // If click occured on already selected element
+              // If click occurred on already selected element
               // it is needed to remove selection from other elements
               // or if SHIFT or META key pressed remove selection
               // from hitted element
               //
-              // If click occured and elements were dragged or some element
+              // If click occurred and elements were dragged or some element
               // was added to selection (on mousedown phase) we need to keep
               // selection unchanged
               if (
                 hitElement &&
-                !draggingOccured &&
+                !draggingOccurred &&
                 !elementIsAddedToSelection
               ) {
                 if (e.shiftKey) {

src/zindex.ts

@@ -80,7 +80,7 @@ export function moveOneRight<T>(elements: T[], indicesToMove: number[]) {
 // [_, _, a, b, d, e, g]
 //
 // At this point, we can fill back the leftmost elements with the array we saved at
-// the beggining
+// the beginning
 //
 //        |1       |0
 // [c, f, a, b, d, e, g]
@@ -158,7 +158,7 @@ export function moveAllLeft<T>(elements: T[], indicesToMove: number[]) {
 // [a, b, d, e, g, _, _]
 //
 // At this point, we can fill back the rightmost elements with the array we saved at
-// the beggining
+// the beginning
 //
 //        |0       |1
 // [a, b, d, e, g, c, f]