@quasar/quasar-ui-qiconpicker 2.0.3 → 2.0.6

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v2.0.3
- * (c) 2021 Jeff Galbraith <jeff@quasar.dev>
+ * @quasar/quasar-ui-qiconpicker v2.0.5
+ * (c) 2022 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */
 
@@ -13,11 +13,11 @@
   /**
    * QIconPicker Properties
    */
-  var useIconPickerProps = {
+  const useIconPickerProps = {
     modelValue: String,
     iconSet: {
       type: String,
-      validator: function (v) { return [
+      validator: v => [
         'material-icons',
         'material-icons-outlined',
         'material-icons-round',
@@ -32,7 +32,7 @@
         'line-awesome',
         'bootstrap-icons',
         ''
-      ].includes(v); },
+      ].includes(v),
       default: ''
     },
     icons: Array,
@@ -57,10 +57,10 @@
     },
     paginationProps: {
       type: Object,
-      default: function () { return ({
+      default: () => ({
         maxPages: 5,
         input: true
-      }); }
+      })
     },
     modelPagination: Object,
     animated: Boolean,
@@ -74,7 +74,7 @@
     }
   };
 
-  var direction = {
+  const direction = {
     NEXT: 'next',
     PREV: 'prev'
   };
@@ -97,7 +97,7 @@
     // returns true if the pagination is the same,
     // otherwise returns false if it has changed
     function samePagination(oldPag, newPag) {
-      for (var prop in newPag) {
+      for (const prop in newPag) {
         if (newPag[ prop ] !== oldPag[ prop ]) {
           return false
         }
@@ -105,19 +105,23 @@
       return true
     }
 
-    var computedPagination = vue.computed(function () {
-      return fixPagination(Object.assign({}, data.innerPagination,
-        props.modelPagination))
+    const computedPagination = vue.computed(() => {
+      return fixPagination({
+        ...data.innerPagination,
+        ...props.modelPagination
+      })
     });
 
-    var computedPagesNumber = vue.computed(function () {
+    const computedPagesNumber = vue.computed(() => {
       return computedPagination.value.itemsPerPage === 0 ? 1
         : Math.max(1, Math.ceil(computedFilteredIcons.value.length / computedPagination.value.itemsPerPage))
     });
 
     function setPagination(val) {
-      var newPagination = fixPagination(Object.assign({}, computedPagination.value,
-        val));
+      const newPagination = fixPagination({
+        ...computedPagination.value,
+        ...val
+      });
 
       if (!samePagination(data.innerPagination, newPagination)) {
         if (props.modelPagination) {
@@ -134,11 +138,11 @@
     }
 
     return {
-      samePagination: samePagination,
-      computedPagination: computedPagination,
-      setPagination: setPagination,
-      updatePagination: updatePagination,
-      computedPagesNumber: computedPagesNumber
+      samePagination,
+      computedPagination,
+      setPagination,
+      updatePagination,
+      computedPagesNumber
     }
   }
 
@@ -152,29 +156,29 @@
       if (iconSet) {
         // detect if UMD version is installed
         if (window.QIconPicker) {
-          var name = iconSet.replace(/-([a-z])/g, function (g) { return g[ 1 ].toUpperCase(); });
+          const name = iconSet.replace(/-([a-z])/g, g => g[ 1 ].toUpperCase());
           if (window.QIconPicker.iconSet && window.QIconPicker.iconSet[ name ]) {
             data.iconsList = window.QIconPicker.iconSet[ name ].icons;
           }
           else {
-            console.error(("QIconPicker: no icon set loaded called " + iconSet));
+            console.error(`QIconPicker: no icon set loaded called ${ iconSet }`);
             console.error('Be sure to load the UMD version of the icon set in a script tag before using QIconPicker UMD version');
           }
         }
         else {
           try {
-            data.iconsList = require(("@quasar/quasar-ui-qiconpicker/src/components/icon-set/" + iconSet + ".js")).default.icons;
+            data.iconsList = require(`@quasar/quasar-ui-qiconpicker/src/components/icon-set/${ iconSet }.js`).default.icons;
           }
           catch (e) {
-            console.error(("QIconPicker: cannot find icon set found called " + iconSet));
+            console.error(`QIconPicker: cannot find icon set found called ${ iconSet }`);
           }
         }
       }
-      console.info(("Loaded " + (data.iconsList.length) + " icons."));
+      console.info(`Loaded ${ data.iconsList.length } icons.`);
     }
 
-    var computedDisplayedIcons = vue.computed(function () {
-      var icons = [];
+    const computedDisplayedIcons = vue.computed(() => {
+      let icons = [];
       if (data.iconsList) {
         icons = computedFilteredIcons.value;
 
@@ -186,27 +190,27 @@
       return icons
     });
 
-    var computedFilteredIcons = vue.computed(function () {
-      var icons = data.iconsList;
+    const computedFilteredIcons = vue.computed(() => {
+      let icons = data.iconsList;
       if (icons) {
         if (props.tags !== void 0 && props.tags !== '' && props.tags !== null && props.tags.length > 0) {
-          icons = icons.filter(function (icon) {
-            return icon.tags.filter(function (tag) { return props.tags.includes(tag); }).length > 0
+          icons = icons.filter(icon => {
+            return icon.tags.filter(tag => props.tags.includes(tag)).length > 0
           });
         }
         if (props.filter !== void 0 && props.filter !== '' && props.filter !== null) {
-          icons = icons.filter(function (icon) { return icon.name.includes(props.filter); });
+          icons = icons.filter(icon => icon.name.includes(props.filter));
         }
       }
       return icons
     });
 
     function categories() {
-      var t = [];
-      data.iconsList.forEach(function (icon) {
-        var tags = icon.tags;
+      const t = [];
+      data.iconsList.forEach(icon => {
+        const tags = icon.tags;
         if (tags && tags.length > 0) {
-          tags.forEach(function (tag) {
+          tags.forEach(tag => {
             if (t.includes(tag) !== true) {
               t.push(tag);
             }
@@ -219,10 +223,10 @@
     }
 
     return {
-      loadIconSet: loadIconSet,
-      computedDisplayedIcons: computedDisplayedIcons,
-      computedFilteredIcons: computedFilteredIcons,
-      categories: categories
+      loadIconSet,
+      computedDisplayedIcons,
+      computedFilteredIcons,
+      categories
     }
   }
 
@@ -231,9 +235,8 @@
    */
   function exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber) {
     // goes to previous page
-    var prevPage = function () {
-      var ref = computedPagination.value;
-      var page = ref.page;
+    const prevPage = () => {
+      const { page } = computedPagination.value;
       if (page > 1) {
         setPagination({ page: page - 1 });
         data.direction = direction.PREV;
@@ -241,10 +244,8 @@
     };
 
     // goes to next page
-    var nextPage = function () {
-      var ref = computedPagination.value;
-      var page = ref.page;
-      var itemsPerPage = ref.itemsPerPage;
+    const nextPage = () => {
+      const { page, itemsPerPage } = computedPagination.value;
       if (computedLastItemIndex.value > 0 && page * itemsPerPage < computedFilteredIcons.value.length) {
         setPagination({ page: page + 1 });
         data.direction = direction.NEXT;
@@ -252,17 +253,17 @@
     };
 
     // goes to last page
-    var lastPage = function () {
+    const lastPage = () => {
       setPagination({ page: computedPagesNumber.value });
     };
 
     // goes to first page
-    var firstPage = function () {
+    const firstPage = () => {
       setPagination({ page: 0 });
     };
 
     // checks if we are on the last page
-    var isLastPage = vue.computed(function () {
+    const isLastPage = vue.computed(() => {
       return computedLastItemIndex.value === 0
         ? true
         : computedPagination.value.page >= computedPagesNumber.value
@@ -270,17 +271,17 @@
 
 
     // checks if we are on the first page
-    var isFirstPage = vue.computed(function () {
+    const isFirstPage = vue.computed(() => {
       return computedPagination.value.page === 1
     });
 
     expose({
-      prevPage: prevPage,
-      nextPage: nextPage,
-      lastPage: lastPage,
-      firstPage: firstPage,
-      isLastPage: isLastPage,
-      isFirstPage: isFirstPage
+      prevPage,
+      nextPage,
+      lastPage,
+      firstPage,
+      isLastPage,
+      isFirstPage
     });
   }
 
@@ -288,7 +289,9 @@
   var QIconPicker = vue.defineComponent({
     name: 'QIconPicker',
 
-    props: Object.assign({}, useIconPickerProps),
+    props: {
+      ...useIconPickerProps
+    },
 
     emits: [
       'update:model-value',
@@ -296,13 +299,9 @@
       'update:model-pagination'
     ],
 
-    setup: function setup(props, ref$1) {
-      var slots = ref$1.slots;
-      var emit = ref$1.emit;
-      var expose = ref$1.expose;
-
-      var scrollAreaRef = vue.ref(null);
-      var data = vue.reactive({
+    setup(props, { slots, emit, expose }) {
+      const scrollAreaRef = vue.ref(null);
+      const data = vue.reactive({
         iconsList: [],
         innerPagination: {
           page: 1,
@@ -316,37 +315,35 @@
       });
 
       // index of first item on a page
-      var computedFirstItemIndex = vue.computed(function () {
-        var ref = computedPagination.value;
-        var page = ref.page;
-        var itemsPerPage = ref.itemsPerPage;
+      const computedFirstItemIndex = vue.computed(() => {
+        const { page, itemsPerPage } = computedPagination.value;
         return (page - 1) * itemsPerPage
       });
 
       // index of last item on a page
-      var computedLastItemIndex = vue.computed(function () {
-        var ref = computedPagination.value;
-        var page = ref.page;
-        var itemsPerPage = ref.itemsPerPage;
+      const computedLastItemIndex = vue.computed(() => {
+        const { page, itemsPerPage } = computedPagination.value;
         return page * itemsPerPage
       });
 
-      var ref$2 = useIconPickerIcons(data, props, computedFirstItemIndex, computedLastItemIndex);
-      var loadIconSet = ref$2.loadIconSet;
-      var computedDisplayedIcons = ref$2.computedDisplayedIcons;
-      var computedFilteredIcons = ref$2.computedFilteredIcons;
-      var categories = ref$2.categories;
-
-      var ref$3 = useIconPickerPagination(data, props, emit, computedFilteredIcons);
-      var samePagination = ref$3.samePagination;
-      var computedPagination = ref$3.computedPagination;
-      var setPagination = ref$3.setPagination;
-      var updatePagination = ref$3.updatePagination;
-      var computedPagesNumber = ref$3.computedPagesNumber;
+      const {
+        loadIconSet,
+        computedDisplayedIcons,
+        computedFilteredIcons,
+        categories
+      } = useIconPickerIcons(data, props, computedFirstItemIndex, computedLastItemIndex);
+
+      const {
+        samePagination,
+        computedPagination,
+        setPagination,
+        updatePagination,
+        computedPagesNumber
+      } = useIconPickerPagination(data, props, emit, computedFilteredIcons);
 
       exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber);
 
-      vue.onMounted(function () {
+      vue.onMounted(() => {
         if (props.iconSet) {
           loadIconSet(props.iconSet);
         }
@@ -357,14 +354,14 @@
       });
 
 
-      vue.watch(function () { return props.iconSet; }, function (val) {
+      vue.watch(() => props.iconSet, (val) => {
         if (val) {
           loadIconSet(val);
           updatePagination();
-          vue.nextTick(function () {
+          vue.nextTick(() => {
             // whenever the icon set changes, it resets pagination page to page 1
             setPagination({ page: 1 });
-          }).catch(function (e) { return console.error(e); });
+          }).catch(e => console.error(e));
           // scroll to top of QScrollArea, if applicable
           if(scrollAreaRef.value) {
             scrollAreaRef.value.setScrollPosition(0);
@@ -372,35 +369,35 @@
         }
       });
 
-      vue.watch(function () { return props.icons; }, function (val) {
+      vue.watch(() => props.icons, (val) => {
         if (props.icons !== void 0 && props.icons.length > 0) {
           data.iconsList = props.icons;
         }
         updatePagination();
-        vue.nextTick(function () {
+        vue.nextTick(() => {
           // whenever the icon set changes, it resets pagination page to page 1
           setPagination({ page: 1 });
-        }).catch(function (e) { return console.error(e); });
+        }).catch(e => console.error(e));
         // scroll to top of QScrollArea, if applicable
         if(scrollAreaRef.value) {
           scrollAreaRef.value.setScrollPosition(0);
         }
       });
 
-      vue.watch(function () { return props.filter; }, function () {
+      vue.watch(() => props.filter, () => {
         // whenever the filter changes, it resets pagination page to page 1
         setPagination({ page: 1, totalPages: computedPagesNumber.value });
         updatePagination();
       });
 
-      vue.watch(function () { return props.tags; }, function (val) {
+      vue.watch(() => props.tags, (val) => {
         // whenever the tags change, it resets pagination page to page 1
         setPagination({ page: 1, totalPages: computedPagesNumber.value });
         updatePagination();
       });
 
       if (props.modelPagination) {
-        vue.watch(function () { return props.modelPagination; }, function (newVal, oldVal) {
+        vue.watch(() => props.modelPagination, (newVal, oldVal) => {
           if (!samePagination(oldVal, newVal)) {
             updatePagination();
           }
@@ -408,29 +405,28 @@
       }
 
       if (props.modelPagination) {
-        vue.watch(function () { return props.modelPagination.itemsPerPage; }, function () {
+        vue.watch(() => props.modelPagination.itemsPerPage, () => {
           updatePagination();
         });
 
-        vue.watch(function () { return props.modelPagination.page; }, function () {
+        vue.watch(() =>props.modelPagination.page, () => {
           updatePagination();
         });
       }
 
-      return function () {
+      return () => {
 
         function renderPagination() {
-          if (props.modelPagination && props.modelPagination.itemsPerPage === 0) { return '' }
-          var slot = (slots.pagination && slots.pagination());
-          var ref = computedPagination.value;
-          var page = ref.page;
-          var totalPages = ref.totalPages;
-
-          return slot || vue.h(quasar.QPagination, Object.assign({}, {class: 'q-icon-picker__pagination'},
-            props.paginationProps,
-            {modelValue: page,
+          if (props.modelPagination && props.modelPagination.itemsPerPage === 0) return ''
+          const slot = (slots.pagination && slots.pagination());
+          const { page, totalPages } = computedPagination.value;
+
+          return slot || vue.h(quasar.QPagination, {
+            class: 'q-icon-picker__pagination',
+            ...props.paginationProps,
+            modelValue: page,
             max: totalPages,
-            'onUpdate:modelValue': function (value) {
+            'onUpdate:modelValue': value => {
               if (props.animated) {
                 if (value > page) {
                   data.direction = direction.NEXT;
@@ -440,12 +436,13 @@
                 }
               }
               setPagination({ page: value });
-            }}))
+            }
+          })
         }
 
         function renderFooter() {
           if (props.noFooter !== true && props.modelPagination !== void 0) {
-            var slot = (slots.footer && slots.footer());
+            const slot = (slots.footer && slots.footer());
 
             return vue.h('div', {
               class: 'q-icon-picker__footer flex flex-center'
@@ -457,20 +454,20 @@
 
         function renderTooltip(name) {
           if (props.tooltips === true) {
-            return function () { return vue.h(quasar.QTooltip, {}, function () { return name; }); }
+            return () => vue.h(quasar.QTooltip, {}, () => name)
           }
         }
 
         function renderIcon(icon) {
-          var name = (icon.prefix !== void 0 ? icon.prefix + ' ' + icon.name : icon.name);
+          const name = (icon.prefix !== void 0 ? icon.prefix + ' ' + icon.name : icon.name);
 
           if (slots.icon && slots.icon()) {
             return slots.icon(name)
           }
-          var isSelected = name === props.modelValue;
-          var textColor = isSelected ? props.selectedTextColor : undefined;
-          var color = isSelected ? props.selectedColor : undefined;
-          var size = props.size ? props.size : undefined;
+          const isSelected = name === props.modelValue;
+          const textColor = isSelected ? props.selectedTextColor : undefined;
+          const color = isSelected ? props.selectedColor : undefined;
+          const size = props.size ? props.size : undefined;
 
           return vue.h(quasar.QBtn, {
             id: name,
@@ -481,26 +478,26 @@
             textColor: textColor,
             color: color,
             icon: name,
-            onClick: function () { return emit('update:model-value', name); },
+            onClick: () => emit('update:model-value', name),
           }, renderTooltip(name))
         }
 
         function renderIcons() {
-          return computedDisplayedIcons.value.map(function (icon) { return renderIcon(icon); })
+          return computedDisplayedIcons.value.map(icon => renderIcon(icon))
         }
 
         function renderContainer() {
-          var container = function () { return vue.h('div', {
+          const container = () => vue.h('div', {
             key: computedPagination.value.page,
             class: 'q-icon-picker__container col'
-          },  [].concat( renderIcons() )); };
+          },  [...renderIcons()]);
 
           if (props.animated === true) {
-            var transition = 'q-transition--' + (data.direction === 'prev' ? props.transitionPrev : props.transitionNext);
-            return function () { return vue.h(vue.Transition, {
+            const transition = 'q-transition--' + (data.direction === 'prev' ? props.transitionPrev : props.transitionNext);
+            return () => vue.h(vue.Transition, {
               name: transition,
               appear: true
-            }, container); }
+            }, container)
           }
 
           return container
@@ -523,7 +520,7 @@
           }, [
             renderScrollArea(),
             vue.h(quasar.QResizeObserver, {
-              onResize: function (size) {
+              onResize: (size) => {
                 data.width = size.width;
                 data.height = size.height;
               }
@@ -531,31 +528,31 @@
           ])
         }
 
-        var classes = [
+        const classes = [
           'q-icon-picker',
           'column'
         ];
-        if (props.color) { classes.push('bg-' + props.color); }
-        if (props.textColor) { classes.push('text-' + props.textColor); }
+        if (props.color) classes.push('bg-' + props.color);
+        if (props.textColor) classes.push('text-' + props.textColor);
 
-        var picker = vue.h('div', {
+        const picker = vue.h('div', {
           class: classes.join(' ')
         },  [
           renderBody(),
           renderFooter()
         ]);
 
-        vue.nextTick(function () {
+        vue.nextTick(() => {
           categories();
           emit('update:tags', data.categories);
-        }).catch(function (e) { return console.error(e); });
+        }).catch(e => console.error(e));
 
         return picker
       }
     }
   });
 
-  var version = '2.0.3';
+  const version = '2.0.5';
 
   function install (app) {
     app.component(QIconPicker.name, QIconPicker);

package/dist/index.umd.min.js

@@ -1,6 +1,6 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v2.0.3
- * (c) 2021 Jeff Galbraith <jeff@quasar.dev>
+ * @quasar/quasar-ui-qiconpicker v2.0.5
+ * (c) 2022 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */
-(function(e,n){"object"===typeof exports&&"undefined"!==typeof module?n(exports,require("vue"),require("quasar")):"function"===typeof define&&define.amd?define(["exports","vue","quasar"],n):(e="undefined"!==typeof globalThis?globalThis:e||self,n(e.QIconPicker={},e.Vue,e.Quasar))})(this,function(e,h,x){"use strict";var n={modelValue:String,iconSet:{type:String,validator:function(e){return["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","ionicons-v4","mdi-v4","mdi-v5","mdi-v6","fontawesome-v5","eva-icons","themify","line-awesome","bootstrap-icons",""].includes(e)},default:""},icons:Array,filter:String,tags:Array,dense:Boolean,tooltips:Boolean,noFooter:Boolean,size:{type:String,default:"inherit"},color:String,textColor:String,selectedColor:{type:String,default:"primary"},selectedTextColor:{type:String,default:"grey-1"},paginationProps:{type:Object,default:function(){return{maxPages:5,input:!0}}},modelPagination:Object,animated:Boolean,transitionPrev:{type:String,default:"slide-right"},transitionNext:{type:String,default:"slide-left"}},y={NEXT:"next",PREV:"prev"};function w(n,t,i,e){function o(e){return e.page<1&&(e.page=1),(void 0===e.itemsPerPage||e.itemsPerPage<1)&&(e.itemsPerPage=0),e}function a(e,n){for(var t in n)if(n[t]!==e[t])return!1;return!0}var r=h.computed(function(){return o(Object.assign({},n.innerPagination,t.modelPagination))}),c=h.computed(function(){return 0===r.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/r.value.itemsPerPage))});function u(e){e=o(Object.assign({},r.value,e));a(n.innerPagination,e)||(t.modelPagination&&i("update:model-pagination",e),n.innerPagination=e)}function s(){void 0!==t.modelPagination&&u({total:e.value.length,totalPages:c.value})}return{samePagination:a,computedPagination:r,setPagination:u,updatePagination:s,computedPagesNumber:c}}function S(t,n,i,o){function e(n){if(t.iconsList=[],n)if(window.QIconPicker){var e=n.replace(/-([a-z])/g,function(e){return e[1].toUpperCase()});window.QIconPicker.iconSet&&window.QIconPicker.iconSet[e]?t.iconsList=window.QIconPicker.iconSet[e].icons:(console.error("QIconPicker: no icon set loaded called "+n),console.error("Be sure to load the UMD version of the icon set in a script tag before using QIconPicker UMD version"))}else try{t.iconsList=require("@quasar/quasar-ui-qiconpicker/src/components/icon-set/"+n+".js").default.icons}catch(e){console.error("QIconPicker: cannot find icon set found called "+n)}console.info("Loaded "+t.iconsList.length+" icons.")}var a=h.computed(function(){var e=[];return t.iconsList&&(e=r.value,n.modelPagination&&0!==n.modelPagination.itemsPerPage&&(e=e.slice(i.value,o.value))),e}),r=h.computed(function(){var e=t.iconsList;return e&&(void 0!==n.tags&&""!==n.tags&&null!==n.tags&&n.tags.length>0&&(e=e.filter(function(e){return e.tags.filter(function(e){return n.tags.includes(e)}).length>0})),void 0!==n.filter&&""!==n.filter&&null!==n.filter&&(e=e.filter(function(e){return e.name.includes(n.filter)}))),e});function c(){var n=[];return t.iconsList.forEach(function(e){e=e.tags;e&&e.length>0&&e.forEach(function(e){!0!==n.includes(e)&&n.push(e)})}),n.sort(),t.categories=n,!0}return{loadIconSet:e,computedDisplayedIcons:a,computedFilteredIcons:r,categories:c}}function k(t,e,i,o,n,a,r,c){var u=function(){var e=i.value,e=e.page;e>1&&(o({page:e-1}),t.direction=y.PREV)},s=function(){var e=i.value,n=e.page,e=e.itemsPerPage;a.value>0&&n*e<r.value.length&&(o({page:n+1}),t.direction=y.NEXT)},l=function(){o({page:c.value})},d=function(){o({page:0})},g=h.computed(function(){return 0===a.value||i.value.page>=c.value}),f=h.computed(function(){return 1===i.value.page});e({prevPage:u,nextPage:s,lastPage:l,firstPage:d,isLastPage:g,isFirstPage:f})}var t=h.defineComponent({name:"QIconPicker",props:Object.assign({},n),emits:["update:model-value","update:tags","update:model-pagination"],setup:function(s,e){var l=e.slots,d=e.emit,n=e.expose,g=h.ref(null),f=h.reactive({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},categories:[],width:"100",height:"100",direction:""}),t=h.computed(function(){var e=m.value,n=e.page,e=e.itemsPerPage;return(n-1)*e}),i=h.computed(function(){var e=m.value,n=e.page,e=e.itemsPerPage;return n*e}),o=S(f,s,t,i),a=o.loadIconSet,p=o.computedDisplayedIcons,e=o.computedFilteredIcons,v=o.categories,o=w(f,s,d,e),r=o.samePagination,m=o.computedPagination,P=o.setPagination,c=o.updatePagination,u=o.computedPagesNumber;return k(f,n,m,P,t,i,e,u),h.onMounted(function(){s.iconSet?a(s.iconSet):void 0!==s.icons&&s.icons.length>0&&(f.iconsList=s.icons),c()}),h.watch(function(){return s.iconSet},function(e){e&&(a(e),c(),h.nextTick(function(){P({page:1})}).catch(function(e){return console.error(e)}),g.value&&g.value.setScrollPosition(0))}),h.watch(function(){return s.icons},function(e){void 0!==s.icons&&s.icons.length>0&&(f.iconsList=s.icons),c(),h.nextTick(function(){P({page:1})}).catch(function(e){return console.error(e)}),g.value&&g.value.setScrollPosition(0)}),h.watch(function(){return s.filter},function(){P({page:1,totalPages:u.value}),c()}),h.watch(function(){return s.tags},function(e){P({page:1,totalPages:u.value}),c()}),s.modelPagination&&h.watch(function(){return s.modelPagination},function(e,n){r(n,e)||c()}),s.modelPagination&&(h.watch(function(){return s.modelPagination.itemsPerPage},function(){c()}),h.watch(function(){return s.modelPagination.page},function(){c()})),function(){function n(){if(s.modelPagination&&0===s.modelPagination.itemsPerPage)return"";var e=l.pagination&&l.pagination(),n=m.value,t=n.page,n=n.totalPages;return e||h.h(x.QPagination,Object.assign({},{class:"q-icon-picker__pagination"},s.paginationProps,{modelValue:t,max:n,"onUpdate:modelValue":function(e){s.animated&&(f.direction=e>t?y.NEXT:y.PREV),P({page:e})}}))}function e(){if(!0!==s.noFooter&&void 0!==s.modelPagination){var e=l.footer&&l.footer();return h.h("div",{class:"q-icon-picker__footer flex flex-center"},[e?e(m.value):n()])}}function o(e){if(!0===s.tooltips)return function(){return h.h(x.QTooltip,{},function(){return e})}}function t(e){var n=void 0!==e.prefix?e.prefix+" "+e.name:e.name;if(l.icon&&l.icon())return l.icon(n);var t=n===s.modelValue,i=t?s.selectedTextColor:void 0,e=t?s.selectedColor:void 0,t=s.size||void 0;return h.h(x.QBtn,{id:n,unelevated:!0,dense:s.dense,noWrap:!0,size:t,textColor:i,color:e,icon:n,onClick:function(){return d("update:model-value",n)}},o(n))}function i(){return p.value.map(function(e){return t(e)})}function a(){var e=function(){return h.h("div",{key:m.value.page,class:"q-icon-picker__container col"},[].concat(i()))};if(!0!==s.animated)return e;var n="q-transition--"+("prev"===f.direction?s.transitionPrev:s.transitionNext);return function(){return h.h(h.Transition,{name:n,appear:!0},e)}}function r(){return h.h(x.QScrollArea,{ref:g,style:{width:f.width+"px",height:f.height+"px"}},a())}function c(){return h.h("div",{class:"q-icon-picker__body col column"},[r(),h.h(x.QResizeObserver,{onResize:function(e){f.width=e.width,f.height=e.height}})])}var u=["q-icon-picker","column"];s.color&&u.push("bg-"+s.color),s.textColor&&u.push("text-"+s.textColor);u=h.h("div",{class:u.join(" ")},[c(),e()]);return h.nextTick(function(){v(),d("update:tags",f.categories)}).catch(function(e){return console.error(e)}),u}}}),n="2.0.3";function i(e){e.component(t.name,t)}e.QIconPicker=t,e.install=i,e.version=n,Object.defineProperty(e,"__esModule",{value:!0})});
+(function(e,t){"object"===typeof exports&&"undefined"!==typeof module?t(exports,require("vue"),require("quasar")):"function"===typeof define&&define.amd?define(["exports","vue","quasar"],t):(e="undefined"!==typeof globalThis?globalThis:e||self,t(e.QIconPicker={},e.Vue,e.Quasar))})(this,function(e,x,y){"use strict";const t={modelValue:String,iconSet:{type:String,validator:e=>["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","ionicons-v4","mdi-v4","mdi-v5","mdi-v6","fontawesome-v5","eva-icons","themify","line-awesome","bootstrap-icons",""].includes(e),default:""},icons:Array,filter:String,tags:Array,dense:Boolean,tooltips:Boolean,noFooter:Boolean,size:{type:String,default:"inherit"},color:String,textColor:String,selectedColor:{type:String,default:"primary"},selectedTextColor:{type:String,default:"grey-1"},paginationProps:{type:Object,default:()=>({maxPages:5,input:!0})},modelPagination:Object,animated:Boolean,transitionPrev:{type:String,default:"slide-right"},transitionNext:{type:String,default:"slide-left"}},w={NEXT:"next",PREV:"prev"};function s(n,o,i,e){function a(e){return e.page<1&&(e.page=1),(void 0===e.itemsPerPage||e.itemsPerPage<1)&&(e.itemsPerPage=0),e}function r(e,t){for(const n in t)if(t[n]!==e[n])return!1;return!0}const c=x.computed(()=>{return a({...n.innerPagination,...o.modelPagination})}),t=x.computed(()=>{return 0===c.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/c.value.itemsPerPage))});function s(e){const t=a({...c.value,...e});r(n.innerPagination,t)||(o.modelPagination&&i("update:model-pagination",t),n.innerPagination=t)}function l(){void 0!==o.modelPagination&&s({total:e.value.length,totalPages:t.value})}return{samePagination:r,computedPagination:c,setPagination:s,updatePagination:l,computedPagesNumber:t}}function l(o,t,n,i){function e(t){if(o.iconsList=[],t)if(window.QIconPicker){const e=t.replace(/-([a-z])/g,e=>e[1].toUpperCase());window.QIconPicker.iconSet&&window.QIconPicker.iconSet[e]?o.iconsList=window.QIconPicker.iconSet[e].icons:(console.error("QIconPicker: no icon set loaded called "+t),console.error("Be sure to load the UMD version of the icon set in a script tag before using QIconPicker UMD version"))}else try{o.iconsList=require(`@quasar/quasar-ui-qiconpicker/src/components/icon-set/${t}.js`).default.icons}catch(e){console.error("QIconPicker: cannot find icon set found called "+t)}console.info(`Loaded ${o.iconsList.length} icons.`)}const a=x.computed(()=>{let e=[];o.iconsList&&(e=r.value,t.modelPagination&&0!==t.modelPagination.itemsPerPage&&(e=e.slice(n.value,i.value)));return e}),r=x.computed(()=>{let e=o.iconsList;e&&(void 0!==t.tags&&""!==t.tags&&null!==t.tags&&t.tags.length>0&&(e=e.filter(e=>{return e.tags.filter(e=>t.tags.includes(e)).length>0})),void 0!==t.filter&&""!==t.filter&&null!==t.filter&&(e=e.filter(e=>e.name.includes(t.filter))));return e});function c(){const n=[];return o.iconsList.forEach(e=>{const t=e.tags;t&&t.length>0&&t.forEach(e=>{!0!==n.includes(e)&&n.push(e)})}),n.sort(),o.categories=n,!0}return{loadIconSet:e,computedDisplayedIcons:a,computedFilteredIcons:r,categories:c}}function S(n,e,o,i,t,a,r,c){const s=()=>{const e=o.value["page"];e>1&&(i({page:e-1}),n.direction=w.PREV)},l=()=>{const{page:e,itemsPerPage:t}=o.value;a.value>0&&e*t<r.value.length&&(i({page:e+1}),n.direction=w.NEXT)},u=()=>{i({page:c.value})},d=()=>{i({page:0})},g=x.computed(()=>{return 0===a.value||o.value.page>=c.value}),p=x.computed(()=>{return 1===o.value.page});e({prevPage:s,nextPage:l,lastPage:u,firstPage:d,isLastPage:g,isFirstPage:p})}var n=x.defineComponent({name:"QIconPicker",props:{...t},emits:["update:model-value","update:tags","update:model-pagination"],setup(u,{slots:d,emit:g,expose:e}){const p=x.ref(null),m=x.reactive({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},categories:[],width:"100",height:"100",direction:""}),t=x.computed(()=>{const{page:e,itemsPerPage:t}=v.value;return(e-1)*t}),n=x.computed(()=>{const{page:e,itemsPerPage:t}=v.value;return e*t}),{loadIconSet:o,computedDisplayedIcons:P,computedFilteredIcons:i,categories:f}=l(m,u,t,n),{samePagination:a,computedPagination:v,setPagination:h,updatePagination:r,computedPagesNumber:c}=s(m,u,g,i);return S(m,e,v,h,t,n,i,c),x.onMounted(()=>{u.iconSet?o(u.iconSet):void 0!==u.icons&&u.icons.length>0&&(m.iconsList=u.icons);r()}),x.watch(()=>u.iconSet,e=>{e&&(o(e),r(),x.nextTick(()=>{h({page:1})}).catch(e=>console.error(e)),p.value&&p.value.setScrollPosition(0))}),x.watch(()=>u.icons,e=>{void 0!==u.icons&&u.icons.length>0&&(m.iconsList=u.icons);r();x.nextTick(()=>{h({page:1})}).catch(e=>console.error(e));p.value&&p.value.setScrollPosition(0)}),x.watch(()=>u.filter,()=>{h({page:1,totalPages:c.value});r()}),x.watch(()=>u.tags,e=>{h({page:1,totalPages:c.value});r()}),u.modelPagination&&x.watch(()=>u.modelPagination,(e,t)=>{a(t,e)||r()}),u.modelPagination&&(x.watch(()=>u.modelPagination.itemsPerPage,()=>{r()}),x.watch(()=>u.modelPagination.page,()=>{r()})),()=>{function t(){if(u.modelPagination&&0===u.modelPagination.itemsPerPage)return"";const e=d.pagination&&d.pagination(),{page:t,totalPages:n}=v.value;return e||x.h(y.QPagination,{class:"q-icon-picker__pagination",...u.paginationProps,modelValue:t,max:n,"onUpdate:modelValue":e=>{u.animated&&(e>t?m.direction=w.NEXT:m.direction=w.PREV);h({page:e})}})}function e(){if(!0!==u.noFooter&&void 0!==u.modelPagination){const e=d.footer&&d.footer();return x.h("div",{class:"q-icon-picker__footer flex flex-center"},[e?e(v.value):t()])}}function r(e){if(!0===u.tooltips)return()=>x.h(y.QTooltip,{},()=>e)}function n(e){const t=void 0!==e.prefix?e.prefix+" "+e.name:e.name;if(d.icon&&d.icon())return d.icon(t);const n=t===u.modelValue,o=n?u.selectedTextColor:void 0,i=n?u.selectedColor:void 0,a=u.size||void 0;return x.h(y.QBtn,{id:t,unelevated:!0,dense:u.dense,noWrap:!0,size:a,textColor:o,color:i,icon:t,onClick:()=>g("update:model-value",t)},r(t))}function o(){return P.value.map(e=>n(e))}function i(){const e=()=>x.h("div",{key:v.value.page,class:"q-icon-picker__container col"},[...o()]);if(!0!==u.animated)return e;{const t="q-transition--"+("prev"===m.direction?u.transitionPrev:u.transitionNext);return()=>x.h(x.Transition,{name:t,appear:!0},e)}}function a(){return x.h(y.QScrollArea,{ref:p,style:{width:m.width+"px",height:m.height+"px"}},i())}function c(){return x.h("div",{class:"q-icon-picker__body col column"},[a(),x.h(y.QResizeObserver,{onResize:e=>{m.width=e.width;m.height=e.height}})])}const s=["q-icon-picker","column"];u.color&&s.push("bg-"+u.color);u.textColor&&s.push("text-"+u.textColor);const l=x.h("div",{class:s.join(" ")},[c(),e()]);x.nextTick(()=>{f();g("update:tags",m.categories)}).catch(e=>console.error(e));return l}}});const o="2.0.5";function i(e){e.component(n.name,n)}e.QIconPicker=n,e.install=i,e.version=o,Object.defineProperty(e,"__esModule",{value:!0})});

package/dist/types/index.d.ts

@@ -107,7 +107,6 @@ export interface IconNameArray {
     name? : string
 }
 
-import { StringArray, Pagination, PaginationProps } from './types'
 
 declare module '@vue/runtime-core' {
     interface ComponentCustomProperties {