Tails Create websites with TailwindCSS
Wave Start building the next great SAAS
Devblog Create a professional dev blog
MarkdownX The Markdown editor of the future
SAAS Adventure 21-day program for building a SAAS
Learn Learn how to code & design
Join 7 4 , 5 8 7 other developers as we learn, build, and grow together. Connect with fellow developers and gain access to tools that will help you build a profitable SaaS 🚀
Community 🏠Home 🙋Questions 🍿Videos 🎓Courses 🤓Snippets 🤣Fun
Rewards ⭐Points 🎖Badges 💰DevCoin 🏆Contests
Resources 📘Guides 📚eBooks 💡Topics Meet the Team
Tony LeaFounder / Developer
Bobby IlievCo-Founder / DevOps
Boyan IlievDeveloper / DevOps
View All Users
Pricing
🦺
Help & Support Have a question or need help
🤝
Sponsorships Learn about sponsorships
📄
Terms of Service The boring legal stuff
Home / Community / Dev Dojo / Explaining the Laravel Public Folder Written by Dev Dojo on Mar 13th, 2017・ Views ・ Report Post
Dev DojoVisit User Profile
If you have ever installed a PHP application or even Wordpress you probably know that you need to copy and paste the files into the root folder of your website and you are good to go.
Well, Laravel is setup a little different. Laravel has made things more secure by putting all the functionality of the application outside the of the root folder.
First, let's take a look at a basic Laravel folder structure: (folders are bold )
app bootstrap config database public resources routes storage tests .env artisan composer.json ... a few more files All the folders above are not supposed to live in the root directory except for the contents of thepublic
folder, in fact the root directory of your application should be the public
folder. This means that your domain should be pointing to this public
folder. This will be a bit more clear when I explain what happens when a domain is accessed.
Say that some types in devdojo.com in their browser. The domain name server or (DNS) will direct that domain to myserver. When theserver detects that someone is requesting access tothe website, it then has a lookup of what folder to look into to send a response back to the client. This lookup could be any folder on theserver. Take for instance the following folder:/var/www/html/devdojo/
. The folder lookup location can be set up through the server or the hosting provider.
If I had setup a Laravel app in my/var/www/html/devdojo/
folder and this is folder my server looks to serve up an index.html
or an index.php
file, my app would not work because it needs to look inthe public
folder. So to get my Laravel app working correctly I need to tell the server that it should be serving up files frome the following folder /var/www/html/devdojo/public/
when someone requests access to the website.
By having all the functionality of our application outsidethe root folder of the website wewon't have to worry about a lot of the common vulnerabilities people commonly have on their website. Since all the functionality/files are one folder above the root folder they can never be accessed by the end-user and is only available to the application. Thanks Laravel for the awesome security :)
Problems on a shared hosting provider?
If you are having trouble accessing your laravel application on a shared hosting be sure to checkout this article on 3 different ways to get it working on a shared hosting provider:
http://blog.netgloo.com/2016/01/29/deploy-laravel-application-on-shared-hosting/
Hope this helps you understand the public folder in laravel applications.
Type
Post
and press enter to search for a specific post
Type
User
and press enter to search for a specific user
Type
Question
and press enter to search for a specific question
or, type a section to quickly jump to that page
Next,
\n`));class Kr extends Or{constructor({classNames:e}={}){super({template:Wr,classes:Ur}),this.classNames=e}load(e){const t=document.createElement("img");this.classNames&&(t.className=this.classNames),t.addEventListener("load",(()=>{this.el.replaceWith(t)}),{once:!0}),Promise.resolve(e).then((e=>t.src=e))}renderSync(){return super.renderSync(),this.classNames&&this.classNames.split(" ").forEach((e=>this.el.classList.add(e))),this.el}}const Yr=br("customEmoji");const Xr=new qr((({emoji:e})=>`${e} `));class Jr extends class{renderElement(e){return{content:e}}renderImage(e="",t){const n=new Kr({classNames:e});return n.renderSync(),{content:n,resolver:()=>(n.load(t()),n.el)}}doRender(e,t,n){if(e.custom)return this.renderCustom(e,t,n);const{content:o,resolver:i}=this.render(e,n),r=o instanceof Element?o:o.el;return i&&i(),r}doEmit(e){return e.custom?this.emitCustom(e):this.emit(e)}emitCustom({url:e,label:t,emoji:n,data:o}){return{url:e,label:t,emoji:n,data:o}}renderCustom(e,t,n=""){const o=[Yr.customEmoji,n].join(" ").trim(),{content:i,resolver:r}=this.renderImage(o,(()=>e.url)),s=i instanceof Element?i:i.el;return r&&r(),s}}{render(e){return this.renderElement(Xr.renderSync({emoji:e.emoji}))}emit({emoji:e,hexcode:t,label:n}){return{emoji:e,hexcode:t,label:n}}}const Zr=[(e,t)=>("1F91D"===e.hexcode&&t<14&&(e.skins=[]),e),(e,t)=>(e.skins&&(e.skins=e.skins.filter((e=>!e.version||e.version<=t))),e)];function Gr(e,t){return e.filter((e=>null!==function(e,t){return Zr.some((n=>null===n(e,t)))?null:e}(e,t)))}function Qr(e){var t;return{emoji:e.emoji,label:e.label,tags:e.tags,skins:null==(t=e.skins)?void 0:t.map((e=>Qr(e))),order:e.order,custom:!1,hexcode:e.hexcode,version:e.version}}function es(e,t,n){var o;return!(n&&!n.some((t=>t.order===e.group)))&&(vr(e.label,t)||(null==(o=e.tags)?void 0:o.some((e=>vr(e,t)))))}class ts{constructor(e="en"){this.locale=e}}const ns="PicMo";function os(e){return new is(e)}os.deleteDatabase=e=>new Promise(((t,n)=>{const o=indexedDB.deleteDatabase(`${ns}-${e}`);o.addEventListener("success",t),o.addEventListener("error",n)}));class is extends ts{async open(){const e=indexedDB.open(`${ns}-${this.locale}`);return new Promise(((t,n)=>{e.addEventListener("success",(e=>{var n;this.db=null==(n=e.target)?void 0:n.result,t()})),e.addEventListener("error",n),e.addEventListener("upgradeneeded",(async e=>{var t;this.db=null==(t=e.target)?void 0:t.result,this.db.createObjectStore("category",{keyPath:"order"});const n=this.db.createObjectStore("emoji",{keyPath:"emoji"});n.createIndex("category","group"),n.createIndex("version","version"),this.db.createObjectStore("meta")}))}))}async delete(){this.close();const e=indexedDB.deleteDatabase(`${ns}-${this.locale}`);await this.waitForRequest(e)}close(){this.db.close()}async getEmojiCount(){const e=this.db.transaction("emoji","readonly").objectStore("emoji");return(await this.waitForRequest(e.count())).target.result}async getEtags(){const e=this.db.transaction("meta","readonly").objectStore("meta"),[t,n]=await Promise.all([this.waitForRequest(e.get("emojisEtag")),this.waitForRequest(e.get("messagesEtag"))]);return{storedEmojisEtag:t.target.result,storedMessagesEtag:n.target.result}}async setMeta(e){const t=this.db.transaction("meta","readwrite"),n=t.objectStore("meta");return new Promise((o=>{t.oncomplete=o,Object.keys(e).filter(Boolean).forEach((t=>{n.put(e[t],t)}))}))}async getHash(){const e=this.db.transaction("meta","readonly").objectStore("meta");return(await this.waitForRequest(e.get("hash"))).target.result}async isPopulated(){const e=this.db.transaction("category","readonly").objectStore("category");return(await this.waitForRequest(e.count())).target.result>0}async populate({groups:e,emojis:t,emojisEtag:n,messagesEtag:o,hash:i}){await this.removeAllObjects("category","emoji");const r=[this.addObjects("category",e),this.addObjects("emoji",t),this.setMeta({emojisEtag:n,messagesEtag:o,hash:i})];await Promise.all(r)}async getCategories(e){var t;const n=this.db.transaction("category","readonly").objectStore("category");let o=(await this.waitForRequest(n.getAll())).target.result.filter((e=>"component"!==e.key));if(e.showRecents&&o.unshift({key:"recents",order:-1}),null!=(t=e.custom)&&t.length&&o.push({key:"custom",order:10}),e.categories){const t=e.categories;o=o.filter((e=>t.includes(e.key))),o.sort(((e,n)=>t.indexOf(e.key)-t.indexOf(n.key)))}else o.sort(((e,t)=>e.order-t.order));return o}async getEmojis(e,t){const n=this.db.transaction("emoji","readonly").objectStore("emoji").index("category");return Gr((await this.waitForRequest(n.getAll(e.order))).target.result.filter((e=>e.version<=t)).sort(((e,t)=>null!=e.order&&null!=t.order?e.order-t.order:0)).map(Qr),t)}async searchEmojis(e,t,n,o){const i=[];return new Promise(((r,s)=>{const a=this.db.transaction("emoji","readonly").objectStore("emoji").openCursor();a.addEventListener("success",(s=>{var a;const c=null==(a=s.target)?void 0:a.result;if(!c)return r([...Gr(i,n),...t.filter((t=>es(t,e)))]);const l=c.value;es(l,e,o)&&l.version<=n&&i.push(Qr(l)),c.continue()})),a.addEventListener("error",(e=>{s(e)}))}))}async waitForRequest(e){return new Promise(((t,n)=>{e.onsuccess=t,e.onerror=n}))}withTransaction(e,t="readwrite",n){return new Promise(((o,i)=>{const r=this.db.transaction(e,t);r.oncomplete=o,r.onerror=i,n(r)}))}async removeAllObjects(...e){const t=this.db.transaction(e,"readwrite"),n=e.map((e=>t.objectStore(e)));await Promise.all(n.map((e=>this.waitForRequest(e.clear()))))}async addObjects(e,t){return this.withTransaction(e,"readwrite",(n=>{const o=n.objectStore(e);t.forEach((e=>{o.add(e)}))}))}}const rs="PicMo:recents";class ss extends class{}{constructor(e){super(),this.storage=e}clear(){this.storage.removeItem(rs)}getRecents(e){var t;try{return JSON.parse(null!=(t=this.storage.getItem(rs))?t:"[]").slice(0,e)}catch{return[]}}addOrUpdateRecent(e,t){const n=[e,...this.getRecents(t).filter((t=>t.hexcode!==e.hexcode))].slice(0,t);try{this.storage.setItem(rs,JSON.stringify(n))}catch{console.warn("storage is not available, recent emojis will not be saved")}}}class as extends ss{constructor(){super(localStorage)}}const cs={dataStore:os,theme:Lr,animate:!0,showCategoryTabs:!0,showPreview:!0,showRecents:!0,showSearch:!0,showVariants:!0,emojisPerRow:8,visibleRows:6,emojiVersion:"auto",i18n:{"categories.activities":"Activities","categories.animals-nature":"Animals & Nature","categories.custom":"Custom","categories.flags":"Flags","categories.food-drink":"Food & Drink","categories.objects":"Objects","categories.people-body":"People & Body","categories.recents":"Recently Used","categories.smileys-emotion":"Smileys & Emotion","categories.symbols":"Symbols","categories.travel-places":"Travel & Places","error.load":"Failed to load emojis","recents.clear":"Clear recent emojis","recents.none":"You haven't selected any emojis yet.",retry:"Try again","search.clear":"Clear search","search.error":"Failed to search emojis","search.notFound":"No results found",search:"Search emojis..."},locale:"en",maxRecents:50,custom:[]};var ls,us,ds,hs,ps;class fs{constructor(){sr(this,us),sr(this,hs),sr(this,ls,new Map)}on(e,t,n){cr(this,hs,ps).call(this,e,t,n)}once(e,t,n){cr(this,hs,ps).call(this,e,t,n,!0)}off(e,t){const n=cr(this,us,ds).call(this,e);rr(this,ls).set(e,n.filter((e=>e.handler!==t)))}emit(e,...t){cr(this,us,ds).call(this,e).forEach((n=>{n.handler.apply(n.context,t),n.once&&this.off(e,n.handler)}))}removeAll(){rr(this,ls).clear()}}ls=new WeakMap,us=new WeakSet,ds=function(e){return rr(this,ls).has(e)||rr(this,ls).set(e,[]),rr(this,ls).get(e)},hs=new WeakSet,ps=function(e,t,n,o=!1){cr(this,us,ds).call(this,e).push({context:n,handler:t,once:o})};const ms=!0;class gs extends fs{}class vs extends fs{}const ys=br("emojiCategory","categoryName","noRecents","recentEmojis");class ws extends Or{constructor({template:e,category:t,showVariants:n,lazyLoader:o}){super({template:e,classes:ys}),this.baseUIElements={categoryName:Or.byClass(ys.categoryName)},this.category=t,this.showVariants=n,this.lazyLoader=o}setActive(e,t,n){this.emojiContainer.setActive(e,t,n)}}const bs=new qr((({classes:e,emoji:t})=>`\n \n`)),xs=br("emojiButton");class Cs extends Or{constructor({emoji:e,lazyLoader:t,category:n}){super({template:bs,classes:xs}),this.emoji=e,this.lazyLoader=t,this.category=n}initialize(){this.uiEvents=[Or.uiEvent("focus",this.handleFocus)],super.initialize()}handleFocus(){this.category&&this.events.emit("focus:change",this.category)}activateFocus(e){this.el.tabIndex=0,e&&this.el.focus()}deactivateFocus(){this.el.tabIndex=-1}renderSync(){return super.renderSync({emoji:this.emoji,emojiContent:this.renderer.doRender(this.emoji,this.lazyLoader)})}}class ks{constructor(e,t,n=0,o=0,i=!1){this.events=new fs,this.keyHandlers={ArrowLeft:this.focusPrevious.bind(this),ArrowRight:this.focusNext.bind(this),ArrowUp:this.focusUp.bind(this),ArrowDown:this.focusDown.bind(this)},this.rowCount=Math.ceil(t/e),this.columnCount=e,this.focusedRow=n,this.focusedColumn=o,this.emojiCount=t,this.wrap=i,this.handleKeyDown=this.handleKeyDown.bind(this)}destroy(){this.events.removeAll()}on(e,t){this.events.on(e,t)}handleKeyDown(e){e.key in this.keyHandlers&&(e.preventDefault(),this.keyHandlers[e.key]())}setCell(e,t,n=!0){const o=this.getIndex();this.focusedRow=e,void 0!==t&&(this.focusedColumn=Math.min(this.columnCount,t)),(this.focusedRow>=this.rowCount||this.getIndex()>=this.emojiCount)&&(this.focusedRow=this.rowCount-1,this.focusedColumn=this.emojiCount%this.columnCount-1),this.events.emit("focus:change",{from:o,to:this.getIndex(),performFocus:n})}setFocusedIndex(e,t=!0){const n=Math.floor(e/this.columnCount),o=e%this.columnCount;this.setCell(n,o,t)}focusNext(){this.focusedColumn
0?this.setCell(this.focusedRow,this.focusedColumn-1):this.focusedRow>0?this.setCell(this.focusedRow-1,this.columnCount-1):this.wrap?this.setCell(this.rowCount-1,this.columnCount-1):this.events.emit("focus:underflow",this.columnCount-1)}focusUp(){this.focusedRow>0?this.setCell(this.focusedRow-1,this.focusedColumn):this.events.emit("focus:underflow",this.focusedColumn)}focusDown(){this.focusedRow`\n \n`)),Es=br("emojiContainer");class _s extends Or{constructor({emojis:e,showVariants:t,preview:n=!0,lazyLoader:o,category:i,fullHeight:r=!1}){super({template:js,classes:Es}),this.fullHeight=!1,this.showVariants=t,this.lazyLoader=o,this.preview=n,this.emojis=e,this.category=i,this.fullHeight=r,this.setFocus=this.setFocus.bind(this),this.triggerNextCategory=this.triggerNextCategory.bind(this),this.triggerPreviousCategory=this.triggerPreviousCategory.bind(this)}initialize(){this.grid=new ks(this.options.emojisPerRow,this.emojiCount,0,0,!this.category),this.grid.on("focus:change",this.setFocus),this.grid.on("focus:overflow",this.triggerNextCategory),this.grid.on("focus:underflow",this.triggerPreviousCategory),this.uiEvents=[Or.uiEvent("click",this.selectEmoji),Or.uiEvent("keydown",this.grid.handleKeyDown)],this.preview&&this.uiEvents.push(Or.uiEvent("mouseover",this.showPreview),Or.uiEvent("mouseout",this.hidePreview),Or.uiEvent("focus",this.showPreview,{capture:!0}),Or.uiEvent("blur",this.hidePreview,{capture:!0})),super.initialize()}setFocusedView(e,t){if(e)if("string"==typeof e){const t=this.emojis.findIndex((t=>t.emoji===e));this.grid.setFocusedIndex(t,!1),setTimeout((()=>{var e,n,o,i;const r=this.emojiViews[t].el;r.scrollIntoView();const s=null==(e=r.parentElement)?void 0:e.previousElementSibling;(null==(o=null==(n=r.parentElement)?void 0:n.parentElement)?void 0:o.parentElement).scrollTop-=null!=(i=null==s?void 0:s.offsetHeight)?i:0}))}else"first"===e.row||0===e.row?this.grid.setCell(0,e.offset,t):"last"===e.row&&this.grid.setCell(this.grid.getRowCount()-1,e.offset,t)}setActive(e,t,n){var o;e?this.setFocusedView(t,n):null==(o=this.emojiViews[this.grid.getIndex()])||o.deactivateFocus()}renderSync(){return this.emojiViews=this.emojis.map((e=>this.viewFactory.create(Cs,{emoji:e,category:this.category,lazyLoader:this.lazyLoader,renderer:this.renderer}))),this.emojiElements=this.emojiViews.map((e=>e.renderSync())),super.renderSync({emojis:this.emojiElements,i18n:this.i18n})}destroy(){super.destroy(),this.emojiViews.forEach((e=>e.destroy())),this.grid.destroy()}triggerPreviousCategory(e){this.events.emit("category:previous",e)}triggerNextCategory(e){this.category&&this.events.emit("category:next",e)}setFocus({from:e,to:t,performFocus:n}){var o,i;null==(o=this.emojiViews[e])||o.deactivateFocus(),null==(i=this.emojiViews[t])||i.activateFocus(n)}selectEmoji(e){e.stopPropagation();const t=mr(e,this.emojis);t&&this.events.emit("emoji:select",{emoji:t,showVariants:this.showVariants})}showPreview(e){const t=e.target.closest("button"),n=null==t?void 0:t.firstElementChild,o=mr(e,this.emojis);o&&this.events.emit("preview:show",o,null==n?void 0:n.cloneNode(!0))}hidePreview(e){mr(e,this.emojis)&&this.events.emit("preview:hide")}get emojiCount(){return this.emojis.length}}const Ss=new qr((({classes:e,category:t,pickerId:n,icon:o,i18n:i})=>`\n \n \n \n ${i.get(`categories.${t.key}`,t.message||t.key)}\n \n \n \n`));class Ls extends ws{constructor({category:e,showVariants:t,lazyLoader:n,emojiVersion:o}){super({category:e,showVariants:t,lazyLoader:n,template:Ss}),this.showVariants=t,this.lazyLoader=n,this.emojiVersion=o}initialize(){this.uiElements={...this.baseUIElements},super.initialize()}async render(){await this.emojiDataPromise;const e=await this.emojiData.getEmojis(this.category,this.emojiVersion);return this.emojiContainer=this.viewFactory.create(_s,{emojis:e,showVariants:this.showVariants,lazyLoader:this.lazyLoader,category:this.category.key}),super.render({category:this.category,emojis:this.emojiContainer,emojiCount:e.length,icon:Pr[this.category.key]})}}class As extends _s{constructor({category:e,emojis:t,preview:n=!0,lazyLoader:o}){super({category:e,emojis:t,showVariants:!1,preview:n,lazyLoader:o})}async addOrUpdate(e){const t=this.el.querySelector(`[data-emoji="${e.emoji}"]`);t&&(this.el.removeChild(t),this.emojis=this.emojis.filter((t=>t!==e)));const n=this.viewFactory.create(Cs,{emoji:e});if(this.el.insertBefore(n.renderSync(),this.el.firstChild),this.emojis=[e,...this.emojis.filter((t=>t!==e))],this.emojis.length>this.options.maxRecents){this.emojis=this.emojis.slice(0,this.options.maxRecents);const e=this.el.childElementCount-this.options.maxRecents;for(let t=0;t`\n \n \n \n ${r.get(`categories.${n.key}`,n.message||n.key)}\n \n \n \n ${r.get("recents.none")}\n
\n \n`),{mode:"async"});const Os=new qr((({classes:e,category:t,pickerId:n,icon:o,i18n:i})=>`\n \n \n \n ${i.get(`categories.${t.key}`,t.message||t.key)}\n \n \n \n`));class Is{constructor(){this.elements=new Map}lazyLoad(e,t){return this.elements.set(e,t),e}observe(e){if(window.IntersectionObserver){const t=new IntersectionObserver((e=>{e.filter((e=>e.intersectionRatio>0)).map((e=>e.target)).forEach((e=>{const n=this.elements.get(e);null==n||n(),t.unobserve(e)}))}),{root:e});this.elements.forEach(((e,n)=>{t.observe(n)}))}else this.elements.forEach((e=>{e()}))}}const Ps=br("emojiArea"),Ms=new qr((({classes:e})=>`\n \n`),{mode:"async"}),Bs={recents:class extends ws{constructor({category:e,lazyLoader:t,provider:n}){super({category:e,showVariants:!1,lazyLoader:t,template:Ts}),this.provider=n}initialize(){this.uiElements={...this.baseUIElements,recents:Or.byClass(ys.recentEmojis)},this.appEvents={"recent:add":this.addRecent},super.initialize()}async addRecent(e){await this.emojiContainer.addOrUpdate(e),this.ui.recents.dataset.empty="false"}async render(){var e;const t=null==(e=this.provider)?void 0:e.getRecents(this.options.maxRecents);return this.emojiContainer=this.viewFactory.create(As,{emojis:t,showVariants:!1,lazyLoader:this.lazyLoader,category:this.category.key}),await super.render({category:this.category,emojis:this.emojiContainer,emojiCount:t.length,icon:Pr[this.category.key]}),this.el}},custom:class extends ws{constructor({category:e,lazyLoader:t}){super({template:Os,showVariants:!1,lazyLoader:t,category:e})}initialize(){this.uiElements={...this.baseUIElements},super.initialize()}async render(){return this.emojiContainer=this.viewFactory.create(_s,{emojis:this.customEmojis,showVariants:this.showVariants,lazyLoader:this.lazyLoader,category:this.category.key}),super.render({category:this.category,emojis:this.emojiContainer,emojiCount:this.customEmojis.length,icon:Pr[this.category.key]})}}};class zs extends Or{constructor({categoryTabs:e,categories:t,emojiVersion:n}){super({template:Ms,classes:Ps}),this.selectedCategory=0,this.scrollListenerState="active",this.lazyLoader=new Is,this.categoryTabs=e,this.categories=t,this.emojiVersion=n,this.handleScroll=function(e,t){let n=null;return()=>{n||(n=window.setTimeout((()=>{e(),n=null}),t))}}(this.handleScroll.bind(this),100)}initialize(){this.appEvents={"category:select":this.handleCategorySelect,"category:previous":this.focusPreviousCategory,"category:next":this.focusNextCategory,"focus:change":this.updateFocusedCategory},this.uiElements={emojis:Or.byClass(Ps.emojiArea)},this.uiEvents=[Or.uiEvent("scroll",this.handleScroll)],super.initialize()}get focusableEmoji(){return this.el.querySelector('[tabindex="0"]')}async render(){this.emojiCategories=this.categories.map(this.createCategory,this);const e={};return this.categories.forEach(((t,n)=>{e[`emojis-${t.key}`]=this.emojiCategories[n]})),await super.render({emojis:await Promise.all(this.emojiCategories.map((e=>e.render())))}),this.lazyLoader.observe(this.el),window.ResizeObserver&&(this.observer=new ResizeObserver((()=>{const e=this.el.scrollHeight-this.scrollHeight;this.el.scrollTop-this.scrollTop==0&&e>0&&(this.el.scrollTop+=e),this.scrollHeight=this.el.scrollHeight,this.scrollTop=this.el.scrollTop})),this.emojiCategories.forEach((e=>{this.observer.observe(e.el)}))),this.el}destroy(){super.destroy(),this.emojiCategories.forEach((e=>{var t;null==(t=this.observer)||t.unobserve(e.el),e.destroy()}))}handleCategorySelect(e,t){this.selectCategory(e,t)}createCategory(e){const t=Bs[e.key]||Ls;return this.viewFactory.create(t,{category:e,showVariants:!0,lazyLoader:this.lazyLoader,emojiVersion:this.emojiVersion,provider:this.options.recentsProvider})}determineInitialCategory(){var e;return this.options.initialCategory&&this.categories.find((e=>e.key===this.options.initialCategory))?this.options.initialCategory:null==(e=this.categories.find((e=>"recents"!==e.key)))?void 0:e.key}determineFocusTarget(e){const t=this.emojiCategories.find((t=>t.category.key===e));return this.options.initialEmoji&&(null==t?void 0:t.el.querySelector(`[data-emoji="${this.options.initialEmoji}"]`))?this.options.initialEmoji:"button"}reset(e=!0){this.events.emit("preview:hide");const t=this.determineInitialCategory();t&&(this.selectCategory(t,{focus:this.determineFocusTarget(t),performFocus:e,scroll:"jump"}),this.selectedCategory=this.getCategoryIndex(t))}getCategoryIndex(e){return this.categories.findIndex((t=>t.key===e))}focusPreviousCategory(e){this.selectedCategory>0&&this.focusCategory(this.selectedCategory-1,{row:"last",offset:null!=e?e:this.options.emojisPerRow})}focusNextCategory(e){this.selectedCategory{var o;return e<(null==(o=this.emojiCategories[n+1])?void 0:o.el.offsetTop)})),o={changeFocusable:!1,performFocus:!1,scroll:!1};0===e?this.categoryTabs.setActiveTab(0,o):Math.floor(e)===Math.floor(t)||n<0?this.categoryTabs.setActiveTab(this.categories.length-1,o):this.categoryTabs.setActiveTab(n,o)}}const $s=new qr((({classList:e,classes:t,icon:n,message:o})=>`\n\n`)),Fs=br("error","iconContainer","title");class Rs extends Or{constructor({message:e,icon:t="warning",template:n=$s,className:o}){super({template:n,classes:Fs}),this.message=e,this.icon=t,this.className=o}renderSync(){const e=[Fs.error,this.className].join(" ").trim();return super.renderSync({message:this.message,icon:this.icon,classList:e})}}const Ns=new qr((({classList:e,classes:t,icon:n,i18n:o,message:i})=>`\n \n`)),Ds=br("dataError");class Vs extends Rs{constructor({message:e}){super({message:e,template:Ns,className:Ds.dataError})}initialize(){this.uiElements={retryButton:"button"},this.uiEvents=[Or.childEvent("retryButton","click",this.onRetry)],super.initialize()}async onRetry(){this.emojiData?await this.emojiData.delete():await this.options.dataStore.deleteDatabase(this.options.locale),this.events.emit("reinitialize");const e=await _r(this.options.locale,this.options.dataStore,this.options.messages,this.options.emojiData,this.emojiData);this.viewFactory.setEmojiData(e),this.events.emit("data:ready",e)}}const Hs=br("preview","previewEmoji","previewName","tagList","tag"),qs=new qr((({classes:e,tag:t})=>`\n ${t} \n`)),Us=new qr((({classes:e})=>`\n \n`));class Ws extends Or{constructor(){super({template:Us,classes:Hs})}initialize(){this.uiElements={emoji:Or.byClass(Hs.previewEmoji),name:Or.byClass(Hs.previewName),tagList:Or.byClass(Hs.tagList)},this.appEvents={"preview:show":this.showPreview,"preview:hide":this.hidePreview},super.initialize()}showPreview(e,t){if(this.ui.emoji.replaceChildren(t),this.ui.name.textContent=e.label,e.tags){this.ui.tagList.style.display="flex";const t=e.tags.map((e=>qs.renderSync({tag:e,classes:Hs})));this.ui.tagList.replaceChildren(...t)}}hidePreview(){this.ui.emoji.replaceChildren(),this.ui.name.textContent="",this.ui.tagList.replaceChildren()}}const Ks=new qr((({classes:e,i18n:t})=>`\n \n`)),Ys=new qr((({classes:e,i18n:t})=>`\n\n \n \n
\n`),{mode:"async"}),Xs=br("searchContainer","searchField","clearButton","searchAccessory","clearSearchButton","notFound");class Js extends Or{constructor({categories:e,emojiVersion:t}){super({template:Ys,classes:Xs}),this.categories=e.filter((e=>"recents"!==e.key)),this.emojiVersion=t,this.search=function(e,t){let n=null;return(...o)=>{n&&window.clearTimeout(n),n=window.setTimeout((()=>{e(...o),n=null}),t)}}(this.search.bind(this),100)}initialize(){this.uiElements={searchField:Or.byClass(Xs.searchField),searchAccessory:Or.byClass(Xs.searchAccessory)},this.uiEvents=[Or.childEvent("searchField","keydown",this.onKeyDown),Or.childEvent("searchField","input",this.onSearchInput)],super.initialize()}async render(){return await super.render(),this.searchIcon=Mr("search"),this.notFoundMessage=this.viewFactory.create(Rs,{message:this.i18n.get("search.notFound"),className:Xs.notFound,icon:"sad"}),this.notFoundMessage.renderSync(),this.errorMessage=this.viewFactory.create(Rs,{message:this.i18n.get("search.error")}),this.errorMessage.renderSync(),this.clearSearchButton=Ks.render({classes:Xs,i18n:this.i18n}),this.clearSearchButton.addEventListener("click",(e=>this.onClearSearch(e))),this.searchField=this.ui.searchField,this.showSearchIcon(),this.el}showSearchIcon(){this.showSearchAccessory(this.searchIcon)}showClearSearchButton(){this.showSearchAccessory(this.clearSearchButton)}showSearchAccessory(e){this.ui.searchAccessory.replaceChildren(e)}clear(){this.searchField.value="",this.showSearchIcon()}focus(){this.searchField.focus()}onClearSearch(e){var t;e.stopPropagation(),this.searchField.value="",null==(t=this.resultsContainer)||t.destroy(),this.resultsContainer=null,this.showSearchIcon(),this.events.emit("content:show"),this.searchField.focus()}handleResultsKeydown(e){this.resultsContainer&&"Escape"===e.key&&this.onClearSearch(e)}onKeyDown(e){var t;"Escape"===e.key&&this.searchField.value?this.onClearSearch(e):("Enter"===e.key||"ArrowDown"===e.key)&&this.resultsContainer&&(e.preventDefault(),null==(t=this.resultsContainer.el.querySelector('[tabindex="0"]'))||t.focus())}onSearchInput(e){this.searchField.value?(this.showClearSearchButton(),this.search()):this.onClearSearch(e)}async search(){var e;if(this.searchField.value)try{const t=await this.emojiData.searchEmojis(this.searchField.value,this.customEmojis,this.emojiVersion,this.categories);if(this.events.emit("preview:hide"),t.length){const n=new Is;this.resultsContainer=this.viewFactory.create(_s,{emojis:t,fullHeight:!0,showVariants:!0,lazyLoader:n}),this.resultsContainer.renderSync(),null!=(e=this.resultsContainer)&&e.el&&(n.observe(this.resultsContainer.el),this.resultsContainer.setActive(!0,{row:0,offset:0},!1),this.resultsContainer.el.addEventListener("keydown",(e=>this.handleResultsKeydown(e))),this.events.emit("content:show",this.resultsContainer))}else this.events.emit("content:show",this.notFoundMessage)}catch{this.events.emit("content:show",this.errorMessage)}}}const Zs=new qr((({classes:e})=>`\n \n`)),Gs=br("variantOverlay","variantPopup"),Qs={easing:"ease-in-out",duration:250,fill:"both"},ea={opacity:[0,1]},ta={opacity:[0,1],transform:["scale3d(0.8, 0.8, 0.8)","scale3d(1, 1, 1)"]};class na extends Or{constructor({emoji:e,parent:t}){super({template:Zs,classes:Gs,parent:t}),this.focusedEmojiIndex=0,this.focusTrap=new Sr,this.animateShow=()=>Promise.all([yr(this.el,ea,Qs,this.options),yr(this.ui.popup,ta,Qs,this.options)]),this.emoji=e}initialize(){this.uiElements={popup:Or.byClass(Gs.variantPopup)},this.uiEvents=[Or.uiEvent("click",this.handleClick),Or.uiEvent("keydown",this.handleKeydown)],super.initialize()}animateHide(){const e={...Qs,direction:"reverse"};return Promise.all([yr(this.el,ea,e,this.options),yr(this.ui.popup,ta,e,this.options)])}async hide(){await this.animateHide(),this.events.emit("variantPopup:hide")}handleKeydown(e){"Escape"===e.key&&(this.hide(),e.stopPropagation())}handleClick(e){this.ui.popup.contains(e.target)||this.hide()}getEmoji(e){return this.renderedEmojis[e]}setFocusedEmoji(e){this.getEmoji(this.focusedEmojiIndex).tabIndex=-1,this.focusedEmojiIndex=e;const t=this.getEmoji(this.focusedEmojiIndex);t.tabIndex=0,t.focus()}destroy(){this.emojiContainer.destroy(),this.focusTrap.deactivate(),super.destroy()}renderSync(){const e=[{...this.emoji,skins:null},...(this.emoji.skins||[]).map((e=>({...e,label:this.emoji.label,tags:this.emoji.tags})))];return this.emojiContainer=this.viewFactory.create(_s,{emojis:e,preview:!1}),super.renderSync({emojis:this.emojiContainer}),e.length`\n\n \n`)),ia=br("categoryTab","categoryTabActive","categoryButton");class ra extends Or{constructor({category:e,icon:t}){super({template:oa,classes:ia}),this.isActive=!1,this.category=e,this.icon=t}initialize(){this.uiElements={button:Or.byClass(ia.categoryButton)},this.uiEvents=[Or.childEvent("button","click",this.selectCategory),Or.childEvent("button","focus",this.selectCategory)],super.initialize()}renderSync(){return super.renderSync({category:this.category,icon:this.icon}),this.ui.button.ariaSelected="false",this.el}setActive(e,t={}){const{changeFocusable:n,performFocus:o,scroll:i}={changeFocusable:!0,performFocus:!0,scroll:!0,...t};this.el.classList.toggle(ia.categoryTabActive,e),n&&(this.ui.button.tabIndex=e?0:-1,this.ui.button.ariaSelected=e.toString()),e&&o&&(this.ui.button.focus(),i&&this.events.emit("category:select",this.category.key,{scroll:"animate",focus:"button",performFocus:!1})),this.isActive=e}selectCategory(){this.isActive||this.events.emit("category:select",this.category.key,{scroll:"animate",focus:"button",performFocus:!0})}}const sa=new qr((({classes:e})=>`\n \n`)),aa=br("categoryButtons","categoryButtonsContainer");class ca extends Or{constructor({categories:e}){super({template:sa,classes:aa}),this.activeCategoryIndex=0,this.categories=e}initialize(){this.keyBindings={ArrowLeft:this.stepSelectedTab(-1),ArrowRight:this.stepSelectedTab(1)},this.uiEvents=[Or.uiEvent("scroll",this.checkOverflow)],super.initialize()}checkOverflow(){const e=Math.abs(this.el.scrollLeft-(this.el.scrollWidth-this.el.offsetWidth))>1,t=this.el.scrollLeft>0;this.el.className="categoryButtonsContainer",t&&e?this.el.classList.add("has-overflow-both"):t?this.el.classList.add("has-overflow-left"):e&&this.el.classList.add("has-overflow-right")}renderSync(){return this.tabViews=this.categories.map((e=>this.viewFactory.create(ra,{category:e,icon:Pr[e.key]}))),super.renderSync({tabs:this.tabViews.map((e=>e.renderSync()))}),this.el}get currentCategory(){return this.categories[this.activeCategoryIndex]}get currentTabView(){return this.tabViews[this.activeCategoryIndex]}setActiveTab(e,t={}){this.checkOverflow();const n=this.currentTabView,o=this.tabViews[e];n.setActive(!1,t),o.setActive(!0,t),this.activeCategoryIndex=e}getTargetCategory(e){return e<0?this.categories.length-1:e>=this.categories.length?0:e}stepSelectedTab(e){return()=>{const t=this.activeCategoryIndex+e;this.setActiveTab(this.getTargetCategory(t),{changeFocusable:!0,performFocus:!0})}}}const la=[{version:15,emoji:String.fromCodePoint(129768)},{version:14,emoji:String.fromCodePoint(128733)},{version:13,emoji:String.fromCodePoint(129729)},{version:12,emoji:String.fromCodePoint(129449)},{version:11,emoji:String.fromCodePoint(129463)},{version:5,emoji:String.fromCodePoint(129322)},{version:4,emoji:String.fromCodePoint(9877)},{version:3,emoji:String.fromCodePoint(129314)},{version:2,emoji:String.fromCodePoint(128488)},{version:1,emoji:String.fromCodePoint(128512)}];function ua(){var e;const t=la.find((e=>function(e){const t=document.createElement("canvas").getContext("2d");if(t)return t.textBaseline="top",t.font="32px Arial",t.fillText(e,0,0),0!==t.getImageData(16,16,1,1).data[0]}(e.emoji)));return null!=(e=null==t?void 0:t.version)?e:1}function da(e,t){return Array.from({length:e},(()=>t)).join("")}function ha(e){const{emojiCount:t,classes:n,theme:o,className:i,categoryCount:r}=e;return`\n \n ${(({showHeader:t,classes:n})=>t?`\n
\n ${(({showSearch:e,classes:t})=>e?`\n \n `:"")(e)}\n ${(({showCategoryTabs:e,classes:t})=>e?`\n \n `:"")(e)}\n \n `:"")(e)}\n
\n ${(({showPreview:e,classes:t})=>e?`\n
\n `:"")(e)}\n
\n `}const pa=new qr((e=>e.isLoaded?function(e){const{classes:t,theme:n,className:o=""}=e;return`\n \n ${function({showHeader:e,classes:t}){return e?`\n
\n `:""}(e)}\n
\n
\n
\n `}(e):ha(e))),fa=br("picker","skeleton","placeholder","searchSkeleton","searchInput","categoryTabsSkeleton","headerSkeleton","categoryTab","contentSkeleton","categoryName","emojiGrid","emoji","previewSkeleton","previewEmoji","previewName","tagList","tag","overlay","content","fullHeight","pluginContainer","header"),ma={emojisPerRow:"--emojis-per-row",visibleRows:"--row-count",emojiSize:"--emoji-size"};class ga extends Or{constructor(){super({template:pa,classes:fa}),this.pickerReady=!1,this.externalEvents=new vs,this.updaters={styleProperty:e=>t=>this.el.style.setProperty(ma[e],t.toString()),theme:e=>{this.el.classList.remove(this.options.theme),this.el.classList.add(e)},className:e=>{this.options.className&&this.el.classList.remove(this.options.className),this.el.classList.add(e)},emojisPerRow:this.updateStyleProperty.bind(this,"emojisPerRow"),emojiSize:this.updateStyleProperty.bind(this,"emojiSize"),visibleRows:this.updateStyleProperty.bind(this,"visibleRows")}}initialize(){this.uiElements={pickerContent:Or.byClass(fa.content),header:Or.byClass(fa.header)},this.uiEvents=[Or.uiEvent("keydown",this.handleKeyDown)],this.appEvents={error:this.onError,reinitialize:this.reinitialize,"data:ready":this.onDataReady,"content:show":this.showContent,"variantPopup:hide":this.hideVariantPopup,"emoji:select":this.selectEmoji},super.initialize(),this.options.recentsProvider}destroy(){var e,t;super.destroy(),null==(e=this.search)||e.destroy(),this.emojiArea.destroy(),null==(t=this.categoryTabs)||t.destroy(),this.events.removeAll(),this.externalEvents.removeAll()}clearRecents(){this.options.recentsProvider.clear()}addEventListener(e,t){this.externalEvents.on(e,t)}removeEventListener(e,t){this.externalEvents.off(e,t)}initializePickerView(){this.pickerReady&&(this.showContent(),this.emojiArea.reset(!1))}handleKeyDown(e){const t=e.ctrlKey||e.metaKey;"s"===e.key&&t&&this.search&&(e.preventDefault(),this.search.focus())}buildChildViews(){return this.options.showPreview&&(this.preview=this.viewFactory.create(Ws)),this.options.showSearch&&(this.search=this.viewFactory.create(Js,{categories:this.categories,emojiVersion:this.emojiVersion})),this.options.showCategoryTabs&&(this.categoryTabs=this.viewFactory.create(ca,{categories:this.categories})),this.currentView=this.emojiArea=this.viewFactory.create(zs,{categoryTabs:this.categoryTabs,categories:this.categories,emojiVersion:this.emojiVersion}),[this.preview,this.search,this.emojiArea,this.categoryTabs]}setStyleProperties(){this.options.showSearch||this.el.style.setProperty("--search-height-full","0px"),this.options.showCategoryTabs||(this.el.style.setProperty("--category-tabs-height","0px"),this.el.style.setProperty("--category-tabs-offset","0px")),this.options.showPreview||this.el.style.setProperty("--emoji-preview-height-full","0px"),Object.keys(ma).forEach((e=>{this.options[e]&&this.el.style.setProperty(ma[e],this.options[e].toString())}))}updateStyleProperty(e,t){this.el.style.setProperty(ma[e],t.toString())}reinitialize(){this.renderSync()}onError(e){const t=this.viewFactory.create(Vs,{message:this.i18n.get("error.load")}),n=this.el.offsetHeight||375;throw this.el.style.height=`${n}px`,this.el.replaceChildren(t.renderSync()),e}async onDataReady(e){const t=this.el;try{e?this.emojiData=e:await this.emojiDataPromise,"auto"===this.options.emojiVersion?this.emojiVersion=ua()||parseFloat("14.0"):this.emojiVersion=this.options.emojiVersion,this.categories=await this.emojiData.getCategories(this.options);const[n,o,i,r]=this.buildChildViews();await super.render({isLoaded:!0,search:o,categoryTabs:r,emojiArea:i,preview:n,showHeader:Boolean(this.search||this.categoryTabs),theme:this.options.theme,className:this.options.className}),this.el.style.setProperty("--category-count",this.categories.length.toString()),this.pickerReady=!0,t.replaceWith(this.el),this.setStyleProperties(),this.initializePickerView(),this.setInitialFocus(),this.externalEvents.emit("data:ready")}catch(e){this.events.emit("error",e)}}renderSync(){var e;let t=(null==(e=this.options.categories)?void 0:e.length)||10;if(this.options.showRecents&&(t+=1),super.renderSync({isLoaded:!1,theme:this.options.theme,showSearch:this.options.showSearch,showPreview:this.options.showPreview,showCategoryTabs:this.options.showCategoryTabs,showHeader:this.options.showSearch||this.options.showCategoryTabs,emojiCount:this.options.emojisPerRow*this.options.visibleRows,categoryCount:t}),this.el.style.setProperty("--category-count",t.toString()),!this.options.rootElement)throw new Error("Picker must be given a root element via the rootElement option");return this.options.rootElement.replaceChildren(this.el),this.setStyleProperties(),this.pickerReady&&this.initializePickerView(),this.el}getInitialFocusTarget(){if(typeof this.options.autoFocus<"u")switch(this.options.autoFocus){case"emojis":return this.emojiArea.focusableEmoji;case"search":return this.search;case"auto":return this.search||this.emojiArea.focusableEmoji;default:return null}if(!0===this.options.autoFocusSearch)return console.warn("options.autoFocusSearch is deprecated, please use options.focusTarget instead"),this.search}setInitialFocus(){var e;!this.pickerReady||null==(e=this.getInitialFocusTarget())||e.focus()}reset(e=!0){var t;this.pickerReady&&(this.emojiArea.reset(e),this.showContent(this.emojiArea)),null==(t=this.search)||t.clear(),this.hideVariantPopup()}showContent(e=this.emojiArea){var t,n;e!==this.currentView&&(this.currentView!==this.emojiArea&&(null==(t=this.currentView)||t.destroy()),this.ui.pickerContent.classList.toggle(fa.fullHeight,e!==this.emojiArea),this.ui.pickerContent.replaceChildren(e.el),this.currentView=e,e===this.emojiArea?(this.emojiArea.reset(),this.categoryTabs&&this.ui.header.appendChild(this.categoryTabs.el)):null==(n=this.categoryTabs)||n.el.remove())}hideVariantPopup(){var e;null==(e=this.variantPopup)||e.destroy()}isPickerClick(e){var t,n;const o=e.target,i=this.el.contains(o),r=null==(n=null==(t=this.variantPopup)?void 0:t.el)?void 0:n.contains(o);return i||r}async selectEmoji({emoji:e}){var t,n;(null==(t=e.skins)?void 0:t.length)&&this.options.showVariants&&!this.isVariantPopupOpen?this.showVariantPopup(e):(await(null==(n=this.variantPopup)?void 0:n.animateHide()),this.events.emit("variantPopup:hide"),await this.emitEmoji(e))}get isVariantPopupOpen(){return this.variantPopup&&!this.variantPopup.isDestroyed}async showVariantPopup(e){const t=document.activeElement;this.events.once("variantPopup:hide",(()=>{null==t||t.focus()})),this.variantPopup=this.viewFactory.create(na,{emoji:e,parent:this.el}),this.el.appendChild(this.variantPopup.renderSync()),this.variantPopup.activate()}async emitEmoji(e){this.externalEvents.emit("emoji:select",await this.renderer.doEmit(e)),this.options.recentsProvider.addOrUpdateRecent(e,this.options.maxRecents),this.events.emit("recent:add",e)}updateOptions(e){Object.keys(e).forEach((t=>{this.updaters[t](e[t])})),Object.assign(this.options,e)}}class va{constructor({events:e,i18n:t,renderer:n,emojiData:o,options:i,customEmojis:r=[],pickerId:s}){this.events=e,this.i18n=t,this.renderer=n,this.emojiData=o,this.options=i,this.customEmojis=r,this.pickerId=s}setEmojiData(e){this.emojiData=Promise.resolve(e)}create(e,...t){const n=new e(...t);return n.setPickerId(this.pickerId),n.setEvents(this.events),n.setI18n(this.i18n),n.setRenderer(this.renderer),n.setEmojiData(this.emojiData),n.setOptions(this.options),n.setCustomEmojis(this.customEmojis),n.viewFactory=this,n.initialize(),n}}var ya;class wa{constructor(e={}){sr(this,ya,void 0),ar(this,ya,new Map(Object.entries(e)))}get(e,t=e){return rr(this,ya).get(e)||t}}ya=new WeakMap;let ba=0;const xa=function(){let e=!1;return function(t){ms&&!e&&(function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&!(typeof document>"u")){var o=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}(t),e=!0)}}();function Ca(e){return function(e){if(Array.isArray(e))return ka(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return ka(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return ka(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function ka(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n*{font-family:var(--ui-font)}.picmo-picker.skeleton{background:var(--background-color);border-radius:var(--border-radius);border:1px solid var(--border-color);font-family:var(--ui-font);width:var(--picker-width);color:var(--secondary-text-color)}.picmo-picker.skeleton *{box-sizing:border-box}.picmo-picker.skeleton .placeholder{background:var(--placeholder-background-color);position:relative;overflow:hidden}.picmo-picker.skeleton .placeholder:after{position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 100%);animation:shine 2s infinite;content:""}.picmo-picker.skeleton .headerSkeleton{background-color:var(--secondary-background-color);padding-top:8px;padding-bottom:8px;display:flex;flex-direction:column;overflow:hidden;gap:8px;border-bottom:1px solid var(--border-color);width:var(--picker-width)}.picmo-picker.skeleton .searchSkeleton{padding:0 8px;height:var(--search-height)}.picmo-picker.skeleton .searchSkeleton .searchInput{width:100%;height:28px;border-radius:3px}.picmo-picker.skeleton .categoryTabsSkeleton{height:var(--category-tabs-height);display:flex;flex-direction:row;align-items:center;justify-self:center;width:calc(2rem * var(--category-count, 1))}.picmo-picker.skeleton .categoryTabsSkeleton .categoryTab{width:25px;height:25px;padding:2px;border-radius:5px;margin:.25em}.picmo-picker.skeleton .contentSkeleton{height:var(--content-height);padding-right:8px;opacity:.7}.picmo-picker.skeleton .contentSkeleton .categoryName{width:50%;height:1rem;margin:.5rem;box-sizing:border-box}.picmo-picker.skeleton .contentSkeleton .emojiGrid{display:grid;justify-content:space-between;gap:1px;padding:0 .5em;grid-template-columns:repeat(var(--emojis-per-row),calc(var(--emoji-size) * var(--emoji-size-multiplier)));grid-auto-rows:calc(var(--emoji-size) * var(--emoji-size-multiplier));align-items:center;justify-items:center;width:var(--picker-width)}.picmo-picker.skeleton .contentSkeleton .emojiGrid .emoji{width:var(--emoji-size);height:var(--emoji-size);border-radius:50%}.picmo-picker.skeleton .previewSkeleton{height:var(--emoji-preview-height);border-top:1px solid var(--border-color);display:grid;align-items:center;padding:.5em;gap:6px;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;grid-template-areas:"emoji name" "emoji tags"}.picmo-picker.skeleton .previewSkeleton .previewEmoji{grid-area:emoji;border-radius:50%;width:var(--emoji-preview-size);height:var(--emoji-preview-size)}.picmo-picker.skeleton .previewSkeleton .previewName{grid-area:name;height:.8em;width:80%}.picmo-picker.skeleton .previewSkeleton .tagList{grid-area:tags;list-style-type:none;display:flex;flex-direction:row;padding:0;margin:0}.picmo-picker.skeleton .previewSkeleton .tagList .tag{border-radius:3px;padding:2px 8px;margin-right:.25em;height:1em;width:20%}.overlay{background:rgba(0,0,0,.75);height:100%;left:0;position:fixed;top:0;width:100%;z-index:1000}.content{position:relative;overflow:hidden;height:var(--content-height)}.content.fullHeight{height:calc(var(--content-height) + var(--category-tabs-height) + var(--category-tabs-offset));overflow-y:auto;scrollbar-color:var(--scrollbar-color) var(--scrollbar-background-color);scrollbar-width:thin}.content.fullHeight::-webkit-scrollbar{background:var(--scrollbar-background-color);width:1.1em}.content.fullHeight::-webkit-scrollbar-thumb{background:var(--scrollbar-color);background-clip:padding-box;height:1em;border-radius:.5em}.pluginContainer{margin:.5em;display:flex;flex-direction:row}.header{background-color:var(--secondary-background-color);padding-top:8px;padding-bottom:8px;display:grid;gap:8px;border-bottom:1px solid var(--border-color)}@media (prefers-reduced-motion: reduce){.placeholder{background:var(--placeholder-background-color);position:relative;overflow:hidden}.placeholder:after{display:none}}.picmo-picker .preview{border-top:1px solid var(--border-color);display:grid;align-items:center;gap:6px;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;grid-template-areas:"emoji name" "emoji tags";height:var(--emoji-preview-height);box-sizing:border-box;padding:.5em;position:relative;background:var(--preview-background-color)}.picmo-picker .preview .previewEmoji{grid-area:emoji;font-size:var(--emoji-preview-size);font-family:var(--emoji-font);width:1.25em;display:flex;align-items:center;justify-content:center}.picmo-picker .preview .previewName{grid-area:name;color:var(--text-color);font-size:.8em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.picmo-picker .preview .tagList{grid-area:tags;list-style-type:none;display:flex;flex-direction:row;padding:0;margin:0;font-size:.75em;overflow:hidden}.picmo-picker .preview .tag{border-radius:3px;background:var(--tag-background-color);color:var(--text-color);padding:2px 8px;margin-right:.25em;white-space:nowrap}.picmo-picker .preview .tag:last-child{margin-right:0}.picmo-picker .searchContainer{display:flex;height:var(--search-height);box-sizing:border-box;padding:0 8px;position:relative}.picmo-picker .searchContainer .searchField{background:var(--search-background-color);border-radius:3px;border:none;box-sizing:border-box;color:var(--text-color);font-size:.9em;outline:none;padding:.5em 2.25em .5em .5em;width:100%}.picmo-picker .searchContainer .searchField:focus{background:var(--search-focus-background-color)}.picmo-picker .searchContainer .searchField::placeholder{color:var(--search-placeholder-color)}.picmo-picker .searchContainer .searchAccessory{color:var(--search-icon-color);height:100%;position:absolute;right:1em;top:0;width:1.25rem;display:flex;align-items:center}.picmo-picker .searchContainer .searchAccessory svg{fill:var(--search-icon-color)}.picmo-picker .searchContainer .clearButton{border:0;color:var(--search-icon-color);background:transparent;cursor:pointer}.picmo-picker .searchContainer .clearSearchButton{cursor:pointer;border:none;background:transparent;color:var(--search-icon-color);font-size:1em;width:100%;height:100%;display:flex;align-items:center;padding:0}.picmo-picker .searchContainer .notFound [data-icon]{fill:#f3e265}.picmo-picker .variantOverlay{background:var(--overlay-background-color);border-radius:5px;display:flex;flex-direction:column;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.picmo-picker .variantOverlay .variantPopup{background:var(--variant-popup-background-color);border-radius:5px;margin:.5em;padding:.5em;text-align:center;user-select:none;display:flex;align-items:center;justify-content:center}.customEmoji{width:1em;height:1em}@keyframes shine{to{transform:translate(100%)}}.picmo-picker .imagePlaceholder{width:2rem;height:2rem;border-radius:50%}.placeholder{background:#DDDBDD;position:relative}.placeholder:after{position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 100%);animation:shine 2s infinite;content:""}\n');const t=function(e={}){return{...cs,...e,renderer:e.renderer||new Jr,recentsProvider:e.recentsProvider||new as}}(e),n=((null==t?void 0:t.custom)||[]).map((e=>({...e,custom:!0,tags:["custom",...e.tags||[]]}))),o=new gs,i=function(e){return _r(e.locale,e.dataStore,e.messages,e.emojiData)}(t),r=new wa(t.i18n);i.then((e=>{o.emit("data:ready",e)})).catch((e=>{o.emit("error",e)}));const s=new va({events:o,i18n:r,customEmojis:n,renderer:t.renderer,options:t,emojiData:i,pickerId:`picmo-${Date.now()}-${ba++}`}).create(ga);return s.renderSync(),s},window.darkTheme=Ar,qi.start(),window.isInViewport=function(e){var t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)},window.lazyLoadImages=function(){for(var e=document.getElementsByClassName("lazyload"),t=0;t1024&&(e.classList.contains("pinned")?(e.classList.remove("pt-10"),e.classList.remove("pt-1")):window.scrollY>50?(console.log("entered"+window.scrollY),e.classList.remove("pt-10"),e.classList.add("pt-1")):(e.classList.remove("pt-1"),e.classList.add("pt-10")))},window.notificationOpen=!1,window.notificationTimeout=null,window.notficationRemove=null,window.notification={show:function(e,t){clearTimeout(notificationTimeout),clearTimeout(notficationRemove),document.getElementById("notification")&&document.getElementById("notification").remove();var n="text-blue-400",o="Notice";switch(e){case"success":n="text-green-400",o="Success";break;case"warning":n="text-orange-400",o="Warning";break;case"error":n="text-red-400",o="Error"}var i='",r=document.createElement("div");r.className="fixed bottom-0 md:top-0 right-0 z-50 md:mt-3 md:mr-3 transition-all duration-300 ease-out transform translate-y-2 md:translate-y-0 md:translate-x-2 opacity-0",r.id="notification",r.innerHTML=i,document.getElementById("app").appendChild(r);for(var s=document.getElementsByClassName("close-notification"),a=0;a11){n=e.target.value.replace(/\D/g,"").match(/(\d{2})(\d{5})(\d{4})/);e.target.value="("+n[1]+") "+n[2]+"-"+n[3]}}else if(3==t.length){n=e.target.value.replace(/\D/g,"").match(/(\d{3})/);e.target.value="("+n[1]+") "}else if(6==t.length){n=e.target.value.replace(/\D/g,"").match(/(\d{3})(\d{3})/);e.target.value="("+n[1]+") "+n[2]+" "}else if(10==t.length){n=e.target.value.replace(/\D/g,"").match(/(\d{3})(\d{3})(\d{4})/);e.target.value="("+n[1]+") "+n[2]+" "+n[3]}else if(t.length>10){n=e.target.value.replace(/\D/g,"").match(/(\d{3})(\d{3})(\d{4})/);e.target.value="("+n[1]+") "+n[2]+" "+n[3]}})),window.checkoutComplete=function(e){var t=e.checkout.id;Paddle.Order.details(t,(function(e){console.log(e),document.getElementById("loadMsg").innerText="Finishing Up Your Order",document.getElementById("loading").classList.remove("invisible");var t=null;e&&void 0!==e.order&&void 0!==e.order.customer&&void 0!==e.order.customer.email&&(t=e.order.customer.email),axios.post("/paddle/checkout",{_token:document.querySelector("meta[name='csrf-token']").getAttribute("content"),email:t,checkout_id:e.checkout.checkout_id}).then((function(e){console.log(e.data),1==parseInt(e.data.status)&&("/tails/beta"==window.location.pathname?window.location="/tails/beta":"undefined"!=typeof redirectAfterPurchase?window.location=redirectAfterPurchase:window.location="/welcome")}))}))},window.cancelComplete=function(e){console.log("callback"),console.log(e);var t=e.checkout.id;axios.post("/paddle/cancel",{_token:document.querySelector("meta[name='csrf-token']").getAttribute("content"),id:t}).then((function(e){console.log(e.data),1==parseInt(e.data.status)&&(window.location="/settings/subscription")}))},document.getElementById("post_id")&&axios.post("/api/views/posts/"+document.getElementById("post_id").value).then((function(e){console.log(e)})),window.addEventListener("notification",(function(e){notification.show(e.detail.type,e.detail.message)})),window.addEventListener("show-notification",(function(e){showNotification(e.detail.amount,e.detail.message)})),window.contentModalOpen=!1,window.menuLoaded=!1,document.onkeydown=function(e){27==(e=e||window.event).keyCode&&(document.getElementById("content-modal").dispatchEvent(new CustomEvent("close-modal",{detail:{}})),document.getElementsByClassName("search-input")[0].blur())},window.returnBack=function(){window.history.back()},window.setMenuItemActive=function(e){var t,n,o=document.querySelector(".menu-item-active"),i=e.dataset.active;(i=(i=i.split(" ")).filter((function(e){return e})),console.log("adding: "),console.log(i),o)&&(n=o.classList).remove.apply(n,Ca(i));(t=e.classList).add.apply(t,Ca(i));var r=e.getElementsByTagName("svg")[0];r.classList.remove("group-hover:translate-x-0","-translate-x-1"),r.classList.add("translate-x-1","opacity-0")},window.appReady=function(){window.renderResponsiveFunctionality()},window.renderResponsiveFunctionality=function(){window.innerWidth<1024&&(window.app.leftMenuPinned=!1);for(var e=document.querySelectorAll(".main-dropdown-menu"),t=0;t{document.addEventListener("DOMContentLoaded",(function(e){checkForFloatingSushiAvailability()})),window.checkForFloatingSushiAvailability=function(){fetch("/points/floating_sp_eligibility").then((function(e){return e.json()})).then((function(e){if(1==parseInt(e)){var t=Math.floor(3*Math.random()+1);if(1==parseInt(t)){var n=Math.round(60*Math.random())+10;setTimeout((function(){window.showSushi()}),n*=1e3)}}}))},window.showSushi=function(){var e=Math.floor(9*Math.random())+1;floating({content:' ',number:1,duration:9,repeat:1,size:5})},window.sushiClick=function(e){e.classList.add("scale-110"),setTimeout((function(){e.classList.remove("scale-110"),e.classList.add("scale-0"),setTimeout((function(){e.remove()}),200)}),200),fetch("/points/floating_sp_eligibility",{headers:{"Content-Type":"application/json",Accept:"application/json","X-Requested-With":"XMLHttpRequest","X-CSRF-Token":document.querySelector("meta[name='csrf-token']").getAttribute("content")},method:"post",credentials:"same-origin"}).then((function(e){return e.json()})).then((function(e){1==parseInt(e)?showNotification(1,"Floating Sushi"):ahahah()}))},window.ahahah=function(){var e=document.createElement("div");e.id="ahahah",e.className="z-30 bottom-0 left-1/2 -translate-x-1/2 translate-y-full flex max-w-sm w-full justify-between fixed transition duration-200 ease-out transform bg-white rounded-t-lg shadow-2xl bg-white",e.innerHTML=' \n \n
\n \n Your browser does not support the video tag.\n \n
',document.body.appendChild(e),setTimeout((function(){document.getElementById("ahahah").classList.remove("translate-y-full"),document.getElementById("ahahah-video").play()})),setTimeout((function(){document.getElementById("ahahah").classList.add("translate-y-full"),setTimeout((function(){document.getElementById("ahahah").remove()}),200)}),3e3)},window.showNotification=function(e,t){var n=1==e?"":"s",o=document.createElement("div");o.id="sushi_points",o.className="bottom-0 left-1/2 flex justify-between transition -translate-x-1/2 duration-300 ease-out transform translate-y-64 theme-bg rounded-t-lg shadow-2xl",o.innerHTML='
+'+e+" Sushi Point"+n+'! Nice Job! You\'ve just earned '+e+" Sushi Point"+n+' for accomplishing
',document.body.appendChild(o),new Audio("https://cdn.devdojo.com/assets/audio/coin.mp3").play(),t&&(document.getElementById("points_reason").innerHTML=t),setTimeout((function(){document.getElementById("sushi_points").classList.remove("translate-y-64")})),setTimeout((function(){document.getElementById("sushi_points").classList.add("translate-y-64"),setTimeout((function(){document.getElementById("sushi_points").remove()}),1e3)}),4e3)}},779:()=>{window.history.scrollRestoration="manual";var e=new Event("ajax-link-clicked");document.addEventListener("DOMContentLoaded",(function(t){var n=document.getElementById("content"),o=(document.getElementById("leftMenu"),document.getElementById("loading")),i=document.getElementById("footerjs"),r=!0,s=!1,a=["/tails","/wave","/saasadventure","/learn","/markdownx","/markdownx/docs","/wordsmith","/pro","/featured/info","/devblog","/sponsorship","/featured/info","/pricing","/halloween"];window.initializeSpa=function(){setTimeout((function(){for(var e=document.querySelectorAll("[data-href]"),t=document.querySelectorAll("a"),n=0;n{function e(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var o,i,r=[],s=!0,a=!1;try{for(n=n.call(e);!(s=(o=n.next()).done)&&(r.push(o.value),!t||r.length!==t);s=!0);}catch(e){a=!0,i=e}finally{try{s||null==n.return||n.return()}finally{if(a)throw i}}return r}(e,n)||function(e,n){if(!e)return;if("string"==typeof e)return t(e,n);var o=Object.prototype.toString.call(e).slice(8,-1);"Object"===o&&e.constructor&&(o=e.constructor.name);if("Map"===o||"Set"===o)return Array.from(e);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return t(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);nt.offsetTop&&(o.target.classList.toggle("is-pinned",o.intersectionRatio<1&&0!=o.intersectionRatio),o.target.classList.contains("is-pinned")&&window.innerWidth<1024?(document.getElementById("tocButtonMobile").classList.remove("translate-y-20"),document.getElementById("tocButtonMobile").classList.remove("opacity-0"),document.getElementById("backToTopButton").classList.remove("opacity-0"),document.getElementById("backToTopButton").classList.remove("translate-y-20")):(document.getElementById("tocButtonMobile").classList.add("translate-y-20"),document.getElementById("tocButtonMobile").classList.add("opacity-0"),document.getElementById("backToTopButton").classList.add("opacity-0"),document.getElementById("backToTopButton").classList.add("translate-y-20")))}),{threshold:[0,1]}).observe(t)},window.tocScrollFunctionality=function(){var e=-50;document.getElementById("header")&&(e=15),document.getElementById("post")&&(e+=document.getElementById("post").offsetTop);var t=windowContainer.pageYOffset;if(r&&(t=windowContainer.scrollTop),t=n[n.length-1].elementTop+e)s(n[n.length-1].list_item);else for(var o=0;o=n[o].elementTop+e&&t<=n[o+1].elementTop+e&&(n[o].list_item.classList.contains("active")||s(n[o].list_item))};window.anchorLinkClick=function(e){e.preventDefault();var t=window.innerWidth<1024?0:50;if(document.getElementById("header")&&(t=115,window.innerWidth<1024&&(t=115)),e.target.getAttribute("href")){var n=document.querySelector(e.target.getAttribute("href")).offsetTop+(document.getElementById("post").offsetTop+t);"#comments"==e.target.getAttribute("href")&&(n=function(e){for(var t=0;e;)t+=e.offsetTop,e=e.offsetParent;return t}(document.querySelector(this.getAttribute("href")))+t),window.scroll({top:n,left:0,behavior:"smooth"}),history.replaceState(void 0,void 0,this.getAttribute("href"))}},window.removeAnchorLinkListeners=function(){for(var e=0;e{"use strict";n.d(t,{Z:()=>r});var o=n(645),i=n.n(o)()((function(e){return e[1]}));i.push([e.id,".tippy-box[data-animation=shift-away-subtle][data-state=hidden]{opacity:0}.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=top]{transform:translateY(5px)}.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=bottom]{transform:translateY(-5px)}.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=left]{transform:translateX(5px)}.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=right]{transform:translateX(-5px)}",""]);const r=i},95:(e,t,n)=>{"use strict";n.d(t,{Z:()=>r});var o=n(645),i=n.n(o)()((function(e){return e[1]}));i.push([e.id,'.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{background-color:#333;border-radius:4px;color:#fff;font-size:14px;line-height:1.4;outline:0;position:relative;transition-property:transform,visibility,opacity;white-space:normal}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{border-top-color:initial;border-width:8px 8px 0;bottom:-7px;left:0;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:initial;border-width:0 8px 8px;left:0;top:-7px;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-left-color:initial;border-width:8px 0 8px 8px;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{border-right-color:initial;border-width:8px 8px 8px 0;left:-7px;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{color:#333;height:16px;width:16px}.tippy-arrow:before{border-color:transparent;border-style:solid;content:"";position:absolute}.tippy-content{padding:5px 9px;position:relative;z-index:1}',""]);const r=i},645:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=e(t);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,o){"string"==typeof e&&(e=[[null,e,""]]);var i={};if(o)for(var r=0;r{"use strict";n.d(t,{Z:()=>o});const o=function(){var e=0