)
Vue Bits uses [jsrepo](https://jsrepo.dev) for installing components via CLI.
-The setup steps can be found on each component's page in the [documentation](https://vuebits.dev/).
+The setup steps can be found on each component's page in the [documentation](https://vue-bits.dev/).
## How To Contribute?
diff --git a/index.html b/index.html
index a66ddfa..bac3082 100644
--- a/index.html
+++ b/index.html
@@ -40,11 +40,11 @@
-
+
-
+
@@ -53,7 +53,7 @@
-
+
@@ -62,7 +62,7 @@
-
+
@@ -71,9 +71,9 @@
"@context": "https://schema.org",
"@type": "WebPage",
"name": "Vue Bits",
- "url": "https://vuebits.dev",
+ "url": "https://vue-bits.dev",
"description": "An open source collection of high quality, animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.",
- "image": "https://vuebits.dev/og-pic.jpg",
+ "image": "https://vue-bits.dev/og-pic.jpg",
"author": {
"@type": "Person",
"name": "David Haz"
diff --git a/jsrepo-build-config.json b/jsrepo-build-config.json
index b713aa3..29643a7 100644
--- a/jsrepo-build-config.json
+++ b/jsrepo-build-config.json
@@ -4,7 +4,7 @@
"authors": ["David Haz"],
"description": "An open source collection of animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.",
"bugs": "https://github.com/DavidHDev/vue-bits/issues",
- "homepage": "https://vuebits.dev",
+ "homepage": "https://vue-bits.dev",
"repository": "https://github.com/DavidHDev/vue-bits",
"tags": [
"vue",
diff --git a/package-lock.json b/package-lock.json
index a3ac61f..a94de4c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,6 +11,7 @@
"@primeuix/themes": "^1.2.1",
"@wdns/vue-code-block": "^2.3.5",
"gsap": "^3.13.0",
+ "motion-v": "^1.5.0",
"ogl": "^1.0.11",
"primeicons": "^7.0.0",
"primevue": "^4.3.6",
@@ -2770,6 +2771,12 @@
"form-data": "^4.0.0"
}
},
+ "node_modules/@types/web-bluetooth": {
+ "version": "0.0.20",
+ "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
+ "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==",
+ "license": "MIT"
+ },
"node_modules/@typescript-eslint/eslint-plugin": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.36.0.tgz",
@@ -3403,6 +3410,94 @@
}
}
},
+ "node_modules/@vueuse/core": {
+ "version": "10.11.1",
+ "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
+ "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
+ "license": "MIT",
+ "dependencies": {
+ "@types/web-bluetooth": "^0.0.20",
+ "@vueuse/metadata": "10.11.1",
+ "@vueuse/shared": "10.11.1",
+ "vue-demi": ">=0.14.8"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/antfu"
+ }
+ },
+ "node_modules/@vueuse/core/node_modules/vue-demi": {
+ "version": "0.14.10",
+ "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+ "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+ "hasInstallScript": true,
+ "license": "MIT",
+ "bin": {
+ "vue-demi-fix": "bin/vue-demi-fix.js",
+ "vue-demi-switch": "bin/vue-demi-switch.js"
+ },
+ "engines": {
+ "node": ">=12"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/antfu"
+ },
+ "peerDependencies": {
+ "@vue/composition-api": "^1.0.0-rc.1",
+ "vue": "^3.0.0-0 || ^2.6.0"
+ },
+ "peerDependenciesMeta": {
+ "@vue/composition-api": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@vueuse/metadata": {
+ "version": "10.11.1",
+ "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
+ "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
+ "license": "MIT",
+ "funding": {
+ "url": "https://github.com/sponsors/antfu"
+ }
+ },
+ "node_modules/@vueuse/shared": {
+ "version": "10.11.1",
+ "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
+ "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
+ "license": "MIT",
+ "dependencies": {
+ "vue-demi": ">=0.14.8"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/antfu"
+ }
+ },
+ "node_modules/@vueuse/shared/node_modules/vue-demi": {
+ "version": "0.14.10",
+ "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+ "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+ "hasInstallScript": true,
+ "license": "MIT",
+ "bin": {
+ "vue-demi-fix": "bin/vue-demi-fix.js",
+ "vue-demi-switch": "bin/vue-demi-switch.js"
+ },
+ "engines": {
+ "node": ">=12"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/antfu"
+ },
+ "peerDependencies": {
+ "@vue/composition-api": "^1.0.0-rc.1",
+ "vue": "^3.0.0-0 || ^2.6.0"
+ },
+ "peerDependenciesMeta": {
+ "@vue/composition-api": {
+ "optional": true
+ }
+ }
+ },
"node_modules/@wdns/vue-code-block": {
"version": "2.3.5",
"resolved": "https://registry.npmjs.org/@wdns/vue-code-block/-/vue-code-block-2.3.5.tgz",
@@ -5051,6 +5146,33 @@
"url": "https://github.com/sponsors/rawify"
}
},
+ "node_modules/framer-motion": {
+ "version": "12.22.0",
+ "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.22.0.tgz",
+ "integrity": "sha512-qG07rR8/mboCNU34nORbrIbBXbJzP4aDqBdr67TAIVlMryDEOwh7LXjylWovlnPCMg78ExoY0Gn2F1fV+3DNIw==",
+ "license": "MIT",
+ "dependencies": {
+ "motion-dom": "^12.22.0",
+ "motion-utils": "^12.19.0",
+ "tslib": "^2.4.0"
+ },
+ "peerDependencies": {
+ "@emotion/is-prop-valid": "*",
+ "react": "^18.0.0 || ^19.0.0",
+ "react-dom": "^18.0.0 || ^19.0.0"
+ },
+ "peerDependenciesMeta": {
+ "@emotion/is-prop-valid": {
+ "optional": true
+ },
+ "react": {
+ "optional": true
+ },
+ "react-dom": {
+ "optional": true
+ }
+ }
+ },
"node_modules/fs-extra": {
"version": "11.3.0",
"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.0.tgz",
@@ -5304,6 +5426,12 @@
"he": "bin/he"
}
},
+ "node_modules/hey-listen": {
+ "version": "1.0.8",
+ "resolved": "https://registry.npmjs.org/hey-listen/-/hey-listen-1.0.8.tgz",
+ "integrity": "sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==",
+ "license": "MIT"
+ },
"node_modules/highlight.js": {
"version": "11.11.1",
"resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.1.tgz",
@@ -6210,6 +6338,36 @@
"url": "https://github.com/sponsors/isaacs"
}
},
+ "node_modules/motion-dom": {
+ "version": "12.22.0",
+ "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.22.0.tgz",
+ "integrity": "sha512-ooH7+/BPw9gOsL9VtPhEJHE2m4ltnhMlcGMhEqA0YGNhKof7jdaszvsyThXI6LVIKshJUZ9/CP6HNqQhJfV7kw==",
+ "license": "MIT",
+ "dependencies": {
+ "motion-utils": "^12.19.0"
+ }
+ },
+ "node_modules/motion-utils": {
+ "version": "12.19.0",
+ "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.19.0.tgz",
+ "integrity": "sha512-BuFTHINYmV07pdWs6lj6aI63vr2N4dg0vR+td0rtrdpWOhBzIkEklZyLcvKBoEtwSqx8Jg06vUB5RS0xDiUybw==",
+ "license": "MIT"
+ },
+ "node_modules/motion-v": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/motion-v/-/motion-v-1.5.0.tgz",
+ "integrity": "sha512-AIwI0U0ZlxDgdtjZKNzSpUo+X3IKRUGNqrdf+hig3TIehxgFds4gSL3amqsx9iZIGjYnGDdlwuqxKPYR1cxiTQ==",
+ "license": "MIT",
+ "dependencies": {
+ "@vueuse/core": "^10.0.0",
+ "framer-motion": "12.22.0",
+ "hey-listen": "^1.0.8",
+ "motion-dom": "12.22.0"
+ },
+ "peerDependencies": {
+ "vue": ">=3.0.0"
+ }
+ },
"node_modules/mrmime": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.1.tgz",
@@ -7453,9 +7611,7 @@
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
- "dev": true,
- "license": "0BSD",
- "optional": true
+ "license": "0BSD"
},
"node_modules/type-check": {
"version": "0.4.0",
diff --git a/package.json b/package.json
index fef5af1..de576c5 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
"@primeuix/themes": "^1.2.1",
"@wdns/vue-code-block": "^2.3.5",
"gsap": "^3.13.0",
+ "motion-v": "^1.5.0",
"ogl": "^1.0.11",
"primeicons": "^7.0.0",
"primevue": "^4.3.6",
@@ -36,13 +37,13 @@
"eslint": "^9.29.0",
"eslint-plugin-vue": "~10.2.0",
"jiti": "^2.4.2",
+ "jsrepo": "^1.30.1",
"npm-run-all2": "^8.0.4",
"postcss": "^8.5.6",
"tailwindcss": "^4.1.11",
"typescript": "~5.8.0",
"vite": "^7.0.0",
"vite-plugin-vue-devtools": "^7.7.7",
- "vue-tsc": "^2.2.10",
- "jsrepo": "^1.30.1"
+ "vue-tsc": "^2.2.10"
}
}
diff --git a/public/og-pic.jpg b/public/og-pic.jpg
new file mode 100644
index 0000000..dfddc54
Binary files /dev/null and b/public/og-pic.jpg differ
diff --git a/src/components/code/CliInstallation.vue b/src/components/code/CliInstallation.vue
index ea36768..9ad8d42 100644
--- a/src/components/code/CliInstallation.vue
+++ b/src/components/code/CliInstallation.vue
@@ -23,7 +23,7 @@
1. Initialize a config file for your project