@quasar/quasar-ui-qiconpicker 2.0.5 → 2.0.7

package/dist/index.umd.js

@@ -0,0 +1,565 @@
+/*!
+ * @quasar/quasar-ui-qiconpicker v2.0.7
+ * (c) 2023 Jeff Galbraith <jeff@quasar.dev>
+ * Released under the MIT License.
+ */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('quasar')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'vue', 'quasar'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.QIconPicker = {}, global.Vue, global.Quasar));
+})(this, (function (exports, vue, quasar) { 'use strict';
+
+  /**
+   * QIconPicker Properties
+   */
+  const useIconPickerProps = {
+    modelValue: String,
+    iconSet: {
+      type: String,
+      validator: v => [
+        '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(v),
+      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: true
+      })
+    },
+    modelPagination: Object,
+    animated: Boolean,
+    transitionPrev: {
+      type: String,
+      default: 'slide-right'
+    },
+    transitionNext: {
+      type: String,
+      default: 'slide-left'
+    }
+  };
+
+  const direction = {
+    NEXT: 'next',
+    PREV: 'prev'
+  };
+
+  /**
+   * Pagination
+   */
+  function useIconPickerPagination(data, props, emit, computedFilteredIcons) {
+
+    function fixPagination(p) {
+      if (p.page < 1) {
+        p.page = 1;
+      }
+      if (p.itemsPerPage === void 0 || p.itemsPerPage < 1) {
+        p.itemsPerPage = 0; // all
+      }
+      return p
+    }
+
+    // returns true if the pagination is the same,
+    // otherwise returns false if it has changed
+    function samePagination(oldPag, newPag) {
+      for (const prop in newPag) {
+        if (newPag[ prop ] !== oldPag[ prop ]) {
+          return false
+        }
+      }
+      return true
+    }
+
+    const computedPagination = vue.computed(() => {
+      return fixPagination({
+        ...data.innerPagination,
+        ...props.modelPagination
+      })
+    });
+
+    const computedPagesNumber = vue.computed(() => {
+      return computedPagination.value.itemsPerPage === 0 ? 1
+        : Math.max(1, Math.ceil(computedFilteredIcons.value.length / computedPagination.value.itemsPerPage))
+    });
+
+    function setPagination(val) {
+      const newPagination = fixPagination({
+        ...computedPagination.value,
+        ...val
+      });
+
+      if (!samePagination(data.innerPagination, newPagination)) {
+        if (props.modelPagination) {
+          emit('update:model-pagination', newPagination);
+        }
+        data.innerPagination = newPagination;
+      }
+    }
+
+    function updatePagination() {
+      if (props.modelPagination !== void 0) {
+        setPagination({ total: computedFilteredIcons.value.length, totalPages: computedPagesNumber.value });
+      }
+    }
+
+    return {
+      samePagination,
+      computedPagination,
+      setPagination,
+      updatePagination,
+      computedPagesNumber
+    }
+  }
+
+  /**
+   * Icons
+   */
+  function useIconPickerIcons(data, props, computedFirstItemIndex, computedLastItemIndex) {
+
+    function loadIconSet(iconSet) {
+      data.iconsList = [];
+      if (iconSet) {
+        // detect if UMD version is installed
+        if (window.QIconPicker) {
+          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('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;
+          }
+          catch (e) {
+            console.error(`QIconPicker: cannot find icon set found called ${ iconSet }`);
+          }
+        }
+      }
+      console.info(`Loaded ${ data.iconsList.length } icons.`);
+    }
+
+    const computedDisplayedIcons = vue.computed(() => {
+      let icons = [];
+      if (data.iconsList) {
+        icons = computedFilteredIcons.value;
+
+        // should the icons be paged?
+        if (props.modelPagination && props.modelPagination.itemsPerPage !== 0) {
+          icons = icons.slice(computedFirstItemIndex.value, computedLastItemIndex.value);
+        }
+      }
+      return icons
+    });
+
+    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(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(icon => icon.name.includes(props.filter));
+        }
+      }
+      return icons
+    });
+
+    function categories() {
+      const t = [];
+      data.iconsList.forEach(icon => {
+        const tags = icon.tags;
+        if (tags && tags.length > 0) {
+          tags.forEach(tag => {
+            if (t.includes(tag) !== true) {
+              t.push(tag);
+            }
+          });
+        }
+      });
+      t.sort();
+      data.categories = t;
+      return true
+    }
+
+    return {
+      loadIconSet,
+      computedDisplayedIcons,
+      computedFilteredIcons,
+      categories
+    }
+  }
+
+  /**
+   * Exposes api functions
+   */
+  function exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber) {
+    // goes to previous page
+    const prevPage = () => {
+      const { page } = computedPagination.value;
+      if (page > 1) {
+        setPagination({ page: page - 1 });
+        data.direction = direction.PREV;
+      }
+    };
+
+    // goes to next page
+    const nextPage = () => {
+      const { page, itemsPerPage } = computedPagination.value;
+      if (computedLastItemIndex.value > 0 && page * itemsPerPage < computedFilteredIcons.value.length) {
+        setPagination({ page: page + 1 });
+        data.direction = direction.NEXT;
+      }
+    };
+
+    // goes to last page
+    const lastPage = () => {
+      setPagination({ page: computedPagesNumber.value });
+    };
+
+    // goes to first page
+    const firstPage = () => {
+      setPagination({ page: 0 });
+    };
+
+    // checks if we are on the last page
+    const isLastPage = vue.computed(() => {
+      return computedLastItemIndex.value === 0
+        ? true
+        : computedPagination.value.page >= computedPagesNumber.value
+    });
+
+
+    // checks if we are on the first page
+    const isFirstPage = vue.computed(() => {
+      return computedPagination.value.page === 1
+    });
+
+    expose({
+      prevPage,
+      nextPage,
+      lastPage,
+      firstPage,
+      isLastPage,
+      isFirstPage
+    });
+  }
+
+
+  var QIconPicker = vue.defineComponent({
+    name: 'QIconPicker',
+
+    props: {
+      ...useIconPickerProps
+    },
+
+    emits: [
+      'update:model-value',
+      'update:tags',
+      'update:model-pagination'
+    ],
+
+    setup(props, { slots, emit, expose }) {
+      const scrollAreaRef = vue.ref(null);
+      const data = vue.reactive({
+        iconsList: [],
+        innerPagination: {
+          page: 1,
+          itemsPerPage: 0,
+          totalPages: 0
+        },
+        categories: [],
+        width: '100',
+        height: '100',
+        direction: ''
+      });
+
+      // index of first item on a page
+      const computedFirstItemIndex = vue.computed(() => {
+        const { page, itemsPerPage } = computedPagination.value;
+        return (page - 1) * itemsPerPage
+      });
+
+      // index of last item on a page
+      const computedLastItemIndex = vue.computed(() => {
+        const { page, itemsPerPage } = computedPagination.value;
+        return page * itemsPerPage
+      });
+
+      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(() => {
+        if (props.iconSet) {
+          loadIconSet(props.iconSet);
+        }
+        else if (props.icons !== void 0 && props.icons.length > 0) {
+          data.iconsList = props.icons;
+        }
+        updatePagination();
+      });
+
+
+      vue.watch(() => props.iconSet, (val) => {
+        if (val) {
+          loadIconSet(val);
+          updatePagination();
+          vue.nextTick(() => {
+            // whenever the icon set changes, it resets pagination page to page 1
+            setPagination({ page: 1 });
+          }).catch(e => console.error(e));
+          // scroll to top of QScrollArea, if applicable
+          if(scrollAreaRef.value) {
+            scrollAreaRef.value.setScrollPosition(0);
+          }
+        }
+      });
+
+      vue.watch(() => props.icons, (val) => {
+        if (props.icons !== void 0 && props.icons.length > 0) {
+          data.iconsList = props.icons;
+        }
+        updatePagination();
+        vue.nextTick(() => {
+          // whenever the icon set changes, it resets pagination page to page 1
+          setPagination({ page: 1 });
+        }).catch(e => console.error(e));
+        // scroll to top of QScrollArea, if applicable
+        if(scrollAreaRef.value) {
+          scrollAreaRef.value.setScrollPosition(0);
+        }
+      });
+
+      vue.watch(() => props.filter, () => {
+        // whenever the filter changes, it resets pagination page to page 1
+        setPagination({ page: 1, totalPages: computedPagesNumber.value });
+        updatePagination();
+      });
+
+      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(() => props.modelPagination, (newVal, oldVal) => {
+          if (!samePagination(oldVal, newVal)) {
+            updatePagination();
+          }
+        });
+      }
+
+      if (props.modelPagination) {
+        vue.watch(() => props.modelPagination.itemsPerPage, () => {
+          updatePagination();
+        });
+
+        vue.watch(() =>props.modelPagination.page, () => {
+          updatePagination();
+        });
+      }
+
+      return () => {
+
+        function renderPagination() {
+          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': value => {
+              if (props.animated) {
+                if (value > page) {
+                  data.direction = direction.NEXT;
+                }
+                else {
+                  data.direction = direction.PREV;
+                }
+              }
+              setPagination({ page: value });
+            }
+          })
+        }
+
+        function renderFooter() {
+          if (props.noFooter !== true && props.modelPagination !== void 0) {
+            const slot = (slots.footer && slots.footer());
+
+            return vue.h('div', {
+              class: 'q-icon-picker__footer flex flex-center'
+            }, [
+              slot ? slot(computedPagination.value) : renderPagination()
+            ])
+          }
+        }
+
+        function renderTooltip(name) {
+          if (props.tooltips === true) {
+            return () => vue.h(quasar.QTooltip, {}, () => name)
+          }
+        }
+
+        function renderIcon(icon) {
+          const name = (icon.prefix !== void 0 ? icon.prefix + ' ' + icon.name : icon.name);
+
+          if (slots.icon && slots.icon()) {
+            return slots.icon(name)
+          }
+          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,
+            unelevated: true,
+            dense: props.dense,
+            noWrap: true,
+            size: size,
+            textColor: textColor,
+            color: color,
+            icon: name,
+            onClick: () => emit('update:model-value', name),
+          }, renderTooltip(name))
+        }
+
+        function renderIcons() {
+          return computedDisplayedIcons.value.map(icon => renderIcon(icon))
+        }
+
+        function renderContainer() {
+          const container = () => vue.h('div', {
+            key: computedPagination.value.page,
+            class: 'q-icon-picker__container col'
+          },  [...renderIcons()]);
+
+          if (props.animated === true) {
+            const transition = 'q-transition--' + (data.direction === 'prev' ? props.transitionPrev : props.transitionNext);
+            return () => vue.h(vue.Transition, {
+              name: transition,
+              appear: true
+            }, container)
+          }
+
+          return container
+        }
+
+
+        function renderScrollArea() {
+          return vue.h(quasar.QScrollArea, {
+            ref: scrollAreaRef,
+            style: {
+              width: data.width + 'px',
+              height: data.height + 'px'
+            }
+          }, renderContainer())
+        }
+
+        function renderBody() {
+          return vue.h('div', {
+            class: 'q-icon-picker__body col column'
+          }, [
+            renderScrollArea(),
+            vue.h(quasar.QResizeObserver, {
+              onResize: (size) => {
+                data.width = size.width;
+                data.height = size.height;
+              }
+            })
+          ])
+        }
+
+        const classes = [
+          'q-icon-picker',
+          'column'
+        ];
+        if (props.color) classes.push('bg-' + props.color);
+        if (props.textColor) classes.push('text-' + props.textColor);
+
+        const picker = vue.h('div', {
+          class: classes.join(' ')
+        },  [
+          renderBody(),
+          renderFooter()
+        ]);
+
+        vue.nextTick(() => {
+          categories();
+          emit('update:tags', data.categories);
+        }).catch(e => console.error(e));
+
+        return picker
+      }
+    }
+  });
+
+  const version = '2.0.7';
+
+  function install (app) {
+    app.component(QIconPicker.name, QIconPicker);
+  }
+
+  exports.QIconPicker = QIconPicker;
+  exports.install = install;
+  exports.version = version;
+
+}));

