@quasar/quasar-ui-qiconpicker 2.0.4 → 2.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.umd.js DELETED
@@ -1,570 +0,0 @@
1
- /*!
2
- * @quasar/quasar-ui-qiconpicker v2.0.4
3
- * (c) 2021 Jeff Galbraith <jeff@quasar.dev>
4
- * Released under the MIT License.
5
- */
6
-
7
- (function (global, factory) {
8
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('quasar')) :
9
- typeof define === 'function' && define.amd ? define(['exports', 'vue', 'quasar'], factory) :
10
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.QIconPicker = {}, global.Vue, global.Quasar));
11
- })(this, (function (exports, vue, quasar) { 'use strict';
12
-
13
- /**
14
- * QIconPicker Properties
15
- */
16
- var useIconPickerProps = {
17
- modelValue: String,
18
- iconSet: {
19
- type: String,
20
- validator: function (v) { return [
21
- 'material-icons',
22
- 'material-icons-outlined',
23
- 'material-icons-round',
24
- 'material-icons-sharp',
25
- 'ionicons-v4',
26
- 'mdi-v4',
27
- 'mdi-v5',
28
- 'mdi-v6',
29
- 'fontawesome-v5',
30
- 'eva-icons',
31
- 'themify',
32
- 'line-awesome',
33
- 'bootstrap-icons',
34
- ''
35
- ].includes(v); },
36
- default: ''
37
- },
38
- icons: Array,
39
- filter: String,
40
- tags: Array,
41
- dense: Boolean,
42
- tooltips: Boolean,
43
- noFooter: Boolean,
44
- size: {
45
- type: String,
46
- default: 'inherit'
47
- },
48
- color: String,
49
- textColor: String,
50
- selectedColor: {
51
- type: String,
52
- default: 'primary'
53
- },
54
- selectedTextColor: {
55
- type: String,
56
- default: 'grey-1'
57
- },
58
- paginationProps: {
59
- type: Object,
60
- default: function () { return ({
61
- maxPages: 5,
62
- input: true
63
- }); }
64
- },
65
- modelPagination: Object,
66
- animated: Boolean,
67
- transitionPrev: {
68
- type: String,
69
- default: 'slide-right'
70
- },
71
- transitionNext: {
72
- type: String,
73
- default: 'slide-left'
74
- }
75
- };
76
-
77
- var direction = {
78
- NEXT: 'next',
79
- PREV: 'prev'
80
- };
81
-
82
- /**
83
- * Pagination
84
- */
85
- function useIconPickerPagination(data, props, emit, computedFilteredIcons) {
86
-
87
- function fixPagination(p) {
88
- if (p.page < 1) {
89
- p.page = 1;
90
- }
91
- if (p.itemsPerPage === void 0 || p.itemsPerPage < 1) {
92
- p.itemsPerPage = 0; // all
93
- }
94
- return p
95
- }
96
-
97
- // returns true if the pagination is the same,
98
- // otherwise returns false if it has changed
99
- function samePagination(oldPag, newPag) {
100
- for (var prop in newPag) {
101
- if (newPag[ prop ] !== oldPag[ prop ]) {
102
- return false
103
- }
104
- }
105
- return true
106
- }
107
-
108
- var computedPagination = vue.computed(function () {
109
- return fixPagination(Object.assign({}, data.innerPagination,
110
- props.modelPagination))
111
- });
112
-
113
- var computedPagesNumber = vue.computed(function () {
114
- return computedPagination.value.itemsPerPage === 0 ? 1
115
- : Math.max(1, Math.ceil(computedFilteredIcons.value.length / computedPagination.value.itemsPerPage))
116
- });
117
-
118
- function setPagination(val) {
119
- var newPagination = fixPagination(Object.assign({}, computedPagination.value,
120
- val));
121
-
122
- if (!samePagination(data.innerPagination, newPagination)) {
123
- if (props.modelPagination) {
124
- emit('update:model-pagination', newPagination);
125
- }
126
- data.innerPagination = newPagination;
127
- }
128
- }
129
-
130
- function updatePagination() {
131
- if (props.modelPagination !== void 0) {
132
- setPagination({ total: computedFilteredIcons.value.length, totalPages: computedPagesNumber.value });
133
- }
134
- }
135
-
136
- return {
137
- samePagination: samePagination,
138
- computedPagination: computedPagination,
139
- setPagination: setPagination,
140
- updatePagination: updatePagination,
141
- computedPagesNumber: computedPagesNumber
142
- }
143
- }
144
-
145
- /**
146
- * Icons
147
- */
148
- function useIconPickerIcons(data, props, computedFirstItemIndex, computedLastItemIndex) {
149
-
150
- function loadIconSet(iconSet) {
151
- data.iconsList = [];
152
- if (iconSet) {
153
- // detect if UMD version is installed
154
- if (window.QIconPicker) {
155
- var name = iconSet.replace(/-([a-z])/g, function (g) { return g[ 1 ].toUpperCase(); });
156
- if (window.QIconPicker.iconSet && window.QIconPicker.iconSet[ name ]) {
157
- data.iconsList = window.QIconPicker.iconSet[ name ].icons;
158
- }
159
- else {
160
- console.error(("QIconPicker: no icon set loaded called " + iconSet));
161
- console.error('Be sure to load the UMD version of the icon set in a script tag before using QIconPicker UMD version');
162
- }
163
- }
164
- else {
165
- try {
166
- data.iconsList = require(("@quasar/quasar-ui-qiconpicker/src/components/icon-set/" + iconSet + ".js")).default.icons;
167
- }
168
- catch (e) {
169
- console.error(("QIconPicker: cannot find icon set found called " + iconSet));
170
- }
171
- }
172
- }
173
- console.info(("Loaded " + (data.iconsList.length) + " icons."));
174
- }
175
-
176
- var computedDisplayedIcons = vue.computed(function () {
177
- var icons = [];
178
- if (data.iconsList) {
179
- icons = computedFilteredIcons.value;
180
-
181
- // should the icons be paged?
182
- if (props.modelPagination && props.modelPagination.itemsPerPage !== 0) {
183
- icons = icons.slice(computedFirstItemIndex.value, computedLastItemIndex.value);
184
- }
185
- }
186
- return icons
187
- });
188
-
189
- var computedFilteredIcons = vue.computed(function () {
190
- var icons = data.iconsList;
191
- if (icons) {
192
- if (props.tags !== void 0 && props.tags !== '' && props.tags !== null && props.tags.length > 0) {
193
- icons = icons.filter(function (icon) {
194
- return icon.tags.filter(function (tag) { return props.tags.includes(tag); }).length > 0
195
- });
196
- }
197
- if (props.filter !== void 0 && props.filter !== '' && props.filter !== null) {
198
- icons = icons.filter(function (icon) { return icon.name.includes(props.filter); });
199
- }
200
- }
201
- return icons
202
- });
203
-
204
- function categories() {
205
- var t = [];
206
- data.iconsList.forEach(function (icon) {
207
- var tags = icon.tags;
208
- if (tags && tags.length > 0) {
209
- tags.forEach(function (tag) {
210
- if (t.includes(tag) !== true) {
211
- t.push(tag);
212
- }
213
- });
214
- }
215
- });
216
- t.sort();
217
- data.categories = t;
218
- return true
219
- }
220
-
221
- return {
222
- loadIconSet: loadIconSet,
223
- computedDisplayedIcons: computedDisplayedIcons,
224
- computedFilteredIcons: computedFilteredIcons,
225
- categories: categories
226
- }
227
- }
228
-
229
- /**
230
- * Exposes api functions
231
- */
232
- function exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber) {
233
- // goes to previous page
234
- var prevPage = function () {
235
- var ref = computedPagination.value;
236
- var page = ref.page;
237
- if (page > 1) {
238
- setPagination({ page: page - 1 });
239
- data.direction = direction.PREV;
240
- }
241
- };
242
-
243
- // goes to next page
244
- var nextPage = function () {
245
- var ref = computedPagination.value;
246
- var page = ref.page;
247
- var itemsPerPage = ref.itemsPerPage;
248
- if (computedLastItemIndex.value > 0 && page * itemsPerPage < computedFilteredIcons.value.length) {
249
- setPagination({ page: page + 1 });
250
- data.direction = direction.NEXT;
251
- }
252
- };
253
-
254
- // goes to last page
255
- var lastPage = function () {
256
- setPagination({ page: computedPagesNumber.value });
257
- };
258
-
259
- // goes to first page
260
- var firstPage = function () {
261
- setPagination({ page: 0 });
262
- };
263
-
264
- // checks if we are on the last page
265
- var isLastPage = vue.computed(function () {
266
- return computedLastItemIndex.value === 0
267
- ? true
268
- : computedPagination.value.page >= computedPagesNumber.value
269
- });
270
-
271
-
272
- // checks if we are on the first page
273
- var isFirstPage = vue.computed(function () {
274
- return computedPagination.value.page === 1
275
- });
276
-
277
- expose({
278
- prevPage: prevPage,
279
- nextPage: nextPage,
280
- lastPage: lastPage,
281
- firstPage: firstPage,
282
- isLastPage: isLastPage,
283
- isFirstPage: isFirstPage
284
- });
285
- }
286
-
287
-
288
- var QIconPicker = vue.defineComponent({
289
- name: 'QIconPicker',
290
-
291
- props: Object.assign({}, useIconPickerProps),
292
-
293
- emits: [
294
- 'update:model-value',
295
- 'update:tags',
296
- 'update:model-pagination'
297
- ],
298
-
299
- setup: function setup(props, ref$1) {
300
- var slots = ref$1.slots;
301
- var emit = ref$1.emit;
302
- var expose = ref$1.expose;
303
-
304
- var scrollAreaRef = vue.ref(null);
305
- var data = vue.reactive({
306
- iconsList: [],
307
- innerPagination: {
308
- page: 1,
309
- itemsPerPage: 0,
310
- totalPages: 0
311
- },
312
- categories: [],
313
- width: '100',
314
- height: '100',
315
- direction: ''
316
- });
317
-
318
- // index of first item on a page
319
- var computedFirstItemIndex = vue.computed(function () {
320
- var ref = computedPagination.value;
321
- var page = ref.page;
322
- var itemsPerPage = ref.itemsPerPage;
323
- return (page - 1) * itemsPerPage
324
- });
325
-
326
- // index of last item on a page
327
- var computedLastItemIndex = vue.computed(function () {
328
- var ref = computedPagination.value;
329
- var page = ref.page;
330
- var itemsPerPage = ref.itemsPerPage;
331
- return page * itemsPerPage
332
- });
333
-
334
- var ref$2 = useIconPickerIcons(data, props, computedFirstItemIndex, computedLastItemIndex);
335
- var loadIconSet = ref$2.loadIconSet;
336
- var computedDisplayedIcons = ref$2.computedDisplayedIcons;
337
- var computedFilteredIcons = ref$2.computedFilteredIcons;
338
- var categories = ref$2.categories;
339
-
340
- var ref$3 = useIconPickerPagination(data, props, emit, computedFilteredIcons);
341
- var samePagination = ref$3.samePagination;
342
- var computedPagination = ref$3.computedPagination;
343
- var setPagination = ref$3.setPagination;
344
- var updatePagination = ref$3.updatePagination;
345
- var computedPagesNumber = ref$3.computedPagesNumber;
346
-
347
- exposeIconPickerApi(data, expose, computedPagination, setPagination, computedFirstItemIndex, computedLastItemIndex, computedFilteredIcons, computedPagesNumber);
348
-
349
- vue.onMounted(function () {
350
- if (props.iconSet) {
351
- loadIconSet(props.iconSet);
352
- }
353
- else if (props.icons !== void 0 && props.icons.length > 0) {
354
- data.iconsList = props.icons;
355
- }
356
- updatePagination();
357
- });
358
-
359
-
360
- vue.watch(function () { return props.iconSet; }, function (val) {
361
- if (val) {
362
- loadIconSet(val);
363
- updatePagination();
364
- vue.nextTick(function () {
365
- // whenever the icon set changes, it resets pagination page to page 1
366
- setPagination({ page: 1 });
367
- }).catch(function (e) { return console.error(e); });
368
- // scroll to top of QScrollArea, if applicable
369
- if(scrollAreaRef.value) {
370
- scrollAreaRef.value.setScrollPosition(0);
371
- }
372
- }
373
- });
374
-
375
- vue.watch(function () { return props.icons; }, function (val) {
376
- if (props.icons !== void 0 && props.icons.length > 0) {
377
- data.iconsList = props.icons;
378
- }
379
- updatePagination();
380
- vue.nextTick(function () {
381
- // whenever the icon set changes, it resets pagination page to page 1
382
- setPagination({ page: 1 });
383
- }).catch(function (e) { return console.error(e); });
384
- // scroll to top of QScrollArea, if applicable
385
- if(scrollAreaRef.value) {
386
- scrollAreaRef.value.setScrollPosition(0);
387
- }
388
- });
389
-
390
- vue.watch(function () { return props.filter; }, function () {
391
- // whenever the filter changes, it resets pagination page to page 1
392
- setPagination({ page: 1, totalPages: computedPagesNumber.value });
393
- updatePagination();
394
- });
395
-
396
- vue.watch(function () { return props.tags; }, function (val) {
397
- // whenever the tags change, it resets pagination page to page 1
398
- setPagination({ page: 1, totalPages: computedPagesNumber.value });
399
- updatePagination();
400
- });
401
-
402
- if (props.modelPagination) {
403
- vue.watch(function () { return props.modelPagination; }, function (newVal, oldVal) {
404
- if (!samePagination(oldVal, newVal)) {
405
- updatePagination();
406
- }
407
- });
408
- }
409
-
410
- if (props.modelPagination) {
411
- vue.watch(function () { return props.modelPagination.itemsPerPage; }, function () {
412
- updatePagination();
413
- });
414
-
415
- vue.watch(function () { return props.modelPagination.page; }, function () {
416
- updatePagination();
417
- });
418
- }
419
-
420
- return function () {
421
-
422
- function renderPagination() {
423
- if (props.modelPagination && props.modelPagination.itemsPerPage === 0) { return '' }
424
- var slot = (slots.pagination && slots.pagination());
425
- var ref = computedPagination.value;
426
- var page = ref.page;
427
- var totalPages = ref.totalPages;
428
-
429
- return slot || vue.h(quasar.QPagination, Object.assign({}, {class: 'q-icon-picker__pagination'},
430
- props.paginationProps,
431
- {modelValue: page,
432
- max: totalPages,
433
- 'onUpdate:modelValue': function (value) {
434
- if (props.animated) {
435
- if (value > page) {
436
- data.direction = direction.NEXT;
437
- }
438
- else {
439
- data.direction = direction.PREV;
440
- }
441
- }
442
- setPagination({ page: value });
443
- }}))
444
- }
445
-
446
- function renderFooter() {
447
- if (props.noFooter !== true && props.modelPagination !== void 0) {
448
- var slot = (slots.footer && slots.footer());
449
-
450
- return vue.h('div', {
451
- class: 'q-icon-picker__footer flex flex-center'
452
- }, [
453
- slot ? slot(computedPagination.value) : renderPagination()
454
- ])
455
- }
456
- }
457
-
458
- function renderTooltip(name) {
459
- if (props.tooltips === true) {
460
- return function () { return vue.h(quasar.QTooltip, {}, function () { return name; }); }
461
- }
462
- }
463
-
464
- function renderIcon(icon) {
465
- var name = (icon.prefix !== void 0 ? icon.prefix + ' ' + icon.name : icon.name);
466
-
467
- if (slots.icon && slots.icon()) {
468
- return slots.icon(name)
469
- }
470
- var isSelected = name === props.modelValue;
471
- var textColor = isSelected ? props.selectedTextColor : undefined;
472
- var color = isSelected ? props.selectedColor : undefined;
473
- var size = props.size ? props.size : undefined;
474
-
475
- return vue.h(quasar.QBtn, {
476
- id: name,
477
- unelevated: true,
478
- dense: props.dense,
479
- noWrap: true,
480
- size: size,
481
- textColor: textColor,
482
- color: color,
483
- icon: name,
484
- onClick: function () { return emit('update:model-value', name); },
485
- }, renderTooltip(name))
486
- }
487
-
488
- function renderIcons() {
489
- return computedDisplayedIcons.value.map(function (icon) { return renderIcon(icon); })
490
- }
491
-
492
- function renderContainer() {
493
- var container = function () { return vue.h('div', {
494
- key: computedPagination.value.page,
495
- class: 'q-icon-picker__container col'
496
- }, [].concat( renderIcons() )); };
497
-
498
- if (props.animated === true) {
499
- var transition = 'q-transition--' + (data.direction === 'prev' ? props.transitionPrev : props.transitionNext);
500
- return function () { return vue.h(vue.Transition, {
501
- name: transition,
502
- appear: true
503
- }, container); }
504
- }
505
-
506
- return container
507
- }
508
-
509
-
510
- function renderScrollArea() {
511
- return vue.h(quasar.QScrollArea, {
512
- ref: scrollAreaRef,
513
- style: {
514
- width: data.width + 'px',
515
- height: data.height + 'px'
516
- }
517
- }, renderContainer())
518
- }
519
-
520
- function renderBody() {
521
- return vue.h('div', {
522
- class: 'q-icon-picker__body col column'
523
- }, [
524
- renderScrollArea(),
525
- vue.h(quasar.QResizeObserver, {
526
- onResize: function (size) {
527
- data.width = size.width;
528
- data.height = size.height;
529
- }
530
- })
531
- ])
532
- }
533
-
534
- var classes = [
535
- 'q-icon-picker',
536
- 'column'
537
- ];
538
- if (props.color) { classes.push('bg-' + props.color); }
539
- if (props.textColor) { classes.push('text-' + props.textColor); }
540
-
541
- var picker = vue.h('div', {
542
- class: classes.join(' ')
543
- }, [
544
- renderBody(),
545
- renderFooter()
546
- ]);
547
-
548
- vue.nextTick(function () {
549
- categories();
550
- emit('update:tags', data.categories);
551
- }).catch(function (e) { return console.error(e); });
552
-
553
- return picker
554
- }
555
- }
556
- });
557
-
558
- var version = '2.0.4';
559
-
560
- function install (app) {
561
- app.component(QIconPicker.name, QIconPicker);
562
- }
563
-
564
- exports.QIconPicker = QIconPicker;
565
- exports.install = install;
566
- exports.version = version;
567
-
568
- Object.defineProperty(exports, '__esModule', { value: true });
569
-
570
- }));
@@ -1,6 +0,0 @@
1
- /*!
2
- * @quasar/quasar-ui-qiconpicker v2.0.4
3
- * (c) 2021 Jeff Galbraith <jeff@quasar.dev>
4
- * Released under the MIT License.
5
- */
6
- (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.4";function i(e){e.component(t.name,t)}e.QIconPicker=t,e.install=i,e.version=n,Object.defineProperty(e,"__esModule",{value:!0})});