From 8fe015ce7c6258c718f74747b6bc0431fcd22842 Mon Sep 17 00:00:00 2001
From: Daybrush <younkue.choi@navercorp.com>
Date: Tue, 11 Apr 2023 22:49:54 +0900
Subject: [PATCH] fix: fix createElement canvas #40

---
 packages/ngx-ruler/package.json                    | 2 +-
 packages/ngx-ruler/projects/ngx-ruler/package.json | 4 ++--
 packages/ruler/package.json                        | 2 +-
 packages/ruler/src/Ruler.tsx                       | 2 +-
 packages/ruler/tests/manual/portal.html            | 6 +++---
 packages/svelte-ruler/package.json                 | 4 ++--
 packages/vue-ruler/package.json                    | 4 ++--
 7 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/packages/ngx-ruler/package.json b/packages/ngx-ruler/package.json
index 1b314d7..1253826 100644
--- a/packages/ngx-ruler/package.json
+++ b/packages/ngx-ruler/package.json
@@ -19,7 +19,7 @@
     "@angular/platform-browser": "~13.3.0",
     "@angular/platform-browser-dynamic": "~13.3.0",
     "@angular/router": "~13.3.0",
-    "@scena/ruler": "~0.18.2",
+    "@scena/ruler": "~0.18.3",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.11.4"
diff --git a/packages/ngx-ruler/projects/ngx-ruler/package.json b/packages/ngx-ruler/projects/ngx-ruler/package.json
index 021c9ef..a7b0f1b 100644
--- a/packages/ngx-ruler/projects/ngx-ruler/package.json
+++ b/packages/ngx-ruler/projects/ngx-ruler/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ngx-ruler",
-  "version": "0.17.2",
+  "version": "0.17.3",
   "description": "An Angular Ruler component that can draw grids and scroll infinitely.",
   "keywords": [
     "scene",
@@ -22,7 +22,7 @@
   },
   "homepage": "https://github.com/daybrush/ruler#readme",
   "dependencies": {
-    "@scena/ruler": "~0.18.2",
+    "@scena/ruler": "~0.18.3",
     "tslib": "^2.3.0"
   }
 }
diff --git a/packages/ruler/package.json b/packages/ruler/package.json
index 3b138da..2d6f92e 100644
--- a/packages/ruler/package.json
+++ b/packages/ruler/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@scena/ruler",
-    "version": "0.18.2",
+    "version": "0.18.3",
     "description": "A Vanilla Ruler component that can draw grids and scroll infinitely.",
     "main": "./dist/ruler.cjs.js",
     "module": "./dist/ruler.esm.js",
diff --git a/packages/ruler/src/Ruler.tsx b/packages/ruler/src/Ruler.tsx
index 3e5c485..8fe6c90 100644
--- a/packages/ruler/src/Ruler.tsx
+++ b/packages/ruler/src/Ruler.tsx
@@ -42,7 +42,7 @@ class Ruler implements RulerInterface {
             this._warp = true;
             selfElement = parentElement;
         } else {
-            selfElement = document.createElement("div");
+            selfElement = document.createElement("canvas");
             parentElement.appendChild(selfElement);
         }
         renderSelf(
diff --git a/packages/ruler/tests/manual/portal.html b/packages/ruler/tests/manual/portal.html
index 74d6ae3..86205e6 100644
--- a/packages/ruler/tests/manual/portal.html
+++ b/packages/ruler/tests/manual/portal.html
@@ -1,10 +1,10 @@
 <div class="" style="width: 100%; height: 30px">
-    <canvas width="100%" height="100%" style="width:100%;height:100%;position: relative;display: block;"></canvas>
+    <!-- <canvas width="100%" height="100%" style="width:100%;height:100%;position: relative;display: block;"></canvas> -->
 </div>
 
 <script src="../../dist/ruler.js"></script>
 <script>
-    const ruler = new Ruler(document.querySelector("canvas"), {
-        warpSelf: true,
+    const ruler = new Ruler(document.querySelector("div"), {
+        // warpSelf: true,
     });
 </script>
diff --git a/packages/svelte-ruler/package.json b/packages/svelte-ruler/package.json
index 49db368..9d527f5 100644
--- a/packages/svelte-ruler/package.json
+++ b/packages/svelte-ruler/package.json
@@ -1,6 +1,6 @@
 {
     "name": "svelte-ruler",
-    "version": "0.17.2",
+    "version": "0.17.3",
     "description": "A Svelte Ruler component that can draw grids and scroll infinitely.",
     "main": "./dist/ruler.cjs.js",
     "module": "./dist/ruler.esm.js",
@@ -51,7 +51,7 @@
         "typescript": "^4.5.0 <4.6.0"
     },
     "dependencies": {
-        "@scena/ruler": "~0.18.2"
+        "@scena/ruler": "~0.18.3"
     },
     "scripts": {
         "build": "rollup -c rollup.build.config.js",
diff --git a/packages/vue-ruler/package.json b/packages/vue-ruler/package.json
index f937604..f62265c 100644
--- a/packages/vue-ruler/package.json
+++ b/packages/vue-ruler/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@scena/vue-ruler",
-    "version": "0.16.2",
+    "version": "0.16.3",
     "description": "A Vue Ruler component that can draw grids and scroll infinitely.",
     "main": "./dist/ruler.cjs.js",
     "module": "./dist/ruler.esm.js",
@@ -31,7 +31,7 @@
         "declaration": "rm -rf declaration && tsc -p tsconfig.declaration.json && cp ./src/components/Ruler.vue.d.ts ./declaration/"
     },
     "dependencies": {
-        "@scena/ruler": "~0.18.2"
+        "@scena/ruler": "~0.18.3"
     },
     "files": [
         "README.md",