package/dist/index.umd.min.js

@@ -0,0 +1,6 @@
+/*!
+ * @quasar/quasar-ui-qiconpicker v2.0.7
+ * (c) 2023 Jeff Galbraith <jeff@quasar.dev>
+ * Released under the MIT License.
+ */
+(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,w){"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"}},y={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=y.PREV)},l=()=>{const{page:e,itemsPerPage:t}=o.value;a.value>0&&e*t<r.value.length&&(i({page:e+1}),n.direction=y.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(w.QPagination,{class:"q-icon-picker__pagination",...u.paginationProps,modelValue:t,max:n,"onUpdate:modelValue":e=>{u.animated&&(e>t?m.direction=y.NEXT:m.direction=y.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(w.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(w.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(w.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(w.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.7";function i(e){e.component(n.name,n)}e.QIconPicker=n,e.install=i,e.version=o});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quasar/quasar-ui-qiconpicker",
-  "version": "2.0.5",
+  "version": "2.0.7",
   "author": "Jeff Galbraith <jeff@quasar.dev>",
   "description": "QIconPicker - Quasar component",
   "contributors": [
@@ -35,6 +35,7 @@
     "icons:themify": "node build/icons/build.themify.js",
     "icons:bootstrap-icons": "node build/icons/build.bootstrap-icons.js",
     "icons:fontawesome": "node build/icons/build.fontawesome.js",
+    "icons:material": "node build/icons/build.google.material-icons.js",
     "icons:all": "node build/icons/build.all.js"
   },
   "funding": {
@@ -62,41 +63,41 @@
     "attributes": "dist/vetur/attributes.json"
   },
   "devDependencies": {
-    "@babel/core": "^7.17.5",
-    "@babel/eslint-parser": "^7.17.0",
+    "@babel/core": "^7.22.1",
+    "@babel/eslint-parser": "^7.21.8",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/preset-env": "^7.16.11",
-    "@quasar/extras": "^1.13.0",
-    "@rollup/plugin-buble": "^0.21.3",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "@rollup/plugin-replace": "^4.0.0",
-    "@types/node": "^17.0.21",
-    "@typescript-eslint/eslint-plugin": "^5.14.0",
-    "@typescript-eslint/parser": "^5.14.0",
-    "autoprefixer": "^10.4.2",
-    "cross-fetch": "^3.1.5",
-    "cssnano": "^5.1.4",
-    "eslint": "^8.11.0",
-    "eslint-config-standard": "^16.0.3",
-    "eslint-plugin-import": "^2.25.4",
-    "eslint-plugin-jsdoc": "^38.0.3",
+    "@babel/preset-env": "^7.22.4",
+    "@quasar/extras": "^1.16.4",
+    "@rollup/plugin-buble": "^1.0.2",
+    "@rollup/plugin-json": "^6.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.2",
+    "@rollup/plugin-replace": "^5.0.2",
+    "@types/node": "^20.2.5",
+    "@typescript-eslint/eslint-plugin": "^5.59.8",
+    "@typescript-eslint/parser": "^5.59.8",
+    "autoprefixer": "^10.4.14",
+    "cross-fetch": "^3.1.6",
+    "cssnano": "^6.0.1",
+    "eslint": "^8.41.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-jsdoc": "^45.0.0",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^6.0.0",
+    "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-quasar": "^1.1.0",
-    "eslint-plugin-vue": "^8.5.0",
-    "eslint-webpack-plugin": "^3.1.1",
-    "fs-extra": "^10.0.1",
-    "kolorist": "^1.5.1",
-    "open": "^8.4.0",
-    "postcss": "^8.4.8",
-    "quasar": "^2.5.5",
+    "eslint-plugin-vue": "^9.14.1",
+    "eslint-webpack-plugin": "^4.0.1",
+    "fs-extra": "^11.1.1",
+    "kolorist": "^1.8.0",
+    "open": "^9.1.0",
+    "postcss": "^8.4.24",
+    "quasar": "^2.12.0",
     "quasar-json-api": "^2.0.0-alpha.3",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.70.0",
-    "rtlcss": "^3.5.0",
-    "sass": "^1.49.9",
-    "uglify-js": "^3.15.3",
+    "rimraf": "^5.0.1",
+    "rollup": "^3.23.0",
+    "rtlcss": "^4.1.0",
+    "sass": "^1.62.1",
+    "uglify-js": "^3.17.4",
     "zlib": "^1.0.5"
   },
   "browserslist": [
@@ -109,4 +110,4 @@
     "last 4 FirefoxAndroid versions",
     "last 4 iOS versions"
   ]
-}
+}