{"version":3,"sources":["webpack:///./src/views/components/vuesax/slider/Slider.vue","webpack:///./src/views/components/vuesax/slider/SliderDefault.vue","webpack:///src/views/components/vuesax/slider/SliderDefault.vue","webpack:///./src/views/components/vuesax/slider/SliderDefault.vue?a1b0","webpack:///./src/views/components/vuesax/slider/SliderDefault.vue?5818","webpack:///./src/views/components/vuesax/slider/SliderColor.vue","webpack:///src/views/components/vuesax/slider/SliderColor.vue","webpack:///./src/views/components/vuesax/slider/SliderColor.vue?55d4","webpack:///./src/views/components/vuesax/slider/SliderColor.vue?89ea","webpack:///./src/views/components/vuesax/slider/SliderTicks.vue","webpack:///src/views/components/vuesax/slider/SliderTicks.vue","webpack:///./src/views/components/vuesax/slider/SliderTicks.vue?403f","webpack:///./src/views/components/vuesax/slider/SliderTicks.vue?3716","webpack:///./src/views/components/vuesax/slider/SliderRange.vue","webpack:///src/views/components/vuesax/slider/SliderRange.vue","webpack:///./src/views/components/vuesax/slider/SliderRange.vue?97b0","webpack:///./src/views/components/vuesax/slider/SliderRange.vue?bc38","webpack:///./src/views/components/vuesax/slider/SliderIcon.vue","webpack:///src/views/components/vuesax/slider/SliderIcon.vue","webpack:///./src/views/components/vuesax/slider/SliderIcon.vue?d01b","webpack:///./src/views/components/vuesax/slider/SliderIcon.vue?4afa","webpack:///./src/views/components/vuesax/slider/SliderTextFixed.vue","webpack:///src/views/components/vuesax/slider/SliderTextFixed.vue","webpack:///./src/views/components/vuesax/slider/SliderTextFixed.vue?71ad","webpack:///./src/views/components/vuesax/slider/SliderTextFixed.vue?b479","webpack:///./src/views/components/vuesax/slider/SliderChangeMethod.vue","webpack:///src/views/components/vuesax/slider/SliderChangeMethod.vue","webpack:///./src/views/components/vuesax/slider/SliderChangeMethod.vue?93ec","webpack:///./src/views/components/vuesax/slider/SliderChangeMethod.vue?46f5","webpack:///src/views/components/vuesax/slider/Slider.vue","webpack:///./src/views/components/vuesax/slider/Slider.vue?7971","webpack:///./src/views/components/vuesax/slider/Slider.vue?48c6"],"names":["render","_vm","this","_c","_self","attrs","staticRenderFns","_v","staticClass","model","value","value1","callback","$$v","expression","value2","value3","slot","data","component","directives","name","rawName","colorx","domProps","on","$event","target","composing","cambio","style","widthx","heightx","_s","methods","components","SliderDefault","SliderColor","SliderTicks","SliderRange","SliderIcon","SliderTextFixed","SliderChangeMethod"],"mappings":"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","file":"js/chunk-2d2095bf.742fdb2f.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{attrs:{\"id\":\"slider-demo\"}},[_c('slider-default'),_c('slider-color'),_c('slider-ticks'),_c('slider-range'),_c('slider-icon'),_c('slider-text-fixed'),_c('slider-change-method')],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Default\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"To implement a \"),_c('strong',[_vm._v(\"Slider\")]),_vm._v(\" we have the \"),_c('code',[_vm._v(\"vs-slider\")]),_vm._v(\" component\")]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('vs-slider',{attrs:{\"disabled\":\"true\"},model:{value:(_vm.value2),callback:function ($$v) {_vm.value2=$$v},expression:\"value2\"}}),_c('vs-slider',{attrs:{\"max\":\"200\"},model:{value:(_vm.value3),callback:function ($$v) {_vm.value3=$$v},expression:\"value3\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider v-model=\\\"value1\\\" /> <vs-slider disabled=\\\"true\\\" v-model=\\\"value2\\\" /> <vs-slider max=200 v-model=\\\"value3\\\" /> </template> <script> export default { data() { return { value1: 67, value2: 34, value3: 60 } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderDefault.vue\r\n    Description: Rendering of default Slider\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Default\" code-toggler>\r\n\r\n        <p>To implement a <strong>Slider</strong> we have the <code>vs-slider</code> component</p>\r\n\r\n        <div class=\"mt-5\">\r\n            <vs-slider v-model=\"value1\"/>\r\n            <vs-slider disabled=\"true\" v-model=\"value2\"/>\r\n            <vs-slider max=200 v-model=\"value3\"/>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider v-model=&quot;value1&quot; /&gt;\r\n  &lt;vs-slider disabled=&quot;true&quot; v-model=&quot;value2&quot; /&gt;\r\n  &lt;vs-slider max=200 v-model=&quot;value3&quot; /&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data() {\r\n    return {\r\n      value1: 67,\r\n      value2: 34,\r\n      value3: 60\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1: 67,\r\n            value2: 34,\r\n            value3: 60\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderDefault.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderDefault.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderDefault.vue?vue&type=template&id=e9163166&\"\nimport script from \"./SliderDefault.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderDefault.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Color\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"You can change the slider's color with the property color. You can also add the main \"),_c('code',[_vm._v(\"colors\")]),_vm._v(\" like: \"),_c('code',[_vm._v(\"primary\")]),_vm._v(\", \"),_c('code',[_vm._v(\"success\")]),_vm._v(\", \"),_c('code',[_vm._v(\"danger\")]),_vm._v(\", \"),_c('code',[_vm._v(\"warning\")]),_vm._v(\", \"),_c('code',[_vm._v(\"dark\")])]),_c('div',{staticClass:\"mt-5\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.colorx),expression:\"colorx\"}],attrs:{\"type\":\"color\",\"name\":\"\"},domProps:{\"value\":(_vm.colorx)},on:{\"input\":function($event){if($event.target.composing)return;_vm.colorx=$event.target.value}}}),_c('vs-slider',{attrs:{\"color\":_vm.colorx},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <input type=\\\"color\\\" v-model=\\\"colorx\\\" name=\\\"\\\" > <vs-slider :color=\\\"colorx\\\" v-model=\\\"value1\\\"/> </template> <script> export default { data() { return { colorx:'#db7d12', value1:24, } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderColor.vue\r\n    Description: Change color of slider\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Color\" code-toggler>\r\n\r\n        <p>You can change the slider's color with the property color. You can also add the main <code>colors</code> like: <code>primary</code>, <code>success</code>, <code>danger</code>, <code>warning</code>, <code>dark</code></p>\r\n\r\n        <div class=\"mt-5\">\r\n            <input type=\"color\" v-model=\"colorx\" name=\"\" >\r\n            <vs-slider :color=\"colorx\" v-model=\"value1\"/>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;input type=&quot;color&quot; v-model=&quot;colorx&quot; name=&quot;&quot; &gt;\r\n  &lt;vs-slider :color=&quot;colorx&quot; v-model=&quot;value1&quot;/&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data() {\r\n    return {\r\n      colorx:'#db7d12',\r\n      value1:24,\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            colorx:'#db7d12',\r\n            value1:24,\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderColor.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderColor.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderColor.vue?vue&type=template&id=682d1266&\"\nimport script from \"./SliderColor.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderColor.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Ticks\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"With Ticks you can allow the user to select a value inside a range of allowed values. With the property \"),_c('strong',[_vm._v(\"step\")]),_vm._v(\" you can change the distance between each Tick\")]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{attrs:{\"step\":\"10\"},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('vs-slider',{attrs:{\"ticks\":\"\",\"step\":\"25\"},model:{value:(_vm.value2),callback:function ($$v) {_vm.value2=$$v},expression:\"value2\"}}),_c('vs-slider',{attrs:{\"ticks\":\"\",\"step\":\"0.5\",\"step-decimals\":true},model:{value:(_vm.value3),callback:function ($$v) {_vm.value3=$$v},expression:\"value3\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider step=10 v-model=\\\"value1\\\"/> <vs-slider ticks step=25 v-model=\\\"value2\\\"/> <vs-slider ticks step=0.5 :step-decimals=\\\"true\\\" v-model=\\\"value3\\\"/> </template> <script> export default { data(){ return { value1:60, value2:25, value3: 25.5 } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderTicks.vue\r\n    Description: Add ticks to you slider using step\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Ticks\" code-toggler>\r\n\r\n        <p>With Ticks you can allow the user to select a value inside a range of allowed values. With the property <strong>step</strong> you can change the distance between each Tick</p>\r\n\r\n        <div class=\"mt-5\">\r\n            <vs-slider step=10 v-model=\"value1\"/>\r\n            <vs-slider ticks step=25 v-model=\"value2\"/>\r\n            <vs-slider ticks step=0.5 :step-decimals=\"true\" v-model=\"value3\"/>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider step=10 v-model=&quot;value1&quot;/&gt;\r\n  &lt;vs-slider ticks step=25 v-model=&quot;value2&quot;/&gt;\r\n  &lt;vs-slider ticks step=0.5 :step-decimals=&quot;true&quot; v-model=&quot;value3&quot;/&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data(){\r\n    return {\r\n      value1:60,\r\n      value2:25,\r\n      value3: 25.5\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1: 60,\r\n            value2: 25,\r\n            value3: 50.5\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderTicks.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderTicks.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderTicks.vue?vue&type=template&id=06e164ce&\"\nimport script from \"./SliderTicks.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderTicks.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Range\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"With Range you can allow the user to select a range inside a range of allowed values. You can use the v-model property with \"),_c('strong',[_vm._v(\"Array\")]),_vm._v(\" and a minimum and maximum value represented as: \"),_c('code',[_vm._v(\"[min, max]\")])]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{attrs:{\"color\":\"warning\"},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('vs-slider',{attrs:{\"color\":\"danger\",\"ticks\":\"\",\"step\":\"10\"},model:{value:(_vm.value2),callback:function ($$v) {_vm.value2=$$v},expression:\"value2\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider color=\\\"warning\\\" v-model=\\\"value1\\\"/> <vs-slider color=\\\"danger\\\" ticks step=10 v-model=\\\"value2\\\"/> </template> <script> export default { data(){ return { value1:[60,90], value2:[30,40] } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderRange.vue\r\n    Description: Add range to your sliders\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Range\" code-toggler>\r\n\r\n        <p>With Range you can allow the user to select a range inside a range of allowed values. You can use the v-model property with <strong>Array</strong> and a minimum and maximum value represented as: <code>[min, max]</code></p>\r\n        <div class=\"mt-5\">\r\n            <vs-slider color=\"warning\" v-model=\"value1\"/>\r\n            <vs-slider color=\"danger\" ticks step=10 v-model=\"value2\"/>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider color=&quot;warning&quot; v-model=&quot;value1&quot;/&gt;\r\n  &lt;vs-slider color=&quot;danger&quot; ticks step=10 v-model=&quot;value2&quot;/&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data(){\r\n    return {\r\n      value1:[60,90],\r\n      value2:[30,40]\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1: [60,90],\r\n            value2: [30,40]\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderRange.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderRange.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderRange.vue?vue&type=template&id=a1b4bcce&\"\nimport script from \"./SliderRange.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderRange.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Icon\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"You can add an icon with the \"),_c('code',[_vm._v(\"icon\")]),_vm._v(\" property to better representation the sliders to the user\")]),_c('vs-alert',{staticClass:\"mt-5\",attrs:{\"color\":\"primary\",\"icon\":\"new_releases\",\"active\":\"true\"}},[_c('p',[_vm._v(\"Vuesax uses the Google Material Icons font library by default. For a list of all available icons, visit the official \"),_c('a',{attrs:{\"href\":\"https://material.io/icons/\",\"target\":\"_blank\"}},[_vm._v(\"Material Icons page\")]),_vm._v(\".\")]),_c('p',[_vm._v(\"FontAwesome and other fonts library are supported. Simply use the icon-pack with fa or fas. You still need to include the Font Awesome icons in your project.\")])]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{attrs:{\"icon\":\"volume_up\",\"max\":\"10\"},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('vs-slider',{attrs:{\"icon\":\"group_add\",\"ticks\":\"\",\"step\":\"25\"},model:{value:(_vm.value2),callback:function ($$v) {_vm.value2=$$v},expression:\"value2\"}}),_c('vs-slider',{attrs:{\"icon\":\"star\",\"ticks\":\"\",\"max\":\"5\"},model:{value:(_vm.value3),callback:function ($$v) {_vm.value3=$$v},expression:\"value3\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider icon=\\\"volume_up\\\" max=10 v-model=\\\"value1\\\"/> <vs-slider icon=\\\"group_add\\\" ticks step=25 v-model=\\\"value2\\\"/> <vs-slider icon=\\\"star\\\" ticks max=5 v-model=\\\"value3\\\"/> </template> <script> export default { data() { return { value1:6, value2:25, value3:[2,4] } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderIcon.vue\r\n    Description: Rendering of Slider with Icon\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Icon\" code-toggler>\r\n\r\n        <p>You can add an icon with the <code>icon</code> property to better representation the sliders to the user</p>\r\n\r\n        <vs-alert color=\"primary\" icon=\"new_releases\" active=\"true\" class=\"mt-5\">\r\n            <p>Vuesax uses the Google Material Icons font library by default. For a list of all available icons, visit the official <a href=\"https://material.io/icons/\" target=\"_blank\">Material Icons page</a>.</p>\r\n            <p>FontAwesome and other fonts library are supported. Simply use the icon-pack with fa or fas. You still need to include the Font Awesome icons in your project.</p>\r\n        </vs-alert>\r\n\r\n        <div class=\"mt-5\">\r\n            <vs-slider icon=\"volume_up\" max=10 v-model=\"value1\" />\r\n            <vs-slider icon=\"group_add\" ticks step=25 v-model=\"value2\" />\r\n            <vs-slider icon=\"star\" ticks max=5 v-model=\"value3\" />\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider icon=&quot;volume_up&quot; max=10 v-model=&quot;value1&quot;/&gt;\r\n  &lt;vs-slider icon=&quot;group_add&quot; ticks step=25 v-model=&quot;value2&quot;/&gt;\r\n  &lt;vs-slider icon=&quot;star&quot; ticks max=5 v-model=&quot;value3&quot;/&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data() {\r\n    return {\r\n      value1:6,\r\n      value2:25,\r\n      value3:[2,4]\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1:6,\r\n            value2:25,\r\n            value3:[2,4]\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderIcon.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderIcon.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderIcon.vue?vue&type=template&id=4dd61332&\"\nimport script from \"./SliderIcon.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderIcon.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Text Fixed\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"Determine the text that will be fixed next to the value with the property \"),_c('code',[_vm._v(\"text-fixed\")])]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{attrs:{\"color\":\"success\",\"text-fixed\":\"%\"},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('vs-slider',{attrs:{\"color\":\"danger\",\"text-fixed\":\"Min\",\"ticks\":\"\",\"step\":\"25\"},model:{value:(_vm.value2),callback:function ($$v) {_vm.value2=$$v},expression:\"value2\"}}),_c('vs-slider',{attrs:{\"color\":\"dark\",\"text-fixed\":\"K\",\"ticks\":\"\",\"max\":\"5\"},model:{value:(_vm.value3),callback:function ($$v) {_vm.value3=$$v},expression:\"value3\"}})],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider color=\\\"success\\\" text-fixed=% v-model=\\\"value1\\\"/> <vs-slider color=\\\"danger\\\" text-fixed=Min ticks step=25 v-model=\\\"value2\\\"/> <vs-slider color=\\\"dark\\\" text-fixed=K ticks max=5 v-model=\\\"value3\\\"/> </template> <script> export default { data() { return { value1:6, value2:25, value3:[2,4] } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderTextFixed.vue\r\n    Description: Add fixed text next to the value of slider\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Text Fixed\" code-toggler>\r\n\r\n        <p>Determine the text that will be fixed next to the value with the property <code>text-fixed</code></p>\r\n\r\n        <div class=\"mt-5\">\r\n            <vs-slider color=\"success\" text-fixed=% v-model=\"value1\"/>\r\n            <vs-slider color=\"danger\" text-fixed=Min ticks step=25 v-model=\"value2\"/>\r\n            <vs-slider color=\"dark\" text-fixed=K ticks max=5 v-model=\"value3\"/>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider color=&quot;success&quot; text-fixed=% v-model=&quot;value1&quot;/&gt;\r\n  &lt;vs-slider color=&quot;danger&quot; text-fixed=Min ticks step=25 v-model=&quot;value2&quot;/&gt;\r\n  &lt;vs-slider color=&quot;dark&quot; text-fixed=K ticks max=5 v-model=&quot;value3&quot;/&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data() {\r\n    return {\r\n      value1:6,\r\n      value2:25,\r\n      value3:[2,4]\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1:6,\r\n            value2:25,\r\n            value3:[2,4]\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderTextFixed.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderTextFixed.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderTextFixed.vue?vue&type=template&id=1d0faa39&\"\nimport script from \"./SliderTextFixed.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderTextFixed.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('vx-card',{attrs:{\"title\":\"Change Method\",\"code-toggler\":\"\"}},[_c('p',[_vm._v(\"You can add a function that will be triggered every time the value changes with \"),_c('code',[_vm._v(\"@change=\\\"MyFunction\\\"\")])]),_c('vs-alert',{staticClass:\"mt-5\",attrs:{\"color\":\"primary\",\"icon\":\"new_releases\",\"active\":\"true\"}},[_c('p',[_vm._v(\"You can change the minimum or maximum number admitted with the properties: \"),_c('code',[_vm._v(\"min\")]),_vm._v(\", \"),_c('code',[_vm._v(\"max\")])])]),_c('div',{staticClass:\"mt-5\"},[_c('vs-slider',{attrs:{\"min\":50,\"color\":\"rgb(45, 208, 129)\"},on:{\"change\":_vm.cambio},model:{value:(_vm.value1),callback:function ($$v) {_vm.value1=$$v},expression:\"value1\"}}),_c('div',{staticClass:\"p-2 bg-success rounded text-white flex items-center justify-center\",style:({'width':_vm.widthx+'px','height':_vm.heightx+'px'})},[_vm._v(\" \"+_vm._s(_vm.value1)+\" \")])],1),_c('template',{slot:\"codeContainer\"},[_vm._v(\" <template> <vs-slider :min=\\\"50\\\" @change=\\\"cambio\\\" color=\\\"rgb(45, 208, 129)\\\" v-model=\\\"value1\\\"/> <div :style=\\\"{'width':widthx+'px','height':heightx+'px'}\\\" class=\\\"box\\\"> \"+_vm._s(_vm.value1)+\" </div> </template> <script> export default { data(){ return { value1:55, widthx:55, heightx:55 } }, methods:{ cambio(value){ this.widthx = value this.heightx = value } } } </script> \")])],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\r\n    File Name: SliderChangeMethod.vue\r\n    Description: Trigger function on change\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <vx-card title=\"Change Method\" code-toggler>\r\n\r\n        <p>You can add a function that will be triggered every time the value changes with <code>@change=\"MyFunction\"</code></p>\r\n\r\n        <vs-alert color=\"primary\" icon=\"new_releases\" active=\"true\" class=\"mt-5\">\r\n            <p>You can change the minimum or maximum number admitted with the properties: <code>min</code>, <code>max</code></p>\r\n        </vs-alert>\r\n\r\n        <div class=\"mt-5\">\r\n            <vs-slider :min=\"50\" @change=\"cambio\" color=\"rgb(45, 208, 129)\" v-model=\"value1\"/>\r\n            <div :style=\"{'width':widthx+'px','height':heightx+'px'}\" class=\"p-2 bg-success rounded text-white flex items-center justify-center\"> {{value1}} </div>\r\n        </div>\r\n\r\n        <template slot=\"codeContainer\">\r\n&lt;template&gt;\r\n  &lt;vs-slider :min=&quot;50&quot; @change=&quot;cambio&quot; color=&quot;rgb(45, 208, 129)&quot; v-model=&quot;value1&quot;/&gt;\r\n  &lt;div :style=&quot;{'width':widthx+'px','height':heightx+'px'}&quot; class=&quot;box&quot;&gt; {{value1}} &lt;/div&gt;\r\n&lt;/template&gt;\r\n\r\n&lt;script&gt;\r\nexport default {\r\n  data(){\r\n    return {\r\n      value1:55,\r\n      widthx:55,\r\n      heightx:55\r\n    }\r\n  },\r\n  methods:{\r\n    cambio(value){\r\n      this.widthx = value\r\n      this.heightx = value\r\n    }\r\n  }\r\n}\r\n&lt;/script&gt;\r\n        </template>\r\n\r\n    </vx-card>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    data() {\r\n        return {\r\n            value1: 55,\r\n            widthx: 55,\r\n            heightx: 55\r\n        }\r\n    },\r\n    methods: {\r\n        cambio(value) {\r\n            this.widthx = value\r\n            this.heightx = value\r\n        }\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderChangeMethod.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./SliderChangeMethod.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SliderChangeMethod.vue?vue&type=template&id=8902529a&\"\nimport script from \"./SliderChangeMethod.vue?vue&type=script&lang=js&\"\nexport * from \"./SliderChangeMethod.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","<!-- =========================================================================================\r\n    File Name: Slider.vue\r\n    Description: Slider - Imports all page portions\r\n    ----------------------------------------------------------------------------------------\r\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\r\n      Author: Miguel Arenas\r\n    Author URL: http://github.com/mxaxaxbx\r\n========================================================================================== -->\r\n\r\n\r\n<template>\r\n    <div id=\"slider-demo\">\r\n        <slider-default></slider-default>\r\n        <slider-color></slider-color>\r\n        <slider-ticks></slider-ticks>\r\n        <slider-range></slider-range>\r\n        <slider-icon></slider-icon>\r\n        <slider-text-fixed></slider-text-fixed>\r\n        <slider-change-method></slider-change-method>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\nimport SliderDefault from './SliderDefault.vue'\r\nimport SliderColor from './SliderColor.vue'\r\nimport SliderTicks from './SliderTicks.vue'\r\nimport SliderRange from './SliderRange.vue'\r\nimport SliderIcon from './SliderIcon.vue'\r\nimport SliderTextFixed from './SliderTextFixed.vue'\r\nimport SliderChangeMethod from './SliderChangeMethod.vue'\r\n\r\nexport default{\r\n    components: {\r\n        SliderDefault,\r\n        SliderColor,\r\n        SliderTicks,\r\n        SliderRange,\r\n        SliderIcon,\r\n        SliderTextFixed,\r\n        SliderChangeMethod,\r\n    }\r\n}\r\n</script>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./Slider.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./Slider.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Slider.vue?vue&type=template&id=d3ddf498&\"\nimport script from \"./Slider.vue?vue&type=script&lang=js&\"\nexport * from \"./Slider.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}