diff --git a/.gitignore b/.gitignore
index d451ff1..6b352c4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,3 +3,4 @@ node_modules
dist
dist-ssr
*.local
+cypress
diff --git a/cypress.json b/cypress.json
new file mode 100644
index 0000000..8f5cb7d
--- /dev/null
+++ b/cypress.json
@@ -0,0 +1,7 @@
+{
+ "baseUrl": "http://localhost:3001",
+ "integrationFolder": "tests",
+ "pluginsFile": false,
+ "supportFile": false,
+ "video": false
+}
diff --git a/demo/sandbox/index.html b/demo/sandbox/index.html
new file mode 100644
index 0000000..e4d1a89
--- /dev/null
+++ b/demo/sandbox/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+ vue-input-autowidth test sandbox
+
+
+
+
+
+
diff --git a/demo/sandbox/src/Sandbox.vue b/demo/sandbox/src/Sandbox.vue
new file mode 100644
index 0000000..d1772a1
--- /dev/null
+++ b/demo/sandbox/src/Sandbox.vue
@@ -0,0 +1,50 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/demo/sandbox/src/env.d.ts b/demo/sandbox/src/env.d.ts
new file mode 100644
index 0000000..d27eb5a
--- /dev/null
+++ b/demo/sandbox/src/env.d.ts
@@ -0,0 +1,8 @@
+///
+
+declare module '*.vue' {
+ import { DefineComponent } from 'vue'
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+ const component: DefineComponent<{}, {}, any>
+ export default component
+}
diff --git a/demo/sandbox/src/main.ts b/demo/sandbox/src/main.ts
new file mode 100644
index 0000000..88cbb25
--- /dev/null
+++ b/demo/sandbox/src/main.ts
@@ -0,0 +1,6 @@
+import { createApp } from "vue";
+import Sandbox from "./Sandbox.vue";
+import { plugin as VueInputAutowidth } from "../../../src/";
+import "../../src/app.css";
+
+createApp(Sandbox).use(VueInputAutowidth).mount("#app");
diff --git a/demo/src/App.vue b/demo/src/App.vue
index 06527d4..a4621e7 100644
--- a/demo/src/App.vue
+++ b/demo/src/App.vue
@@ -1,5 +1,5 @@
-
+
@@ -14,7 +14,21 @@
rel="noopener noreferrer"
class="inline-block transition-colors hover:text-purple-500"
>
- GitHub
+
@@ -47,7 +61,11 @@
class="input"
placeholder="An example with custom options"
v-model="msg"
- v-autowidth
+ v-autowidth="{
+ minWidth: '75px',
+ maxWidth: '75%',
+ comfortZone: '1ch',
+ }"
/>