@quasar/quasar-ui-qiconpicker 3.0.0-beta.4 → 3.0.0

package/dist/index.esm.min.js

@@ -1,6 +1,6 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+ * @quasar/quasar-ui-qiconpicker v3.0.0
  * (c) 2026 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */
-import{Transition,computed,defineComponent,h,nextTick,onMounted,reactive,ref,watch}from"vue";import{QBtn,QPagination,QResizeObserver,QScrollArea,QTooltip}from"quasar";var __defProp=Object.defineProperty,__exportAll=(e,t)=>{let o={};for(var a in e)__defProp(o,a,{get:e[a],enumerable:!0});return t||__defProp(o,Symbol.toStringTag,{value:"Module"}),o};const iconSetNames=["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","material-symbols-outlined","material-symbols-rounded","material-symbols-sharp","ionicons-v8","mdi-v7","fontawesome-v7","eva-icons","themify","line-awesome","bootstrap-icons"];function pascalToKebab(e){return e.replace(/([A-Z]+)([A-Z][a-z])/g,"$1-$2").replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}function pascalToSnake(e){return pascalToKebab(e).replace(/-/g,"_")}function removePrefix(e,t){if(!1===e.startsWith(t))throw new Error(`Icon export ${e} does not start with expected prefix `+t);return e.slice(t.length)}function createSvgEntry(o,a=""){return(e,t)=>({name:""+a+pascalToKebab(removePrefix(e,o)),icon:t})}function createMaterialSvgEntry(o,a=""){return(e,t)=>({name:""+a+pascalToSnake(removePrefix(e,o)),icon:t})}function getIconNames(e){return Array.isArray(e)?e:e.default}function getIconExports(e){return Object.fromEntries(Object.entries(e).filter(e=>"string"===typeof e[1]))}function createIconSet(o,e,t){const a=getIconNames(e),n=new Set(a),i=getIconExports(t),r=iconSetConfigs[o];return{name:o,icons:a.map(e=>{const t=i[e];if("string"!==typeof t)throw new Error(`QIconPicker: ${o} is missing @quasar/extras export `+e);return r.createEntry(e,t,n)})}}const iconSetConfigs={"material-icons":{createEntry:createMaterialSvgEntry("mat")},"material-icons-outlined":{createEntry:createMaterialSvgEntry("outlined","o_")},"material-icons-round":{createEntry:createMaterialSvgEntry("round","r_")},"material-icons-sharp":{createEntry:createMaterialSvgEntry("sharp","s_")},"material-symbols-outlined":{createEntry:createMaterialSvgEntry("symOutlined","sym_o_")},"material-symbols-rounded":{createEntry:createMaterialSvgEntry("symRounded","sym_r_")},"material-symbols-sharp":{createEntry:createMaterialSvgEntry("symSharp","sym_s_")},"mdi-v7":{createEntry:createSvgEntry("mdi","mdi-")},"ionicons-v8":{createEntry:(e,t)=>({name:e,icon:t})},"fontawesome-v7":{createEntry:(e,t)=>({name:"fa-"+pascalToKebab(e.slice(3)),icon:t,prefix:e.slice(0,3)})},"line-awesome":{createEntry:(e,t,o)=>{const a=removePrefix(e,"la"),n=a.endsWith("Solid");return{name:"la-"+pascalToKebab(n?a.slice(0,-5):a),icon:t,prefix:n?"las":o.has(e+"Solid")?"lar":"lab"}}},"eva-icons":{createEntry:createSvgEntry("eva","eva-")},themify:{createEntry:createSvgEntry("ti","ti-")},"bootstrap-icons":{createEntry:createSvgEntry("bi","bi-")}},iconSetLoaders={"material-icons":()=>Promise.all([import("@quasar/extras/material-icons/icons.json"),import("@quasar/extras/material-icons")]).then(([e,t])=>createIconSet("material-icons",e,t)),"material-icons-outlined":()=>Promise.all([import("@quasar/extras/material-icons-outlined/icons.json"),import("@quasar/extras/material-icons-outlined")]).then(([e,t])=>createIconSet("material-icons-outlined",e,t)),"material-icons-round":()=>Promise.all([import("@quasar/extras/material-icons-round/icons.json"),import("@quasar/extras/material-icons-round")]).then(([e,t])=>createIconSet("material-icons-round",e,t)),"material-icons-sharp":()=>Promise.all([import("@quasar/extras/material-icons-sharp/icons.json"),import("@quasar/extras/material-icons-sharp")]).then(([e,t])=>createIconSet("material-icons-sharp",e,t)),"material-symbols-outlined":()=>Promise.all([import("@quasar/extras/material-symbols-outlined/icons.json"),import("@quasar/extras/material-symbols-outlined")]).then(([e,t])=>createIconSet("material-symbols-outlined",e,t)),"material-symbols-rounded":()=>Promise.all([import("@quasar/extras/material-symbols-rounded/icons.json"),import("@quasar/extras/material-symbols-rounded")]).then(([e,t])=>createIconSet("material-symbols-rounded",e,t)),"material-symbols-sharp":()=>Promise.all([import("@quasar/extras/material-symbols-sharp/icons.json"),import("@quasar/extras/material-symbols-sharp")]).then(([e,t])=>createIconSet("material-symbols-sharp",e,t)),"ionicons-v8":()=>Promise.all([import("@quasar/extras/ionicons-v8/icons.json"),import("@quasar/extras/ionicons-v8")]).then(([e,t])=>createIconSet("ionicons-v8",e,t)),"mdi-v7":()=>Promise.all([import("@quasar/extras/mdi-v7/icons.json"),import("@quasar/extras/mdi-v7")]).then(([e,t])=>createIconSet("mdi-v7",e,t)),"fontawesome-v7":()=>Promise.all([import("@quasar/extras/fontawesome-v7/icons.json"),import("@quasar/extras/fontawesome-v7")]).then(([e,t])=>createIconSet("fontawesome-v7",e,t)),"line-awesome":()=>Promise.all([import("@quasar/extras/line-awesome/icons.json"),import("@quasar/extras/line-awesome")]).then(([e,t])=>createIconSet("line-awesome",e,t)),"eva-icons":()=>Promise.all([import("@quasar/extras/eva-icons/icons.json"),import("@quasar/extras/eva-icons")]).then(([e,t])=>createIconSet("eva-icons",e,t)),themify:()=>Promise.all([import("@quasar/extras/themify/icons.json"),import("@quasar/extras/themify")]).then(([e,t])=>createIconSet("themify",e,t)),"bootstrap-icons":()=>Promise.all([import("@quasar/extras/bootstrap-icons/icons.json"),import("@quasar/extras/bootstrap-icons")]).then(([e,t])=>createIconSet("bootstrap-icons",e,t))};function loadIconSet(e){return iconSetLoaders[e]()}const useIconPickerProps={modelValue:String,iconSet:{type:String,validator:e=>[...iconSetNames,""].includes(e),default:""},icons:Array,filter:String,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"}},direction={NEXT:"next",PREV:"prev"};function useIconPickerPagination(o,a,n,e){function i(e){return e.page<1&&(e.page=1),(void 0===e.itemsPerPage||e.itemsPerPage<1)&&(e.itemsPerPage=0),e}function r(e,t){for(var o in t)if(t[o]!==e[o])return!1;return!0}const s=computed(()=>{return i({...o.innerPagination,...a.modelPagination})}),t=computed(()=>{return 0===s.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/s.value.itemsPerPage))});function c(e){const t=i({...s.value,...e});r(o.innerPagination,t)||(a.modelPagination&&n("update:model-pagination",t),o.innerPagination=t)}function l(){void 0!==a.modelPagination&&c({total:e.value.length,totalPages:t.value})}return{samePagination:r,computedPagination:s,setPagination:c,updatePagination:l,computedPagesNumber:t}}function useIconPickerIcons(n,o,t,a){let i=0;async function e(t){const e=++i;if(n.iconsList=[],t)if("undefined"!==typeof window&&window.QIconPicker){const o=t.replace(/-([a-z])/g,e=>e[1].toUpperCase());window.QIconPicker.iconSet&&window.QIconPicker.iconSet[o]?n.iconsList=window.QIconPicker.iconSet[o].icons:(console.error("QIconPicker: no icon set loaded called "+t),console.error("Built-in icon sets require ESM bundler support for @quasar/extras lazy imports. With the UMD build, pass an icons array instead."))}else if(iconSetNames.includes(t))try{const a=await loadIconSet(t);e===i&&(n.iconsList=a.icons)}catch(e){console.error("QIconPicker: failed to load icon set called "+t),console.error(e)}else console.error("QIconPicker: cannot find icon set called "+t)}const r=computed(()=>{let e=[];return n.iconsList&&(e=s.value,o.modelPagination)&&0!==o.modelPagination.itemsPerPage&&(e=e.slice(t.value,a.value)),e}),s=computed(()=>{let e=n.iconsList;if(e&&void 0!==o.filter&&""!==o.filter&&null!==o.filter){const t=o.filter.toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t))}return e});return{loadIconSet:e,computedDisplayedIcons:r,computedFilteredIcons:s}}function exposeIconPickerApi(o,e,a,n,t,i,r,s){const c=()=>{const e=a.value.page;e>1&&(n({page:e-1}),o.direction=direction.PREV)},l=()=>{const{page:e,itemsPerPage:t}=a.value;i.value>0&&e*t<r.value.length&&(n({page:e+1}),o.direction=direction.NEXT)},m=()=>{n({page:s.value})},u=()=>{n({page:0})};e({prevPage:c,nextPage:l,lastPage:m,firstPage:u,isLastPage:computed(()=>{return 0===i.value||a.value.page>=s.value}),isFirstPage:computed(()=>{return 1===a.value.page})})}var QIconPicker_default=defineComponent({name:"QIconPicker",props:{...useIconPickerProps},emits:["update:model-value","update:model-pagination"],setup(l,{slots:m,emit:u,expose:e}){const d=ref(null),p=reactive({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},width:"100",height:"100",direction:""}),t=computed(()=>{const{page:e,itemsPerPage:t}=P.value;return(e-1)*t}),o=computed(()=>{const{page:e,itemsPerPage:t}=P.value;return e*t}),{loadIconSet:a,computedDisplayedIcons:g,computedFilteredIcons:n}=useIconPickerIcons(p,l,t,o),{samePagination:i,computedPagination:P,setPagination:v,updatePagination:r,computedPagesNumber:s}=useIconPickerPagination(p,l,u,n);return exposeIconPickerApi(p,e,P,v,t,o,n,s),onMounted(async()=>{l.iconSet?await a(l.iconSet):void 0!==l.icons&&l.icons.length>0&&(p.iconsList=l.icons),r()}),watch(()=>l.iconSet,async e=>{e&&(await a(e),r(),nextTick(()=>{v({page:1})}).catch(e=>console.error(e)),d.value)&&d.value.setScrollPosition("vertical",0)}),watch(()=>l.icons,()=>{void 0!==l.icons&&l.icons.length>0&&(p.iconsList=l.icons),r(),nextTick(()=>{v({page:1})}).catch(e=>console.error(e)),d.value&&d.value.setScrollPosition("vertical",0)}),watch(()=>l.filter,()=>{v({page:1,totalPages:s.value}),r()}),l.modelPagination&&watch(()=>l.modelPagination,(e,t)=>{i(t,e)||r()}),l.modelPagination&&(watch(()=>l.modelPagination.itemsPerPage,()=>{r()}),watch(()=>l.modelPagination.page,()=>{r()})),()=>{function e(){if(l.modelPagination&&0===l.modelPagination.itemsPerPage)return"";const{page:t,totalPages:e}=P.value;return m.pagination?m.pagination(P.value):h(QPagination,{class:"q-icon-picker__pagination",...l.paginationProps,modelValue:t,max:e,"onUpdate:modelValue":e=>{l.animated&&(e>t?p.direction=direction.NEXT:p.direction=direction.PREV),v({page:e})}})}function t(){if(!0!==l.noFooter&&void 0!==l.modelPagination)return h("div",{class:"q-icon-picker__footer flex flex-center"},[m.footer?m.footer(P.value):e()])}function s(e){if(!0===l.tooltips)return()=>h(QTooltip,{},()=>e)}function o(e){const t=void 0!==e.prefix?e.prefix+" "+e.name:e.name,o=void 0!==e.icon?e.icon:t;if(m.icon)return m.icon(t);const a=t===l.modelValue,n=a?l.selectedTextColor:void 0,i=a?l.selectedColor:void 0,r=l.size||void 0;return h(QBtn,{id:e.name,unelevated:!0,dense:l.dense,noWrap:!0,size:r,textColor:n,color:i,icon:o,onClick:()=>u("update:model-value",t)},s(t))}function a(){return g.value.map(e=>o(e))}function n(){const e=()=>h("div",{key:P.value.page,class:"q-icon-picker__container col"},[...a()]);if(!0!==l.animated)return e;{const t="q-transition--"+("prev"===p.direction?l.transitionPrev:l.transitionNext);return()=>h(Transition,{name:t,appear:!0},e)}}function i(){return h(QScrollArea,{ref:d,style:{width:p.width+"px",height:p.height+"px"}},n())}function r(){return h("div",{class:"q-icon-picker__body col column"},[i(),h(QResizeObserver,{onResize:e=>{p.width=e.width,p.height=e.height}})])}const c=["q-icon-picker","column"];return l.color&&c.push("bg-"+l.color),l.textColor&&c.push("text-"+l.textColor),h("div",{class:c.join(" ")},[r(),t()])}}});const version="3.0.0-beta.4";var vue_plugin_exports=__exportAll({QIconPicker:()=>QIconPicker_default,install:()=>install,version:()=>version});function install(e){e.component(String(QIconPicker_default.name),QIconPicker_default)}var index_esm_default=vue_plugin_exports;export{QIconPicker_default as QIconPicker,index_esm_default as default,install,version};
+import{Transition,computed,defineComponent,h,nextTick,onMounted,reactive,ref,watch}from"vue";import{QBtn,QPagination,QResizeObserver,QScrollArea,QTooltip}from"quasar";var __defProp=Object.defineProperty,__exportAll=(e,t)=>{let o={};for(var a in e)__defProp(o,a,{get:e[a],enumerable:!0});return t||__defProp(o,Symbol.toStringTag,{value:"Module"}),o};const iconSetNames=["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","material-symbols-outlined","material-symbols-rounded","material-symbols-sharp","ionicons-v8","mdi-v7","fontawesome-v7","eva-icons","themify","line-awesome","bootstrap-icons"];function pascalToKebab(e){return e.replace(/([A-Z]+)([A-Z][a-z])/g,"$1-$2").replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}function pascalToSnake(e){return pascalToKebab(e).replace(/-/g,"_")}function removePrefix(e,t){if(!1===e.startsWith(t))throw new Error(`Icon export ${e} does not start with expected prefix `+t);return e.slice(t.length)}function createSvgEntry(o,a=""){return(e,t)=>({name:""+a+pascalToKebab(removePrefix(e,o)),icon:t})}function createMaterialSvgEntry(o,a=""){return(e,t)=>({name:""+a+pascalToSnake(removePrefix(e,o)),icon:t})}function getIconNames(e){return Array.isArray(e)?e:e.default}function getIconExports(e){return Object.fromEntries(Object.entries(e).filter(e=>"string"===typeof e[1]))}function createIconSet(o,e,t){const a=getIconNames(e),n=new Set(a),i=getIconExports(t),r=iconSetConfigs[o];return{name:o,icons:a.map(e=>{const t=i[e];if("string"!==typeof t)throw new Error(`QIconPicker: ${o} is missing @quasar/extras export `+e);return r.createEntry(e,t,n)})}}const iconSetConfigs={"material-icons":{createEntry:createMaterialSvgEntry("mat")},"material-icons-outlined":{createEntry:createMaterialSvgEntry("outlined","o_")},"material-icons-round":{createEntry:createMaterialSvgEntry("round","r_")},"material-icons-sharp":{createEntry:createMaterialSvgEntry("sharp","s_")},"material-symbols-outlined":{createEntry:createMaterialSvgEntry("symOutlined","sym_o_")},"material-symbols-rounded":{createEntry:createMaterialSvgEntry("symRounded","sym_r_")},"material-symbols-sharp":{createEntry:createMaterialSvgEntry("symSharp","sym_s_")},"mdi-v7":{createEntry:createSvgEntry("mdi","mdi-")},"ionicons-v8":{createEntry:(e,t)=>({name:e,icon:t})},"fontawesome-v7":{createEntry:(e,t)=>({name:"fa-"+pascalToKebab(e.slice(3)),icon:t,prefix:e.slice(0,3)})},"line-awesome":{createEntry:(e,t,o)=>{const a=removePrefix(e,"la"),n=a.endsWith("Solid");return{name:"la-"+pascalToKebab(n?a.slice(0,-5):a),icon:t,prefix:n?"las":o.has(e+"Solid")?"lar":"lab"}}},"eva-icons":{createEntry:createSvgEntry("eva","eva-")},themify:{createEntry:createSvgEntry("ti","ti-")},"bootstrap-icons":{createEntry:createSvgEntry("bi","bi-")}},iconSetLoaders={"material-icons":()=>Promise.all([import("@quasar/extras/material-icons/icons.json"),import("@quasar/extras/material-icons")]).then(([e,t])=>createIconSet("material-icons",e,t)),"material-icons-outlined":()=>Promise.all([import("@quasar/extras/material-icons-outlined/icons.json"),import("@quasar/extras/material-icons-outlined")]).then(([e,t])=>createIconSet("material-icons-outlined",e,t)),"material-icons-round":()=>Promise.all([import("@quasar/extras/material-icons-round/icons.json"),import("@quasar/extras/material-icons-round")]).then(([e,t])=>createIconSet("material-icons-round",e,t)),"material-icons-sharp":()=>Promise.all([import("@quasar/extras/material-icons-sharp/icons.json"),import("@quasar/extras/material-icons-sharp")]).then(([e,t])=>createIconSet("material-icons-sharp",e,t)),"material-symbols-outlined":()=>Promise.all([import("@quasar/extras/material-symbols-outlined/icons.json"),import("@quasar/extras/material-symbols-outlined")]).then(([e,t])=>createIconSet("material-symbols-outlined",e,t)),"material-symbols-rounded":()=>Promise.all([import("@quasar/extras/material-symbols-rounded/icons.json"),import("@quasar/extras/material-symbols-rounded")]).then(([e,t])=>createIconSet("material-symbols-rounded",e,t)),"material-symbols-sharp":()=>Promise.all([import("@quasar/extras/material-symbols-sharp/icons.json"),import("@quasar/extras/material-symbols-sharp")]).then(([e,t])=>createIconSet("material-symbols-sharp",e,t)),"ionicons-v8":()=>Promise.all([import("@quasar/extras/ionicons-v8/icons.json"),import("@quasar/extras/ionicons-v8")]).then(([e,t])=>createIconSet("ionicons-v8",e,t)),"mdi-v7":()=>Promise.all([import("@quasar/extras/mdi-v7/icons.json"),import("@quasar/extras/mdi-v7")]).then(([e,t])=>createIconSet("mdi-v7",e,t)),"fontawesome-v7":()=>Promise.all([import("@quasar/extras/fontawesome-v7/icons.json"),import("@quasar/extras/fontawesome-v7")]).then(([e,t])=>createIconSet("fontawesome-v7",e,t)),"line-awesome":()=>Promise.all([import("@quasar/extras/line-awesome/icons.json"),import("@quasar/extras/line-awesome")]).then(([e,t])=>createIconSet("line-awesome",e,t)),"eva-icons":()=>Promise.all([import("@quasar/extras/eva-icons/icons.json"),import("@quasar/extras/eva-icons")]).then(([e,t])=>createIconSet("eva-icons",e,t)),themify:()=>Promise.all([import("@quasar/extras/themify/icons.json"),import("@quasar/extras/themify")]).then(([e,t])=>createIconSet("themify",e,t)),"bootstrap-icons":()=>Promise.all([import("@quasar/extras/bootstrap-icons/icons.json"),import("@quasar/extras/bootstrap-icons")]).then(([e,t])=>createIconSet("bootstrap-icons",e,t))};function loadIconSet(e){return iconSetLoaders[e]()}const useIconPickerProps={modelValue:String,iconSet:{type:String,validator:e=>[...iconSetNames,""].includes(e),default:""},icons:Array,filter:String,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"}},direction={NEXT:"next",PREV:"prev"};function useIconPickerPagination(o,a,n,e){function i(e){return e.page<1&&(e.page=1),(void 0===e.itemsPerPage||e.itemsPerPage<1)&&(e.itemsPerPage=0),e}function r(e,t){for(var o in t)if(t[o]!==e[o])return!1;return!0}const s=computed(()=>{return i({...o.innerPagination,...a.modelPagination})}),t=computed(()=>{return 0===s.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/s.value.itemsPerPage))});function c(e){const t=i({...s.value,...e});r(o.innerPagination,t)||(a.modelPagination&&n("update:model-pagination",t),o.innerPagination=t)}function l(){void 0!==a.modelPagination&&c({total:e.value.length,totalPages:t.value})}return{samePagination:r,computedPagination:s,setPagination:c,updatePagination:l,computedPagesNumber:t}}function useIconPickerIcons(n,o,t,a){let i=0;async function e(t){const e=++i;if(n.iconsList=[],t)if("undefined"!==typeof window&&window.QIconPicker){const o=t.replace(/-([a-z])/g,e=>e[1].toUpperCase());window.QIconPicker.iconSet&&window.QIconPicker.iconSet[o]?n.iconsList=window.QIconPicker.iconSet[o].icons:(console.error("QIconPicker: no icon set loaded called "+t),console.error("Built-in icon sets require ESM bundler support for @quasar/extras lazy imports. With the UMD build, pass an icons array instead."))}else if(iconSetNames.includes(t))try{const a=await loadIconSet(t);e===i&&(n.iconsList=a.icons)}catch(e){console.error("QIconPicker: failed to load icon set called "+t),console.error(e)}else console.error("QIconPicker: cannot find icon set called "+t)}const r=computed(()=>{let e=[];return n.iconsList&&(e=s.value,o.modelPagination)&&0!==o.modelPagination.itemsPerPage&&(e=e.slice(t.value,a.value)),e}),s=computed(()=>{let e=n.iconsList;if(e&&void 0!==o.filter&&""!==o.filter&&null!==o.filter){const t=o.filter.toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t))}return e});return{loadIconSet:e,computedDisplayedIcons:r,computedFilteredIcons:s}}function exposeIconPickerApi(o,a,n,e,i,r,t){const s=()=>{const e=a.value.page;e>1&&(n({page:e-1}),o.direction=direction.PREV)},c=()=>{const{page:e,itemsPerPage:t}=a.value;i.value>0&&e*t<r.value.length&&(n({page:e+1}),o.direction=direction.NEXT)},l=()=>{n({page:t.value})},m=()=>{n({page:0})};return{prevPage:s,nextPage:c,lastPage:l,firstPage:m,isLastPage:computed(()=>{return 0===i.value||a.value.page>=t.value}),isFirstPage:computed(()=>{return 1===a.value.page})}}var QIconPicker_default=defineComponent({name:"QIconPicker",slots:Object,props:{...useIconPickerProps},emits:["update:model-value","update:model-pagination"],setup(l,{slots:m,emit:u,expose:e}){const d=ref(null),p=reactive({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},width:"100",height:"100",direction:""}),t=computed(()=>{const{page:e,itemsPerPage:t}=P.value;return(e-1)*t}),o=computed(()=>{const{page:e,itemsPerPage:t}=P.value;return e*t}),{loadIconSet:a,computedDisplayedIcons:g,computedFilteredIcons:n}=useIconPickerIcons(p,l,t,o),{samePagination:i,computedPagination:P,setPagination:v,updatePagination:r,computedPagesNumber:s}=useIconPickerPagination(p,l,u,n),c=exposeIconPickerApi(p,P,v,t,o,n,s);return e({prevPage:c.prevPage,nextPage:c.nextPage,lastPage:c.lastPage,firstPage:c.firstPage,isLastPage:c.isLastPage,isFirstPage:c.isFirstPage}),onMounted(async()=>{l.iconSet?await a(l.iconSet):void 0!==l.icons&&l.icons.length>0&&(p.iconsList=l.icons),r()}),watch(()=>l.iconSet,async e=>{e&&(await a(e),r(),nextTick(()=>{v({page:1})}).catch(e=>console.error(e)),d.value)&&d.value.setScrollPosition("vertical",0)}),watch(()=>l.icons,()=>{void 0!==l.icons&&l.icons.length>0&&(p.iconsList=l.icons),r(),nextTick(()=>{v({page:1})}).catch(e=>console.error(e)),d.value&&d.value.setScrollPosition("vertical",0)}),watch(()=>l.filter,()=>{v({page:1,totalPages:s.value}),r()}),l.modelPagination&&watch(()=>l.modelPagination,(e,t)=>{i(t,e)||r()}),l.modelPagination&&(watch(()=>l.modelPagination.itemsPerPage,()=>{r()}),watch(()=>l.modelPagination.page,()=>{r()})),()=>{function e(){if(l.modelPagination&&0===l.modelPagination.itemsPerPage)return"";const{page:t,totalPages:e}=P.value;return m.pagination?m.pagination(P.value):h(QPagination,{class:"q-icon-picker__pagination",...l.paginationProps,modelValue:t,max:e,"onUpdate:modelValue":e=>{l.animated&&(e>t?p.direction=direction.NEXT:p.direction=direction.PREV),v({page:e})}})}function t(){if(!0!==l.noFooter&&void 0!==l.modelPagination)return h("div",{class:"q-icon-picker__footer flex flex-center"},[m.footer?m.footer(P.value):e()])}function s(e){if(!0===l.tooltips)return()=>h(QTooltip,{},()=>e)}function o(e){const t=void 0!==e.prefix?e.prefix+" "+e.name:e.name,o=void 0!==e.icon?e.icon:t;if(m.icon)return m.icon(t);const a=t===l.modelValue,n=a?l.selectedTextColor:void 0,i=a?l.selectedColor:void 0,r=l.size||void 0;return h(QBtn,{id:e.name,unelevated:!0,dense:l.dense,noWrap:!0,size:r,textColor:n,color:i,icon:o,onClick:()=>u("update:model-value",t)},s(t))}function a(){return g.value.map(e=>o(e))}function n(){const e=()=>h("div",{key:P.value.page,class:"q-icon-picker__container col"},[...a()]);if(!0!==l.animated)return e;{const t="q-transition--"+("prev"===p.direction?l.transitionPrev:l.transitionNext);return()=>h(Transition,{name:t,appear:!0},e)}}function i(){return h(QScrollArea,{ref:d,style:{width:p.width+"px",height:p.height+"px"}},n())}function r(){return h("div",{class:"q-icon-picker__body col column"},[i(),h(QResizeObserver,{onResize:e=>{p.width=e.width,p.height=e.height}})])}const c=["q-icon-picker","column"];return l.color&&c.push("bg-"+l.color),l.textColor&&c.push("text-"+l.textColor),h("div",{class:c.join(" ")},[r(),t()])}}});const version="3.0.0";var vue_plugin_exports=__exportAll({QIconPicker:()=>QIconPicker_default,install:()=>install,version:()=>version});function install(e){e.component(String(QIconPicker_default.name),QIconPicker_default)}var index_esm_default=vue_plugin_exports;export{QIconPicker_default as QIconPicker,index_esm_default as default,install,version};

package/dist/index.min.css

@@ -1,5 +1,5 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+ * @quasar/quasar-ui-qiconpicker v3.0.0
  * (c) 2026 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */.q-icon-picker{display:flex;flex-direction:column;flex-wrap:nowrap;width:100%;height:100%}.q-icon-picker__body{position:relative}.q-icon-picker__body,.q-icon-picker__scroll-area{overflow:hidden;flex:1 1 auto;width:100%}.q-icon-picker__container{display:flex;flex:1 1 auto;flex-wrap:wrap;flex-direction:row;justify-content:center;width:100%}.q-icon-picker__footer,.q-icon-picker__header{width:100%}

package/dist/index.rtl.css

@@ -1,5 +1,5 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+ * @quasar/quasar-ui-qiconpicker v3.0.0
  * (c) 2026 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */

package/dist/index.rtl.min.css

@@ -1,5 +1,5 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+ * @quasar/quasar-ui-qiconpicker v3.0.0
  * (c) 2026 Jeff Galbraith <jeff@quasar.dev>
  * Released under the MIT License.
  */.q-icon-picker{display:flex;flex-direction:column;flex-wrap:nowrap;width:100%;height:100%}.q-icon-picker__body{position:relative}.q-icon-picker__body,.q-icon-picker__scroll-area{overflow:hidden;flex:1 1 auto;width:100%}.q-icon-picker__container{display:flex;flex:1 1 auto;flex-wrap:wrap;flex-direction:row;justify-content:center;width:100%}.q-icon-picker__footer,.q-icon-picker__header{width:100%}

package/dist/index.umd.js

@@ -1,5 +1,5 @@
 /*!
-* @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+* @quasar/quasar-ui-qiconpicker v3.0.0
 * (c) 2026 Jeff Galbraith <jeff@quasar.dev>
 * Released under the MIT License.
 */
@@ -126,31 +126,117 @@
 	* QIconPicker Properties
 	*/
 	const useIconPickerProps = {
+		/**
+		* `v-model`; the selected icon.
+		*
+		* @category model
+		* @example v-model="calendar_today"
+		* @example v-model="bolt"
+		*/
 		modelValue: String,
+		/**
+		* The name of a [Quasar Icon Set](https://quasar.dev/options/quasar-icon-sets). Built-in sets are lazy loaded from `@quasar/extras`.
+		*
+		* @category source
+		* @values material-icons | material-icons-outlined | material-icons-round | material-icons-sharp | material-symbols-outlined | material-symbols-rounded | material-symbols-sharp | ionicons-v8 | mdi-v7 | fontawesome-v7 | line-awesome | eva-icons | themify | bootstrap-icons
+		* @example icon-set="material-icons"
+		* @example icon-set="fontawesome-v7"
+		*/
 		iconSet: {
 			type: String,
 			validator: (v) => [...iconSetNames, ""].includes(v),
 			default: ""
 		},
+		/**
+		* An array of objects containing icon information. The object must contain the key `name` with the value being the selected icon name. Use the optional `icon` key for SVG path data used for display, for example `{ name: 'bolt', icon: matBolt }`.
+		*
+		* @category source
+		* @tsType IconNameArray
+		* @example :icons="[{ name: 'calendar-today' }, { name: 'bolt' }]"
+		*/
 		icons: Array,
+		/**
+		* Icons will be filtered by the passed string.
+		*
+		* @category source
+		* @example :filter="myFilter"
+		*/
 		filter: String,
+		/**
+		* Use less of a footprint for the component.
+		*
+		* @category style
+		*/
 		dense: Boolean,
+		/**
+		* Turns tooltips on for each displayed icon, showing the icon name.
+		*
+		* @category behavior
+		*/
 		tooltips: Boolean,
+		/**
+		* Hides the footer area when pagination is enabled.
+		*
+		* @category pagination
+		*/
 		noFooter: Boolean,
+		/**
+		* Size in CSS units, including unit name or standard size name (xs, sm, md, lg, xl).
+		*
+		* @category style
+		* @example size="3rem"
+		* @example size="24px"
+		* @example size="lg"
+		*/
 		size: {
 			type: String,
 			default: "inherit"
 		},
+		/**
+		* Any color from the [Quasar Color Palette](https://quasar.dev/style/color-palette).
+		*
+		* @category style
+		* @example color="orange-8"
+		* @example color="yellow-6"
+		*/
 		color: String,
+		/**
+		* Any text color from the [Quasar Color Palette](https://quasar.dev/style/color-palette).
+		*
+		* @category style
+		* @example text-color="orange-8"
+		* @example text-color="red-6"
+		*/
 		textColor: String,
+		/**
+		* Color used for the selected icon.
+		*
+		* @category style
+		* @example selected-color="orange-8"
+		* @example selected-color="#c8c8c8"
+		*/
 		selectedColor: {
 			type: String,
 			default: "primary"
 		},
+		/**
+		* Text color used for the selected icon.
+		*
+		* @category style
+		* @example selected-text-color="orange-8"
+		* @example selected-text-color="#c8c8c8"
+		*/
 		selectedTextColor: {
 			type: String,
 			default: "grey-1"
 		},
+		/**
+		* The properties to pass to the QPagination component.
+		*
+		* @category pagination
+		* @tsType PaginationProps
+		* @api-exemption examples
+		*/
 		paginationProps: {
 			type: Object,
 			default: () => ({
@@ -158,12 +244,36 @@
 				input: true
 			})
 		},
+		/**
+		* For pagination purposes uses Quasar's pagination component. Use `v-model:model-pagination` to synchronize the data. You can use `page` and `itemsPerPage` to control the pagination. QIconPicker will set `totalPages` depending on `icon-set` or `icons` properties. If using a `filter` the page will automatically be reset to 1.
+		*
+		* @category pagination
+		* @tsType Pagination
+		* @example v-model:model-pagination="myPagination"
+		*/
 		modelPagination: Object,
+		/**
+		* Turns on animation.
+		*
+		* @category behavior
+		*/
 		animated: Boolean,
+		/**
+		* When animated property is true, transition to use for previous paginated view.
+		*
+		* @category behavior
+		* @example transition-prev="flip-right"
+		*/
 		transitionPrev: {
 			type: String,
 			default: "slide-right"
 		},
+		/**
+		* When animated property is true, transition to use for next paginated view.
+		*
+		* @category behavior
+		* @example transition-next="flip-left"
+		*/
 		transitionNext: {
 			type: String,
 			default: "slide-left"
@@ -270,7 +380,10 @@
 	/**
 	* Exposes api functions
 	*/
-	function exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber) {
+	function exposeIconPickerApi(data, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber) {
+		/**
+		* If paginated, will go to previous page if not on 1st page.
+		*/
 		const prevPage = () => {
 			const { page } = computedPagination.value;
 			if (page > 1) {
@@ -278,6 +391,9 @@
 				data.direction = direction.PREV;
 			}
 		};
+		/**
+		* If paginated, will go to next page, if not on last page.
+		*/
 		const nextPage = () => {
 			const { page, itemsPerPage } = computedPagination.value;
 			if (computedLastItemIndex.value > 0 && page * itemsPerPage < computedFilteredIcons.value.length) {
@@ -285,13 +401,19 @@
 				data.direction = direction.NEXT;
 			}
 		};
+		/**
+		* If paginated, will go to the last page.
+		*/
 		const lastPage = () => {
 			setPagination({ page: computedPagesNumber.value });
 		};
+		/**
+		* If paginated, will go to the first page.
+		*/
 		const firstPage = () => {
 			setPagination({ page: 0 });
 		};
-		expose({
+		return {
 			prevPage,
 			nextPage,
 			lastPage,
@@ -302,10 +424,11 @@
 			isFirstPage: (0, vue.computed)(() => {
 				return computedPagination.value.page === 1;
 			})
-		});
+		};
 	}
 	var QIconPicker_default = (0, vue.defineComponent)({
 		name: "QIconPicker",
+		slots: Object,
 		props: { ...useIconPickerProps },
 		emits: ["update:model-value", "update:model-pagination"],
 		setup(props, { slots, emit, expose }) {
@@ -331,7 +454,33 @@
 			});
 			const { loadIconSet, computedDisplayedIcons, computedFilteredIcons } = 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);
+			const iconPickerApi = exposeIconPickerApi(data, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber);
+			expose({
+				/**
+				* If paginated, will go to previous page if not on 1st page.
+				*/
+				prevPage: iconPickerApi.prevPage,
+				/**
+				* If paginated, will go to next page, if not on last page.
+				*/
+				nextPage: iconPickerApi.nextPage,
+				/**
+				* If paginated, will go to the last page.
+				*/
+				lastPage: iconPickerApi.lastPage,
+				/**
+				* If paginated, will go to the first page.
+				*/
+				firstPage: iconPickerApi.firstPage,
+				/**
+				* True if on last page otherwise false.
+				*/
+				isLastPage: iconPickerApi.isLastPage,
+				/**
+				* True if on first page otherwise false.
+				*/
+				isFirstPage: iconPickerApi.isFirstPage
+			});
 			(0, vue.onMounted)(async () => {
 				if (props.iconSet) await loadIconSet(props.iconSet);
 				else if (props.icons !== void 0 && props.icons.length > 0) data.iconsList = props.icons;
@@ -456,7 +605,7 @@
 	});
 	//#endregion
 	//#region src/version.ts
-	const version = "3.0.0-beta.4";
+	const version = "3.0.0";
 	//#endregion
 	//#region src/vue-plugin.ts
 	function install(app) {

package/dist/index.umd.min.js

@@ -1,6 +1,6 @@
 /*!
- * @quasar/quasar-ui-qiconpicker v3.0.0-beta.4
+ * @quasar/quasar-ui-qiconpicker v3.0.0
  * (c) 2026 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,h,v){Object.defineProperty(e,Symbol.toStringTag,{value:"Module"});const l=["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","material-symbols-outlined","material-symbols-rounded","material-symbols-sharp","ionicons-v8","mdi-v7","fontawesome-v7","eva-icons","themify","line-awesome","bootstrap-icons"];function a(e){return e.replace(/([A-Z]+)([A-Z][a-z])/g,"$1-$2").replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}function n(e){return a(e).replace(/-/g,"_")}function r(e,t){if(!1===e.startsWith(t))throw new Error(`Icon export ${e} does not start with expected prefix `+t);return e.slice(t.length)}function t(o,i=""){return(e,t)=>({name:""+i+a(r(e,o)),icon:t})}function o(o,i=""){return(e,t)=>({name:""+i+n(r(e,o)),icon:t})}function s(e){return Array.isArray(e)?e:e.default}function c(e){return Object.fromEntries(Object.entries(e).filter(e=>"string"===typeof e[1]))}function i(o,e,t){const i=s(e),n=new Set(i),a=c(t),r=u[o];return{name:o,icons:i.map(e=>{const t=a[e];if("string"!==typeof t)throw new Error(`QIconPicker: ${o} is missing @quasar/extras export `+e);return r.createEntry(e,t,n)})}}const u={"material-icons":{createEntry:o("mat")},"material-icons-outlined":{createEntry:o("outlined","o_")},"material-icons-round":{createEntry:o("round","r_")},"material-icons-sharp":{createEntry:o("sharp","s_")},"material-symbols-outlined":{createEntry:o("symOutlined","sym_o_")},"material-symbols-rounded":{createEntry:o("symRounded","sym_r_")},"material-symbols-sharp":{createEntry:o("symSharp","sym_s_")},"mdi-v7":{createEntry:t("mdi","mdi-")},"ionicons-v8":{createEntry:(e,t)=>({name:e,icon:t})},"fontawesome-v7":{createEntry:(e,t)=>({name:"fa-"+a(e.slice(3)),icon:t,prefix:e.slice(0,3)})},"line-awesome":{createEntry:(e,t,o)=>{const i=r(e,"la"),n=i.endsWith("Solid");return{name:"la-"+a(n?i.slice(0,-5):i),icon:t,prefix:n?"las":o.has(e+"Solid")?"lar":"lab"}}},"eva-icons":{createEntry:t("eva","eva-")},themify:{createEntry:t("ti","ti-")},"bootstrap-icons":{createEntry:t("bi","bi-")}},m={"material-icons":()=>Promise.all([import("@quasar/extras/material-icons/icons.json"),import("@quasar/extras/material-icons")]).then(([e,t])=>i("material-icons",e,t)),"material-icons-outlined":()=>Promise.all([import("@quasar/extras/material-icons-outlined/icons.json"),import("@quasar/extras/material-icons-outlined")]).then(([e,t])=>i("material-icons-outlined",e,t)),"material-icons-round":()=>Promise.all([import("@quasar/extras/material-icons-round/icons.json"),import("@quasar/extras/material-icons-round")]).then(([e,t])=>i("material-icons-round",e,t)),"material-icons-sharp":()=>Promise.all([import("@quasar/extras/material-icons-sharp/icons.json"),import("@quasar/extras/material-icons-sharp")]).then(([e,t])=>i("material-icons-sharp",e,t)),"material-symbols-outlined":()=>Promise.all([import("@quasar/extras/material-symbols-outlined/icons.json"),import("@quasar/extras/material-symbols-outlined")]).then(([e,t])=>i("material-symbols-outlined",e,t)),"material-symbols-rounded":()=>Promise.all([import("@quasar/extras/material-symbols-rounded/icons.json"),import("@quasar/extras/material-symbols-rounded")]).then(([e,t])=>i("material-symbols-rounded",e,t)),"material-symbols-sharp":()=>Promise.all([import("@quasar/extras/material-symbols-sharp/icons.json"),import("@quasar/extras/material-symbols-sharp")]).then(([e,t])=>i("material-symbols-sharp",e,t)),"ionicons-v8":()=>Promise.all([import("@quasar/extras/ionicons-v8/icons.json"),import("@quasar/extras/ionicons-v8")]).then(([e,t])=>i("ionicons-v8",e,t)),"mdi-v7":()=>Promise.all([import("@quasar/extras/mdi-v7/icons.json"),import("@quasar/extras/mdi-v7")]).then(([e,t])=>i("mdi-v7",e,t)),"fontawesome-v7":()=>Promise.all([import("@quasar/extras/fontawesome-v7/icons.json"),import("@quasar/extras/fontawesome-v7")]).then(([e,t])=>i("fontawesome-v7",e,t)),"line-awesome":()=>Promise.all([import("@quasar/extras/line-awesome/icons.json"),import("@quasar/extras/line-awesome")]).then(([e,t])=>i("line-awesome",e,t)),"eva-icons":()=>Promise.all([import("@quasar/extras/eva-icons/icons.json"),import("@quasar/extras/eva-icons")]).then(([e,t])=>i("eva-icons",e,t)),themify:()=>Promise.all([import("@quasar/extras/themify/icons.json"),import("@quasar/extras/themify")]).then(([e,t])=>i("themify",e,t)),"bootstrap-icons":()=>Promise.all([import("@quasar/extras/bootstrap-icons/icons.json"),import("@quasar/extras/bootstrap-icons")]).then(([e,t])=>i("bootstrap-icons",e,t))};function d(e){return m[e]()}const p={modelValue:String,iconSet:{type:String,validator:e=>[...l,""].includes(e),default:""},icons:Array,filter:String,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 x(o,i,n,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(var o in t)if(t[o]!==e[o])return!1;return!0}const s=(0,h.computed)(()=>{return a({...o.innerPagination,...i.modelPagination})}),t=(0,h.computed)(()=>{return 0===s.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/s.value.itemsPerPage))});function l(e){const t=a({...s.value,...e});r(o.innerPagination,t)||(i.modelPagination&&n("update:model-pagination",t),o.innerPagination=t)}function c(){void 0!==i.modelPagination&&l({total:e.value.length,totalPages:t.value})}return{samePagination:r,computedPagination:s,setPagination:l,updatePagination:c,computedPagesNumber:t}}function w(n,o,t,i){let a=0;async function e(t){const e=++a;if(n.iconsList=[],t)if("undefined"!==typeof window&&window.QIconPicker){const o=t.replace(/-([a-z])/g,e=>e[1].toUpperCase());window.QIconPicker.iconSet&&window.QIconPicker.iconSet[o]?n.iconsList=window.QIconPicker.iconSet[o].icons:(console.error("QIconPicker: no icon set loaded called "+t),console.error("Built-in icon sets require ESM bundler support for @quasar/extras lazy imports. With the UMD build, pass an icons array instead."))}else if(l.includes(t))try{const i=await d(t);e===a&&(n.iconsList=i.icons)}catch(e){console.error("QIconPicker: failed to load icon set called "+t),console.error(e)}else console.error("QIconPicker: cannot find icon set called "+t)}const r=(0,h.computed)(()=>{let e=[];return n.iconsList&&(e=s.value,o.modelPagination)&&0!==o.modelPagination.itemsPerPage&&(e=e.slice(t.value,i.value)),e}),s=(0,h.computed)(()=>{let e=n.iconsList;if(e&&void 0!==o.filter&&""!==o.filter&&null!==o.filter){const t=o.filter.toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t))}return e});return{loadIconSet:e,computedDisplayedIcons:r,computedFilteredIcons:s}}function b(o,e,i,n,t,a,r,s){const l=()=>{const e=i.value.page;e>1&&(n({page:e-1}),o.direction=y.PREV)},c=()=>{const{page:e,itemsPerPage:t}=i.value;a.value>0&&e*t<r.value.length&&(n({page:e+1}),o.direction=y.NEXT)},u=()=>{n({page:s.value})},m=()=>{n({page:0})};e({prevPage:l,nextPage:c,lastPage:u,firstPage:m,isLastPage:(0,h.computed)(()=>{return 0===a.value||i.value.page>=s.value}),isFirstPage:(0,h.computed)(()=>{return 1===i.value.page})})}var g=(0,h.defineComponent)({name:"QIconPicker",props:{...p},emits:["update:model-value","update:model-pagination"],setup(c,{slots:u,emit:m,expose:e}){const d=(0,h.ref)(null),p=(0,h.reactive)({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},width:"100",height:"100",direction:""}),t=(0,h.computed)(()=>{const{page:e,itemsPerPage:t}=f.value;return(e-1)*t}),o=(0,h.computed)(()=>{const{page:e,itemsPerPage:t}=f.value;return e*t}),{loadIconSet:i,computedDisplayedIcons:g,computedFilteredIcons:n}=w(p,c,t,o),{samePagination:a,computedPagination:f,setPagination:P,updatePagination:r,computedPagesNumber:s}=x(p,c,m,n);return b(p,e,f,P,t,o,n,s),(0,h.onMounted)(async()=>{c.iconSet?await i(c.iconSet):void 0!==c.icons&&c.icons.length>0&&(p.iconsList=c.icons),r()}),(0,h.watch)(()=>c.iconSet,async e=>{e&&(await i(e),r(),(0,h.nextTick)(()=>{P({page:1})}).catch(e=>console.error(e)),d.value)&&d.value.setScrollPosition("vertical",0)}),(0,h.watch)(()=>c.icons,()=>{void 0!==c.icons&&c.icons.length>0&&(p.iconsList=c.icons),r(),(0,h.nextTick)(()=>{P({page:1})}).catch(e=>console.error(e)),d.value&&d.value.setScrollPosition("vertical",0)}),(0,h.watch)(()=>c.filter,()=>{P({page:1,totalPages:s.value}),r()}),c.modelPagination&&(0,h.watch)(()=>c.modelPagination,(e,t)=>{a(t,e)||r()}),c.modelPagination&&((0,h.watch)(()=>c.modelPagination.itemsPerPage,()=>{r()}),(0,h.watch)(()=>c.modelPagination.page,()=>{r()})),()=>{function e(){if(c.modelPagination&&0===c.modelPagination.itemsPerPage)return"";const{page:t,totalPages:e}=f.value;return u.pagination?u.pagination(f.value):(0,h.h)(v.QPagination,{class:"q-icon-picker__pagination",...c.paginationProps,modelValue:t,max:e,"onUpdate:modelValue":e=>{c.animated&&(e>t?p.direction=y.NEXT:p.direction=y.PREV),P({page:e})}})}function t(){if(!0!==c.noFooter&&void 0!==c.modelPagination)return(0,h.h)("div",{class:"q-icon-picker__footer flex flex-center"},[u.footer?u.footer(f.value):e()])}function s(e){if(!0===c.tooltips)return()=>(0,h.h)(v.QTooltip,{},()=>e)}function o(e){const t=void 0!==e.prefix?e.prefix+" "+e.name:e.name,o=void 0!==e.icon?e.icon:t;if(u.icon)return u.icon(t);const i=t===c.modelValue,n=i?c.selectedTextColor:void 0,a=i?c.selectedColor:void 0,r=c.size||void 0;return(0,h.h)(v.QBtn,{id:e.name,unelevated:!0,dense:c.dense,noWrap:!0,size:r,textColor:n,color:a,icon:o,onClick:()=>m("update:model-value",t)},s(t))}function i(){return g.value.map(e=>o(e))}function n(){const e=()=>(0,h.h)("div",{key:f.value.page,class:"q-icon-picker__container col"},[...i()]);if(!0!==c.animated)return e;{const t="q-transition--"+("prev"===p.direction?c.transitionPrev:c.transitionNext);return()=>(0,h.h)(h.Transition,{name:t,appear:!0},e)}}function a(){return(0,h.h)(v.QScrollArea,{ref:d,style:{width:p.width+"px",height:p.height+"px"}},n())}function r(){return(0,h.h)("div",{class:"q-icon-picker__body col column"},[a(),(0,h.h)(v.QResizeObserver,{onResize:e=>{p.width=e.width,p.height=e.height}})])}const l=["q-icon-picker","column"];return c.color&&l.push("bg-"+c.color),c.textColor&&l.push("text-"+c.textColor),(0,h.h)("div",{class:l.join(" ")},[r(),t()])}}});const f="3.0.0-beta.4";function P(e){e.component(String(g.name),g)}e.QIconPicker=g,e.install=P,e.version=f});
+(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,v,h){Object.defineProperty(e,Symbol.toStringTag,{value:"Module"});const l=["material-icons","material-icons-outlined","material-icons-round","material-icons-sharp","material-symbols-outlined","material-symbols-rounded","material-symbols-sharp","ionicons-v8","mdi-v7","fontawesome-v7","eva-icons","themify","line-awesome","bootstrap-icons"];function n(e){return e.replace(/([A-Z]+)([A-Z][a-z])/g,"$1-$2").replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}function i(e){return n(e).replace(/-/g,"_")}function r(e,t){if(!1===e.startsWith(t))throw new Error(`Icon export ${e} does not start with expected prefix `+t);return e.slice(t.length)}function t(o,a=""){return(e,t)=>({name:""+a+n(r(e,o)),icon:t})}function o(o,a=""){return(e,t)=>({name:""+a+i(r(e,o)),icon:t})}function s(e){return Array.isArray(e)?e:e.default}function c(e){return Object.fromEntries(Object.entries(e).filter(e=>"string"===typeof e[1]))}function a(o,e,t){const a=s(e),i=new Set(a),n=c(t),r=u[o];return{name:o,icons:a.map(e=>{const t=n[e];if("string"!==typeof t)throw new Error(`QIconPicker: ${o} is missing @quasar/extras export `+e);return r.createEntry(e,t,i)})}}const u={"material-icons":{createEntry:o("mat")},"material-icons-outlined":{createEntry:o("outlined","o_")},"material-icons-round":{createEntry:o("round","r_")},"material-icons-sharp":{createEntry:o("sharp","s_")},"material-symbols-outlined":{createEntry:o("symOutlined","sym_o_")},"material-symbols-rounded":{createEntry:o("symRounded","sym_r_")},"material-symbols-sharp":{createEntry:o("symSharp","sym_s_")},"mdi-v7":{createEntry:t("mdi","mdi-")},"ionicons-v8":{createEntry:(e,t)=>({name:e,icon:t})},"fontawesome-v7":{createEntry:(e,t)=>({name:"fa-"+n(e.slice(3)),icon:t,prefix:e.slice(0,3)})},"line-awesome":{createEntry:(e,t,o)=>{const a=r(e,"la"),i=a.endsWith("Solid");return{name:"la-"+n(i?a.slice(0,-5):a),icon:t,prefix:i?"las":o.has(e+"Solid")?"lar":"lab"}}},"eva-icons":{createEntry:t("eva","eva-")},themify:{createEntry:t("ti","ti-")},"bootstrap-icons":{createEntry:t("bi","bi-")}},m={"material-icons":()=>Promise.all([import("@quasar/extras/material-icons/icons.json"),import("@quasar/extras/material-icons")]).then(([e,t])=>a("material-icons",e,t)),"material-icons-outlined":()=>Promise.all([import("@quasar/extras/material-icons-outlined/icons.json"),import("@quasar/extras/material-icons-outlined")]).then(([e,t])=>a("material-icons-outlined",e,t)),"material-icons-round":()=>Promise.all([import("@quasar/extras/material-icons-round/icons.json"),import("@quasar/extras/material-icons-round")]).then(([e,t])=>a("material-icons-round",e,t)),"material-icons-sharp":()=>Promise.all([import("@quasar/extras/material-icons-sharp/icons.json"),import("@quasar/extras/material-icons-sharp")]).then(([e,t])=>a("material-icons-sharp",e,t)),"material-symbols-outlined":()=>Promise.all([import("@quasar/extras/material-symbols-outlined/icons.json"),import("@quasar/extras/material-symbols-outlined")]).then(([e,t])=>a("material-symbols-outlined",e,t)),"material-symbols-rounded":()=>Promise.all([import("@quasar/extras/material-symbols-rounded/icons.json"),import("@quasar/extras/material-symbols-rounded")]).then(([e,t])=>a("material-symbols-rounded",e,t)),"material-symbols-sharp":()=>Promise.all([import("@quasar/extras/material-symbols-sharp/icons.json"),import("@quasar/extras/material-symbols-sharp")]).then(([e,t])=>a("material-symbols-sharp",e,t)),"ionicons-v8":()=>Promise.all([import("@quasar/extras/ionicons-v8/icons.json"),import("@quasar/extras/ionicons-v8")]).then(([e,t])=>a("ionicons-v8",e,t)),"mdi-v7":()=>Promise.all([import("@quasar/extras/mdi-v7/icons.json"),import("@quasar/extras/mdi-v7")]).then(([e,t])=>a("mdi-v7",e,t)),"fontawesome-v7":()=>Promise.all([import("@quasar/extras/fontawesome-v7/icons.json"),import("@quasar/extras/fontawesome-v7")]).then(([e,t])=>a("fontawesome-v7",e,t)),"line-awesome":()=>Promise.all([import("@quasar/extras/line-awesome/icons.json"),import("@quasar/extras/line-awesome")]).then(([e,t])=>a("line-awesome",e,t)),"eva-icons":()=>Promise.all([import("@quasar/extras/eva-icons/icons.json"),import("@quasar/extras/eva-icons")]).then(([e,t])=>a("eva-icons",e,t)),themify:()=>Promise.all([import("@quasar/extras/themify/icons.json"),import("@quasar/extras/themify")]).then(([e,t])=>a("themify",e,t)),"bootstrap-icons":()=>Promise.all([import("@quasar/extras/bootstrap-icons/icons.json"),import("@quasar/extras/bootstrap-icons")]).then(([e,t])=>a("bootstrap-icons",e,t))};function d(e){return m[e]()}const p={modelValue:String,iconSet:{type:String,validator:e=>[...l,""].includes(e),default:""},icons:Array,filter:String,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 x(o,a,i,e){function n(e){return e.page<1&&(e.page=1),(void 0===e.itemsPerPage||e.itemsPerPage<1)&&(e.itemsPerPage=0),e}function r(e,t){for(var o in t)if(t[o]!==e[o])return!1;return!0}const s=(0,v.computed)(()=>{return n({...o.innerPagination,...a.modelPagination})}),t=(0,v.computed)(()=>{return 0===s.value.itemsPerPage?1:Math.max(1,Math.ceil(e.value.length/s.value.itemsPerPage))});function l(e){const t=n({...s.value,...e});r(o.innerPagination,t)||(a.modelPagination&&i("update:model-pagination",t),o.innerPagination=t)}function c(){void 0!==a.modelPagination&&l({total:e.value.length,totalPages:t.value})}return{samePagination:r,computedPagination:s,setPagination:l,updatePagination:c,computedPagesNumber:t}}function w(i,o,t,a){let n=0;async function e(t){const e=++n;if(i.iconsList=[],t)if("undefined"!==typeof window&&window.QIconPicker){const o=t.replace(/-([a-z])/g,e=>e[1].toUpperCase());window.QIconPicker.iconSet&&window.QIconPicker.iconSet[o]?i.iconsList=window.QIconPicker.iconSet[o].icons:(console.error("QIconPicker: no icon set loaded called "+t),console.error("Built-in icon sets require ESM bundler support for @quasar/extras lazy imports. With the UMD build, pass an icons array instead."))}else if(l.includes(t))try{const a=await d(t);e===n&&(i.iconsList=a.icons)}catch(e){console.error("QIconPicker: failed to load icon set called "+t),console.error(e)}else console.error("QIconPicker: cannot find icon set called "+t)}const r=(0,v.computed)(()=>{let e=[];return i.iconsList&&(e=s.value,o.modelPagination)&&0!==o.modelPagination.itemsPerPage&&(e=e.slice(t.value,a.value)),e}),s=(0,v.computed)(()=>{let e=i.iconsList;if(e&&void 0!==o.filter&&""!==o.filter&&null!==o.filter){const t=o.filter.toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t))}return e});return{loadIconSet:e,computedDisplayedIcons:r,computedFilteredIcons:s}}function b(o,a,i,e,n,r,t){const s=()=>{const e=a.value.page;e>1&&(i({page:e-1}),o.direction=y.PREV)},l=()=>{const{page:e,itemsPerPage:t}=a.value;n.value>0&&e*t<r.value.length&&(i({page:e+1}),o.direction=y.NEXT)},c=()=>{i({page:t.value})},u=()=>{i({page:0})};return{prevPage:s,nextPage:l,lastPage:c,firstPage:u,isLastPage:(0,v.computed)(()=>{return 0===n.value||a.value.page>=t.value}),isFirstPage:(0,v.computed)(()=>{return 1===a.value.page})}}var g=(0,v.defineComponent)({name:"QIconPicker",slots:Object,props:{...p},emits:["update:model-value","update:model-pagination"],setup(c,{slots:u,emit:m,expose:e}){const d=(0,v.ref)(null),p=(0,v.reactive)({iconsList:[],innerPagination:{page:1,itemsPerPage:0,totalPages:0},width:"100",height:"100",direction:""}),t=(0,v.computed)(()=>{const{page:e,itemsPerPage:t}=P.value;return(e-1)*t}),o=(0,v.computed)(()=>{const{page:e,itemsPerPage:t}=P.value;return e*t}),{loadIconSet:a,computedDisplayedIcons:g,computedFilteredIcons:i}=w(p,c,t,o),{samePagination:n,computedPagination:P,setPagination:f,updatePagination:r,computedPagesNumber:s}=x(p,c,m,i),l=b(p,P,f,t,o,i,s);return e({prevPage:l.prevPage,nextPage:l.nextPage,lastPage:l.lastPage,firstPage:l.firstPage,isLastPage:l.isLastPage,isFirstPage:l.isFirstPage}),(0,v.onMounted)(async()=>{c.iconSet?await a(c.iconSet):void 0!==c.icons&&c.icons.length>0&&(p.iconsList=c.icons),r()}),(0,v.watch)(()=>c.iconSet,async e=>{e&&(await a(e),r(),(0,v.nextTick)(()=>{f({page:1})}).catch(e=>console.error(e)),d.value)&&d.value.setScrollPosition("vertical",0)}),(0,v.watch)(()=>c.icons,()=>{void 0!==c.icons&&c.icons.length>0&&(p.iconsList=c.icons),r(),(0,v.nextTick)(()=>{f({page:1})}).catch(e=>console.error(e)),d.value&&d.value.setScrollPosition("vertical",0)}),(0,v.watch)(()=>c.filter,()=>{f({page:1,totalPages:s.value}),r()}),c.modelPagination&&(0,v.watch)(()=>c.modelPagination,(e,t)=>{n(t,e)||r()}),c.modelPagination&&((0,v.watch)(()=>c.modelPagination.itemsPerPage,()=>{r()}),(0,v.watch)(()=>c.modelPagination.page,()=>{r()})),()=>{function e(){if(c.modelPagination&&0===c.modelPagination.itemsPerPage)return"";const{page:t,totalPages:e}=P.value;return u.pagination?u.pagination(P.value):(0,v.h)(h.QPagination,{class:"q-icon-picker__pagination",...c.paginationProps,modelValue:t,max:e,"onUpdate:modelValue":e=>{c.animated&&(e>t?p.direction=y.NEXT:p.direction=y.PREV),f({page:e})}})}function t(){if(!0!==c.noFooter&&void 0!==c.modelPagination)return(0,v.h)("div",{class:"q-icon-picker__footer flex flex-center"},[u.footer?u.footer(P.value):e()])}function s(e){if(!0===c.tooltips)return()=>(0,v.h)(h.QTooltip,{},()=>e)}function o(e){const t=void 0!==e.prefix?e.prefix+" "+e.name:e.name,o=void 0!==e.icon?e.icon:t;if(u.icon)return u.icon(t);const a=t===c.modelValue,i=a?c.selectedTextColor:void 0,n=a?c.selectedColor:void 0,r=c.size||void 0;return(0,v.h)(h.QBtn,{id:e.name,unelevated:!0,dense:c.dense,noWrap:!0,size:r,textColor:i,color:n,icon:o,onClick:()=>m("update:model-value",t)},s(t))}function a(){return g.value.map(e=>o(e))}function i(){const e=()=>(0,v.h)("div",{key:P.value.page,class:"q-icon-picker__container col"},[...a()]);if(!0!==c.animated)return e;{const t="q-transition--"+("prev"===p.direction?c.transitionPrev:c.transitionNext);return()=>(0,v.h)(v.Transition,{name:t,appear:!0},e)}}function n(){return(0,v.h)(h.QScrollArea,{ref:d,style:{width:p.width+"px",height:p.height+"px"}},i())}function r(){return(0,v.h)("div",{class:"q-icon-picker__body col column"},[n(),(0,v.h)(h.QResizeObserver,{onResize:e=>{p.width=e.width,p.height=e.height}})])}const l=["q-icon-picker","column"];return c.color&&l.push("bg-"+c.color),c.textColor&&l.push("text-"+c.textColor),(0,v.h)("div",{class:l.join(" ")},[r(),t()])}}});const P="3.0.0";function f(e){e.component(String(g.name),g)}e.QIconPicker=g,e.install=f,e.version=P});