@theprojectsx/react-head
Version:
Lightweight Component to manage the head of your React and Next JS applications
3 lines (2 loc) • 2.58 kB
JavaScript
import e,{useEffect as t}from"react";const i=(e,t,i)=>{if("charset"===e){const e=document.querySelector("meta[charset]");if(e)e.setAttribute("charset",t);else{const e=document.createElement("meta");e.setAttribute("charset",t),document.head.appendChild(e)}return}const n=document.querySelector(`meta[${e}="${t}"]`);if(n)n.setAttribute("content",i);else{const n=document.createElement("meta");n.setAttribute(e,t),n.setAttribute("content",i),document.head.appendChild(n)}},n=(e,t)=>{const i=document.createElement(e);Object.entries(t).filter((([e])=>"children"!==e)).forEach((([e,t])=>{i.setAttribute(e,t)})),t.children&&(i.textContent=t.children),document.head.appendChild(i)},r=({title:e,base:r,meta:l,link:s,style:a,script:c,noscript:o,template:p})=>{t((()=>{if(!e)return;document.title=e;const t=setTimeout((()=>{document.title=e}),24);return()=>clearTimeout(t)}),[e]),t((()=>{if(!r)return;const e=document.querySelector("base");if(e)Object.entries(r).forEach((([t,i])=>{e.setAttribute(t,i)}));else{const e=document.createElement("base");Object.entries(r).forEach((([t,i])=>{e.setAttribute(t,i)})),document.head.appendChild(e)}}),[r]),t((()=>{0!==l.length&&l.forEach((e=>{const{name:t,property:n,httpEquiv:r,charset:l,content:s}=e;if(l)return void i("charset",l);const a=t?"name":n?"property":r?"http-equiv":null;a&&i(a,t||n||r,s)}))}),[l]),t((()=>{0!==s.length&&s.forEach((e=>n("link",e)))}),[s]),t((()=>{0!==a.length&&a.forEach((e=>n("style",e)))}),[a]),t((()=>{0!==c.length&&c.forEach((e=>n("script",e)))}),[c]),t((()=>{0!==o.length&&o.forEach((e=>n("noscript",e)))}),[o]),t((()=>{0!==p.length&&p.forEach((e=>n("template",e)))}),[p])},l=({children:t})=>{const i=e.Children.toArray(t),n=i.find((t=>e.isValidElement(t)&&"title"===t.type)),l=i.find((t=>e.isValidElement(t)&&"base"===t.type)),s=i.filter((t=>e.isValidElement(t)&&"meta"===t.type)),a=i.filter((t=>e.isValidElement(t)&&"link"===t.type)),c=i.filter((t=>e.isValidElement(t)&&"style"===t.type)),o=i.filter((t=>e.isValidElement(t)&&"script"===t.type)),p=i.filter((t=>e.isValidElement(t)&&"noscript"===t.type)),m=i.filter((t=>e.isValidElement(t)&&"template"===t.type));return r({title:n?String(n.props.children):void 0,base:l?l.props:void 0,meta:s.map((t=>e.isValidElement(t)?t.props:{})),link:a.map((t=>e.isValidElement(t)?t.props:{})),style:c.map((t=>e.isValidElement(t)?t.props:{})),script:o.map((t=>e.isValidElement(t)?t.props:{})),noscript:p.map((t=>e.isValidElement(t)?t.props:{})),template:m.map((t=>e.isValidElement(t)?t.props:{}))}),null};export{l as default,r as useReactHead};
//# sourceMappingURL=index.esm.js.map