adding

example/index.html

@@ -18,13 +18,13 @@
                 </h1>
             </div>
             <div class="bar__main justify-end">
-                <a class="button button--small m-left-sm-3 m-bottom-0" href="https://gitea.node001.net/tiny-components/notification" rel="noopener" target="_blank">
+                <a class="button button--small m-left-sm-3 m-bottom-0" href="https://gitea.node001.net/tiny-components/slider" rel="noopener" target="_blank">
                     Gitea
                     <svg class="m-left-3 icon fill-text" aria-hidden="true">
                         <use xlink:href="/symbol-defs.svg#icon-gitea"></use>
                     </svg>
                 </a>
-                <a class="button button--small m-left-sm-3 m-bottom-0" href="https://gitea.node001.net/tiny-components/notification" rel="noopener" target="_blank">
+                <a class="button button--small m-left-sm-3 m-bottom-0" href="https://gitea.node001.net/tiny-components/slider" rel="noopener" target="_blank">
                     Github
                     <svg class="m-left-3 icon fill-text" aria-hidden="true">
                         <use xlink:href="/symbol-defs.svg#icon-github"></use>

example/spritemap.js

@@ -1,13 +1 @@
-(self["webpackChunk_tiny_components_slider"] = self["webpackChunk_tiny_components_slider"] || []).push([["spritemap"],{
+(self.webpackChunk_tiny_components_slider=self.webpackChunk_tiny_components_slider||[]).push([[355],{256:()=>{}}]);
-
-/***/ "?c20d":
-/*!******************************!*\
-  !*** spritemap-dummy-module ***!
-  \******************************/
-/***/ (() => {
-
-
-
-/***/ })
-
-}]);

src/mixin.js

@@ -72,10 +72,13 @@ export default {
 
         // getting current max
         const max = this.state.max
+        const element = this.$('.' + this.state.classes.item)
+
+        if (element) {
 
             // setting max to show visible
             this.state.max = 0
-        this.state.width = this.$('.' + this.state.classes.item).offsetWidth
+            this.state.width = element.offsetWidth
 
             // check how many elements can visible in element
             this.$$('.' + this.state.classes.item).forEach((element, index) => {
@@ -91,6 +94,7 @@ export default {
             if (this.state.position >= value && this.state.position > 1) {
                 this.state.position -= value
             }
+        }
     },
 
     /**

webpack.mix.js

@@ -67,6 +67,7 @@ mix
         extend: {
             content: [
                 path.join(__dirname, 'src/**.riot'),
+                path.join(__dirname, 'src/**.js'),
                 path.join(__dirname, 'example/index.html')
             ]
         }