feat: Add loader component to storybook

stone-payments · Dec 19, 2018 · 0d90e5c · 0d90e5c
1 parent be262e1
commit 0d90e5c
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 2 deletions.
diff --git a/storybook/package-lock.json b/storybook/package-lock.json
diff --git a/storybook/package.json b/storybook/package.json
@@ -20,9 +20,10 @@
   "dependencies": {
     "sling-web-component-brand-icon": "^1.11.7",
     "sling-web-component-button": "^1.11.7",
-    "sling-web-component-snackbar": "^1.11.7",
-    "sling-web-component-label": "^1.11.7",
     "sling-web-component-input": "^1.11.7",
+    "sling-web-component-label": "^1.11.7",
+    "sling-web-component-loader": "^1.11.7",
+    "sling-web-component-snackbar": "^1.11.7",
     "vue": "^2.5.21"
   }
 }
diff --git a/storybook/stories/loader/Loader.js b/storybook/stories/loader/Loader.js
@@ -0,0 +1,13 @@
+import 'sling-web-component-loader'
+
+export default {
+    name: 'storybook-loader',
+
+    template: `
+        <div>
+            <h1>Example</h1>
+            <sling-loader loading></sling-loader>
+        </div>
+    `,
+
+};
diff --git a/storybook/stories/loader/loader.stories.js b/storybook/stories/loader/loader.stories.js
@@ -0,0 +1,11 @@
+import { storiesOf } from '@storybook/vue';
+
+import StorybookLoader from './Loader';
+
+const stories = storiesOf('loader', module);
+
+stories
+  .add('Example', () => ({
+    components: { StorybookLoader },
+    template: '<storybook-loader />',
+  }));