diff --git a/dist/icon-picker.min.js b/dist/icon-picker.min.js index 131b224..9723f64 100644 --- a/dist/icon-picker.min.js +++ b/dist/icon-picker.min.js @@ -1,3 +1,3 @@ -/*! Icon Picker 1.2.1 MIT | https://github.com/AppoloDev/icon-picker */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.IconPicker=t():e.IconPicker=t()}(self,(()=>(()=>{"use strict";var e={d:(t,i)=>{for(var n in i)e.o(i,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:i[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};function i(e,t,i,n){Array.isArray(t)||(t=[t]),Array.isArray(i)||(i=[i]);for(const s of t)for(const t of i)s[e](t,n);return[].slice.call(arguments,1)}e.d(t,{default:()=>m});const n=i.bind(null,"addEventListener"),s=i.bind(null,"removeEventListener");function o(e){if(window.DOMParser){return(new DOMParser).parseFromString(e,"text/html").body.firstElementChild}const t=document.createElement("div");return t.innerHTML=e,t.firstElementChild}function r(e){return e&&"object"==typeof e&&!Array.isArray(e)}function a(e,t){let i=Object.assign({},e);return r(e)&&r(t)&&Object.keys(t).forEach((n=>{r(t[n])?n in e?i[n]=a(e[n],t[n]):Object.assign(i,{[n]:t[n]}):Object.assign(i,{[n]:t[n]})})),i}function l(e,t){return Object.keys(e).find((i=>e[i]===t))}const c=e=>{const{theme:t,i18n:i,closeOnSelect:n}=e,s=function(e){const t=(e,t)=>{const i=e.getAttribute(t);return e.removeAttribute(t),i},i=(e,n={})=>{const s=t(e,"data-element");s&&(n[s]=e);for(const s of Array.from(e.children)){const e=t(s,"data-interaction");e&&e&&(n[e]=s),i(s,n)}return n};return i(o(e))}(`\n \n `);return t.includes("bootstrap")&&(s.save?.classList.add("btn","btn-primary"),s.search.classList.add("form-control")),s};const u="https://raw.githubusercontent.com/iconify/icon-sets/master/json",d={"Material Design Icons":{key:"mdi",prefix:"mdi mdi-",url:`${u}/mdi.json`},"FontAwesome Brands 6":{key:"fa6-brands",prefix:"fab fa-",url:`${u}/fa6-brands.json`},"FontAwesome Solid 6":{key:"fa6-solid",prefix:"fas fa-",url:`${u}/fa6-solid.json`},"FontAwesome Regular 6":{key:"fa6-regular",prefix:"far fa-",url:`${u}/fa6-regular.json`},Iconoir:{key:"iconoir",prefix:"iconoir-",url:`${u}/iconoir.json`}};function h(e){let t=Object.create({});return Array.isArray(e)&&e.forEach((e=>{!function(e){return d.hasOwnProperty(e)}(e)?e.key&&(t[e.key]=e):t[d[e].key]=d[e]})),t}class m{static DEFAULT_OPTIONS={theme:"default",closeOnSelect:!0,defaultValue:null,iconSource:[],i18n:{"input:placeholder":"Search icon…","text:title":"Select icon","text:empty":"No results found…","btn:save":"Save"}};_eventListener={select:[],save:[],show:[],clear:[],hide:[]};constructor(e,t={}){this.options=a(m.DEFAULT_OPTIONS,t),this.element=e,this._preBuild(),this.element&&this.options.iconSource.length>0?(this._binEvents(),this._renderdIcons(),this._createModal()):this._catchError("iconSourceMissing")}_preBuild(){var e;this.element=(e=this.element)instanceof HTMLElement?e:"string"==typeof e?document.querySelector(e):null,this.root=c(this.options),!Array.isArray(this.options.iconSource)&&this.options.iconSource.length>0&&(this.options.iconSource=[this.options.iconSource])}_binEvents(){const{options:e,root:t,element:i}=this;let s=[];var r,a,l;this._eventBindings=[n(i,"click",(()=>this.show())),n(t.close,"click",(()=>this.hide())),n(t.modal,"click",(e=>{e.target===t.modal&&this.hide()})),n(t.search,"keyup",(r=i=>{const n=this.availableIcons.filter((e=>e.value.includes(i.target.value.toLowerCase())||e.categories?.filter((e=>e.includes(i.target.value.toLowerCase()))).length>0));s.length||(s=document.querySelectorAll(".icon-element")),s.forEach((e=>{e.hidden=!0,n.forEach((t=>{e.classList.contains(t.value)&&(e.hidden=!1)}))}));const r=t.content.querySelector(".is-empty");n.length>0?r&&r.remove():r||t.content.appendChild(o(`
${e.i18n["text:empty"]}
`))},a=250,function(){var e=arguments,t=this;clearTimeout(l),l=setTimeout((function(){r.apply(t,e)}),a)}))],e.closeOnSelect||this._eventBindings.push(n(t.save,"click",(()=>this._onSave())))}hide(){return!!this.isOpen()&&(this.root.modal.classList.remove("is-visible"),this._emit("hide"),this)}show(){return!this.isOpen()&&(this.root.modal.classList.add("is-visible"),this._emit("show"),this)}clear(){this.initialized&&this.currentlySelectName&&(this.currentlySelectName=null,this._emit("clear"))}isOpen(){return this.root.modal.classList.contains("is-visible")}destroy(e=!0){this.initialized=!1,this._eventBindings.forEach((e=>s(...e))),e&&Object.keys(this).forEach((e=>delete this[e]))}_emit(e,...t){this._eventListener[e].forEach((e=>e(...t,this)))}on(e,t){return void 0!==this._eventListener[e]&&(this._eventListener[e].push(t),this)}off(e,t){const i=this._eventListener[e]||[],n=i.indexOf(t);return~n&&i.splice(n,1),this}_createModal(){document.body.appendChild(this.root.modal),this.initialized=!0}_onSave(){this._setValueInput(),this.hide(),this._emit("save",this.emitValues)}async _renderdIcons(){const{root:e,options:t}=this;let i=null,n=null,s=null;if(this.availableIcons=[],e.content.innerHTML="",(await this._getIcons()).forEach((o=>{let r=o.iconFormat?o.iconFormat:"svg";for(const[a,c]of Object.entries(o.icons)){const u=document.createElement("button");if(u.title=a,u.className=`icon-element ${a}`,u.dataset.value=o.prefix+a,o.categories&&Object.entries(o.categories).length>0){s=[];for(const[e]of Object.entries(o.categories))o.categories[e].includes(a)&&(s.length>0?s.push(e.toLowerCase()):s=[e.toLowerCase()])}let d;if(o.chars&&(u.dataset.unicode=l(o.chars,a)),"i"!==r&&c.body)if("markup"===r){let e=document.createElement("template");e.innerHTML=c.body,d=e.content}else d=document.createElementNS("http://www.w3.org/2000/svg","svg"),d.setAttribute("height","24"),d.setAttribute("width","24"),d.setAttribute("viewBox",`0 0 ${c.width?c.width:o.width} ${c.height?c.height:o.height}`),d.innerHTML=c.body;else d=document.createElement("i"),d.setAttribute("class",u.dataset.value);u.append(d),e.content.appendChild(u),this.availableIcons.push({value:a,body:d.outerHTML,...s.length>0&&{categories:s}}),u.addEventListener("click",(e=>{this.currentlySelectName!==e.currentTarget.firstChild.className&&(e.currentTarget.classList.add("is-selected"),n=e.currentTarget,this.currentlySelectName=n.dataset.value,this.SVGString=d.outerHTML,this.emitValues={name:a,value:this.currentlySelectName,svg:this.SVGString},o.chars&&(this.emitValues.unicode=d.dataset.unicode),this._emit("select",this.emitValues)),i&&i.classList.remove("is-selected"),t.closeOnSelect&&this._onSave(),i=n}))}})),t.defaultValue||this.element.value){let e=document.querySelector(`[data-value="${t.defaultValue?t.defaultValue:this.element.value}"]`)?document.querySelector(`[data-value="${t.defaultValue?t.defaultValue:this.element.value}"]`):document.querySelector(`.${t.defaultValue?t.defaultValue:this.element.value}`),n=e?.dataset.value??"";e?.classList.add("is-selected"),i=e,this.currentlySelectName=n,this.element.value||this._setValueInput()}}async _getIcons(){const{options:e}=this,t=[];let i=h(e.iconSource);for(const e of Object.values(i))t.push(e.url);return await Promise.all(t.map((e=>fetch(e).then((e=>e.json()))))).then((e=>(e.forEach((e=>{i.hasOwnProperty(e.prefix)&&(e.prefix=i[e.prefix].prefix)})),e)))}_catchError(e){if("iconSourceMissing"===e)throw Error("No icon source was found.")}_setValueInput(e=this.currentlySelectName){const{element:t}=this;t instanceof HTMLInputElement&&this.currentlySelectName&&(t.value=e)}}return t=t.default})())); +/*! Icon Picker 1.3.1 MIT | https://github.com/AppoloDev/icon-picker */ +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.IconPicker=t():e.IconPicker=t()}(self,(()=>(()=>{"use strict";var e={d:(t,i)=>{for(var n in i)e.o(i,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:i[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};function i(e,t,i,n){Array.isArray(t)||(t=[t]),Array.isArray(i)||(i=[i]);for(const s of t)for(const t of i)s[e](t,n);return[].slice.call(arguments,1)}e.d(t,{default:()=>m});const n=i.bind(null,"addEventListener"),s=i.bind(null,"removeEventListener");function o(e){if(window.DOMParser){return(new DOMParser).parseFromString(e,"text/html").body.firstElementChild}const t=document.createElement("div");return t.innerHTML=e,t.firstElementChild}function r(e){return e&&"object"==typeof e&&!Array.isArray(e)}function a(e,t){let i=Object.assign({},e);return r(e)&&r(t)&&Object.keys(t).forEach((n=>{r(t[n])?n in e?i[n]=a(e[n],t[n]):Object.assign(i,{[n]:t[n]}):Object.assign(i,{[n]:t[n]})})),i}function l(e,t){return Object.keys(e).find((i=>e[i]===t))}const c=e=>{const{theme:t,i18n:i,closeOnSelect:n}=e,s=function(e){const t=(e,t)=>{const i=e.getAttribute(t);return e.removeAttribute(t),i},i=(e,n={})=>{const s=t(e,"data-element");s&&(n[s]=e);for(const s of Array.from(e.children)){const e=t(s,"data-interaction");e&&e&&(n[e]=s),i(s,n)}return n};return i(o(e))}(`\n \n `);return t.includes("bootstrap")&&(s.save?.classList.add("btn","btn-primary"),s.search.classList.add("form-control")),s};const u="https://raw.githubusercontent.com/iconify/icon-sets/master/json",d={"Material Design Icons":{key:"mdi",prefix:"mdi mdi-",url:`${u}/mdi.json`},"FontAwesome Brands 6":{key:"fa6-brands",prefix:"fab fa-",url:`${u}/fa6-brands.json`},"FontAwesome Solid 6":{key:"fa6-solid",prefix:"fas fa-",url:`${u}/fa6-solid.json`},"FontAwesome Regular 6":{key:"fa6-regular",prefix:"far fa-",url:`${u}/fa6-regular.json`},Iconoir:{key:"iconoir",prefix:"iconoir-",url:`${u}/iconoir.json`}};function h(e){let t=Object.create({});return Array.isArray(e)&&e.forEach((e=>{!function(e){return d.hasOwnProperty(e)}(e)?e.key&&(t[e.key]=e):t[d[e].key]=d[e]})),t}class m{static DEFAULT_OPTIONS={theme:"default",closeOnSelect:!0,defaultValue:null,iconSource:[],i18n:{"input:placeholder":"Search icon…","text:title":"Select icon","text:empty":"No results found…","btn:save":"Save"}};_eventListener={select:[],save:[],show:[],clear:[],hide:[]};constructor(e,t={}){this.options=a(m.DEFAULT_OPTIONS,t),this.element=e,this._preBuild(),this.element&&this.options.iconSource.length>0?(this._binEvents(),this._renderdIcons(),this._createModal()):this._catchError("iconSourceMissing")}_preBuild(){var e;this.element=(e=this.element)instanceof HTMLElement?e:"string"==typeof e?document.querySelector(e):null,this.root=c(this.options),!Array.isArray(this.options.iconSource)&&this.options.iconSource.length>0&&(this.options.iconSource=[this.options.iconSource])}_binEvents(){const{options:e,root:t,element:i}=this;let s=[];var r,a,l;this._eventBindings=[n(i,"click",(()=>this.show())),n(t.close,"click",(()=>this.hide())),n(t.modal,"click",(e=>{e.target===t.modal&&this.hide()})),n(t.search,"keyup",(r=i=>{const n=this.availableIcons.filter((e=>e.value.includes(i.target.value.toLowerCase())||e.categories?.filter((e=>e.includes(i.target.value.toLowerCase()))).length>0));s.length||(s=document.querySelectorAll(".icon-element")),s.forEach((e=>{e.hidden=!0,n.forEach((t=>{e.classList.contains(t.value)&&(e.hidden=!1)}))}));const r=t.content.querySelector(".is-empty");n.length>0?r&&r.remove():r||t.content.appendChild(o(`
${e.i18n["text:empty"]}
`))},a=250,function(){var e=arguments,t=this;clearTimeout(l),l=setTimeout((function(){r.apply(t,e)}),a)}))],e.closeOnSelect||this._eventBindings.push(n(t.save,"click",(()=>this._onSave())))}hide(){return!!this.isOpen()&&(this.root.modal.classList.remove("is-visible"),this._emit("hide"),this)}show(){return!this.isOpen()&&(this.root.modal.classList.add("is-visible"),this._emit("show"),this)}clear(){this.initialized&&this.currentlySelectName&&(this.currentlySelectName=null,this._emit("clear"))}isOpen(){return this.root.modal.classList.contains("is-visible")}destroy(e=!0){this.initialized=!1,this._eventBindings.forEach((e=>s(...e))),e&&Object.keys(this).forEach((e=>delete this[e]))}_emit(e,...t){this._eventListener[e].forEach((e=>e(...t,this)))}on(e,t){return void 0!==this._eventListener[e]&&(this._eventListener[e].push(t),this)}off(e,t){const i=this._eventListener[e]||[],n=i.indexOf(t);return~n&&i.splice(n,1),this}_createModal(){document.body.appendChild(this.root.modal),this.initialized=!0}_onSave(){this._setValueInput(),this.hide(),this._emit("save",this.emitValues)}async _renderdIcons(){const{root:e,options:t}=this;let i=null,n=null,s=null;if(this.availableIcons=[],e.content.innerHTML="",(await this._getIcons()).forEach((o=>{let r=o.iconFormat?o.iconFormat:"svg";for(const[a,c]of Object.entries(o.icons)){const u=document.createElement("button");if(u.title=a,u.className=`icon-element ${a}`,u.dataset.value=o.prefix+a,o.categories&&Object.entries(o.categories).length>0){s=[];for(const[e]of Object.entries(o.categories))o.categories[e].includes(a)&&(s.length>0?s.push(e.toLowerCase()):s=[e.toLowerCase()])}let d;if(o.chars&&(u.dataset.unicode=l(o.chars,a)),"i"!==r&&c.body)if("markup"===r){let e=document.createElement("template");e.innerHTML=c.body,d=e.content}else d=document.createElementNS("http://www.w3.org/2000/svg","svg"),d.setAttribute("height","24"),d.setAttribute("width","24"),d.setAttribute("viewBox",`0 0 ${c.width?c.width:o.width} ${c.height?c.height:o.height}`),d.innerHTML=c.body;else d=document.createElement("i"),d.setAttribute("class",u.dataset.value);u.append(d),e.content.appendChild(u),this.availableIcons.push({value:a,body:d.outerHTML,...s?.length>0&&{categories:s}}),u.addEventListener("click",(e=>{this.currentlySelectName!==e.currentTarget.firstChild.className&&(e.currentTarget.classList.add("is-selected"),n=e.currentTarget,this.currentlySelectName=n.dataset.value,this.SVGString=d.outerHTML,this.emitValues={name:a,value:this.currentlySelectName,svg:this.SVGString},o.chars&&(this.emitValues.unicode=d.dataset.unicode),this._emit("select",this.emitValues)),i&&i.classList.remove("is-selected"),t.closeOnSelect&&this._onSave(),i=n}))}})),t.defaultValue||this.element.value){let e=document.querySelector(`[data-value="${t.defaultValue?t.defaultValue:this.element.value}"]`)?document.querySelector(`[data-value="${t.defaultValue?t.defaultValue:this.element.value}"]`):document.querySelector(`.${t.defaultValue?t.defaultValue:this.element.value}`),n=e?.dataset.value??"";e?.classList.add("is-selected"),i=e,this.currentlySelectName=n,this.element.value||this._setValueInput()}}async _getIcons(){const{options:e}=this,t=[];let i=h(e.iconSource);for(const e of Object.values(i))t.push(e.url);return await Promise.all(t.map((e=>fetch(e).then((e=>e.json()))))).then((e=>(e.forEach((e=>{i.hasOwnProperty(e.prefix)&&(e.prefix=i[e.prefix].prefix)})),e)))}_catchError(e){if("iconSourceMissing"===e)throw Error("No icon source was found.")}_setValueInput(e=this.currentlySelectName){const{element:t}=this;t instanceof HTMLInputElement&&this.currentlySelectName&&(t.value=e)}}return t=t.default})())); //# sourceMappingURL=icon-picker.min.map \ No newline at end of file diff --git a/dist/icon-picker.min.map b/dist/icon-picker.min.map index 990d08d..f256a2c 100644 --- a/dist/icon-picker.min.map +++ b/dist/icon-picker.min.map @@ -1 +1 @@ -{"version":3,"file":"icon-picker.min.js","mappings":"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","sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap","webpack:///webpack/runtime/define property getters","webpack:///webpack/runtime/hasOwnProperty shorthand","webpack:///./src/js/utlis/utils.js","webpack:///./src/js/template.js","webpack:///./src/js/utlis/collections.js","webpack:///./src/js/IconPicker.js"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"IconPicker\"] = factory();\n\telse\n\t\troot[\"IconPicker\"] = factory();\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","function eventListener(method, elements, events, fn) {\n if (!Array.isArray(elements)) {\n elements = [elements];\n }\n\n if (!Array.isArray(events)) {\n events = [events];\n }\n\n for (const el of elements) {\n for (const ev of events) {\n el[method](ev, fn);\n }\n }\n\n return [].slice.call(arguments, 1);\n}\n\n/**\n * Add event to element.\n * @param elements DOM-Elements\n * @param events Event names\n * @param fn Callback\n * @param options Optional options\n * @return Array passed arguments\n */\nexport const addEvent = eventListener.bind(null, 'addEventListener');\n\n/**\n * Remove event from element.\n * @param elements DOM-Elements\n * @param events Event names\n * @param fn Callback\n * @param options Optional options\n * @return Array passed arguments\n */\nexport const removeEvent = eventListener.bind(null, 'removeEventListener');\n\n/**\n * Resolves a HTMLElement by query.\n * @param val\n * @returns {null|Document|Element}\n */\nexport function resolveElement(val) {\n if (val instanceof HTMLElement) {\n return val;\n } else if (typeof val === 'string') {\n return document.querySelector(val)\n }\n\n return null;\n}\n\n/**\n * Convert a template string into HTML DOM nodes\n * @param {String} str The template string\n * @return {Node} The template HTML\n */\nexport function stringToHTML(str) {\n if (window.DOMParser) {\n const parser = new DOMParser();\n const doc = parser.parseFromString(str, 'text/html');\n return doc.body.firstElementChild;\n }\n\n const dom = document.createElement('div');\n dom.innerHTML = str;\n return dom.firstElementChild;\n}\n\n/**\n * Check if item is an object\n * @param {Object} item\n * @returns {boolean}\n */\nexport function isObject(item) {\n return (item && typeof item === 'object' && !Array.isArray(item));\n}\n\n/**\n *\n * @param target\n * @param source\n * @returns {Object}\n */\nexport function mergeDeep(target, source) {\n let output = Object.assign({}, target);\n\n if (isObject(target) && isObject(source)) {\n Object.keys(source).forEach(key => {\n if (isObject(source[key])) {\n if (!(key in target))\n Object.assign(output, {[key]: source[key]});\n else\n output[key] = mergeDeep(target[key], source[key]);\n } else {\n Object.assign(output, {[key]: source[key]});\n }\n });\n }\n return output;\n}\n\n/**\n *\n * @param callback\n * @param delay\n * @returns {(function(): void)|*}\n */\nexport function debounce(callback, delay){\n var timer;\n return function(){\n var args = arguments;\n var context = this;\n clearTimeout(timer);\n timer = setTimeout(function(){\n callback.apply(context, args);\n }, delay)\n }\n}\n\n/**\n *\n * @param object\n * @param value\n * @returns {string}\n */\nexport function getKeyByValue(object, value) {\n return Object.keys(object).find(key => object[key] === value);\n}\n","import {stringToHTML} from \"./utlis/utils\";\n\nexport default options => {\n const {theme, i18n, closeOnSelect} = options;\n\n const modalElement = getHTMLElements(`\n
\n
\n
\n ${typeof i18n['text:title'] === 'string' && i18n['text:title'] !== '' ? `

${i18n['text:title']}

` : ''}\n \n \n
\n \n \n \n
\n \n ${!closeOnSelect ? `\n
\n \n
` : ''\n }\n
\n
\n `);\n\n if (theme.includes('bootstrap')) {\n modalElement.save?.classList.add('btn', 'btn-primary');\n modalElement.search.classList.add('form-control');\n }\n\n return modalElement;\n}\n\n\nfunction getHTMLElements(str) {\n const removeAttribute = (el, name) => {\n const value = el.getAttribute(name);\n el.removeAttribute(name);\n return value;\n };\n\n const resolve = (element, base = {}) => {\n const elementKey = removeAttribute(element, 'data-element');\n elementKey && (base[elementKey] = element);\n\n for (const child of Array.from(element.children)) {\n const childInteractionKey = removeAttribute(child, 'data-interaction');\n\n if (childInteractionKey) {\n childInteractionKey && (base[childInteractionKey] = child);\n }\n\n resolve(child, base);\n }\n\n return base;\n };\n\n return resolve(stringToHTML(str));\n}\n","const iconifyPath = 'https://raw.githubusercontent.com/iconify/icon-sets/master/json';\n\nexport const collections = {\n 'Material Design Icons': {\n key: 'mdi',\n prefix: 'mdi mdi-',\n url: `${iconifyPath}/mdi.json`\n },\n 'FontAwesome Brands 6': {\n key: 'fa6-brands',\n prefix: 'fab fa-',\n url: `${iconifyPath}/fa6-brands.json`\n },\n 'FontAwesome Solid 6': {\n key: 'fa6-solid',\n prefix: 'fas fa-',\n url: `${iconifyPath}/fa6-solid.json`\n\n },\n 'FontAwesome Regular 6': {\n key: 'fa6-regular',\n prefix: 'far fa-',\n url: `${iconifyPath}/fa6-regular.json`\n },\n 'Iconoir': {\n key: 'iconoir',\n prefix: 'iconoir-',\n url: `${iconifyPath}/iconoir.json`\n }\n}\n\n/**\n *\n * @param {array} collectionsOptions\n */\nexport function resolveCollection(collectionsOptions) {\n let collectionResolved = Object.create({});\n\n if (Array.isArray(collectionsOptions)) {\n collectionsOptions.forEach((collection) => {\n if (hasCollection(collection)) {\n collectionResolved[collections[collection].key] = collections[collection]\n } else if (collection.key) {\n collectionResolved[collection.key] = collection\n }\n })\n }\n\n return collectionResolved;\n}\n\n/**\n *\n * @param {string} collection\n * @returns {boolean}\n */\nfunction hasCollection(collection) {\n return collections.hasOwnProperty(collection)\n}\n","import * as _ from \"./utlis/utils\";\nimport template from \"./template\";\nimport { resolveCollection } from \"./utlis/collections\";\n\nexport default class IconPicker {\n static DEFAULT_OPTIONS = {\n theme: 'default',\n closeOnSelect: true,\n defaultValue: null,\n iconSource: [],\n i18n: {\n 'input:placeholder': 'Search icon…',\n\n 'text:title': 'Select icon',\n 'text:empty': 'No results found…',\n\n 'btn:save': 'Save'\n }\n }\n\n _eventListener = {\n select: [],\n save: [],\n show: [],\n clear: [],\n hide: []\n };\n\n /**\n *\n * @param {string | HTMLElement} el\n * @param {Object} options\n */\n constructor(el, options = {}) {\n this.options = _.mergeDeep(IconPicker.DEFAULT_OPTIONS, options);\n this.element = el;\n\n // Initialize icon picker\n this._preBuild();\n\n if (this.element && this.options.iconSource.length > 0) {\n this._binEvents();\n this._renderdIcons();\n this._createModal();\n } else {\n this._catchError('iconSourceMissing');\n }\n }\n\n _preBuild() {\n this.element = _.resolveElement(this.element);\n this.root = template(this.options);\n\n if (!Array.isArray(this.options.iconSource) && this.options.iconSource.length > 0) {\n this.options.iconSource = [this.options.iconSource];\n }\n }\n\n _binEvents() {\n const {options, root, element} = this;\n let iconsElements = [];\n\n this._eventBindings = [\n _.addEvent(element, 'click', () => this.show()),\n _.addEvent(root.close, 'click', () => this.hide()),\n _.addEvent(root.modal, 'click', (evt) => {\n if (evt.target === root.modal) {\n this.hide();\n }\n }),\n _.addEvent(root.search, 'keyup', _.debounce((evt) => {\n const iconsResult = this.availableIcons.filter((obj) => {\n return obj.value.includes(evt.target.value.toLowerCase()) || obj.categories?.filter(c => c.includes(evt.target.value.toLowerCase())).length > 0\n });\n\n if (!iconsElements.length) {\n iconsElements = document.querySelectorAll('.icon-element');\n }\n\n iconsElements.forEach((iconElement) => {\n iconElement.hidden = true;\n\n iconsResult.forEach((result) => {\n if (iconElement.classList.contains(result.value)) {\n iconElement.hidden = false;\n }\n });\n });\n\n const emptyElement = root.content.querySelector('.is-empty');\n\n if (iconsResult.length > 0) {\n if (emptyElement) {\n emptyElement.remove();\n }\n } else {\n if (!emptyElement) {\n root.content.appendChild(_.stringToHTML(`
${options.i18n['text:empty']}
`));\n }\n }\n }, 250))\n ];\n\n if (!options.closeOnSelect) {\n this._eventBindings.push(_.addEvent(root.save, 'click', () => this._onSave()));\n }\n }\n\n /**\n * Hide icon picker modal\n */\n hide() {\n if (this.isOpen()) {\n this.root.modal.classList.remove('is-visible');\n this._emit('hide');\n\n return this;\n }\n\n return false\n }\n\n /**\n * Show icon picker modal\n */\n show() {\n if (!this.isOpen()) {\n this.root.modal.classList.add('is-visible');\n this._emit('show');\n\n return this;\n }\n\n return false\n }\n\n clear() {\n if (this.initialized && this.currentlySelectName) {\n this.currentlySelectName = null;\n\n this._emit('clear');\n }\n }\n\n /**\n * Check if modal is open\n * @returns {boolean}\n */\n isOpen() {\n return this.root.modal.classList.contains('is-visible');\n }\n\n /**\n * Destroy icon picker instance and detach all events listeners\n * @param {boolean} deleteInstance\n */\n destroy(deleteInstance = true) {\n this.initialized = false;\n\n // Remove elements events\n this._eventBindings.forEach(args => _.removeEvent(...args));\n\n // Delete instance\n if (deleteInstance) {\n Object.keys(this).forEach((key) => delete this[key]);\n }\n }\n\n _emit(event, ...args) {\n this._eventListener[event].forEach(cb => cb(...args, this));\n }\n\n on(event, callback) {\n if (this._eventListener[event] !== undefined) {\n this._eventListener[event].push(callback);\n return this;\n }\n\n return false\n }\n\n off(event, callback) {\n const callBacks = (this._eventListener[event] || []);\n const index = callBacks.indexOf(callback);\n\n if (~index) {\n callBacks.splice(index, 1);\n }\n\n return this;\n }\n\n _createModal() {\n document.body.appendChild(this.root.modal);\n\n this.initialized = true;\n }\n\n _onSave() {\n this._setValueInput()\n\n this.hide();\n this._emit('save', this.emitValues);\n }\n\n /**\n * Generate icons elements\n * @private\n */\n async _renderdIcons() {\n const {root, options} = this;\n let previousSelectedIcon = null;\n let currentlySelectElement = null;\n let categories = null;\n this.availableIcons = [];\n\n root.content.innerHTML = '';\n\n let icons = await this._getIcons();\n\n icons.forEach((library) => {\n let iconFormat = library.iconFormat ? library.iconFormat : 'svg';\n\n for (const [key, value] of Object.entries(library.icons)) {\n const iconTarget = document.createElement('button');\n iconTarget.title = key\n iconTarget.className = `icon-element ${key}`;\n iconTarget.dataset.value = library.prefix + key;\n\n if (library.categories && Object.entries(library.categories).length > 0) {\n categories = [];\n\n for (const [categoryKey] of Object.entries(library.categories)) {\n if (library.categories[categoryKey].includes(key)) {\n if (categories.length > 0) {\n categories.push(categoryKey.toLowerCase())\n } else {\n categories = [categoryKey.toLowerCase()]\n }\n }\n }\n }\n\n if (library.chars) {\n iconTarget.dataset.unicode = _.getKeyByValue(library.chars, key);\n }\n\n let iconElement;\n if (iconFormat === 'i' || !value.body) {\n iconElement = document.createElement('i');\n iconElement.setAttribute('class', iconTarget.dataset.value);\n } else if (iconFormat === 'markup') {\n let t = document.createElement('template');\n t.innerHTML = value.body;\n iconElement = t.content;\n } else {\n iconElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n iconElement.setAttribute('height', '24');\n iconElement.setAttribute('width', '24');\n iconElement.setAttribute('viewBox', `0 0 ${value.width ? value.width : library.width} ${value.height ? value.height : library.height}`);\n iconElement.innerHTML = value.body;\n }\n\n iconTarget.append(iconElement)\n\n root.content.appendChild(iconTarget);\n\n this.availableIcons.push({value: key, body: iconElement.outerHTML, ...(categories.length > 0 && {categories})});\n\n // Icon click event\n iconTarget.addEventListener('click', (evt) => {\n if (this.currentlySelectName !== evt.currentTarget.firstChild.className) {\n evt.currentTarget.classList.add('is-selected');\n\n currentlySelectElement = evt.currentTarget;\n this.currentlySelectName = currentlySelectElement.dataset.value;\n this.SVGString = iconElement.outerHTML;\n\n this.emitValues = {\n name: key,\n value: this.currentlySelectName,\n svg: this.SVGString,\n }\n\n if (library.chars) {\n this.emitValues.unicode = iconElement.dataset.unicode\n }\n\n this._emit('select', this.emitValues);\n }\n\n if (previousSelectedIcon) {\n previousSelectedIcon.classList.remove('is-selected');\n }\n\n if (options.closeOnSelect) {\n this._onSave();\n }\n\n previousSelectedIcon = currentlySelectElement;\n });\n }\n });\n\n if (options.defaultValue || this.element.value) {\n // Check if icon name ou icon value is set\n let defaultValueElement = document.querySelector(`[data-value=\"${options.defaultValue ? options.defaultValue : this.element.value}\"]`) ?\n document.querySelector(`[data-value=\"${options.defaultValue ? options.defaultValue : this.element.value}\"]`) :\n document.querySelector(`.${options.defaultValue ? options.defaultValue : this.element.value}`);\n\n let iconValue = defaultValueElement?.dataset.value ?? '';\n defaultValueElement?.classList.add('is-selected');\n\n previousSelectedIcon = defaultValueElement;\n this.currentlySelectName = iconValue;\n\n if (!this.element.value) {\n this._setValueInput();\n }\n }\n }\n\n /**\n *\n * @returns {string}\n * @private\n */\n async _getIcons() {\n const {options} = this\n const iconsURL = [];\n\n let sourceInformation = resolveCollection(options.iconSource);\n\n for (const source of Object.values(sourceInformation)) {\n iconsURL.push(source.url)\n }\n\n return await Promise.all(iconsURL.map((iconURL) => fetch(iconURL).then((response) => response.json())))\n .then((iconLibrary) => {\n iconLibrary.forEach((library) => {\n if (sourceInformation.hasOwnProperty(library.prefix)) {\n library.prefix = sourceInformation[library.prefix].prefix\n }\n });\n\n return iconLibrary;\n });\n }\n\n /**\n *\n * @param {string} exception\n * @private\n */\n _catchError(exception) {\n switch (exception) {\n case 'iconSourceMissing':\n throw Error('No icon source was found.');\n }\n }\n\n /**\n * Set value into input element\n * @param value\n * @private\n */\n _setValueInput(value = this.currentlySelectName) {\n const {element} = this;\n\n if (element instanceof HTMLInputElement && this.currentlySelectName) {\n element.value = value;\n }\n }\n}\n"],"names":["root","factory","exports","module","define","amd","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","eventListener","method","elements","events","fn","Array","isArray","el","ev","slice","arguments","addEvent","bind","removeEvent","stringToHTML","str","window","DOMParser","parseFromString","body","firstElementChild","dom","document","createElement","innerHTML","isObject","item","mergeDeep","target","source","output","assign","keys","forEach","getKeyByValue","object","value","find","options","theme","i18n","closeOnSelect","modalElement","removeAttribute","name","getAttribute","resolve","element","base","elementKey","child","from","children","childInteractionKey","getHTMLElements","includes","save","classList","add","search","iconifyPath","collections","prefix","url","resolveCollection","collectionsOptions","collectionResolved","create","collection","hasCollection","IconPicker","static","defaultValue","iconSource","_eventListener","select","show","clear","hide","constructor","this","DEFAULT_OPTIONS","_preBuild","length","_binEvents","_renderdIcons","_createModal","_catchError","val","HTMLElement","querySelector","template","iconsElements","callback","delay","timer","_eventBindings","close","modal","evt","iconsResult","availableIcons","filter","toLowerCase","categories","c","querySelectorAll","iconElement","hidden","result","contains","emptyElement","content","remove","appendChild","args","context","clearTimeout","setTimeout","apply","push","_onSave","isOpen","_emit","initialized","currentlySelectName","destroy","deleteInstance","event","cb","on","undefined","off","callBacks","index","indexOf","splice","_setValueInput","emitValues","async","previousSelectedIcon","currentlySelectElement","_getIcons","library","iconFormat","entries","icons","iconTarget","title","className","dataset","categoryKey","chars","unicode","t","createElementNS","setAttribute","width","height","append","outerHTML","addEventListener","currentTarget","firstChild","SVGString","svg","defaultValueElement","iconValue","iconsURL","sourceInformation","values","Promise","all","map","iconURL","fetch","then","response","json","iconLibrary","exception","Error","HTMLInputElement"],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"icon-picker.min.js","mappings":"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","sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap","webpack:///webpack/runtime/define property getters","webpack:///webpack/runtime/hasOwnProperty shorthand","webpack:///./src/js/utlis/utils.js","webpack:///./src/js/template.js","webpack:///./src/js/utlis/collections.js","webpack:///./src/js/IconPicker.js"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"IconPicker\"] = factory();\n\telse\n\t\troot[\"IconPicker\"] = factory();\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","function eventListener(method, elements, events, fn) {\n if (!Array.isArray(elements)) {\n elements = [elements];\n }\n\n if (!Array.isArray(events)) {\n events = [events];\n }\n\n for (const el of elements) {\n for (const ev of events) {\n el[method](ev, fn);\n }\n }\n\n return [].slice.call(arguments, 1);\n}\n\n/**\n * Add event to element.\n * @param elements DOM-Elements\n * @param events Event names\n * @param fn Callback\n * @param options Optional options\n * @return Array passed arguments\n */\nexport const addEvent = eventListener.bind(null, 'addEventListener');\n\n/**\n * Remove event from element.\n * @param elements DOM-Elements\n * @param events Event names\n * @param fn Callback\n * @param options Optional options\n * @return Array passed arguments\n */\nexport const removeEvent = eventListener.bind(null, 'removeEventListener');\n\n/**\n * Resolves a HTMLElement by query.\n * @param val\n * @returns {null|Document|Element}\n */\nexport function resolveElement(val) {\n if (val instanceof HTMLElement) {\n return val;\n } else if (typeof val === 'string') {\n return document.querySelector(val)\n }\n\n return null;\n}\n\n/**\n * Convert a template string into HTML DOM nodes\n * @param {String} str The template string\n * @return {Node} The template HTML\n */\nexport function stringToHTML(str) {\n if (window.DOMParser) {\n const parser = new DOMParser();\n const doc = parser.parseFromString(str, 'text/html');\n return doc.body.firstElementChild;\n }\n\n const dom = document.createElement('div');\n dom.innerHTML = str;\n return dom.firstElementChild;\n}\n\n/**\n * Check if item is an object\n * @param {Object} item\n * @returns {boolean}\n */\nexport function isObject(item) {\n return (item && typeof item === 'object' && !Array.isArray(item));\n}\n\n/**\n *\n * @param target\n * @param source\n * @returns {Object}\n */\nexport function mergeDeep(target, source) {\n let output = Object.assign({}, target);\n\n if (isObject(target) && isObject(source)) {\n Object.keys(source).forEach(key => {\n if (isObject(source[key])) {\n if (!(key in target))\n Object.assign(output, {[key]: source[key]});\n else\n output[key] = mergeDeep(target[key], source[key]);\n } else {\n Object.assign(output, {[key]: source[key]});\n }\n });\n }\n return output;\n}\n\n/**\n *\n * @param callback\n * @param delay\n * @returns {(function(): void)|*}\n */\nexport function debounce(callback, delay){\n var timer;\n return function(){\n var args = arguments;\n var context = this;\n clearTimeout(timer);\n timer = setTimeout(function(){\n callback.apply(context, args);\n }, delay)\n }\n}\n\n/**\n *\n * @param object\n * @param value\n * @returns {string}\n */\nexport function getKeyByValue(object, value) {\n return Object.keys(object).find(key => object[key] === value);\n}\n","import {stringToHTML} from \"./utlis/utils\";\n\nexport default options => {\n const {theme, i18n, closeOnSelect} = options;\n\n const modalElement = getHTMLElements(`\n
\n
\n
\n ${typeof i18n['text:title'] === 'string' && i18n['text:title'] !== '' ? `

${i18n['text:title']}

` : ''}\n \n \n
\n \n \n \n
\n \n ${!closeOnSelect ? `\n
\n \n
` : ''\n }\n
\n
\n `);\n\n if (theme.includes('bootstrap')) {\n modalElement.save?.classList.add('btn', 'btn-primary');\n modalElement.search.classList.add('form-control');\n }\n\n return modalElement;\n}\n\n\nfunction getHTMLElements(str) {\n const removeAttribute = (el, name) => {\n const value = el.getAttribute(name);\n el.removeAttribute(name);\n return value;\n };\n\n const resolve = (element, base = {}) => {\n const elementKey = removeAttribute(element, 'data-element');\n elementKey && (base[elementKey] = element);\n\n for (const child of Array.from(element.children)) {\n const childInteractionKey = removeAttribute(child, 'data-interaction');\n\n if (childInteractionKey) {\n childInteractionKey && (base[childInteractionKey] = child);\n }\n\n resolve(child, base);\n }\n\n return base;\n };\n\n return resolve(stringToHTML(str));\n}\n","const iconifyPath = 'https://raw.githubusercontent.com/iconify/icon-sets/master/json';\n\nexport const collections = {\n 'Material Design Icons': {\n key: 'mdi',\n prefix: 'mdi mdi-',\n url: `${iconifyPath}/mdi.json`\n },\n 'FontAwesome Brands 6': {\n key: 'fa6-brands',\n prefix: 'fab fa-',\n url: `${iconifyPath}/fa6-brands.json`\n },\n 'FontAwesome Solid 6': {\n key: 'fa6-solid',\n prefix: 'fas fa-',\n url: `${iconifyPath}/fa6-solid.json`\n\n },\n 'FontAwesome Regular 6': {\n key: 'fa6-regular',\n prefix: 'far fa-',\n url: `${iconifyPath}/fa6-regular.json`\n },\n 'Iconoir': {\n key: 'iconoir',\n prefix: 'iconoir-',\n url: `${iconifyPath}/iconoir.json`\n }\n}\n\n/**\n *\n * @param {array} collectionsOptions\n */\nexport function resolveCollection(collectionsOptions) {\n let collectionResolved = Object.create({});\n\n if (Array.isArray(collectionsOptions)) {\n collectionsOptions.forEach((collection) => {\n if (hasCollection(collection)) {\n collectionResolved[collections[collection].key] = collections[collection]\n } else if (collection.key) {\n collectionResolved[collection.key] = collection\n }\n })\n }\n\n return collectionResolved;\n}\n\n/**\n *\n * @param {string} collection\n * @returns {boolean}\n */\nfunction hasCollection(collection) {\n return collections.hasOwnProperty(collection)\n}\n","import * as _ from \"./utlis/utils\";\nimport template from \"./template\";\nimport { resolveCollection } from \"./utlis/collections\";\n\nexport default class IconPicker {\n static DEFAULT_OPTIONS = {\n theme: 'default',\n closeOnSelect: true,\n defaultValue: null,\n iconSource: [],\n i18n: {\n 'input:placeholder': 'Search icon…',\n\n 'text:title': 'Select icon',\n 'text:empty': 'No results found…',\n\n 'btn:save': 'Save'\n }\n }\n\n _eventListener = {\n select: [],\n save: [],\n show: [],\n clear: [],\n hide: []\n };\n\n /**\n *\n * @param {string | HTMLElement} el\n * @param {Object} options\n */\n constructor(el, options = {}) {\n this.options = _.mergeDeep(IconPicker.DEFAULT_OPTIONS, options);\n this.element = el;\n\n // Initialize icon picker\n this._preBuild();\n\n if (this.element && this.options.iconSource.length > 0) {\n this._binEvents();\n this._renderdIcons();\n this._createModal();\n } else {\n this._catchError('iconSourceMissing');\n }\n }\n\n _preBuild() {\n this.element = _.resolveElement(this.element);\n this.root = template(this.options);\n\n if (!Array.isArray(this.options.iconSource) && this.options.iconSource.length > 0) {\n this.options.iconSource = [this.options.iconSource];\n }\n }\n\n _binEvents() {\n const {options, root, element} = this;\n let iconsElements = [];\n\n this._eventBindings = [\n _.addEvent(element, 'click', () => this.show()),\n _.addEvent(root.close, 'click', () => this.hide()),\n _.addEvent(root.modal, 'click', (evt) => {\n if (evt.target === root.modal) {\n this.hide();\n }\n }),\n _.addEvent(root.search, 'keyup', _.debounce((evt) => {\n const iconsResult = this.availableIcons.filter((obj) => {\n return obj.value.includes(evt.target.value.toLowerCase()) || obj.categories?.filter(c => c.includes(evt.target.value.toLowerCase())).length > 0\n });\n\n if (!iconsElements.length) {\n iconsElements = document.querySelectorAll('.icon-element');\n }\n\n iconsElements.forEach((iconElement) => {\n iconElement.hidden = true;\n\n iconsResult.forEach((result) => {\n if (iconElement.classList.contains(result.value)) {\n iconElement.hidden = false;\n }\n });\n });\n\n const emptyElement = root.content.querySelector('.is-empty');\n\n if (iconsResult.length > 0) {\n if (emptyElement) {\n emptyElement.remove();\n }\n } else {\n if (!emptyElement) {\n root.content.appendChild(_.stringToHTML(`
${options.i18n['text:empty']}
`));\n }\n }\n }, 250))\n ];\n\n if (!options.closeOnSelect) {\n this._eventBindings.push(_.addEvent(root.save, 'click', () => this._onSave()));\n }\n }\n\n /**\n * Hide icon picker modal\n */\n hide() {\n if (this.isOpen()) {\n this.root.modal.classList.remove('is-visible');\n this._emit('hide');\n\n return this;\n }\n\n return false\n }\n\n /**\n * Show icon picker modal\n */\n show() {\n if (!this.isOpen()) {\n this.root.modal.classList.add('is-visible');\n this._emit('show');\n\n return this;\n }\n\n return false\n }\n\n clear() {\n if (this.initialized && this.currentlySelectName) {\n this.currentlySelectName = null;\n\n this._emit('clear');\n }\n }\n\n /**\n * Check if modal is open\n * @returns {boolean}\n */\n isOpen() {\n return this.root.modal.classList.contains('is-visible');\n }\n\n /**\n * Destroy icon picker instance and detach all events listeners\n * @param {boolean} deleteInstance\n */\n destroy(deleteInstance = true) {\n this.initialized = false;\n\n // Remove elements events\n this._eventBindings.forEach(args => _.removeEvent(...args));\n\n // Delete instance\n if (deleteInstance) {\n Object.keys(this).forEach((key) => delete this[key]);\n }\n }\n\n _emit(event, ...args) {\n this._eventListener[event].forEach(cb => cb(...args, this));\n }\n\n on(event, callback) {\n if (this._eventListener[event] !== undefined) {\n this._eventListener[event].push(callback);\n return this;\n }\n\n return false\n }\n\n off(event, callback) {\n const callBacks = (this._eventListener[event] || []);\n const index = callBacks.indexOf(callback);\n\n if (~index) {\n callBacks.splice(index, 1);\n }\n\n return this;\n }\n\n _createModal() {\n document.body.appendChild(this.root.modal);\n\n this.initialized = true;\n }\n\n _onSave() {\n this._setValueInput()\n\n this.hide();\n this._emit('save', this.emitValues);\n }\n\n /**\n * Generate icons elements\n * @private\n */\n async _renderdIcons() {\n const {root, options} = this;\n let previousSelectedIcon = null;\n let currentlySelectElement = null;\n let categories = null;\n this.availableIcons = [];\n\n root.content.innerHTML = '';\n\n let icons = await this._getIcons();\n\n icons.forEach((library) => {\n let iconFormat = library.iconFormat ? library.iconFormat : 'svg';\n\n for (const [key, value] of Object.entries(library.icons)) {\n const iconTarget = document.createElement('button');\n iconTarget.title = key\n iconTarget.className = `icon-element ${key}`;\n iconTarget.dataset.value = library.prefix + key;\n\n if (library.categories && Object.entries(library.categories).length > 0) {\n categories = [];\n\n for (const [categoryKey] of Object.entries(library.categories)) {\n if (library.categories[categoryKey].includes(key)) {\n if (categories.length > 0) {\n categories.push(categoryKey.toLowerCase())\n } else {\n categories = [categoryKey.toLowerCase()]\n }\n }\n }\n }\n\n if (library.chars) {\n iconTarget.dataset.unicode = _.getKeyByValue(library.chars, key);\n }\n\n let iconElement;\n if (iconFormat === 'i' || !value.body) {\n iconElement = document.createElement('i');\n iconElement.setAttribute('class', iconTarget.dataset.value);\n } else if (iconFormat === 'markup') {\n let t = document.createElement('template');\n t.innerHTML = value.body;\n iconElement = t.content;\n } else {\n iconElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n iconElement.setAttribute('height', '24');\n iconElement.setAttribute('width', '24');\n iconElement.setAttribute('viewBox', `0 0 ${value.width ? value.width : library.width} ${value.height ? value.height : library.height}`);\n iconElement.innerHTML = value.body;\n }\n\n iconTarget.append(iconElement)\n\n root.content.appendChild(iconTarget);\n\n this.availableIcons.push({value: key, body: iconElement.outerHTML, ...(categories?.length > 0 && {categories})});\n\n // Icon click event\n iconTarget.addEventListener('click', (evt) => {\n if (this.currentlySelectName !== evt.currentTarget.firstChild.className) {\n evt.currentTarget.classList.add('is-selected');\n\n currentlySelectElement = evt.currentTarget;\n this.currentlySelectName = currentlySelectElement.dataset.value;\n this.SVGString = iconElement.outerHTML;\n\n this.emitValues = {\n name: key,\n value: this.currentlySelectName,\n svg: this.SVGString,\n }\n\n if (library.chars) {\n this.emitValues.unicode = iconElement.dataset.unicode\n }\n\n this._emit('select', this.emitValues);\n }\n\n if (previousSelectedIcon) {\n previousSelectedIcon.classList.remove('is-selected');\n }\n\n if (options.closeOnSelect) {\n this._onSave();\n }\n\n previousSelectedIcon = currentlySelectElement;\n });\n }\n });\n\n if (options.defaultValue || this.element.value) {\n // Check if icon name ou icon value is set\n let defaultValueElement = document.querySelector(`[data-value=\"${options.defaultValue ? options.defaultValue : this.element.value}\"]`) ?\n document.querySelector(`[data-value=\"${options.defaultValue ? options.defaultValue : this.element.value}\"]`) :\n document.querySelector(`.${options.defaultValue ? options.defaultValue : this.element.value}`);\n\n let iconValue = defaultValueElement?.dataset.value ?? '';\n defaultValueElement?.classList.add('is-selected');\n\n previousSelectedIcon = defaultValueElement;\n this.currentlySelectName = iconValue;\n\n if (!this.element.value) {\n this._setValueInput();\n }\n }\n }\n\n /**\n *\n * @returns {string}\n * @private\n */\n async _getIcons() {\n const {options} = this\n const iconsURL = [];\n\n let sourceInformation = resolveCollection(options.iconSource);\n\n for (const source of Object.values(sourceInformation)) {\n iconsURL.push(source.url)\n }\n\n return await Promise.all(iconsURL.map((iconURL) => fetch(iconURL).then((response) => response.json())))\n .then((iconLibrary) => {\n iconLibrary.forEach((library) => {\n if (sourceInformation.hasOwnProperty(library.prefix)) {\n library.prefix = sourceInformation[library.prefix].prefix\n }\n });\n\n return iconLibrary;\n });\n }\n\n /**\n *\n * @param {string} exception\n * @private\n */\n _catchError(exception) {\n switch (exception) {\n case 'iconSourceMissing':\n throw Error('No icon source was found.');\n }\n }\n\n /**\n * Set value into input element\n * @param value\n * @private\n */\n _setValueInput(value = this.currentlySelectName) {\n const {element} = this;\n\n if (element instanceof HTMLInputElement && this.currentlySelectName) {\n element.value = value;\n }\n }\n}\n"],"names":["root","factory","exports","module","define","amd","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","eventListener","method","elements","events","fn","Array","isArray","el","ev","slice","arguments","addEvent","bind","removeEvent","stringToHTML","str","window","DOMParser","parseFromString","body","firstElementChild","dom","document","createElement","innerHTML","isObject","item","mergeDeep","target","source","output","assign","keys","forEach","getKeyByValue","object","value","find","options","theme","i18n","closeOnSelect","modalElement","removeAttribute","name","getAttribute","resolve","element","base","elementKey","child","from","children","childInteractionKey","getHTMLElements","includes","save","classList","add","search","iconifyPath","collections","prefix","url","resolveCollection","collectionsOptions","collectionResolved","create","collection","hasCollection","IconPicker","static","defaultValue","iconSource","_eventListener","select","show","clear","hide","constructor","this","DEFAULT_OPTIONS","_preBuild","length","_binEvents","_renderdIcons","_createModal","_catchError","val","HTMLElement","querySelector","template","iconsElements","callback","delay","timer","_eventBindings","close","modal","evt","iconsResult","availableIcons","filter","toLowerCase","categories","c","querySelectorAll","iconElement","hidden","result","contains","emptyElement","content","remove","appendChild","args","context","clearTimeout","setTimeout","apply","push","_onSave","isOpen","_emit","initialized","currentlySelectName","destroy","deleteInstance","event","cb","on","undefined","off","callBacks","index","indexOf","splice","_setValueInput","emitValues","async","previousSelectedIcon","currentlySelectElement","_getIcons","library","iconFormat","entries","icons","iconTarget","title","className","dataset","categoryKey","chars","unicode","t","createElementNS","setAttribute","width","height","append","outerHTML","addEventListener","currentTarget","firstChild","SVGString","svg","defaultValueElement","iconValue","iconsURL","sourceInformation","values","Promise","all","map","iconURL","fetch","then","response","json","iconLibrary","exception","Error","HTMLInputElement"],"sourceRoot":""} \ No newline at end of file diff --git a/dist/themes/bootstrap-5.min.css b/dist/themes/bootstrap-5.min.css index d48173a..1b838b9 100644 --- a/dist/themes/bootstrap-5.min.css +++ b/dist/themes/bootstrap-5.min.css @@ -1,2 +1,2 @@ -/*! Icon Picker 1.2.1 MIT | https://github.com/AppoloDev/icon-picker */ +/*! Icon Picker 1.3.1 MIT | https://github.com/AppoloDev/icon-picker */ .icon-picker-modal{position:fixed;left:0;top:0;bottom:0;right:0;z-index:100000;background-color:rgba(68,69,69,0);visibility:hidden;transition:background-color .3s ease-out,visibility .3s ease-out}.icon-picker-modal.is-visible{background-color:rgba(68,69,69,.6);visibility:visible}.icon-picker-modal.is-visible .icon-picker-modal__dialog{transform:translate(-50%, -50%);opacity:1}.icon-picker-modal__dialog{display:flex;flex-direction:column;position:absolute;left:50%;top:50%;z-index:1;height:440px;min-width:380px;opacity:0;transform:translate(-50%, -55%);transition:transform .3s ease-in-out,opacity .3s ease;padding:24px;background-color:#fff;border-radius:16px}.icon-picker-modal__header{display:flex;justify-content:space-between;align-items:center}.icon-picker-modal__header h2{margin-block-start:0;margin-block-end:0;font-size:24px}.icon-picker-modal__header .icon-picker-modal--close{cursor:pointer;margin-left:auto;-webkit-appearance:none;background:none;border:none;padding:2px;border-radius:4px;transition:background-color .3s ease}.icon-picker-modal__header .icon-picker-modal--close:hover{background-color:#f3f3f3}.icon-picker-modal__search{margin:32px 0 24px 0}.icon-picker-modal__content{display:grid;grid-template-columns:repeat(7, 40px);grid-gap:8px;overflow-y:scroll}.icon-picker-modal__content .is-empty{text-align:center;grid-column:1/-1}.icon-picker-modal__content .icon-element{display:flex;align-items:center;justify-content:center;border:1px solid #ced4da;border-radius:4px;background-color:rgba(0,0,0,0);height:40px;width:40px;cursor:pointer;transition:background-color .3s ease,border-color .3s ease}.icon-picker-modal__content .icon-element i,.icon-picker-modal__content .icon-element svg{font-size:24px;color:#0983fd}.icon-picker-modal__content .icon-element:hover{background-color:#0983fd;border-color:#0983fd}.icon-picker-modal__content .icon-element:hover i,.icon-picker-modal__content .icon-element:hover svg{color:#fff}.icon-picker-modal__content .icon-element.is-selected{background-color:#0983fd;border-color:#0983fd}.icon-picker-modal__content .icon-element.is-selected i,.icon-picker-modal__content .icon-element.is-selected svg{color:#fff}.icon-picker-modal__content .icon-element[hidden]{display:none}.icon-picker-modal__footer{margin-top:auto;padding-top:24px;align-self:flex-end} diff --git a/dist/themes/default.min.css b/dist/themes/default.min.css index a19d28b..a5da4a3 100644 --- a/dist/themes/default.min.css +++ b/dist/themes/default.min.css @@ -1,2 +1,2 @@ -/*! Icon Picker 1.2.1 MIT | https://github.com/AppoloDev/icon-picker */ +/*! Icon Picker 1.3.1 MIT | https://github.com/AppoloDev/icon-picker */ .icon-picker-modal[data-theme=default] .icon-picker-modal__header h2{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif}.icon-picker-modal[data-theme=default] .icon-picker-modal__search{background-color:#f6f9fd;border:1px solid #f4f7f9;border-radius:4px;padding:10px 16px;transition:border-color .3s ease,box-shadow .3s ease,background-color .3s ease}.icon-picker-modal[data-theme=default] .icon-picker-modal__search:focus,.icon-picker-modal[data-theme=default] .icon-picker-modal__search:focus-visible{box-shadow:0 0 0 4px rgba(9,131,253,.25);background-color:#fff;border-color:#086acc;outline:0}.icon-picker-modal[data-theme=default] .icon-picker-modal__footer .picker-save{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Helvetica Neue",Arial,sans-serif;color:#fff;background-color:#0983fd;border-radius:4px;padding:8px 16px;transition:background-color .3s ease}.icon-picker-modal[data-theme=default] .icon-picker-modal__footer .picker-save:hover{background-color:#0a72cc}.icon-picker-modal{position:fixed;left:0;top:0;bottom:0;right:0;z-index:100000;background-color:rgba(68,69,69,0);visibility:hidden;transition:background-color .3s ease-out,visibility .3s ease-out}.icon-picker-modal.is-visible{background-color:rgba(68,69,69,.6);visibility:visible}.icon-picker-modal.is-visible .icon-picker-modal__dialog{transform:translate(-50%, -50%);opacity:1}.icon-picker-modal__dialog{display:flex;flex-direction:column;position:absolute;left:50%;top:50%;z-index:1;height:440px;min-width:380px;opacity:0;transform:translate(-50%, -55%);transition:transform .3s ease-in-out,opacity .3s ease;padding:24px;background-color:#fff;border-radius:16px}.icon-picker-modal__header{display:flex;justify-content:space-between;align-items:center}.icon-picker-modal__header h2{margin-block-start:0;margin-block-end:0;font-size:24px}.icon-picker-modal__header .icon-picker-modal--close{cursor:pointer;margin-left:auto;-webkit-appearance:none;background:none;border:none;padding:2px;border-radius:4px;transition:background-color .3s ease}.icon-picker-modal__header .icon-picker-modal--close:hover{background-color:#f3f3f3}.icon-picker-modal__search{margin:32px 0 24px 0}.icon-picker-modal__content{display:grid;grid-template-columns:repeat(7, 40px);grid-gap:8px;overflow-y:scroll}.icon-picker-modal__content .is-empty{text-align:center;grid-column:1/-1}.icon-picker-modal__content .icon-element{display:flex;align-items:center;justify-content:center;border:1px solid #ced4da;border-radius:4px;background-color:rgba(0,0,0,0);height:40px;width:40px;cursor:pointer;transition:background-color .3s ease,border-color .3s ease}.icon-picker-modal__content .icon-element i,.icon-picker-modal__content .icon-element svg{font-size:24px;color:#0983fd}.icon-picker-modal__content .icon-element:hover{background-color:#0983fd;border-color:#0983fd}.icon-picker-modal__content .icon-element:hover i,.icon-picker-modal__content .icon-element:hover svg{color:#fff}.icon-picker-modal__content .icon-element.is-selected{background-color:#0983fd;border-color:#0983fd}.icon-picker-modal__content .icon-element.is-selected i,.icon-picker-modal__content .icon-element.is-selected svg{color:#fff}.icon-picker-modal__content .icon-element[hidden]{display:none}.icon-picker-modal__footer{margin-top:auto;padding-top:24px;align-self:flex-end} diff --git a/package.json b/package.json index 3a0dbca..1cd8f36 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vanilla-icon-picker", - "version": "1.3.0", + "version": "1.3.1", "description": "Icon picker - Vanilla JS icon picker", "keywords": [ "ux", diff --git a/src/js/IconPicker.js b/src/js/IconPicker.js index 58ef6fa..baf4583 100644 --- a/src/js/IconPicker.js +++ b/src/js/IconPicker.js @@ -265,7 +265,7 @@ export default class IconPicker { root.content.appendChild(iconTarget); - this.availableIcons.push({value: key, body: iconElement.outerHTML, ...(categories.length > 0 && {categories})}); + this.availableIcons.push({value: key, body: iconElement.outerHTML, ...(categories?.length > 0 && {categories})}); // Icon click event iconTarget.addEventListener('click', (evt) => { diff --git a/www/index.js b/www/index.js index 6041411..3794c62 100644 --- a/www/index.js +++ b/www/index.js @@ -5,9 +5,9 @@ const iconPickerInput = new IconPicker('input', { 'Iconoir', 'FontAwesome Solid 6', { - key: 'academicons', - prefix: 'ai ai-', - url: 'https://raw.githubusercontent.com/iconify/icon-sets/master/json/academicons.json' + key: 'gg', + prefix: 'gg-', + url: 'https://raw.githubusercontent.com/iconify/icon-sets/master/json/gg.json' } ], closeOnSelect: true @@ -26,13 +26,3 @@ iconPickerInput.on('select', (icon) => { }); // Icon picker with `default` theme -const iconPickerButton = new IconPicker('.btn', { - theme: 'default', - iconSource: ['FontAwesome Brands 6', 'FontAwesome Solid 6', 'FontAwesome Regular 6'], - closeOnSelect: true -}); - -const iconElementButton = document.querySelector('.icon-selected-text'); -iconPickerButton.on('select', (icon) => { - iconElementButton.innerHTML = `Icon selected – name: ${icon.name} & value: ${icon.value}`; -});