preact-custom-element
Version:
Wrap your component up as a custom element
3 lines (2 loc) • 2.9 kB
JavaScript
var t=require("preact");function e(){return e=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},e.apply(this,arguments)}function n(t,e){if(null==t)return{};var n,r,o={},i=Object.keys(t);for(r=0;r<i.length;r++)e.indexOf(n=i[r])>=0||(o[n]=t[n]);return o}var r=["context","children"],o=["useFragment"];function i(e){this.getChildContext=function(){return e.context};var o=e.children,i=n(e,r);return t.cloneElement(o,i)}function a(n){var r=new CustomEvent("_preact",{detail:{},bubbles:!0,cancelable:!0});this.dispatchEvent(r),this._vdom=t.h(i,e({},this._props,{context:r.detail.context}),d(this,this._vdomComponent,n)),(this.hasAttribute("hydrate")?t.hydrate:t.render)(this._vdom,this._root)}function s(t){return t.replace(/-(\w)/g,function(t,e){return e?e.toUpperCase():""})}function l(e,n,r){if(this._vdom){var o={};o[e]=r=null==r?void 0:r,o[s(e)]=r,this._vdom=t.cloneElement(this._vdom,o),t.render(this._vdom,this._root)}}function c(){t.render(this._vdom=null,this._root)}function u(r,i){var a=this,s=r.useFragment,l=n(r,o);return t.h(s?t.Fragment:"slot",e({},l,{ref:function(t){t?(a.ref=t,a._listener||(a._listener=function(t){t.stopPropagation(),t.detail.context=i},t.addEventListener("_preact",a._listener))):a.ref.removeEventListener("_preact",a._listener)}}))}function d(e,n,r){if(3===e.nodeType)return e.data;if(1!==e.nodeType)return null;var o=[],i={},a=0,l=e.attributes,c=e.childNodes;for(a=l.length;a--;)"slot"!==l[a].name&&(i[l[a].name]=l[a].value,i[s(l[a].name)]=l[a].value);for(a=c.length;a--;){var h=d(c[a],null,r),p=c[a].slot;p?i[p]=t.h(u,{name:p},h):o[a]=h}var f=!(!r||!r.shadow),m=n?t.h(u,{useFragment:!f},o):o;return!f&&n&&(e.innerHTML=""),t.h(n||e.nodeName.toLowerCase(),i,m)}module.exports=function(t,e,n,r){function o(){var e,n=Reflect.construct(HTMLElement,[],o);return n._vdomComponent=t,r&&r.shadow?(n._root=n.attachShadow({mode:r.mode||"open",serializable:null!=(e=r.serializable)&&e}),r.adoptedStyleSheets&&(n._root.adoptedStyleSheets=r.adoptedStyleSheets)):n._root=n,n}return(o.prototype=Object.create(HTMLElement.prototype)).constructor=o,o.prototype.connectedCallback=function(){a.call(this,r)},o.prototype.attributeChangedCallback=l,o.prototype.disconnectedCallback=c,n=n||t.observedAttributes||Object.keys(t.propTypes||{}),o.observedAttributes=n,t.formAssociated&&(o.formAssociated=!0),n.forEach(function(t){Object.defineProperty(o.prototype,t,{get:function(){return this._vdom?this._vdom.props[t]:this._props[t]},set:function(e){this._vdom?this.attributeChangedCallback(t,null,e):(this._props||(this._props={}),this._props[t]=e);var n=typeof e;null!=e&&"string"!==n&&"boolean"!==n&&"number"!==n||this.setAttribute(t,e)}})}),customElements.define(e||t.tagName||t.displayName||t.name,o),o};
//# sourceMappingURL=preact-custom-element.js.map