diff --git a/CHANGELOG.md b/CHANGELOG.md index f38503f..018eb8b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,13 @@ +## [1.2.1](https://github.com/nolanlawson/emoji-picker-element/compare/v1.2.0...v1.2.1) (2020-09-24) + + +### Bug Fixes + +* fix emoji support detection on Chrome on Mac ([#49](https://github.com/nolanlawson/emoji-picker-element/issues/49)) ([0a9e3bb](https://github.com/nolanlawson/emoji-picker-element/commit/0a9e3bb0734fbb868324dfaaf0e591b84ce6bccf)) +* fix ZWJ detection on windows ([#50](https://github.com/nolanlawson/emoji-picker-element/issues/50)) ([a467685](https://github.com/nolanlawson/emoji-picker-element/commit/a4676858801f51057c5831e5fed07b5fadf4748b)) + + + # [1.2.0](https://github.com/nolanlawson/emoji-picker-element/compare/v1.1.0...v1.2.0) (2020-09-13) diff --git a/docs/bundle.js b/docs/bundle.js index 39259cf..ee91dde 100644 --- a/docs/bundle.js +++ b/docs/bundle.js @@ -1 +1 @@ -var emojiPickerElement=function(e){"use strict";function t(e){if("string"!=typeof e||!e)throw new Error("expected a non-empty string, got: "+e)}function n(e){if("number"!=typeof e)throw new Error("expected a number, got: "+e)}const o="eTag",i="url";function r(e){return function(e,t){const n=new Set,o=[];for(const i of e){const e=t(i);n.has(e)||(n.add(e),o.push(i))}return o}(e,e=>e.unicode)}const a={},s={},c={};function l(e,t,n){n.onerror=()=>t(n.error),n.onblocked=()=>t(new Error("IDB blocked")),n.onsuccess=()=>e(n.result)}async function u(e){const t=await new Promise((t,n)=>{const o=indexedDB.open(e,1);a[e]=o,o.onupgradeneeded=e=>{const t=o.result;e.oldVersion<1&&function(e){function t(t,n,o){const i=n?e.createObjectStore(t,{keyPath:n}):e.createObjectStore(t);if(o)for(const[e,[t,n]]of Object.entries(o))i.createIndex(e,t,{multiEntry:n});return i}t("keyvalue"),t("emoji","unicode",{tokens:["tokens",!0],"group-order":[["group","order"]],skinUnicodes:["skinUnicodes",!0]}),t("favorites",void 0,{count:[""]})}(t)},l(t,n,o)});return t.onclose=()=>f(e),t}function d(e,t,n,o){return new Promise((i,r)=>{const a=e.transaction(t,n),s="string"==typeof t?a.objectStore(t):t.map(e=>a.objectStore(e));let c;o(s,e=>{c=e}),a.oncomplete=()=>i(c),a.onerror=()=>r(a.error)})}function f(e){const t=a[e],n=t&&t.result;if(n){n.close();const t=c[e];if(t)for(const e of t)e()}delete a[e],delete s[e],delete c[e]}const m=new Set([":D","xD",":'D","o:)",":x",":p",";p","xp",":l",":z",":j","8D","xo","8)",":B",":o",":s",":'o","Dx","x(","D:",":c",">0)",":3","!e.match(/\w/)||m.has(e)?e.toLowerCase():e.replace(/[)(:,]/g,"").replace(/’/g,"'").toLowerCase()).filter(Boolean)}function p(e,t,n,o){e[t](n).onsuccess=e=>o&&o(e.target.result)}function g(e,t,n){p(e,"get",t,n)}function b(e,t,n){p(e,"getAll",t,n)}function y(e,t){const n=function(e,t){let n=e[0];for(let o=1;ot(i)&&(n=i)}return n}(e,e=>e.length),o=[];for(const i of n)e.some(e=>-1===e.findIndex(e=>t(e)===t(i)))||o.push(i);return o}async function k(e,t,n,r){try{const a=function(e){return e.map(({annotation:e,emoticon:t,group:n,order:o,shortcodes:i,skins:r,tags:a,emoji:s,version:c})=>{const l=[...new Set([...i.map(h).flat(),...a.map(h).flat(),...h(e),t].filter(Boolean).map(e=>e.toLowerCase()).filter(e=>e.length>=2))].sort(),u={annotation:e,group:n,order:o,shortcodes:i,tags:a,tokens:l,unicode:s,version:c};if(t&&(u.emoticon=t),r){u.skinTones=[],u.skinUnicodes=[],u.skinVersions=[];for(const{tone:e,emoji:t,version:n}of r)u.skinTones.push(e),u.skinUnicodes.push(t),u.skinVersions.push(n)}return u})}(t);await d(e,["emoji","keyvalue"],"readwrite",([e,t])=>{let s,c,l,u=0;function d(){3==++u&&function(){if(s===r&&c===n)return;for(const t of l)e.delete(t);for(const t of a)e.put(t);t.put(r,o),t.put(n,i)}()}g(t,o,e=>{s=e,d()}),g(t,i,e=>{c=e,d()}),p(e,"getAllKeys",void 0,e=>{l=e,d()})})}finally{}}async function w(e,t){const n=h(t);return d(e,"emoji","readonly",(e,t)=>{const o=[],i=()=>{const e=y(o,e=>e.unicode);t(e.sort((e,t)=>e.order{o.push(e),o.length===n.length&&i()})}})}function v(e,t,n){return d(e,t,"readonly",(e,t)=>g(e,n,t))}const j=["name","shortcodes","url"];function $(e){!function(e){const t=e&&Array.isArray(e),n=t&&e.length&&(!e[0]||j.some(t=>!(t in e[0])));if(!t||n)throw new Error("Expected custom emojis to be in correct format")}(e);const t=(e,t)=>e.name.toLowerCase(){let o=n;for(let t=0;te[0][...new Set(e.shortcodes.map(e=>h(e)).flat())]),i=e=>o(e,!0),r=e=>o(e,!1),a=new Map,s=new Map;for(const t of e){s.set(t.name.toLowerCase(),t);for(const e of t.shortcodes)a.set(e.toLowerCase(),t)}return{all:n,search:e=>{const n=h(e);return y(n.map((e,t)=>(te.name).sort(t)},byShortcode:e=>a.get(e.toLowerCase()),byName:e=>s.get(e.toLowerCase())}}function x(e){if(!e)return e;if(delete e.tokens,e.skinTones){const t=e.skinTones.length;e.skins=Array(t);for(let n=0;n!(t in e[0])))throw new Error("Expected emojibase full (not compact) data, but data is in wrong format")}(o),[n,o]}async function T(e){const t=function(e){for(var t=e.length,n=new ArrayBuffer(t),o=new Uint8Array(n),i=-1;++iv(e,"keyvalue",t)));return r===n&&a===t}(e,t,r));else{if(!n){n=(await C(t))[1]}await k(e,n,t,r)}}class z{constructor({dataSource:e="https://cdn.jsdelivr.net/npm/emojibase-data@5/en/data.json",locale:t="en",customEmoji:n=[]}={}){this.dataSource=e,this.locale=t,this._dbName="emoji-picker-element-"+this.locale,this._db=void 0,this._lazyUpdate=void 0,this._custom=$(n),this._clear=this._clear.bind(this),this._ready=this._init()}async _init(){const e=this._db=await(t=this._dbName,s[t]||(s[t]=u(t)),s[t]);var t;!function(e,t){let n=c[e];n||(n=c[e]=[]),n.push(t)}(this._dbName,this._clear);const n=this.dataSource;await async function(e){return!await v(e,"keyvalue",i)}(e)?await async function(e,t){let[n,o]=await C(t);n||(n=await T(o)),await k(e,o,t,n)}(e,n):this._lazyUpdate=L(e,n)}async ready(){return this._ready||(this._ready=this._init()),this._ready}async getEmojiByGroup(e){return n(e),await this.ready(),r(await async function(e,t){return d(e,"emoji","readonly",(e,n)=>{const o=IDBKeyRange.bound([t,0],[t+1,0],!1,!0);b(e.index("group-order"),o,n)})}(this._db,e)).map(x)}async getEmojiBySearchQuery(e){t(e),await this.ready();return[...this._custom.search(e),...r(await w(this._db,e)).map(x)]}async getEmojiByShortcode(e){t(e),await this.ready();const n=this._custom.byShortcode(e);return n||x(await async function(e,t){return(await w(e,t)).filter(e=>e.shortcodes.map(e=>e.toLowerCase()).includes(t.toLowerCase()))[0]||null}(this._db,e))}async getEmojiByUnicodeOrName(e){t(e),await this.ready();const n=this._custom.byName(e);return n||x(await async function(e,t){return d(e,"emoji","readonly",(e,n)=>g(e,t,o=>{if(o)return n(o);g(e.index("skinUnicodes"),t,e=>n(e||null))}))}(this._db,e))}async getPreferredSkinTone(){return await this.ready(),await v(this._db,"keyvalue","skinTone")||0}async setPreferredSkinTone(e){return n(e),await this.ready(),t=this._db,o="skinTone",i=e,d(t,"keyvalue","readwrite",e=>e.put(i,o));var t,o,i}async incrementFavoriteEmojiCount(e){return t(e),await this.ready(),n=this._db,o=e,d(n,"favorites","readwrite",e=>{g(e,o,t=>e.put((t||0)+1,o))});var n,o}async getTopFavoriteEmoji(e){return n(e),await this.ready(),(await function(e,t,n){return 0===n?[]:d(e,["favorites","emoji"],"readonly",([e,o],i)=>{const r=[];e.index("count").openCursor(void 0,"prev").onsuccess=e=>{const a=e.target.result;if(!a)return i(r);function s(e){if(r.push(e),r.length===n)return i(r);a.continue()}const c=a.primaryKey,l=t.byName(c);if(l)return s(l);g(o,c,e=>{if(e)return s(e);a.continue()})}})}(this._db,this._custom,e)).map(x)}set customEmoji(e){this._custom=$(e)}get customEmoji(){return this._custom.all}async _shutdown(){await this.ready();try{await this._lazyUpdate}catch(e){}if(this._db)return!0}_clear(){this._dbName,this._db=this._ready=this._lazyUpdate=void 0}async close(){await this._shutdown()&&await f(this._dbName)}async delete(){var e;await this._shutdown()&&await(e=this._dbName,new Promise((t,n)=>{f(e),l(t,n,indexedDB.deleteDatabase(e))}))}}function A(){}function D(e){return e()}function B(){return Object.create(null)}function M(e){e.forEach(D)}function U(e){return"function"==typeof e}function N(e,t){return e!=e?t==t:e!==t||e&&"object"==typeof e||"function"==typeof e}function P(e){return e&&U(e.destroy)?e.destroy:A}function R(e,t){e.appendChild(t)}function I(e,t,n){e.insertBefore(t,n||null)}function O(e){e.parentNode.removeChild(e)}function F(e){return document.createElement(e)}function H(e){return document.createTextNode(e)}function V(e,t,n,o){return e.addEventListener(t,n,o),()=>e.removeEventListener(t,n,o)}function K(e,t,n){null==n?e.removeAttribute(t):e.getAttribute(t)!==n&&e.setAttribute(t,n)}function Y(e,t){t=""+t,e.wholeText!==t&&(e.data=t)}function q(e,t){e.value=null==t?"":t}function W(e,t,n,o){e.style.setProperty(t,n,o?"important":"")}let G;function Q(e){G=e}function X(){if(!G)throw new Error("Function called outside component initialization");return G}const J=[],Z=[],ee=[],te=[],ne=Promise.resolve();let oe=!1;function ie(){oe||(oe=!0,ne.then(le))}function re(){return ie(),ne}function ae(e){ee.push(e)}let se=!1;const ce=new Set;function le(){if(!se){se=!0;do{for(let e=0;ey.get(i)?(w.add(o),v(t)):(k.add(i),f--):(c(n,a),f--)}for(;f--;){const t=e[f];b.has(t.key)||c(t,a)}for(;m;)v(g[m-1]);return g}function ge(e,t,n,o,i,r,a=[-1]){const s=G;Q(e);const c=t.props||{},l=e.$$={fragment:null,ctx:null,props:r,update:A,not_equal:i,bound:B(),on_mount:[],on_destroy:[],before_update:[],after_update:[],context:new Map(s?s.$$.context:[]),callbacks:B(),dirty:a,skip_bound:!1};let u=!1;if(l.ctx=n?n(e,c,(t,n,...o)=>{const r=o.length?o[0]:n;return l.ctx&&i(l.ctx[t],l.ctx[t]=r)&&(!l.skip_bound&&l.bound[t]&&l.bound[t](r),u&&function(e,t){-1===e.$$.dirty[0]&&(J.push(e),ie(),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<{const t=i.map(D).filter(U);r?r.push(...t):M(t),e.$$.on_mount=[]}),a.forEach(ae)}(e,t.target,t.anchor),le()}Q(s)}let be;"function"==typeof HTMLElement&&(be=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){for(const e in this.$$.slotted)this.appendChild(this.$$.slotted[e])}attributeChangedCallback(e,t,n){this[e]=n}$destroy(){!function(e,t){const n=e.$$;null!==n.fragment&&(M(n.on_destroy),n.fragment&&n.fragment.d(t),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=A}$on(e,t){const n=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return n.push(t),()=>{const e=n.indexOf(t);-1!==e&&n.splice(e,1)}}$set(e){var t;this.$$set&&(t=e,0!==Object.keys(t).length)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}});var ye={categoriesLabel:"Categories",emojiUnsupportedMessage:"Your browser does not support color emoji.",favoritesLabel:"Favorites",loadingMessage:"Loading…",networkErrorMessage:"Could not load emoji. Try refreshing.",regionLabel:"Emoji picker",searchDescription:"When search results are available, press up or down to select and enter to choose.",searchLabel:"Search",searchResultsLabel:"Search results",skinToneDescription:"When expanded, press up or down to select and enter to choose.",skinToneLabel:"Choose a skin tone (currently {skinTone})",skinTonesLabel:"Skin tones",skinTones:["Default","Light","Medium-Light","Medium","Medium-Dark","Dark"],categories:{custom:"Custom","smileys-emotion":"Smileys and emoticons","people-body":"People and body","animals-nature":"Animals and nature","food-drink":"Food and drink","travel-places":"Travel and places",activities:"Activities",objects:"Objects",symbols:"Symbols",flags:"Flags"}};const ke=[[-1,"✨","custom"],[0,"πŸ˜€","smileys-emotion"],[1,"πŸ‘‹","people-body"],[3,"🐱","animals-nature"],[4,"🍎","food-drink"],[5,"🏠️","travel-places"],[6,"⚽","activities"],[7,"πŸ“","objects"],[8,"⛔️","symbols"],[9,"🏁","flags"]].map(([e,t,n])=>({id:e,emoji:t,name:n})),we=ke.slice(1),ve=ke[0],je="function"==typeof requestIdleCallback?requestIdleCallback:setTimeout;function $e(e){return e.unicode.includes("‍")}const xe={"πŸ˜ƒ":.6,"😐️":.7,"πŸ˜€":1,"πŸ‘οΈβ€πŸ—¨οΈ":2,"🀣":3,"πŸ‘±β€β™€οΈ":4,"🀩":5,"πŸ₯°":11,"πŸ₯»":12,"πŸ§‘β€πŸ¦°":12.1,"πŸ₯²":13},Ee="πŸ–οΈ",_e=["😊","πŸ˜’","β™₯️","πŸ‘οΈ","😍","πŸ˜‚","😭","☺️","πŸ˜”","😩","😏","πŸ’•","πŸ™Œ","😘"],Se='"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Twemoji Mozilla","Noto Color Emoji","EmojiOne Color","Android Emoji",sans-serif',Ce=(e,t)=>{try{const n=document.createElement("canvas");n.width=n.height=1;const o=n.getContext("2d");return o.textBaseline="top",o.font="100px "+Se,o.fillStyle=t,o.scale(.01,.01),o.fillText(e,0,0),o.getImageData(0,0,1,1).data}catch(e){}};function Te(e){const t=Ce(e,"#000"),n=Ce(e,"#fff");return t&&n&&((e,t)=>{const n=[...e].join(",");return n===[...t].join(",")&&"0,0,0,0"!==n})(t,n)}const Le=new Promise(e=>je(()=>e(function(){let e;for(const[t,n]of Object.entries(xe)){if(!Te(t))break;e=n}return e}()))),ze=new Map;function Ae(e){e.preventDefault(),e.stopPropagation()}function De(e,t,n){return(t+=e?-1:1)<0?t=n.length-1:t>=n.length&&(t=0),t}function Be(e,t){const n=new Set,o=[];for(const i of e){const e=t(i);n.has(e)||(n.add(e),o.push(i))}return o}const Me=requestAnimationFrame,Ue="function"==typeof ResizeObserver;function Ne(e,t){let n;return Ue?(n=new ResizeObserver(e=>t(e[0].contentRect.width)),n.observe(e)):Me(()=>t(e.getBoundingClientRect().width)),{destroy(){n&&n.disconnect()}}}function Pe(e){{const t=document.createRange();return t.selectNode(e.firstChild),t.getBoundingClientRect().width}}let Re;const{Map:Ie}=me;function Oe(e,t,n){const o=e.slice();return o[65]=t[n],o[67]=n,o}function Fe(e,t,n){const o=e.slice();return o[65]=t[n],o[67]=n,o}function He(e,t,n){const o=e.slice();return o[68]=t[n],o[67]=n,o}function Ve(e,t,n){const o=e.slice();return o[71]=t[n],o}function Ke(e,t,n){const o=e.slice();return o[74]=t[n],o[67]=n,o}function Ye(e,t){let n,o,i,r,a,s,c,l=t[74]+"";return{key:e,first:null,c(){n=F("div"),o=H(l),K(n,"id",i="skintone-"+t[67]),K(n,"class",r="emoji skintone-option cursor-pointer hide-focus "+(t[67]===t[15]?"active":"")),K(n,"aria-selected",a=t[67]===t[15]),K(n,"role","option"),K(n,"title",s=t[0].skinTones[t[67]]),K(n,"tabindex","-1"),K(n,"aria-label",c=t[0].skinTones[t[67]]),this.first=n},m(e,t){I(e,n,t),R(n,o)},p(e,t){524288&t[0]&&l!==(l=e[74]+"")&&Y(o,l),524288&t[0]&&i!==(i="skintone-"+e[67])&&K(n,"id",i),557056&t[0]&&r!==(r="emoji skintone-option cursor-pointer hide-focus "+(e[67]===e[15]?"active":""))&&K(n,"class",r),557056&t[0]&&a!==(a=e[67]===e[15])&&K(n,"aria-selected",a),524289&t[0]&&s!==(s=e[0].skinTones[e[67]])&&K(n,"title",s),524289&t[0]&&c!==(c=e[0].skinTones[e[67]])&&K(n,"aria-label",c)},d(e){e&&O(n)}}}function qe(e,t){let n,o,i,r,a,s,c,l,u,d=t[71].emoji+"";function f(...e){return t[46](t[71],...e)}return{key:e,first:null,c(){n=F("button"),o=F("div"),i=H(d),K(o,"class","emoji"),K(n,"role","tab"),K(n,"class","nav-button"),K(n,"aria-controls",r="tab-"+t[71].id),K(n,"aria-label",a=t[0].categories[t[71].name]),K(n,"aria-selected",s=!t[7]&&t[23].id===t[71].id),K(n,"title",c=t[0].categories[t[71].name]),this.first=n},m(e,t){I(e,n,t),R(n,o),R(o,i),l||(u=V(n,"click",f),l=!0)},p(e,o){t=e,4194304&o[0]&&d!==(d=t[71].emoji+"")&&Y(i,d),4194304&o[0]&&r!==(r="tab-"+t[71].id)&&K(n,"aria-controls",r),4194305&o[0]&&a!==(a=t[0].categories[t[71].name])&&K(n,"aria-label",a),12583040&o[0]&&s!==(s=!t[7]&&t[23].id===t[71].id)&&K(n,"aria-selected",s),4194305&o[0]&&c!==(c=t[0].categories[t[71].name])&&K(n,"title",c)},d(e){e&&O(n),l=!1,u()}}}function We(e){let t;return{c(){t=F("div"),K(t,"class","custom-emoji"),W(t,"background-image","url("+e[65].url+")")},m(e,n){I(e,t,n)},p(e,n){4&n[0]&&W(t,"background-image","url("+e[65].url+")")},d(e){e&&O(t)}}}function Ge(e){let t,n=nt(e[65],e[14])+"";return{c(){t=H(n)},m(e,n){I(e,t,n)},p(e,o){16388&o[0]&&n!==(n=nt(e[65],e[14])+"")&&Y(t,n)},d(e){e&&O(t)}}}function Qe(e,t){let n,o,i,r,a,s,c;function l(e,t){return e[65].unicode?Ge:We}let u=l(t),d=u(t);return{key:e,first:null,c(){n=F("button"),d.c(),K(n,"role",o=t[7]?"option":"menuitem"),K(n,"aria-selected",i=t[7]?t[67]==t[8]:""),K(n,"aria-label",r=t[26](t[65],t[14])),K(n,"title",a=t[65].title),K(n,"class",s="emoji "+(t[7]&&t[67]===t[8]?"active":"")),K(n,"id",c="emo-"+t[65].id),this.first=n},m(e,t){I(e,n,t),d.m(n,null)},p(e,t){u===(u=l(e))&&d?d.p(e,t):(d.d(1),d=u(e),d&&(d.c(),d.m(n,null))),128&t[0]&&o!==(o=e[7]?"option":"menuitem")&&K(n,"role",o),388&t[0]&&i!==(i=e[7]?e[67]==e[8]:"")&&K(n,"aria-selected",i),16388&t[0]&&r!==(r=e[26](e[65],e[14]))&&K(n,"aria-label",r),4&t[0]&&a!==(a=e[65].title)&&K(n,"title",a),388&t[0]&&s!==(s="emoji "+(e[7]&&e[67]===e[8]?"active":""))&&K(n,"class",s),4&t[0]&&c!==(c="emo-"+e[65].id)&&K(n,"id",c)},d(e){e&&O(n),d.d()}}}function Xe(e,t){let n,o,i,r,a,s,c,l,u,d,f,m=(t[7]?t[0].searchResultsLabel:t[68].category?t[68].category:t[2].length>1?t[0].categories.custom:t[0].categories[t[23].name])+"",h=[],p=new Ie,g=t[68].emojis;const b=e=>e[65].id;for(let e=0;e1?"":"gone")),K(n,"aria-hidden","true"),K(a,"class","emoji-menu"),K(a,"role",s=t[7]?"listbox":"menu"),K(a,"aria-labelledby",c="menu-label-"+t[67]),K(a,"id",l=t[7]?"search-results":""),this.first=n},m(e,i){I(e,n,i),R(n,o),I(e,a,i);for(let e=0;e1?e[0].categories.custom:e[0].categories[e[23].name])+"")&&Y(o,m),4&t[0]&&i!==(i="menu-label-"+e[67])&&K(n,"id",i),4&t[0]&&r!==(r="category "+(e[2].length>1?"":"gone"))&&K(n,"class",r),67125636&t[0]){const n=e[68].emojis;h=pe(h,t,b,1,e,n,p,a,he,Qe,null,Fe)}128&t[0]&&s!==(s=e[7]?"listbox":"menu")&&K(a,"role",s),4&t[0]&&c!==(c="menu-label-"+e[67])&&K(a,"aria-labelledby",c),128&t[0]&&l!==(l=e[7]?"search-results":"")&&K(a,"id",l)},d(e){e&&O(n),e&&O(a);for(let e=0;ee[74];for(let t=0;te[71].id;for(let t=0;te[68].category;for(let t=0;t<$e.length;t+=1){let n=He(e,$e,t),o=xe(n);ge.set(o,me[t]=Xe(o,n))}let Ee=e[20];const _e=e=>e[65].id;for(let t=0;tet?1:0)}=t,w=[],v=[],j="",$="",x=!1,E=-1,_=0,S="",C=!1,T=!1,L=0,A=0,D="",B=[],M=[],U=8,N=0,P=0,R=we,I=!1;function O(e){o.getRootNode().getElementById(e).focus()}function F(e,t){o.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}var H;function V(e){const t=o.getRootNode();!function(e,t,n){for(const o of e){const e=Pe(n(o));void 0===Re&&(Re=Pe(t));const i=e.toFixed(1)===Re.toFixed(1);ze.set(o.unicode,i),i||o.unicode}}(e,i,e=>t.getElementById("emo-"+e.id)),n(1,w=w)}function K(e){return!e.unicode||!$e(e)||ze.get(e.unicode)}async function Y(e){const t=await Le;return e.filter(({version:e})=>!e||e<=t)}async function q(e){return function(e,t){const n=e=>{const n={};for(const o of e)"number"==typeof o.tone&&o.version<=t&&(n[o.tone]=o.unicode);return n};return e.map(({unicode:e,skins:t,shortcodes:o,url:i,name:r,category:a})=>({unicode:e,name:r,shortcodes:o,url:i,category:a,id:e||r,skins:t&&n(t),title:o.join(", ")}))}(e,await Le)}function W(e){n(3,j=""),n(51,$=""),n(8,E=-1),n(55,P=R.findIndex(t=>t.id===e.id))}async function G(e){const t=await b.getEmojiByUnicodeOrName(e),o=[...w,...M].find(t=>t.id===e),i=o.unicode&&nt(o,L);await b.incrementFavoriteEmojiCount(e),n(53,u=u),F("emoji-click",{emoji:t,skinTone:L,...i&&{unicode:i},...o.name&&{name:o.name}})}async function Q(e){const{target:t}=e;if(!t.classList.contains("skintone-option"))return;Ae(e);const o=parseInt(t.id.slice(9),10);n(14,L=o),n(11,C=!1),O("skintone-button"),F("skin-tone-change",{skinTone:o}),b.setPreferredSkinTone(o)}Le.then(e=>{e||n(9,a=g.emojiUnsupportedMessage)}),H=async()=>{await re(),n(38,m=m||"en"),n(39,h=h||"https://cdn.jsdelivr.net/npm/emojibase-data@5/en/data.json")},X().$$.on_mount.push(H),function(e){X().$$.on_destroy.push(e)}(async()=>{b&&await b.close()});return e.$$set=e=>{"locale"in e&&n(38,m=e.locale),"dataSource"in e&&n(39,h=e.dataSource),"skinToneEmoji"in e&&n(41,p=e.skinToneEmoji),"i18n"in e&&n(0,g=e.i18n),"database"in e&&n(40,b=e.database),"customEmoji"in e&&n(42,y=e.customEmoji),"customCategorySorting"in e&&n(43,k=e.customCategorySorting)},e.$$.update=()=>{if(896&e.$$.dirty[1]&&m&&h&&(!b||b.locale!==m&&b.dataSource!==h)&&n(40,b=new z({dataSource:h,locale:m})),2560&e.$$.dirty[1]&&y&&b&&n(40,b.customEmoji=y,b),513&e.$$.dirty[0]|512&e.$$.dirty[1]){b&&async function(){const e=setTimeout(()=>{n(9,a=g.loadingMessage)},1e3);try{await b.ready(),n(24,I=!0)}catch(e){console.error(e),n(9,a=g.networkErrorMessage)}finally{clearTimeout(e),a===g.loadingMessage&&n(9,a="")}}()}if(4194304&e.$$.dirty[0]|2048&e.$$.dirty[1]&&(y&&y.length?n(22,R=[ve,...we]):R!==we&&n(22,R=we)),8&e.$$.dirty[0]&&je(()=>{n(51,$=(j||"").trim()),n(8,E=-1)}),4194304&e.$$.dirty[0]|16777216&e.$$.dirty[1]&&n(23,d=R[P]),8388608&e.$$.dirty[0]|1049088&e.$$.dirty[1]){!async function(){b?$.length>=2?(n(1,w=await async function(e){return q(await Y(await b.getEmojiBySearchQuery(e)))}($)),n(7,x=!0)):d&&(n(1,w=await async function(e){if(void 0===e)return[];const t=-1===e?y:await b.getEmojiByGroup(e);return q(await Y(t))}(d.id)),n(7,x=!1)):(n(1,w=[]),n(7,x=!1))}()}if(4194432&e.$$.dirty[0]&&n(17,l=`\n --font-family: ${Se};\n --num-groups: ${R.length}; \n --indicator-opacity: ${x?0:1}; \n --num-skintones: 6;`),512&e.$$.dirty[1]){!async function(){b&&n(14,L=await b.getPreferredSkinTone())}()}if(1024&e.$$.dirty[1]&&n(19,B=Array(6).fill().map((e,t)=>function(e,t){if(0===t)return e;const n=e.indexOf("‍");return-1!==n?e.substring(0,n)+String.fromCodePoint(127995+t-1)+e.substring(n):(e.endsWith("️")&&(e=e.substring(0,e.length-1)),e+"\ud83c"+String.fromCodePoint(57339+t-1))}(p,t))),540672&e.$$.dirty[0]&&n(16,c=B[L]),16385&e.$$.dirty[0]&&n(18,D=g.skinToneLabel.replace("{skinTone}",g.skinTones[L])),512&e.$$.dirty[1]){b&&async function(){n(53,u=(await Promise.all(_e.map(e=>b.getEmojiByUnicodeOrName(e)))).filter(Boolean))}()}if(12583424&e.$$.dirty[1]){b&&u&&async function(){const e=await b.getTopFavoriteEmoji(U),t=await q(Be([...e,...u],e=>e.unicode||e.name).slice(0,U));n(20,M=t)}()}if(18874368&e.$$.dirty[1]&&n(10,S=Ue?`transform: translateX(${P*_}px);`:`transform: translateX(${100*P}%);`),2&e.$$.dirty[0]){const e=w.filter(e=>e.unicode).filter(e=>$e(e)&&!ze.has(e.unicode));e.length?Me(()=>V(e)):(n(1,w=w.filter(K)),Me(()=>{n(6,r.scrollTop=0,r)}))}if(e.$$.dirty[0],e.$$.dirty[1],130&e.$$.dirty[0]|4096&e.$$.dirty[1]){n(2,v=function(){if(x)return[{category:"",emojis:w}];const e=new Map;for(const t of w){const n=t.category||"";let o=e.get(n);o||(o=[],e.set(n,o)),o.push(t)}return[...e.entries()].map(([e,t])=>({category:e,emojis:t})).sort((e,t)=>k(e.category,t.category))}())}258&e.$$.dirty[0]&&n(25,f=-1!==E&&w[E].id),10240&e.$$.dirty[0]&&(C?s.addEventListener("transitionend",()=>{n(12,T=!0)},{once:!0}):n(12,T=!1))},[g,w,v,j,o,i,r,x,E,a,S,C,T,s,L,A,c,l,D,B,M,N,R,d,I,f,function(e,t){return(n=[e.name||nt(e,t),...e.shortcodes],Be(n,e=>e)).join(", ");var n},function(e){return Ne(e,t=>{const i=parseInt(getComputedStyle(o).getPropertyValue("--num-columns"),10),r=e.parentElement.getBoundingClientRect().width-t;n(54,U=i),n(21,N=r)})},function(e){return Ne(e,e=>{n(52,_=e)})},function(e){if(!x||!w.length)return;const t=t=>{Ae(e),n(8,E=De(t,E,w))};switch(e.key){case"ArrowDown":return t(!1);case"ArrowUp":return t(!0);case"Enter":if(-1!==E)return Ae(e),G(w[E].id);w.length&&n(8,E=0)}},W,function(e){const{target:t,key:n}=e,o=t=>{t&&(Ae(e),t.focus())};switch(n){case"ArrowLeft":return o(t.previousSibling);case"ArrowRight":return o(t.nextSibling);case"Home":return o(t.parentElement.firstChild);case"End":return o(t.parentElement.lastChild)}},async function(e){const{target:t}=e;if(!t.classList.contains("emoji"))return;Ae(e),G(t.id.substring(4))},Q,async function(e){n(11,C=!C),n(15,A=L),C&&(Ae(e),Me(()=>O("skintone-"+A)))},function(e){if(!C)return;const t=async t=>{Ae(e),n(15,A=t),await re(),O("skintone-"+A)};switch(e.key){case"ArrowUp":return t(De(!0,A,B));case"ArrowDown":return t(De(!1,A,B));case"Home":return t(0);case"End":return t(B.length-1);case"Enter":return Q(e);case"Escape":return Ae(e),O("skintone-button")}},function(e){if(C)switch(e.key){case" ":return Q(e)}},async function(e){const{relatedTarget:t}=e;t&&t.classList.contains("skintone-option")||n(11,C=!1)},m,h,b,p,y,k,function(){j=this.value,n(3,j)},function(e){Z[e?"unshift":"push"](()=>{s=e,n(13,s)})},e=>W(e),function(e){Z[e?"unshift":"push"](()=>{r=e,n(6,r),n(1,w),n(40,b),n(51,$),n(23,d),n(38,m),n(39,h),n(42,y),n(3,j),n(22,R),n(55,P)})},function(e){Z[e?"unshift":"push"](()=>{i=e,n(5,i)})},function(e){Z[e?"unshift":"push"](()=>{o=e,n(4,o)})}]}class it extends be{constructor(e){super(),this.shadowRoot.innerHTML="",ge(this,{target:this.shadowRoot},ot,tt,N,{locale:38,dataSource:39,skinToneEmoji:41,i18n:0,database:40,customEmoji:42,customCategorySorting:43},[-1,-1,-1]),e&&(e.target&&I(e.target,this,e.anchor),e.props&&(this.$set(e.props),le()))}static get observedAttributes(){return["locale","dataSource","skinToneEmoji","i18n","database","customEmoji","customCategorySorting"]}get locale(){return this.$$.ctx[38]}set locale(e){this.$set({locale:e}),le()}get dataSource(){return this.$$.ctx[39]}set dataSource(e){this.$set({dataSource:e}),le()}get skinToneEmoji(){return this.$$.ctx[41]}set skinToneEmoji(e){this.$set({skinToneEmoji:e}),le()}get i18n(){return this.$$.ctx[0]}set i18n(e){this.$set({i18n:e}),le()}get database(){return this.$$.ctx[40]}set database(e){this.$set({database:e}),le()}get customEmoji(){return this.$$.ctx[42]}set customEmoji(e){this.$set({customEmoji:e}),le()}get customCategorySorting(){return this.$$.ctx[43]}set customCategorySorting(e){this.$set({customCategorySorting:e}),le()}}class rt extends it{constructor(e){super({props:e})}disconnectedCallback(){this.$destroy()}static get observedAttributes(){return["locale","data-source","skin-tone-emoji"]}attributeChangedCallback(e,t,n){super.attributeChangedCallback(e.replace(/-([a-z])/g,(e,t)=>t.toUpperCase()),t,n)}}return customElements.define("emoji-picker",rt),e.Database=z,e.Picker=rt,e}({}); +var emojiPickerElement=function(e){"use strict";function t(e){if("string"!=typeof e||!e)throw new Error("expected a non-empty string, got: "+e)}function n(e){if("number"!=typeof e)throw new Error("expected a number, got: "+e)}const o="eTag",i="url";function r(e){return function(e,t){const n=new Set,o=[];for(const i of e){const e=t(i);n.has(e)||(n.add(e),o.push(i))}return o}(e,e=>e.unicode)}const a={},s={},c={};function l(e,t,n){n.onerror=()=>t(n.error),n.onblocked=()=>t(new Error("IDB blocked")),n.onsuccess=()=>e(n.result)}async function u(e){const t=await new Promise((t,n)=>{const o=indexedDB.open(e,1);a[e]=o,o.onupgradeneeded=e=>{const t=o.result;e.oldVersion<1&&function(e){function t(t,n,o){const i=n?e.createObjectStore(t,{keyPath:n}):e.createObjectStore(t);if(o)for(const[e,[t,n]]of Object.entries(o))i.createIndex(e,t,{multiEntry:n});return i}t("keyvalue"),t("emoji","unicode",{tokens:["tokens",!0],"group-order":[["group","order"]],skinUnicodes:["skinUnicodes",!0]}),t("favorites",void 0,{count:[""]})}(t)},l(t,n,o)});return t.onclose=()=>f(e),t}function d(e,t,n,o){return new Promise((i,r)=>{const a=e.transaction(t,n),s="string"==typeof t?a.objectStore(t):t.map(e=>a.objectStore(e));let c;o(s,e=>{c=e}),a.oncomplete=()=>i(c),a.onerror=()=>r(a.error)})}function f(e){const t=a[e],n=t&&t.result;if(n){n.close();const t=c[e];if(t)for(const e of t)e()}delete a[e],delete s[e],delete c[e]}const m=new Set([":D","xD",":'D","o:)",":x",":p",";p","xp",":l",":z",":j","8D","xo","8)",":B",":o",":s",":'o","Dx","x(","D:",":c",">0)",":3","!e.match(/\w/)||m.has(e)?e.toLowerCase():e.replace(/[)(:,]/g,"").replace(/’/g,"'").toLowerCase()).filter(Boolean)}function p(e,t,n,o){e[t](n).onsuccess=e=>o&&o(e.target.result)}function g(e,t,n){p(e,"get",t,n)}function b(e,t,n){p(e,"getAll",t,n)}function y(e,t){const n=function(e,t){let n=e[0];for(let o=1;ot(i)&&(n=i)}return n}(e,e=>e.length),o=[];for(const i of n)e.some(e=>-1===e.findIndex(e=>t(e)===t(i)))||o.push(i);return o}async function k(e,t,n,r){try{const a=function(e){return e.map(({annotation:e,emoticon:t,group:n,order:o,shortcodes:i,skins:r,tags:a,emoji:s,version:c})=>{const l=[...new Set([...i.map(h).flat(),...a.map(h).flat(),...h(e),t].filter(Boolean).map(e=>e.toLowerCase()).filter(e=>e.length>=2))].sort(),u={annotation:e,group:n,order:o,shortcodes:i,tags:a,tokens:l,unicode:s,version:c};if(t&&(u.emoticon=t),r){u.skinTones=[],u.skinUnicodes=[],u.skinVersions=[];for(const{tone:e,emoji:t,version:n}of r)u.skinTones.push(e),u.skinUnicodes.push(t),u.skinVersions.push(n)}return u})}(t);await d(e,["emoji","keyvalue"],"readwrite",([e,t])=>{let s,c,l,u=0;function d(){3==++u&&function(){if(s===r&&c===n)return;for(const t of l)e.delete(t);for(const t of a)e.put(t);t.put(r,o),t.put(n,i)}()}g(t,o,e=>{s=e,d()}),g(t,i,e=>{c=e,d()}),p(e,"getAllKeys",void 0,e=>{l=e,d()})})}finally{}}async function w(e,t){const n=h(t);return d(e,"emoji","readonly",(e,t)=>{const o=[],i=()=>{const e=y(o,e=>e.unicode);t(e.sort((e,t)=>e.order{o.push(e),o.length===n.length&&i()})}})}function v(e,t,n){return d(e,t,"readonly",(e,t)=>g(e,n,t))}const j=["name","shortcodes","url"];function $(e){!function(e){const t=e&&Array.isArray(e),n=t&&e.length&&(!e[0]||j.some(t=>!(t in e[0])));if(!t||n)throw new Error("Expected custom emojis to be in correct format")}(e);const t=(e,t)=>e.name.toLowerCase(){let o=n;for(let t=0;te[0][...new Set(e.shortcodes.map(e=>h(e)).flat())]),i=e=>o(e,!0),r=e=>o(e,!1),a=new Map,s=new Map;for(const t of e){s.set(t.name.toLowerCase(),t);for(const e of t.shortcodes)a.set(e.toLowerCase(),t)}return{all:n,search:e=>{const n=h(e);return y(n.map((e,t)=>(te.name).sort(t)},byShortcode:e=>a.get(e.toLowerCase()),byName:e=>s.get(e.toLowerCase())}}function x(e){if(!e)return e;if(delete e.tokens,e.skinTones){const t=e.skinTones.length;e.skins=Array(t);for(let n=0;n!(t in e[0])))throw new Error("Expected emojibase full (not compact) data, but data is in wrong format")}(o),[n,o]}async function T(e){const t=function(e){for(var t=e.length,n=new ArrayBuffer(t),o=new Uint8Array(n),i=-1;++iv(e,"keyvalue",t)));return r===n&&a===t}(e,t,r));else{if(!n){n=(await C(t))[1]}await k(e,n,t,r)}}class z{constructor({dataSource:e="https://cdn.jsdelivr.net/npm/emojibase-data@5/en/data.json",locale:t="en",customEmoji:n=[]}={}){this.dataSource=e,this.locale=t,this._dbName="emoji-picker-element-"+this.locale,this._db=void 0,this._lazyUpdate=void 0,this._custom=$(n),this._clear=this._clear.bind(this),this._ready=this._init()}async _init(){const e=this._db=await(t=this._dbName,s[t]||(s[t]=u(t)),s[t]);var t;!function(e,t){let n=c[e];n||(n=c[e]=[]),n.push(t)}(this._dbName,this._clear);const n=this.dataSource;await async function(e){return!await v(e,"keyvalue",i)}(e)?await async function(e,t){let[n,o]=await C(t);n||(n=await T(o)),await k(e,o,t,n)}(e,n):this._lazyUpdate=L(e,n)}async ready(){return this._ready||(this._ready=this._init()),this._ready}async getEmojiByGroup(e){return n(e),await this.ready(),r(await async function(e,t){return d(e,"emoji","readonly",(e,n)=>{const o=IDBKeyRange.bound([t,0],[t+1,0],!1,!0);b(e.index("group-order"),o,n)})}(this._db,e)).map(x)}async getEmojiBySearchQuery(e){t(e),await this.ready();return[...this._custom.search(e),...r(await w(this._db,e)).map(x)]}async getEmojiByShortcode(e){t(e),await this.ready();const n=this._custom.byShortcode(e);return n||x(await async function(e,t){return(await w(e,t)).filter(e=>e.shortcodes.map(e=>e.toLowerCase()).includes(t.toLowerCase()))[0]||null}(this._db,e))}async getEmojiByUnicodeOrName(e){t(e),await this.ready();const n=this._custom.byName(e);return n||x(await async function(e,t){return d(e,"emoji","readonly",(e,n)=>g(e,t,o=>{if(o)return n(o);g(e.index("skinUnicodes"),t,e=>n(e||null))}))}(this._db,e))}async getPreferredSkinTone(){return await this.ready(),await v(this._db,"keyvalue","skinTone")||0}async setPreferredSkinTone(e){return n(e),await this.ready(),t=this._db,o="skinTone",i=e,d(t,"keyvalue","readwrite",e=>e.put(i,o));var t,o,i}async incrementFavoriteEmojiCount(e){return t(e),await this.ready(),n=this._db,o=e,d(n,"favorites","readwrite",e=>{g(e,o,t=>e.put((t||0)+1,o))});var n,o}async getTopFavoriteEmoji(e){return n(e),await this.ready(),(await function(e,t,n){return 0===n?[]:d(e,["favorites","emoji"],"readonly",([e,o],i)=>{const r=[];e.index("count").openCursor(void 0,"prev").onsuccess=e=>{const a=e.target.result;if(!a)return i(r);function s(e){if(r.push(e),r.length===n)return i(r);a.continue()}const c=a.primaryKey,l=t.byName(c);if(l)return s(l);g(o,c,e=>{if(e)return s(e);a.continue()})}})}(this._db,this._custom,e)).map(x)}set customEmoji(e){this._custom=$(e)}get customEmoji(){return this._custom.all}async _shutdown(){await this.ready();try{await this._lazyUpdate}catch(e){}if(this._db)return!0}_clear(){this._dbName,this._db=this._ready=this._lazyUpdate=void 0}async close(){await this._shutdown()&&await f(this._dbName)}async delete(){var e;await this._shutdown()&&await(e=this._dbName,new Promise((t,n)=>{f(e),l(t,n,indexedDB.deleteDatabase(e))}))}}function A(){}function D(e){return e()}function B(){return Object.create(null)}function M(e){e.forEach(D)}function U(e){return"function"==typeof e}function N(e,t){return e!=e?t==t:e!==t||e&&"object"==typeof e||"function"==typeof e}function P(e){return e&&U(e.destroy)?e.destroy:A}function R(e,t){e.appendChild(t)}function I(e,t,n){e.insertBefore(t,n||null)}function O(e){e.parentNode.removeChild(e)}function F(e){return document.createElement(e)}function H(e){return document.createTextNode(e)}function V(e,t,n,o){return e.addEventListener(t,n,o),()=>e.removeEventListener(t,n,o)}function K(e,t,n){null==n?e.removeAttribute(t):e.getAttribute(t)!==n&&e.setAttribute(t,n)}function Y(e,t){t=""+t,e.wholeText!==t&&(e.data=t)}function q(e,t){e.value=null==t?"":t}function W(e,t,n,o){e.style.setProperty(t,n,o?"important":"")}let G;function Q(e){G=e}function X(){if(!G)throw new Error("Function called outside component initialization");return G}const J=[],Z=[],ee=[],te=[],ne=Promise.resolve();let oe=!1;function ie(){oe||(oe=!0,ne.then(le))}function re(){return ie(),ne}function ae(e){ee.push(e)}let se=!1;const ce=new Set;function le(){if(!se){se=!0;do{for(let e=0;ey.get(i)?(w.add(o),v(t)):(k.add(i),f--):(c(n,a),f--)}for(;f--;){const t=e[f];b.has(t.key)||c(t,a)}for(;m;)v(g[m-1]);return g}function ge(e,t,n,o,i,r,a=[-1]){const s=G;Q(e);const c=t.props||{},l=e.$$={fragment:null,ctx:null,props:r,update:A,not_equal:i,bound:B(),on_mount:[],on_destroy:[],before_update:[],after_update:[],context:new Map(s?s.$$.context:[]),callbacks:B(),dirty:a,skip_bound:!1};let u=!1;if(l.ctx=n?n(e,c,(t,n,...o)=>{const r=o.length?o[0]:n;return l.ctx&&i(l.ctx[t],l.ctx[t]=r)&&(!l.skip_bound&&l.bound[t]&&l.bound[t](r),u&&function(e,t){-1===e.$$.dirty[0]&&(J.push(e),ie(),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<{const t=i.map(D).filter(U);r?r.push(...t):M(t),e.$$.on_mount=[]}),a.forEach(ae)}(e,t.target,t.anchor),le()}Q(s)}let be;"function"==typeof HTMLElement&&(be=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){for(const e in this.$$.slotted)this.appendChild(this.$$.slotted[e])}attributeChangedCallback(e,t,n){this[e]=n}$destroy(){!function(e,t){const n=e.$$;null!==n.fragment&&(M(n.on_destroy),n.fragment&&n.fragment.d(t),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=A}$on(e,t){const n=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return n.push(t),()=>{const e=n.indexOf(t);-1!==e&&n.splice(e,1)}}$set(e){var t;this.$$set&&(t=e,0!==Object.keys(t).length)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}});var ye={categoriesLabel:"Categories",emojiUnsupportedMessage:"Your browser does not support color emoji.",favoritesLabel:"Favorites",loadingMessage:"Loading…",networkErrorMessage:"Could not load emoji. Try refreshing.",regionLabel:"Emoji picker",searchDescription:"When search results are available, press up or down to select and enter to choose.",searchLabel:"Search",searchResultsLabel:"Search results",skinToneDescription:"When expanded, press up or down to select and enter to choose.",skinToneLabel:"Choose a skin tone (currently {skinTone})",skinTonesLabel:"Skin tones",skinTones:["Default","Light","Medium-Light","Medium","Medium-Dark","Dark"],categories:{custom:"Custom","smileys-emotion":"Smileys and emoticons","people-body":"People and body","animals-nature":"Animals and nature","food-drink":"Food and drink","travel-places":"Travel and places",activities:"Activities",objects:"Objects",symbols:"Symbols",flags:"Flags"}};const ke=[[-1,"✨","custom"],[0,"πŸ˜€","smileys-emotion"],[1,"πŸ‘‹","people-body"],[3,"🐱","animals-nature"],[4,"🍎","food-drink"],[5,"🏠️","travel-places"],[6,"⚽","activities"],[7,"πŸ“","objects"],[8,"⛔️","symbols"],[9,"🏁","flags"]].map(([e,t,n])=>({id:e,emoji:t,name:n})),we=ke.slice(1),ve=ke[0],je="function"==typeof requestIdleCallback?requestIdleCallback:setTimeout;function $e(e){return e.unicode.includes("‍")}const xe={"πŸ˜ƒ":.6,"😐️":.7,"πŸ˜€":1,"πŸ‘οΈβ€πŸ—¨οΈ":2,"🀣":3,"πŸ‘±β€β™€οΈ":4,"🀩":5,"πŸ₯°":11,"πŸ₯»":12,"πŸ§‘β€πŸ¦°":12.1,"πŸ₯²":13},Ee="πŸ–οΈ",_e=["😊","πŸ˜’","β™₯️","πŸ‘οΈ","😍","πŸ˜‚","😭","☺️","πŸ˜”","😩","😏","πŸ’•","πŸ™Œ","😘"],Se='"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Twemoji Mozilla","Noto Color Emoji","EmojiOne Color","Android Emoji",sans-serif',Ce=(e,t)=>{try{const n=document.createElement("canvas");n.width=n.height=1;const o=n.getContext("2d");return o.textBaseline="top",o.font="100px "+Se,o.fillStyle=t,o.scale(.01,.01),o.fillText(e,0,0),o.getImageData(0,0,1,1).data}catch(e){}};function Te(e){const t=Ce(e,"#000"),n=Ce(e,"#fff");return t&&n&&((e,t)=>{const n=[...e].join(",");return n===[...t].join(",")&&!n.startsWith("0,0,0,")})(t,n)}const Le=new Promise(e=>je(()=>e(function(){let e;for(const[t,n]of Object.entries(xe)){if(!Te(t))break;e=n}return e}()))),ze=new Map;function Ae(e){e.preventDefault(),e.stopPropagation()}function De(e,t,n){return(t+=e?-1:1)<0?t=n.length-1:t>=n.length&&(t=0),t}function Be(e,t){const n=new Set,o=[];for(const i of e){const e=t(i);n.has(e)||(n.add(e),o.push(i))}return o}const Me=requestAnimationFrame,Ue="function"==typeof ResizeObserver;function Ne(e,t){let n;return Ue?(n=new ResizeObserver(e=>t(e[0].contentRect.width)),n.observe(e)):Me(()=>t(e.getBoundingClientRect().width)),{destroy(){n&&n.disconnect()}}}function Pe(e){{const t=document.createRange();return t.selectNode(e.firstChild),t.getBoundingClientRect().width}}let Re;const{Map:Ie}=me;function Oe(e,t,n){const o=e.slice();return o[65]=t[n],o[67]=n,o}function Fe(e,t,n){const o=e.slice();return o[65]=t[n],o[67]=n,o}function He(e,t,n){const o=e.slice();return o[68]=t[n],o[67]=n,o}function Ve(e,t,n){const o=e.slice();return o[71]=t[n],o}function Ke(e,t,n){const o=e.slice();return o[74]=t[n],o[67]=n,o}function Ye(e,t){let n,o,i,r,a,s,c,l=t[74]+"";return{key:e,first:null,c(){n=F("div"),o=H(l),K(n,"id",i="skintone-"+t[67]),K(n,"class",r="emoji skintone-option cursor-pointer hide-focus "+(t[67]===t[15]?"active":"")),K(n,"aria-selected",a=t[67]===t[15]),K(n,"role","option"),K(n,"title",s=t[0].skinTones[t[67]]),K(n,"tabindex","-1"),K(n,"aria-label",c=t[0].skinTones[t[67]]),this.first=n},m(e,t){I(e,n,t),R(n,o)},p(e,t){524288&t[0]&&l!==(l=e[74]+"")&&Y(o,l),524288&t[0]&&i!==(i="skintone-"+e[67])&&K(n,"id",i),557056&t[0]&&r!==(r="emoji skintone-option cursor-pointer hide-focus "+(e[67]===e[15]?"active":""))&&K(n,"class",r),557056&t[0]&&a!==(a=e[67]===e[15])&&K(n,"aria-selected",a),524289&t[0]&&s!==(s=e[0].skinTones[e[67]])&&K(n,"title",s),524289&t[0]&&c!==(c=e[0].skinTones[e[67]])&&K(n,"aria-label",c)},d(e){e&&O(n)}}}function qe(e,t){let n,o,i,r,a,s,c,l,u,d=t[71].emoji+"";function f(...e){return t[46](t[71],...e)}return{key:e,first:null,c(){n=F("button"),o=F("div"),i=H(d),K(o,"class","emoji"),K(n,"role","tab"),K(n,"class","nav-button"),K(n,"aria-controls",r="tab-"+t[71].id),K(n,"aria-label",a=t[0].categories[t[71].name]),K(n,"aria-selected",s=!t[7]&&t[23].id===t[71].id),K(n,"title",c=t[0].categories[t[71].name]),this.first=n},m(e,t){I(e,n,t),R(n,o),R(o,i),l||(u=V(n,"click",f),l=!0)},p(e,o){t=e,4194304&o[0]&&d!==(d=t[71].emoji+"")&&Y(i,d),4194304&o[0]&&r!==(r="tab-"+t[71].id)&&K(n,"aria-controls",r),4194305&o[0]&&a!==(a=t[0].categories[t[71].name])&&K(n,"aria-label",a),12583040&o[0]&&s!==(s=!t[7]&&t[23].id===t[71].id)&&K(n,"aria-selected",s),4194305&o[0]&&c!==(c=t[0].categories[t[71].name])&&K(n,"title",c)},d(e){e&&O(n),l=!1,u()}}}function We(e){let t;return{c(){t=F("div"),K(t,"class","custom-emoji"),W(t,"background-image","url("+e[65].url+")")},m(e,n){I(e,t,n)},p(e,n){4&n[0]&&W(t,"background-image","url("+e[65].url+")")},d(e){e&&O(t)}}}function Ge(e){let t,n=nt(e[65],e[14])+"";return{c(){t=H(n)},m(e,n){I(e,t,n)},p(e,o){16388&o[0]&&n!==(n=nt(e[65],e[14])+"")&&Y(t,n)},d(e){e&&O(t)}}}function Qe(e,t){let n,o,i,r,a,s,c;function l(e,t){return e[65].unicode?Ge:We}let u=l(t),d=u(t);return{key:e,first:null,c(){n=F("button"),d.c(),K(n,"role",o=t[7]?"option":"menuitem"),K(n,"aria-selected",i=t[7]?t[67]==t[8]:""),K(n,"aria-label",r=t[26](t[65],t[14])),K(n,"title",a=t[65].title),K(n,"class",s="emoji "+(t[7]&&t[67]===t[8]?"active":"")),K(n,"id",c="emo-"+t[65].id),this.first=n},m(e,t){I(e,n,t),d.m(n,null)},p(e,t){u===(u=l(e))&&d?d.p(e,t):(d.d(1),d=u(e),d&&(d.c(),d.m(n,null))),128&t[0]&&o!==(o=e[7]?"option":"menuitem")&&K(n,"role",o),388&t[0]&&i!==(i=e[7]?e[67]==e[8]:"")&&K(n,"aria-selected",i),16388&t[0]&&r!==(r=e[26](e[65],e[14]))&&K(n,"aria-label",r),4&t[0]&&a!==(a=e[65].title)&&K(n,"title",a),388&t[0]&&s!==(s="emoji "+(e[7]&&e[67]===e[8]?"active":""))&&K(n,"class",s),4&t[0]&&c!==(c="emo-"+e[65].id)&&K(n,"id",c)},d(e){e&&O(n),d.d()}}}function Xe(e,t){let n,o,i,r,a,s,c,l,u,d,f,m=(t[7]?t[0].searchResultsLabel:t[68].category?t[68].category:t[2].length>1?t[0].categories.custom:t[0].categories[t[23].name])+"",h=[],p=new Ie,g=t[68].emojis;const b=e=>e[65].id;for(let e=0;e1?"":"gone")),K(n,"aria-hidden","true"),K(a,"class","emoji-menu"),K(a,"role",s=t[7]?"listbox":"menu"),K(a,"aria-labelledby",c="menu-label-"+t[67]),K(a,"id",l=t[7]?"search-results":""),this.first=n},m(e,i){I(e,n,i),R(n,o),I(e,a,i);for(let e=0;e1?e[0].categories.custom:e[0].categories[e[23].name])+"")&&Y(o,m),4&t[0]&&i!==(i="menu-label-"+e[67])&&K(n,"id",i),4&t[0]&&r!==(r="category "+(e[2].length>1?"":"gone"))&&K(n,"class",r),67125636&t[0]){const n=e[68].emojis;h=pe(h,t,b,1,e,n,p,a,he,Qe,null,Fe)}128&t[0]&&s!==(s=e[7]?"listbox":"menu")&&K(a,"role",s),4&t[0]&&c!==(c="menu-label-"+e[67])&&K(a,"aria-labelledby",c),128&t[0]&&l!==(l=e[7]?"search-results":"")&&K(a,"id",l)},d(e){e&&O(n),e&&O(a);for(let e=0;ee[74];for(let t=0;te[71].id;for(let t=0;te[68].category;for(let t=0;t<$e.length;t+=1){let n=He(e,$e,t),o=xe(n);ge.set(o,me[t]=Xe(o,n))}let Ee=e[20];const _e=e=>e[65].id;for(let t=0;tet?1:0)}=t,w=[],v=[],j="",$="",x=!1,E=-1,_=0,S="",C=!1,T=!1,L=0,A=0,D="",B=[],M=[],U=8,N=0,P=0,R=we,I=!1;function O(e){o.getRootNode().getElementById(e).focus()}function F(e,t){o.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}var H;function V(e){const t=o.getRootNode();!function(e,t,n){for(const o of e){const e=Pe(n(o));void 0===Re&&(Re=Pe(t));const i=e/1.8t.getElementById("emo-"+e.id)),n(1,w=w)}function K(e){return!e.unicode||!$e(e)||ze.get(e.unicode)}async function Y(e){const t=await Le;return e.filter(({version:e})=>!e||e<=t)}async function q(e){return function(e,t){const n=e=>{const n={};for(const o of e)"number"==typeof o.tone&&o.version<=t&&(n[o.tone]=o.unicode);return n};return e.map(({unicode:e,skins:t,shortcodes:o,url:i,name:r,category:a})=>({unicode:e,name:r,shortcodes:o,url:i,category:a,id:e||r,skins:t&&n(t),title:o.join(", ")}))}(e,await Le)}function W(e){n(3,j=""),n(51,$=""),n(8,E=-1),n(55,P=R.findIndex(t=>t.id===e.id))}async function G(e){const t=await b.getEmojiByUnicodeOrName(e),o=[...w,...M].find(t=>t.id===e),i=o.unicode&&nt(o,L);await b.incrementFavoriteEmojiCount(e),n(53,u=u),F("emoji-click",{emoji:t,skinTone:L,...i&&{unicode:i},...o.name&&{name:o.name}})}async function Q(e){const{target:t}=e;if(!t.classList.contains("skintone-option"))return;Ae(e);const o=parseInt(t.id.slice(9),10);n(14,L=o),n(11,C=!1),O("skintone-button"),F("skin-tone-change",{skinTone:o}),b.setPreferredSkinTone(o)}Le.then(e=>{e||n(9,a=g.emojiUnsupportedMessage)}),H=async()=>{await re(),n(38,m=m||"en"),n(39,h=h||"https://cdn.jsdelivr.net/npm/emojibase-data@5/en/data.json")},X().$$.on_mount.push(H),function(e){X().$$.on_destroy.push(e)}(async()=>{b&&await b.close()});return e.$$set=e=>{"locale"in e&&n(38,m=e.locale),"dataSource"in e&&n(39,h=e.dataSource),"skinToneEmoji"in e&&n(41,p=e.skinToneEmoji),"i18n"in e&&n(0,g=e.i18n),"database"in e&&n(40,b=e.database),"customEmoji"in e&&n(42,y=e.customEmoji),"customCategorySorting"in e&&n(43,k=e.customCategorySorting)},e.$$.update=()=>{if(896&e.$$.dirty[1]&&m&&h&&(!b||b.locale!==m&&b.dataSource!==h)&&n(40,b=new z({dataSource:h,locale:m})),2560&e.$$.dirty[1]&&y&&b&&n(40,b.customEmoji=y,b),513&e.$$.dirty[0]|512&e.$$.dirty[1]){b&&async function(){const e=setTimeout(()=>{n(9,a=g.loadingMessage)},1e3);try{await b.ready(),n(24,I=!0)}catch(e){console.error(e),n(9,a=g.networkErrorMessage)}finally{clearTimeout(e),a===g.loadingMessage&&n(9,a="")}}()}if(4194304&e.$$.dirty[0]|2048&e.$$.dirty[1]&&(y&&y.length?n(22,R=[ve,...we]):R!==we&&n(22,R=we)),8&e.$$.dirty[0]&&je(()=>{n(51,$=(j||"").trim()),n(8,E=-1)}),4194304&e.$$.dirty[0]|16777216&e.$$.dirty[1]&&n(23,d=R[P]),8388608&e.$$.dirty[0]|1049088&e.$$.dirty[1]){!async function(){b?$.length>=2?(n(1,w=await async function(e){return q(await Y(await b.getEmojiBySearchQuery(e)))}($)),n(7,x=!0)):d&&(n(1,w=await async function(e){if(void 0===e)return[];const t=-1===e?y:await b.getEmojiByGroup(e);return q(await Y(t))}(d.id)),n(7,x=!1)):(n(1,w=[]),n(7,x=!1))}()}if(4194432&e.$$.dirty[0]&&n(17,l=`\n --font-family: ${Se};\n --num-groups: ${R.length}; \n --indicator-opacity: ${x?0:1}; \n --num-skintones: 6;`),512&e.$$.dirty[1]){!async function(){b&&n(14,L=await b.getPreferredSkinTone())}()}if(1024&e.$$.dirty[1]&&n(19,B=Array(6).fill().map((e,t)=>function(e,t){if(0===t)return e;const n=e.indexOf("‍");return-1!==n?e.substring(0,n)+String.fromCodePoint(127995+t-1)+e.substring(n):(e.endsWith("️")&&(e=e.substring(0,e.length-1)),e+"\ud83c"+String.fromCodePoint(57339+t-1))}(p,t))),540672&e.$$.dirty[0]&&n(16,c=B[L]),16385&e.$$.dirty[0]&&n(18,D=g.skinToneLabel.replace("{skinTone}",g.skinTones[L])),512&e.$$.dirty[1]){b&&async function(){n(53,u=(await Promise.all(_e.map(e=>b.getEmojiByUnicodeOrName(e)))).filter(Boolean))}()}if(12583424&e.$$.dirty[1]){b&&u&&async function(){const e=await b.getTopFavoriteEmoji(U),t=await q(Be([...e,...u],e=>e.unicode||e.name).slice(0,U));n(20,M=t)}()}if(18874368&e.$$.dirty[1]&&n(10,S=Ue?`transform: translateX(${P*_}px);`:`transform: translateX(${100*P}%);`),2&e.$$.dirty[0]){const e=w.filter(e=>e.unicode).filter(e=>$e(e)&&!ze.has(e.unicode));e.length?Me(()=>V(e)):(n(1,w=w.filter(K)),Me(()=>{n(6,r.scrollTop=0,r)}))}if(e.$$.dirty[0],e.$$.dirty[1],130&e.$$.dirty[0]|4096&e.$$.dirty[1]){n(2,v=function(){if(x)return[{category:"",emojis:w}];const e=new Map;for(const t of w){const n=t.category||"";let o=e.get(n);o||(o=[],e.set(n,o)),o.push(t)}return[...e.entries()].map(([e,t])=>({category:e,emojis:t})).sort((e,t)=>k(e.category,t.category))}())}258&e.$$.dirty[0]&&n(25,f=-1!==E&&w[E].id),10240&e.$$.dirty[0]&&(C?s.addEventListener("transitionend",()=>{n(12,T=!0)},{once:!0}):n(12,T=!1))},[g,w,v,j,o,i,r,x,E,a,S,C,T,s,L,A,c,l,D,B,M,N,R,d,I,f,function(e,t){return(n=[e.name||nt(e,t),...e.shortcodes],Be(n,e=>e)).join(", ");var n},function(e){return Ne(e,t=>{const i=parseInt(getComputedStyle(o).getPropertyValue("--num-columns"),10),r=e.parentElement.getBoundingClientRect().width-t;n(54,U=i),n(21,N=r)})},function(e){return Ne(e,e=>{n(52,_=e)})},function(e){if(!x||!w.length)return;const t=t=>{Ae(e),n(8,E=De(t,E,w))};switch(e.key){case"ArrowDown":return t(!1);case"ArrowUp":return t(!0);case"Enter":if(-1!==E)return Ae(e),G(w[E].id);w.length&&n(8,E=0)}},W,function(e){const{target:t,key:n}=e,o=t=>{t&&(Ae(e),t.focus())};switch(n){case"ArrowLeft":return o(t.previousSibling);case"ArrowRight":return o(t.nextSibling);case"Home":return o(t.parentElement.firstChild);case"End":return o(t.parentElement.lastChild)}},async function(e){const{target:t}=e;if(!t.classList.contains("emoji"))return;Ae(e),G(t.id.substring(4))},Q,async function(e){n(11,C=!C),n(15,A=L),C&&(Ae(e),Me(()=>O("skintone-"+A)))},function(e){if(!C)return;const t=async t=>{Ae(e),n(15,A=t),await re(),O("skintone-"+A)};switch(e.key){case"ArrowUp":return t(De(!0,A,B));case"ArrowDown":return t(De(!1,A,B));case"Home":return t(0);case"End":return t(B.length-1);case"Enter":return Q(e);case"Escape":return Ae(e),O("skintone-button")}},function(e){if(C)switch(e.key){case" ":return Q(e)}},async function(e){const{relatedTarget:t}=e;t&&t.classList.contains("skintone-option")||n(11,C=!1)},m,h,b,p,y,k,function(){j=this.value,n(3,j)},function(e){Z[e?"unshift":"push"](()=>{s=e,n(13,s)})},e=>W(e),function(e){Z[e?"unshift":"push"](()=>{r=e,n(6,r),n(1,w),n(40,b),n(51,$),n(23,d),n(38,m),n(39,h),n(42,y),n(3,j),n(22,R),n(55,P)})},function(e){Z[e?"unshift":"push"](()=>{i=e,n(5,i)})},function(e){Z[e?"unshift":"push"](()=>{o=e,n(4,o)})}]}class it extends be{constructor(e){super(),this.shadowRoot.innerHTML="",ge(this,{target:this.shadowRoot},ot,tt,N,{locale:38,dataSource:39,skinToneEmoji:41,i18n:0,database:40,customEmoji:42,customCategorySorting:43},[-1,-1,-1]),e&&(e.target&&I(e.target,this,e.anchor),e.props&&(this.$set(e.props),le()))}static get observedAttributes(){return["locale","dataSource","skinToneEmoji","i18n","database","customEmoji","customCategorySorting"]}get locale(){return this.$$.ctx[38]}set locale(e){this.$set({locale:e}),le()}get dataSource(){return this.$$.ctx[39]}set dataSource(e){this.$set({dataSource:e}),le()}get skinToneEmoji(){return this.$$.ctx[41]}set skinToneEmoji(e){this.$set({skinToneEmoji:e}),le()}get i18n(){return this.$$.ctx[0]}set i18n(e){this.$set({i18n:e}),le()}get database(){return this.$$.ctx[40]}set database(e){this.$set({database:e}),le()}get customEmoji(){return this.$$.ctx[42]}set customEmoji(e){this.$set({customEmoji:e}),le()}get customCategorySorting(){return this.$$.ctx[43]}set customCategorySorting(e){this.$set({customCategorySorting:e}),le()}}class rt extends it{constructor(e){super({props:e})}disconnectedCallback(){this.$destroy()}static get observedAttributes(){return["locale","data-source","skin-tone-emoji"]}attributeChangedCallback(e,t,n){super.attributeChangedCallback(e.replace(/-([a-z])/g,(e,t)=>t.toUpperCase()),t,n)}}return customElements.define("emoji-picker",rt),e.Database=z,e.Picker=rt,e}({}); diff --git a/package.json b/package.json index c9bfaaa..6a6b674 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "emoji-picker-element", - "version": "1.2.0", + "version": "1.2.1", "description": "Lightweight emoji picker distributed as a web component", "main": "index.js", "module": "index.js",