Merge pull request #8 from hedint/feature/issue-5-create-demo-page

add a new demo page! fixes #5

CHANGELOG.md

@@ -1,6 +1,10 @@
 # Changelog
 
 
+## v1.0.3
+
+Add stackblitz demo page
+
 ## v1.0.2
 
 Fix badges in README.md

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Fatih Kadir Akın <fatihkadirakin@gmail.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -10,6 +10,8 @@ Typescript friendly! <br/>
 Basically it's a modern fork of [vue-social-sharing](https://github.com/nicolasbeauvais/vue-social-sharing) library.
 If you are using vue 2 you should use that library.
 
+## [Demo page](https://stackblitz.com/edit/vue3-social-sharing-plugin?file=src%2FApp.vue)
+
 ## Available networks
 
 `Baidu`
@@ -86,8 +88,8 @@ import Vue3SocialSharingPlugin from "vue3-social-sharing";
 
 
 const app = createApp(App);
-app.mount("#app");
 app.use(Vue3SocialSharingPlugin);
+app.mount("#app");
 ```
 
 After you'll be able to use ShareNetwork component in your app like this:
@@ -102,6 +104,7 @@ After you'll be able to use ShareNetwork component in your app like this:
 </ShareNetwork>
 
 ```
+Here you can find [the demo page](https://stackblitz.com/edit/vue3-social-sharing-plugin?file=src%2FApp.vue).
 
 ### As renderless component
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue3-social-sharing",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "Vue 3 social sharing plugin",
   "repository": "https://github.com/hedint/vue3-social-sharing",
   "keywords": [

playground/package.json

@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "vue": "^3.4.15",
-    "vue3-social-sharing": "file:vue3-social-sharing-1.0.0.tgz"
+    "vue3-social-sharing": "file:vue3-social-sharing-1.0.2.tgz"
   },
   "devDependencies": {
     "@playwright/test": "^1.41.1",

playground/src/App.vue

@@ -2,20 +2,16 @@
   <main>
     <img alt="Vue logo" class="logo" src="./assets/logo.svg" width="125" height="125">
     <div class="social-sharing-block">
-      <ShareNetwork v-for="network in socialList" :key="network" v-slot="{ share }" :network="network" title="My  perfect title" url="https://example.com">
+      <share-network v-for="network in socialList" :key="network" v-slot="{ share }" :network="network" title="My  perfect title" url="https://example.com">
         <i class="fab fah fa-lg" :class="`fa-${network}`" @click="share">
           <span> {{ network.toUpperCase() }}</span>
         </i>
-      </ShareNetwork>
+      </share-network>
     </div>
   </main>
 </template>
 
 <script setup lang="ts">
-// import { ShareNetwork } from "vue3-social-sharing";
-
-import { ShareNetwork } from "vue3-social-sharing";
-
 const socialList = ["facebook", "twitter", "telegram"];
 
 /*

playground/src/main.ts

@@ -4,5 +4,5 @@ import { createApp } from "vue";
 import App from "./App.vue";
 
 const app = createApp(App);
-app.mount("#app");
 app.use(Vue3SocialSharingPlugin);
+app.mount("#app");