preact-island/dist/index.cjs

🏝 Create your own slice of paradise on any website.

var e=require("preact"),t=require("preact/compat");function n(){return n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},n.apply(this,arguments)}function r(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,i(e,t)}function o(e){return o=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},o(e)}function i(e,t){return i=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},i(e,t)}function c(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch(e){return!1}}function a(e,t,n){return a=c()?Reflect.construct:function(e,t,n){var r=[null];r.push.apply(r,t);var o=new(Function.bind.apply(e,r));return n&&i(o,n.prototype),o},a.apply(null,arguments)}function u(e){var t="function"==typeof Map?new Map:void 0;return u=function(e){if(null===e||-1===Function.toString.call(e).indexOf("[native code]"))return e;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,n)}function n(){return a(e,arguments,o(this).constructor)}return n.prototype=Object.create(e.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),i(n,e)},u(e)}var l=function(e){return e instanceof ShadowRoot},s=function(e){var t,n=(e.getRootNode()instanceof ShadowRoot?e.getRootNode().host:e).dataset,r={};for(var o in n){if(!1===n.hasOwnProperty(o))return;var i=""+(t=o.split(/(props?)/).pop()||"").charAt(0).toLowerCase()+t.slice(1);i&&(r[i]=n[o])}return r},p=function(e){return["text/props","application/json"].includes(e.getAttribute("type")||"")},f=function(e){return l(e)?[]:Array.from(e.getElementsByTagName("script")).filter(p)},d=function(e){return Array.from(document.querySelectorAll(e)).filter(p)},m=function(e){var t={};return e.forEach(function(e){try{t=n({},t,JSON.parse(e.innerHTML))}catch(e){}}),t},v=function(e,t,r,o){void 0===r&&(r={});var i=s(t),c=e._executedScript?s(e._executedScript):{},a=m(f(t));return n({},r,i,c,o?m(d(o)):{},a)};function h(e,t){var n=(t=[].concat(t))[t.length-1].nextSibling;function r(t,r){e.insertBefore(t,r||n)}return e.__k={nodeType:1,parentNode:e,firstChild:t[0],childNodes:t,insertBefore:r,appendChild:r,removeChild:function(t){e.removeChild(t)}}}var y=function(t){var n=t.widget,r=t.rootFragment,o=t.props;t.island.props=o,e.render(e.h(n,o),r)},b=function(t){var r={_rootsToObservers:new WeakMap,_roots:[],_executedScript:document.currentScript,props:{},render:function(e){var o=e.selector,i=e.clean,c=void 0!==i&&i,a=e.replace,u=void 0!==a&&a,s=e.inline,p=void 0!==s&&s,m=e.initialProps,b=void 0===m?{}:m,E=e.propsSelector,g=e.elementName,w=!1,S=function(){if(!0!==w){var e=function(e){var t=e.selector,n=e.elementName,r=document.currentScript;if(e.inline&&null!=r&&r.parentNode)return[r.parentNode];var o=null==r?void 0:r.dataset.mountIn;return o?Array.from(document.querySelectorAll(o)).map(function(e){if(null!=n){var t=document.createElement(n),r=e.appendChild(t);return null!=r.shadowRoot?r.shadowRoot:r}return e}):t?Array.from(document.querySelectorAll(t)).map(function(e){return null!=e.shadowRoot?e.shadowRoot:e}):[]}({selector:o,inline:p,elementName:g});if(0!==e.length){var i=function(e){var t=e.island,r=e.widget,o=e.clean,i=e.replace,c=e.initialProps,a=e.propsSelector,u=[];return e.hostElements.forEach(function(e){var s,p=v(t,e,c,a);if(o&&e.replaceChildren(),i)s=h(e.parentElement||document.body,e);else{var m=document.createElement("div");e.appendChild(m),s=h(e,m)}u.push(s),y({island:t,widget:r,rootFragment:s,props:p});var b=function(e){var t=e.island,r=e.hostElement,o=e.initialProps,i=e.onNewProps,c=e.propsSelector,a=new MutationObserver(function(e){e.forEach(function(){i(v(t,r,o,c))})}),u={attributes:!0,childList:!0,characterData:!0};return t._executedScript&&a.observe(t._executedScript,u),f(r).forEach(function(e){a.observe(e,n({},u,{subtree:!0}))}),c&&d(c).forEach(function(e){a.observe(e,n({},u,{subtree:!0}))}),a.observe(l(r)?r.host:r,u),a}({island:t,hostElement:e,initialProps:c,onNewProps:function(e){y({island:t,widget:r,rootFragment:s,props:e})},propsSelector:a});t._rootsToObservers.set(s,b)}),{rootFragments:u}}({island:r,widget:t,clean:c,hostElements:e,replace:u,initialProps:b,propsSelector:E});r._roots=r._roots.concat(i.rootFragments),w=!0}}};S(),document.addEventListener("DOMContentLoaded",S),document.addEventListener("load",S)},rerender:function(e){r._roots.forEach(function(o){y({island:r,widget:t,rootFragment:o,props:n({},r.props,e)})})},destroy:function(){r._roots.forEach(function(t){var n;null==(n=r._rootsToObservers.get(t))||n.disconnect(),e.render(null,t)})}};return r};exports.WebComponentPortal=function(e){var n=e.name,o=e.container,i=void 0===o?document.body:o,c=e.children,a=e.style,l=t.useMemo(function(){if(null==customElements.get(n)){var e=/*#__PURE__*/function(e){function t(){var t,n=(t=e.call(this)||this).attachShadow({mode:"open"});if(!a)return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t);if(a instanceof HTMLStyleElement)n.prepend(a);else{var r=document.createElement("style");r.innerHTML=a,n.prepend(r)}return t}return r(t,e),t}(/*#__PURE__*/u(HTMLElement));customElements.define(n,e)}var t=document.createElement(n);return i.appendChild(t)},[i,a]);return t.useEffect(function(){return function(){l.remove()}},[l]),t.createPortal(c,l.shadowRoot)},exports.createIsland=b,exports.createIslandWebComponent=function(e,t){if(null==customElements.get(e)){var o=/*#__PURE__*/function(e){function t(){var t;return(t=e.call(this)||this).attachShadow({mode:"open"}),t}return r(t,e),t}(/*#__PURE__*/u(HTMLElement));customElements.define(e,o)}var i=b(t);return n({},i,{render:function(t){return i.render(n({elementName:e},t))},injectStyles:function(e){i._roots.forEach(function(t){var n=document.createElement("style");n.innerHTML=e,t.parentNode.prepend(n)})}})};