dragon-editor 2.1.1 → 3.0.0-beta

package/dist/runtime/utils/keyboardEvent.mjs

@@ -0,0 +1,781 @@
+import { _setCursor, _setCursorData, _clenupCursor, _soltingCursorDataOnElement } from "./cursor.mjs";
+import { _getParentElementIfNodeIsText, _findContentEditableElement } from "./element.mjs";
+import { _getBlockType, _createTextBlock, _createListItemBlock } from "./block.mjs";
+import { _setNodeStyle } from "./style.mjs";
+let ketEventCount = 0;
+export function _elementKeyEvent(event, store) {
+  _setCursorData(store);
+  switch (event.code) {
+    case "Enter":
+      event.preventDefault();
+      if (ketEventCount === 0) {
+        _clenupCursor(store);
+        setTimeout(() => {
+          if (event.shiftKey === true) {
+            elementShiftEnterEvent(event, store);
+          } else {
+            elementEnterEvent(event, store);
+          }
+        });
+      }
+      ketEventCount += 1;
+      setTimeout(() => {
+        ketEventCount = 0;
+      }, 150);
+      break;
+    case "Backspace":
+      elementBackspaceEvent(event, store);
+      break;
+    case "Tab":
+      event.preventDefault();
+      if (ketEventCount === 0) {
+        _clenupCursor(store);
+        setTimeout(() => {
+          elementTabEvent(event, store);
+        });
+      }
+      ketEventCount += 1;
+      setTimeout(() => {
+        ketEventCount = 0;
+      }, 150);
+      break;
+    case "Space":
+      break;
+    case "ArrowUp":
+      moveToBlockEvent(event, store, "up");
+      break;
+    case "ArrowDown":
+      moveToBlockEvent(event, store, "down");
+      break;
+  }
+}
+function elementEnterEvent(event, store) {
+  const { $element, type } = _getBlockType(event.target);
+  switch (type) {
+    case "text":
+    case "heading":
+      defaultBlockEnterEvent(store, $element);
+      break;
+    case "list":
+      listBlockEnterEvent(event, store, $element);
+      break;
+    default:
+  }
+}
+function elementShiftEnterEvent(event, store) {
+  const { $element, type } = _getBlockType(event.target);
+  switch (type) {
+    case "text":
+    case "heading":
+      defaultBlockShiftEnterEvent(store, $element);
+      break;
+    case "list":
+      listBlockEnterEvent(event, store, $element);
+      break;
+    default:
+  }
+}
+function elementBackspaceEvent(e, store) {
+  const { $element, type } = _getBlockType(e.target);
+  switch (type) {
+    case "text":
+    case "heading":
+      defaultBlockBackspaceEvent(e, store, $element);
+      break;
+    default:
+      console.log("// TODO : \uB2E4\uB978 \uD0C0\uC785 \uBE14\uB7ED \uBC31\uC2A4\uD398\uC774\uC2A4 \uC774\uBCA4\uD2B8", type);
+  }
+}
+function defaultBlockEnterEvent(store, $element) {
+  const $textBlock = $element;
+  if (store.cursorData.type === "Caret") {
+    if ($textBlock.textContent === "") {
+      if ($textBlock.hasChildNodes() === false) {
+        const $newTextBlock = _createTextBlock();
+        $textBlock.insertAdjacentElement("afterend", $newTextBlock);
+        $newTextBlock.focus();
+      } else {
+        let preStructure = [];
+        let nextStructure = [];
+        $textBlock.childNodes.forEach((_, i) => {
+          const $br = document.createElement("br");
+          if (store.cursorData.startOffset < i) {
+            preStructure.push($br);
+          } else {
+            nextStructure.push($br);
+          }
+        });
+        $textBlock.replaceChildren(...preStructure);
+        $textBlock.insertAdjacentElement("afterend", _createTextBlock());
+        const $nextBlock = $textBlock.nextElementSibling;
+        if (nextStructure.length === 0) {
+          $nextBlock.focus();
+        } else {
+          if (nextStructure.length === 1) {
+            nextStructure.push(document.createElement("br"));
+          }
+          $nextBlock.replaceChildren(...nextStructure);
+          _setCursor(nextStructure[0], 0);
+        }
+      }
+    } else {
+      const childNodeList = [...$element.childNodes];
+      const $targetNode = _getParentElementIfNodeIsText(store.cursorData.startNode, $textBlock);
+      const preStructure = [];
+      const nextStructure = [];
+      let nodeIdx = -1;
+      for (let i = 0; childNodeList.length > i; i += 1) {
+        if (childNodeList[i] === $targetNode) {
+          nodeIdx = i;
+          break;
+        }
+      }
+      childNodeList.forEach((node, i) => {
+        if (nodeIdx < i) {
+          nextStructure.push(node);
+        } else if (nodeIdx > i) {
+          preStructure.push(node);
+        } else if (nodeIdx === i) {
+          if (node.constructor.name === "Text") {
+            const text = node.textContent;
+            const preText = document.createTextNode(text.slice(0, store.cursorData.startOffset));
+            const nextText = document.createTextNode(text.slice(store.cursorData.startOffset));
+            preStructure.push(preText);
+            nextStructure.push(nextText);
+          } else {
+            const originalClassList = [...node.classList];
+            const text = node.textContent;
+            const preSpan = document.createElement("span");
+            const nextSpan = document.createElement("span");
+            preSpan.classList.add(...originalClassList);
+            preSpan.textContent = text.slice(0, store.cursorData.startOffset);
+            preStructure.push(preSpan);
+            nextSpan.classList.add(...originalClassList);
+            nextSpan.textContent = text.slice(store.cursorData.startOffset);
+            nextStructure.push(nextSpan);
+          }
+        }
+      });
+      const $nextBlock = _createTextBlock();
+      $textBlock.insertAdjacentElement("afterend", $nextBlock);
+      $textBlock.replaceChildren(...preStructure);
+      $nextBlock.replaceChildren(...nextStructure);
+      if (nextStructure.length === 0) {
+        $nextBlock.focus();
+      } else {
+        _setCursor($nextBlock.childNodes[0], 0);
+      }
+    }
+  } else {
+    const childNodeList = $textBlock.childNodes;
+    const cursorData = _soltingCursorDataOnElement(store.cursorData, $textBlock);
+    const preStructure = [];
+    const nextStructure = [];
+    if (cursorData.startNodeIdx === cursorData.endNodeIdx) {
+      childNodeList.forEach((node, i) => {
+        if (cursorData.startNodeIdx > i) {
+          preStructure.push(node);
+        } else if (cursorData.endNodeIdx < i) {
+          nextStructure.push(node);
+        } else if (cursorData.startNodeIdx === i) {
+          if (node.constructor.name === "Text") {
+            const preText = node.textContent.slice(0, cursorData.startOffset);
+            const nextText = node.textContent.slice(cursorData.endOffset);
+            if (preText !== "") {
+              const textNode = document.createTextNode(preText);
+              preStructure.push(textNode);
+            }
+            if (nextText !== "") {
+              const textNode = document.createTextNode(nextText);
+              nextStructure.push(textNode);
+            }
+          } else {
+            const originalClassList = [...node.classList];
+            const preText = node.textContent.slice(0, cursorData.startOffset);
+            const nextText = node.textContent.slice(cursorData.endOffset);
+            if (preText !== "") {
+              const $span = document.createElement("span");
+              $span.classList.add(...originalClassList);
+              $span.textContent = preText;
+              preStructure.push($span);
+            }
+            if (nextText !== "") {
+              const $span = document.createElement("span");
+              $span.classList.add(...originalClassList);
+              $span.textContent = nextText;
+              nextStructure.push($span);
+            }
+          }
+        }
+      });
+    } else {
+      childNodeList.forEach((node, i) => {
+        if (cursorData.startNodeIdx > i) {
+          preStructure.push(node);
+        } else if (cursorData.startNodeIdx === i) {
+          if (node.constructor.name === "Text") {
+            const text = node.textContent.slice(0, cursorData.startOffset);
+            if (text !== "") {
+              const textNode = document.createTextNode(text);
+              preStructure.push(textNode);
+            }
+          } else {
+            const originalClassList = [...node.classList];
+            const text = node.textContent.slice(0, cursorData.startOffset);
+            if (text !== "") {
+              const $span = document.createElement("span");
+              $span.classList.add(...originalClassList);
+              $span.textContent = text;
+              preStructure.push($span);
+            }
+          }
+        }
+        if (cursorData.endNodeIdx < i) {
+          nextStructure.push(node);
+        } else if (cursorData.endNodeIdx === i) {
+          if (node.constructor.name === "Text") {
+            const text = node.textContent.slice(cursorData.endOffset);
+            if (text !== "") {
+              const textNode = document.createTextNode(text);
+              nextStructure.push(textNode);
+            }
+          } else {
+            const originalClassList = [...node.classList];
+            const text = node.textContent.slice(cursorData.endOffset);
+            const $span = document.createElement("span");
+            if (text !== "") {
+              $span.classList.add(...originalClassList);
+              $span.textContent = text;
+              nextStructure.push($span);
+            }
+          }
+        }
+      });
+    }
+    const $nextBlock = _createTextBlock(store);
+    $textBlock.insertAdjacentElement("afterend", $nextBlock);
+    $textBlock.replaceChildren(...preStructure);
+    $nextBlock.replaceChildren(...nextStructure);
+    if (nextStructure.length === 0) {
+      $nextBlock.focus();
+    } else {
+      _setCursor($nextBlock.childNodes[0], 0);
+    }
+  }
+}
+function listBlockEnterEvent(event, store, $element) {
+  const $listBlock = $element;
+  const $editableElement = _findContentEditableElement(event.target);
+  const liList = $listBlock.querySelectorAll(".de-item");
+  let liIdx = -1;
+  for (let i = 0; liList.length > i; i += 1) {
+    if (liList[i] === $editableElement) {
+      liIdx = i;
+      break;
+    }
+  }
+  if (store.cursorData.type === "Caret") {
+    if ($editableElement.textContent === "") {
+      if (liList.length - 1 === liIdx) {
+        const $textBlock = _createTextBlock();
+        $listBlock.insertAdjacentElement("afterend", $textBlock);
+        if (liList.length === 1) {
+          $listBlock.remove();
+        } else {
+          $editableElement.remove();
+        }
+        $textBlock.focus();
+      } else {
+        const $liBlock = _createListItemBlock();
+        $editableElement.insertAdjacentElement("afterend", $liBlock);
+        $liBlock.focus();
+      }
+    } else {
+      const childNodeList = $editableElement.childNodes;
+      const targetNode = _getParentElementIfNodeIsText(store.cursorData.startNode, $editableElement);
+      const preStructure = [];
+      const nextStructure = [];
+      let nodeIdx = -1;
+      for (let i = 0; childNodeList.length > i; i += 1) {
+        if (childNodeList[i] === targetNode) {
+          nodeIdx = i;
+          break;
+        }
+      }
+      childNodeList.forEach((node, i) => {
+        if (nodeIdx < i) {
+          nextStructure.push(node);
+        } else if (nodeIdx > i) {
+          preStructure.push(node);
+        } else if (nodeIdx === i) {
+          if (node.constructor.name === "Text") {
+            const preText = node.textContent.slice(0, store.cursorData.startOffset);
+            const nextText = node.textContent.slice(store.cursorData.endOffset);
+            if (preText !== "") {
+              preStructure.push(document.createTextNode(preText));
+            }
+            if (nextText !== "") {
+              nextStructure.push(document.createTextNode(nextText));
+            }
+          } else {
+            const originalClassList = [...node.classList];
+            const preText = node.textContent.slice(0, store.cursorData.startOffset);
+            const nextText = node.textContent.slice(store.cursorData.endOffset);
+            if (preText !== "") {
+              const $span = document.createElement("span");
+              $span.textContent = preText;
+              $span.classList.add(...originalClassList);
+              preStructure.push($span);
+            }
+            if (nextText !== "") {
+              const $span = document.createElement("span");
+              $span.textContent = nextText;
+              $span.classList.add(...originalClassList);
+              nextStructure.push($span);
+            }
+          }
+        }
+      });
+      const $liBlock = _createListItemBlock();
+      $editableElement.insertAdjacentElement("afterend", $liBlock);
+      $editableElement.replaceChildren(...preStructure);
+      $liBlock.replaceChildren(...nextStructure);
+      if (nextStructure.length === 0) {
+        $liBlock.focus();
+      } else {
+        _setCursor($liBlock.childNodes[0], 0);
+      }
+    }
+  } else {
+    const childNodeList = $editableElement.childNodes;
+    const cursorData = _soltingCursorDataOnElement(store.cursorData, $editableElement);
+    const preStructure = [];
+    const nextStructure = [];
+    childNodeList.forEach((node, i) => {
+      if (cursorData.startNodeIdx > i) {
+        preStructure.push(node);
+      } else if (cursorData.startNodeIdx === i) {
+        if (node.constructor.name === "Text") {
+          const text = node.textContent.slice(0, cursorData.startOffset);
+          if (text !== "") {
+            const $textNode = document.createTextNode(text);
+            preStructure.push($textNode);
+          }
+        } else {
+          const originalClassList = [...node.classList];
+          const text = node.textContent.slice(0, cursorData.startOffset);
+          if (text !== "") {
+            const $span = document.createElement("span");
+            $span.classList.add(...originalClassList);
+            $span.textContent = text;
+            preStructure.push($span);
+          }
+        }
+      }
+      if (cursorData.endNodeIdx < i) {
+        nextStructure.push(node);
+      } else if (cursorData.endNodeIdx === i) {
+        if (node.constructor.name === "Text") {
+          const text = node.textContent.slice(cursorData.endOffset);
+          if (text !== "") {
+            const $textNode = document.createTextNode(text);
+            nextStructure.push($textNode);
+          }
+        } else {
+          const originalClassList = [...node.classList];
+          const text = node.textContent.slice(cursorData.endOffset);
+          if (text !== "") {
+            const $span = document.createElement("span");
+            $span.classList.add(...originalClassList);
+            $span.textContent = text;
+            nextStructure.push($span);
+          }
+        }
+      }
+    });
+    const $liBlock = _createListItemBlock();
+    $editableElement.insertAdjacentElement("afterend", $liBlock);
+    $editableElement.replaceChildren(...preStructure);
+    if (nextStructure.length === 0) {
+      $liBlock.focus();
+    } else {
+      $liBlock.replaceChildren(...nextStructure);
+      _setCursor(nextStructure[0], 0);
+    }
+  }
+}
+function defaultBlockShiftEnterEvent(store, $element) {
+  const $textBlock = $element;
+  if (store.cursorData.type === "Caret") {
+    if ($textBlock.textContent === "") {
+      if ($textBlock.hasChildNodes() === false) {
+        $textBlock.insertAdjacentHTML("beforeend", "<br><br>");
+        _setCursor($textBlock.childNodes[1], 0);
+      } else {
+        let $target = store.cursorData.startNode;
+        let childIdx = -1;
+        if ($textBlock === $target) {
+          $target = $textBlock.childNodes[store.cursorData.startOffset];
+        }
+        for (let i = 0; $textBlock.childNodes.length > i; i += 1) {
+          if ($textBlock.childNodes[i] === $target) {
+            childIdx = i;
+            break;
+          }
+        }
+        $target.insertAdjacentHTML("afterend", "<br>");
+        _setCursor($textBlock.childNodes[childIdx + 1], 0);
+      }
+    } else {
+      const childList = $textBlock.childNodes;
+      let $target = store.cursorData.startNode;
+      let targetIdx = -1;
+      let structure = "";
+      if ($target.constructor.name === "Text") {
+        if ($target.parentNode !== $textBlock) {
+          $target = $target.parentNode;
+        }
+      }
+      if ($textBlock === $target) {
+        $target = $textBlock.childNodes[store.cursorData.startOffset];
+      }
+      for (let i = 0; childList.length > i; i += 1) {
+        if (childList[i] === $target) {
+          targetIdx = i;
+          break;
+        }
+      }
+      let curruntIdx = targetIdx;
+      childList.forEach((child, i) => {
+        if (i === targetIdx) {
+          const constructorName = child.constructor.name;
+          if (constructorName === "Text") {
+            structure += child.textContent.slice(0, store.cursorData.startOffset) + "<br>" + child.textContent.slice(store.cursorData.endOffset);
+            if (child.nextSibling === null) {
+              if (child.textContent.slice(store.cursorData.endOffset) === "") {
+                structure += `<br>`;
+              }
+              if (child.textContent.slice(0, store.cursorData.startOffset) === "") {
+                curruntIdx -= 1;
+              }
+            } else {
+              if (child.textContent.slice(store.cursorData.endOffset) !== "" && child.textContent.slice(0, store.cursorData.startOffset) === "") {
+                curruntIdx -= 1;
+              }
+            }
+            curruntIdx += 1;
+          } else {
+            if (constructorName === "HTMLBRElement") {
+              structure += `<br><br>`;
+            } else {
+              console.log("TODO: \uC2A4\uD0C0\uC77C \uD0DC\uADF8 \uBD84\uB9AC \uC791\uC5C5");
+            }
+          }
+        } else {
+          if (child.constructor.name === "Text") {
+            structure += child.textContent;
+          } else {
+            structure += child.outerHTML;
+          }
+        }
+      });
+      $textBlock.innerHTML = structure;
+      _setCursor($textBlock.childNodes[curruntIdx + 1], 0);
+    }
+  } else {
+    const childNodeList = $textBlock.childNodes;
+    let startTargetNode = store.cursorData.startNode;
+    let startNodeIdx = -1;
+    let startOffset = store.cursorData.startOffset;
+    let endTargetNode = store.cursorData.endNode;
+    let endNodeIdx = -1;
+    let endOffset = store.cursorData.endOffset;
+    let structure = "";
+    if (startTargetNode.constructor.name === "Text") {
+      if (startTargetNode.parentElement !== $textBlock) {
+        startTargetNode = startTargetNode.parentElement;
+      }
+    }
+    if (endTargetNode.constructor.name === "Text") {
+      if (endTargetNode.parentElement !== $textBlock) {
+        endTargetNode = endTargetNode.parentElement;
+      }
+    }
+    for (let i = 0; childNodeList.length > i; i += 1) {
+      if (startTargetNode === childNodeList[i]) {
+        startNodeIdx = i;
+      }
+      if (endTargetNode === childNodeList[i]) {
+        endNodeIdx = i;
+      }
+      if (startNodeIdx !== -1 && endNodeIdx !== -1) {
+        break;
+      }
+    }
+    if (startNodeIdx !== endNodeIdx) {
+      if (startNodeIdx > endNodeIdx) {
+        const originalEndNodeIdx = endNodeIdx;
+        const originalEndOffset = endOffset;
+        const originalStartNodeIdx = startNodeIdx;
+        const originalStartOffset = startOffset;
+        startNodeIdx = originalEndNodeIdx;
+        startOffset = originalEndOffset;
+        endNodeIdx = originalStartNodeIdx;
+        endOffset = originalStartOffset;
+      }
+    } else {
+      if (startOffset > endOffset) {
+        const originalEndOffset = endOffset;
+        const originalStartOffset = startOffset;
+        startOffset = originalEndOffset;
+        endOffset = originalStartOffset;
+      }
+    }
+    childNodeList.forEach((node, i) => {
+      if (startNodeIdx > i) {
+        if (node.constructor.name === "Text") {
+          structure += node.textContent;
+        } else {
+          structure += node.outerHTML;
+        }
+      } else if (startNodeIdx === i) {
+        if (node.constructor.name === "Text") {
+          structure += node.textContent.slice(0, startOffset);
+          structure += `<br>`;
+        } else {
+          if (node.tagName === "BR") {
+            structure += `<br>`;
+          } else {
+            const originalClassList = [...node.classList];
+            const text = node.textContent;
+            structure += `<span class="${originalClassList.join(" ")}">${text.slice(0, startOffset)}</span><br>`;
+          }
+        }
+        if (childNodeList.length === i) {
+          structure += `<br>`;
+        }
+      }
+      if (endNodeIdx < i) {
+        if (node.constructor.name === "Text") {
+          structure += node.textContent;
+        } else {
+          structure += node.outerHTML;
+        }
+      } else if (endNodeIdx === i) {
+        if (node.constructor.name === "Text") {
+          structure += node.textContent.slice(endOffset);
+        } else {
+          if (node.tagName === "BR") {
+            structure += `<br>`;
+          } else {
+            const originalClassList = [...node.classList];
+            const text = node.textContent;
+            structure += `<span class="${originalClassList.join(" ")}">${text.slice(endOffset)}</span><br>`;
+          }
+        }
+      }
+    });
+    $textBlock.innerHTML = structure;
+    _setCursor($textBlock.childNodes[startNodeIdx + 2], 0);
+  }
+}
+function elementTabEvent(e, store) {
+  const { $element, type } = _getBlockType(e.target);
+  switch (type) {
+    case "text":
+      defaultTabEvent(e.shiftKey, $element);
+      break;
+  }
+}
+function defaultBlockBackspaceEvent(e, store, $element) {
+  const $textBlock = $element;
+  const childList = store.wrap.querySelectorAll(".de-block");
+  const childLength = childList.length;
+  const $target = _getParentElementIfNodeIsText(store.cursorData.startNode, $textBlock);
+  let elementIdx = -1;
+  for (let i = 0; childLength > i; i += 1) {
+    if (childList[i] === $element) {
+      elementIdx = i;
+      break;
+    }
+  }
+  if (elementIdx === 0) {
+    if (store.cursorData.startOffset === 0 && $target === $textBlock) {
+      if ($target.textContent === "") {
+        $textBlock.insertAdjacentElement("afterend", _createTextBlock());
+        _setCursor($textBlock.nextElementSibling, 0);
+        $textBlock.remove();
+      } else {
+        e.preventDefault();
+        if ($textBlock.tagName !== "P") {
+          $textBlock.insertAdjacentElement("afterend", _createTextBlock($textBlock.textContent));
+          _setCursor($textBlock.nextElementSibling, 0);
+          $textBlock.remove();
+        }
+      }
+    }
+  } else {
+    if ($textBlock.hasChildNodes() === false) {
+      e.preventDefault();
+      const $preBlock = $textBlock.previousElementSibling;
+      if ($preBlock !== null) {
+        const { type: preBlockType } = _getBlockType($textBlock);
+        $textBlock.remove();
+        if (preBlockType === "text") {
+          if ($preBlock.hasChildNodes() === true) {
+            const textBlockChildList = $preBlock.childNodes;
+            const textBlockTargetChild = textBlockChildList[textBlockChildList.length - 1];
+            _setCursor(textBlockTargetChild, textBlockTargetChild.textContent.length);
+          } else {
+            _setCursor($preBlock, 0);
+          }
+        }
+      }
+    } else {
+      if (store.cursorData.startOffset === 0 && ($textBlock.childNodes[0] === store.cursorData.startNode || $textBlock.childNodes[0] === $target)) {
+        e.preventDefault();
+        const $preBlock = $textBlock.previousElementSibling;
+        if ($preBlock !== null) {
+          const { type: preBlockType } = _getBlockType($preBlock);
+          if (preBlockType === "text") {
+            if ($preBlock.hasChildNodes() === true) {
+              const textBlockChildList = $preBlock.childNodes;
+              const textBlockTargetChildIdx = textBlockChildList.length - 1;
+              const textBlockTargetCursorIdx = textBlockChildList[textBlockTargetChildIdx].textContent.length;
+              const thisBlockHTML = $textBlock.innerHTML;
+              $preBlock.innerHTML = $preBlock.innerHTML + thisBlockHTML;
+              _setCursor($preBlock.childNodes[textBlockTargetChildIdx], textBlockTargetCursorIdx);
+            } else {
+              $preBlock.innerHTML = $textBlock.innerHTML;
+              _setCursor($preBlock, 0);
+            }
+            $textBlock.remove();
+          }
+        }
+      }
+    }
+  }
+  if (store.cursorData.startOffset === 1 && $target !== $textBlock) {
+    if ($target.textContent.length === 1) {
+      e.preventDefault();
+      const preNode = $target.previousSibling;
+      if (preNode !== null) {
+        $target.remove();
+        _setCursor(preNode, preNode.textContent.length);
+      } else {
+        if ($textBlock.childNodes[1] === void 0) {
+          $textBlock.innerHTML = "";
+          _setCursor($textBlock, 0);
+        } else {
+          _setCursor($textBlock.childNodes[1], 0);
+          $target.remove();
+        }
+      }
+    }
+  }
+  _setCursorData(store);
+}
+function defaultTabEvent(useShiftKey, $element) {
+  const $target = $element;
+  let value = $target.dataset["depth"] === void 0 ? 0 : parseInt($target.dataset["depth"]);
+  if (useShiftKey === true) {
+    if (value !== 0) {
+      value -= 1;
+    }
+  } else {
+    if (value < 5) {
+      value += 1;
+    }
+  }
+  if (value === 0) {
+    delete $target.dataset["depth"];
+  } else {
+    $target.dataset["depth"] = String(value);
+  }
+}
+function moveToBlockEvent(e, store, keyType) {
+  const $editableElement = _findContentEditableElement(store.cursorData.startNode);
+  if ($editableElement !== null) {
+    const { $element, type } = _getBlockType($editableElement);
+    let $target;
+    switch (type) {
+      case "list":
+        if (keyType === "up") {
+          $target = $editableElement.previousElementSibling;
+        } else {
+          $target = $editableElement.nextElementSibling;
+        }
+        if ($target === null) {
+          if (keyType === "up") {
+            $target = $element.previousElementSibling;
+          } else {
+            $target = $element.nextElementSibling;
+          }
+        }
+        break;
+      default:
+        if (keyType === "up") {
+          $target = $element.previousElementSibling;
+        } else {
+          $target = $element.nextElementSibling;
+        }
+    }
+    if ($target !== null) {
+      if ($target.classList.contains("de-block") == true) {
+        const { $element: $element2, type: targetType } = _getBlockType($target);
+        switch (targetType) {
+          case "list":
+            const $targetItem = $element2.querySelectorAll(".de-item");
+            let $item;
+            if (keyType === "up") {
+              $item = $targetItem[$targetItem.length - 1];
+            } else {
+              $item = $targetItem[0];
+            }
+            _setCursor($item, 0);
+            break;
+          default:
+            _setCursor($element2, 0);
+        }
+      } else {
+        _setCursor($target, 0);
+      }
+    }
+  }
+}
+export function _hotKeyEvent(event, store) {
+  _setCursorData(store);
+  const isControlKeyActive = event.ctrlKey || event.metaKey;
+  if (isControlKeyActive === true) {
+    switch (event.key) {
+      case "b":
+        event.preventDefault();
+        _setNodeStyle("de-bold", store);
+        break;
+      case "i":
+        event.preventDefault();
+        _setNodeStyle("de-italic", store);
+        break;
+      case "u":
+        event.preventDefault();
+        _setNodeStyle("de-underline", store);
+        break;
+      case "s":
+        if (event.shiftKey === true) {
+          event.preventDefault();
+          _setNodeStyle("de-strikethrough", store);
+        }
+        break;
+      case "c":
+        if (event.shiftKey === true) {
+          event.preventDefault();
+          _setNodeStyle("de-code", store);
+        }
+        break;
+    }
+  }
+}
+export function copyEvent(event, store) {
+}
+export function pasteEvent(event, store) {
+}