├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── es.js ├── index.js ├── min.js ├── package-lock.json └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .nyc_output 3 | node_modules/ 4 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .nyc_output 3 | .travis.yml 4 | node_modules/ 5 | rollup/ 6 | test/ 7 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | ISC License 2 | 3 | Copyright (c) 2020, Andrea Giammarchi, @WebReflection 4 | 5 | Permission to use, copy, modify, and/or distribute this software for any 6 | purpose with or without fee is hereby granted, provided that the above 7 | copyright notice and this permission notice appear in all copies. 8 | 9 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH 10 | REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY 11 | AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, 12 | INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM 13 | LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE 14 | OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR 15 | PERFORMANCE OF THIS SOFTWARE. 16 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Custom Elements Polyfill 2 | 3 | This module provides the [Custom Elements V1 API](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-api) as defined by standards, including the ability to [extend builtin elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-customized-builtin-example), all in ~2K _minified_ and _gzipped_ / _brotlied_. 4 | 5 | 6 | ## Compatibility 7 | 8 | The polyfill gracefully enhances the following minimum versions of at least these browsers, up to their latest version: 9 | 10 | * Chrome 38 11 | * Firefox 14 12 | * Opera 25 13 | * Internet Explorer 11 and Edge 12 14 | * Safari 8 and WebKit based 15 | * Samsung Internet 3 16 | 17 | 18 | ## How To 19 | 20 | Either install this module via `npm i @ungap/custom-elements`, and include it in your project, or use a CDN such as [unpkg.com](https://unpkg.com/@ungap/custom-elements) to obtain the _minified_ version of this module. 21 | 22 | ```html 23 | 24 | 25 | ``` 26 | 27 | If targeted browsers are ES2015 compatible, the `es.js` file would provide the same polyfill, just lighter, as no transpilation is used. 28 | 29 | ```html 30 | 31 | ``` 32 | 33 | 34 | 35 | If installed as module, please remember to include it on top of your main JS file. 36 | 37 | ```js 38 | // ESM 39 | import '@ungap/custom-elements'; 40 | 41 | // CJS 42 | require('@ungap/custom-elements'); 43 | ``` 44 | 45 | The module will incrementally patch the global `window`/`self` reference, adding a `customElements` object that is compatible with the API. 46 | 47 | 48 | ## Source Code 49 | 50 | This module simply provides [@webreflection/custom-elements](https://github.com/WebReflection/custom-elements#readme) module under the [ungap](https://ungap.github.io/) umbrella. 51 | -------------------------------------------------------------------------------- /es.js: -------------------------------------------------------------------------------- 1 | !function(){"use strict";var e=(e,t)=>{const n=e=>{for(let t=0,{length:n}=e;t{e.attributeChangedCallback(t,n,e.getAttribute(t))};return(r,s)=>{const{observedAttributes:l}=r.constructor;return l&&e(s).then((()=>{new t(n).observe(r,{attributes:!0,attributeOldValue:!0,attributeFilter:l});for(let e=0,{length:t}=l;er in e,{filter:f}=[];var h=e=>{const h=new i,d=(t,n)=>{let o;if(n)for(let r,s=(e=>e.matches||e.webkitMatchesSelector||e.msMatchesSelector)(t),l=0,{length:c}=g;l{e.handle(t,n,o)})))},p=(e,t=!0)=>{for(let n=0,{length:o}=e;n{const c=(n,r,s,l,a,i)=>{for(const u of n)(i||o in u)&&(a?s.has(u)||(s.add(u),l.delete(u),e(u,a)):l.has(u)||(l.add(u),s.delete(u),e(u,a)),i||c(u[o](r),r,s,l,a,t))},a=new s((e=>{if(l.length){const o=l.join(","),r=new Set,s=new Set;for(const{addedNodes:l,removedNodes:a}of e)c(a,o,r,s,n,n),c(l,o,r,s,t,n)}})),{observe:i}=a;return(a.observe=e=>i.call(a,e,{subtree:t,childList:t}))(r),a})(d,m,c,g),{attachShadow:w}=l.prototype;return w&&(l.prototype.attachShadow=function(e){const t=w.call(this,e);return y.observe(t),t}),g.length&&p(m[r](g)),{drop:e=>{for(let t=0,{length:n}=e;t{const e=y.takeRecords();for(let t=0,{length:n}=e;t{const t=N(e),n=[],o=new y,{length:r}=t;for(let s=0;s{for(let s=0;s{const o=L.get(n);if(t&&!o.isPrototypeOf(e)){const t=D(e);R=C(e,o);try{new o.constructor}finally{R=null,t()}}const r=(t?"":"dis")+"connectedCallback";r in o&&e[r]()},{parse:_}=h({query:H,handle:I});let R=null;const V=e=>{if(!k.has(e)){let t,n=new Promise((e=>{t=e}));k.set(e,{$:n,_:t})}return k.get(e).$},j=e(V,g);function W(){const{constructor:e}=this;if(!$.has(e))throw new M("Illegal constructor");const t=$.get(e);if(R)return j(R,t);const n=P.call(d,t);return j(C(n,e.prototype),t)}self.customElements={define:(e,t)=>{if(x.has(e))throw new v(`the name "${e}" has already been used with this registry`);$.set(t,e),L.set(e,t.prototype),x.set(e,t),H.push(e),V(e).then((()=>{_(d.querySelectorAll(e))})),k.get(e)._(t)},get:e=>x.get(e),whenDefined:V},A(W.prototype=E.prototype,"constructor",{value:W}),self.HTMLElement=W,d.createElement=function(e,t){const n=t&&t.is,o=n?x.get(n):x.get(e);return o?new o:P.call(d,e)},"isConnected"in S.prototype||A(S.prototype,"isConnected",{configurable:!0,get(){return!(this.ownerDocument.compareDocumentPosition(this)&this.DOCUMENT_POSITION_DISCONNECTED)}})}else if(T=!self.customElements.get("extends-br"),T)try{function B(){return self.Reflect.construct(HTMLBRElement,[],B)}B.prototype=HTMLLIElement.prototype;const F="extends-br";self.customElements.define("extends-br",B,{extends:"br"}),T=d.createElement("br",{is:F}).outerHTML.indexOf(F)<0;const{get:U,whenDefined:z}=self.customElements;self.customElements.whenDefined=function(e){return z.call(this,e).then((t=>t||U.call(this,e)))}}catch(G){}if(T){const J=self.customElements,{createElement:K}=d,{define:Q,get:X,upgrade:Y}=J,{construct:Z}=O||{construct(e){return e.call(this)}},ee=new w,te=new y,ne=new p,oe=new p,re=new p,se=new p,le=[],ce=[],ae=e=>se.get(e)||X.call(J,e),ie=(e,t,n)=>{const o=re.get(n);if(t&&!o.isPrototypeOf(e)){const t=D(e);ge=C(e,o);try{new o.constructor}finally{ge=null,t()}}const r=(t?"":"dis")+"connectedCallback";r in o&&e[r]()},{parse:ue}=h({query:ce,handle:ie}),{parse:fe}=h({query:le,handle(e,t){ee.has(e)&&(t?te.add(e):te.delete(e),ce.length&&me.call(ce,e))}}),{attachShadow:he}=b.prototype;he&&(b.prototype.attachShadow=function(e){const t=he.call(this,e);return ee.set(this,t),t});const de=e=>{if(!oe.has(e)){let t,n=new Promise((e=>{t=e}));oe.set(e,{$:n,_:t})}return oe.get(e).$},pe=e(de,g);let ge=null;function me(e){const t=ee.get(e);ue(t.querySelectorAll(this),e.isConnected)}q(self).filter((e=>/^HTML.*Element$/.test(e))).forEach((e=>{const t=self[e];function n(){const{constructor:e}=this;if(!ne.has(e))throw new M("Illegal constructor");const{is:n,tag:o}=ne.get(e);if(n){if(ge)return pe(ge,n);const t=K.call(d,o);return t.setAttribute("is",n),pe(C(t,e.prototype),n)}return Z.call(this,t,[],e)}C(n,t),A(n.prototype=t.prototype,"constructor",{value:n}),A(self,e,{value:n})})),d.createElement=function(e,t){const n=t&&t.is;if(n){const t=se.get(n);if(t&&ne.get(t).tag===e)return new t}const o=K.call(d,e);return n&&o.setAttribute("is",n),o},J.get=ae,J.whenDefined=de,J.upgrade=function(e){const t=e.getAttribute("is");if(t){const n=se.get(t);if(n)return void pe(C(e,n.prototype),t)}Y.call(J,e)},J.define=function(e,t,n){if(ae(e))throw new v(`'${e}' has already been defined as a custom element`);let o;const r=n&&n.extends;ne.set(t,r?{is:e,tag:r}:{is:"",tag:e}),r?(o=`${r}[is="${e}"]`,re.set(o,t.prototype),se.set(e,t),ce.push(o)):(Q.apply(J,arguments),le.push(o=e)),de(e).then((()=>{r?(ue(d.querySelectorAll(o)),te.forEach(me,[o])):fe(d.querySelectorAll(o))})),oe.get(e)._(t)}}}(); 3 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | /*! (c) Andrea Giammarchi @webreflection ISC */ 2 | (function () { 3 | 'use strict'; 4 | 5 | var attributesObserver = (function (whenDefined, MutationObserver) { 6 | var attributeChanged = function attributeChanged(records) { 7 | for (var i = 0, length = records.length; i < length; i++) dispatch(records[i]); 8 | }; 9 | var dispatch = function dispatch(_ref) { 10 | var target = _ref.target, 11 | attributeName = _ref.attributeName, 12 | oldValue = _ref.oldValue; 13 | target.attributeChangedCallback(attributeName, oldValue, target.getAttribute(attributeName)); 14 | }; 15 | return function (target, is) { 16 | var attributeFilter = target.constructor.observedAttributes; 17 | if (attributeFilter) { 18 | whenDefined(is).then(function () { 19 | new MutationObserver(attributeChanged).observe(target, { 20 | attributes: true, 21 | attributeOldValue: true, 22 | attributeFilter: attributeFilter 23 | }); 24 | for (var i = 0, length = attributeFilter.length; i < length; i++) { 25 | if (target.hasAttribute(attributeFilter[i])) dispatch({ 26 | target: target, 27 | attributeName: attributeFilter[i], 28 | oldValue: null 29 | }); 30 | } 31 | }); 32 | } 33 | return target; 34 | }; 35 | }); 36 | 37 | function _unsupportedIterableToArray(o, minLen) { 38 | if (!o) return; 39 | if (typeof o === "string") return _arrayLikeToArray(o, minLen); 40 | var n = Object.prototype.toString.call(o).slice(8, -1); 41 | if (n === "Object" && o.constructor) n = o.constructor.name; 42 | if (n === "Map" || n === "Set") return Array.from(o); 43 | if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); 44 | } 45 | function _arrayLikeToArray(arr, len) { 46 | if (len == null || len > arr.length) len = arr.length; 47 | for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; 48 | return arr2; 49 | } 50 | function _createForOfIteratorHelper(o, allowArrayLike) { 51 | var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; 52 | if (!it) { 53 | if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { 54 | if (it) o = it; 55 | var i = 0; 56 | var F = function () {}; 57 | return { 58 | s: F, 59 | n: function () { 60 | if (i >= o.length) return { 61 | done: true 62 | }; 63 | return { 64 | done: false, 65 | value: o[i++] 66 | }; 67 | }, 68 | e: function (e) { 69 | throw e; 70 | }, 71 | f: F 72 | }; 73 | } 74 | throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); 75 | } 76 | var normalCompletion = true, 77 | didErr = false, 78 | err; 79 | return { 80 | s: function () { 81 | it = it.call(o); 82 | }, 83 | n: function () { 84 | var step = it.next(); 85 | normalCompletion = step.done; 86 | return step; 87 | }, 88 | e: function (e) { 89 | didErr = true; 90 | err = e; 91 | }, 92 | f: function () { 93 | try { 94 | if (!normalCompletion && it.return != null) it.return(); 95 | } finally { 96 | if (didErr) throw err; 97 | } 98 | } 99 | }; 100 | } 101 | 102 | /*! (c) Andrea Giammarchi - ISC */ 103 | var TRUE = true, 104 | FALSE = false, 105 | QSA$1 = 'querySelectorAll'; 106 | 107 | /** 108 | * Start observing a generic document or root element. 109 | * @param {(node:Element, connected:boolean) => void} callback triggered per each dis/connected element 110 | * @param {Document|Element} [root=document] by default, the global document to observe 111 | * @param {Function} [MO=MutationObserver] by default, the global MutationObserver 112 | * @param {string[]} [query=['*']] the selectors to use within nodes 113 | * @returns {MutationObserver} 114 | */ 115 | var notify = function notify(callback) { 116 | var root = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document; 117 | var MO = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : MutationObserver; 118 | var query = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : ['*']; 119 | var loop = function loop(nodes, selectors, added, removed, connected, pass) { 120 | var _iterator = _createForOfIteratorHelper(nodes), 121 | _step; 122 | try { 123 | for (_iterator.s(); !(_step = _iterator.n()).done;) { 124 | var node = _step.value; 125 | if (pass || QSA$1 in node) { 126 | if (connected) { 127 | if (!added.has(node)) { 128 | added.add(node); 129 | removed["delete"](node); 130 | callback(node, connected); 131 | } 132 | } else if (!removed.has(node)) { 133 | removed.add(node); 134 | added["delete"](node); 135 | callback(node, connected); 136 | } 137 | if (!pass) loop(node[QSA$1](selectors), selectors, added, removed, connected, TRUE); 138 | } 139 | } 140 | } catch (err) { 141 | _iterator.e(err); 142 | } finally { 143 | _iterator.f(); 144 | } 145 | }; 146 | var mo = new MO(function (records) { 147 | if (query.length) { 148 | var selectors = query.join(','); 149 | var added = new Set(), 150 | removed = new Set(); 151 | var _iterator2 = _createForOfIteratorHelper(records), 152 | _step2; 153 | try { 154 | for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { 155 | var _step2$value = _step2.value, 156 | addedNodes = _step2$value.addedNodes, 157 | removedNodes = _step2$value.removedNodes; 158 | loop(removedNodes, selectors, added, removed, FALSE, FALSE); 159 | loop(addedNodes, selectors, added, removed, TRUE, FALSE); 160 | } 161 | } catch (err) { 162 | _iterator2.e(err); 163 | } finally { 164 | _iterator2.f(); 165 | } 166 | } 167 | }); 168 | var observe = mo.observe; 169 | (mo.observe = function (node) { 170 | return observe.call(mo, node, { 171 | subtree: TRUE, 172 | childList: TRUE 173 | }); 174 | })(root); 175 | return mo; 176 | }; 177 | 178 | var QSA = 'querySelectorAll'; 179 | var _self$1 = self, 180 | document$2 = _self$1.document, 181 | Element$1 = _self$1.Element, 182 | MutationObserver$2 = _self$1.MutationObserver, 183 | Set$2 = _self$1.Set, 184 | WeakMap$1 = _self$1.WeakMap; 185 | var elements = function elements(element) { 186 | return QSA in element; 187 | }; 188 | var filter = [].filter; 189 | var qsaObserver = (function (options) { 190 | var live = new WeakMap$1(); 191 | var drop = function drop(elements) { 192 | for (var i = 0, length = elements.length; i < length; i++) live["delete"](elements[i]); 193 | }; 194 | var flush = function flush() { 195 | var records = observer.takeRecords(); 196 | for (var i = 0, length = records.length; i < length; i++) { 197 | parse(filter.call(records[i].removedNodes, elements), false); 198 | parse(filter.call(records[i].addedNodes, elements), true); 199 | } 200 | }; 201 | var matches = function matches(element) { 202 | return element.matches || element.webkitMatchesSelector || element.msMatchesSelector; 203 | }; 204 | var notifier = function notifier(element, connected) { 205 | var selectors; 206 | if (connected) { 207 | for (var q, m = matches(element), i = 0, length = query.length; i < length; i++) { 208 | if (m.call(element, q = query[i])) { 209 | if (!live.has(element)) live.set(element, new Set$2()); 210 | selectors = live.get(element); 211 | if (!selectors.has(q)) { 212 | selectors.add(q); 213 | options.handle(element, connected, q); 214 | } 215 | } 216 | } 217 | } else if (live.has(element)) { 218 | selectors = live.get(element); 219 | live["delete"](element); 220 | selectors.forEach(function (q) { 221 | options.handle(element, connected, q); 222 | }); 223 | } 224 | }; 225 | var parse = function parse(elements) { 226 | var connected = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; 227 | for (var i = 0, length = elements.length; i < length; i++) notifier(elements[i], connected); 228 | }; 229 | var query = options.query; 230 | var root = options.root || document$2; 231 | var observer = notify(notifier, root, MutationObserver$2, query); 232 | var attachShadow = Element$1.prototype.attachShadow; 233 | if (attachShadow) Element$1.prototype.attachShadow = function (init) { 234 | var shadowRoot = attachShadow.call(this, init); 235 | observer.observe(shadowRoot); 236 | return shadowRoot; 237 | }; 238 | if (query.length) parse(root[QSA](query)); 239 | return { 240 | drop: drop, 241 | flush: flush, 242 | observer: observer, 243 | parse: parse 244 | }; 245 | }); 246 | 247 | var _self = self, 248 | document$1 = _self.document, 249 | Map = _self.Map, 250 | MutationObserver$1 = _self.MutationObserver, 251 | Object$1 = _self.Object, 252 | Set$1 = _self.Set, 253 | WeakMap = _self.WeakMap, 254 | Element = _self.Element, 255 | HTMLElement = _self.HTMLElement, 256 | Node = _self.Node, 257 | Error = _self.Error, 258 | TypeError$1 = _self.TypeError, 259 | Reflect = _self.Reflect; 260 | var defineProperty = Object$1.defineProperty, 261 | keys = Object$1.keys, 262 | getOwnPropertyNames = Object$1.getOwnPropertyNames, 263 | setPrototypeOf = Object$1.setPrototypeOf; 264 | var legacy = !self.customElements; 265 | var expando = function expando(element) { 266 | var key = keys(element); 267 | var value = []; 268 | var ignore = new Set$1(); 269 | var length = key.length; 270 | for (var i = 0; i < length; i++) { 271 | value[i] = element[key[i]]; 272 | try { 273 | delete element[key[i]]; 274 | } catch (SafariTP) { 275 | ignore.add(i); 276 | } 277 | } 278 | return function () { 279 | for (var _i = 0; _i < length; _i++) ignore.has(_i) || (element[key[_i]] = value[_i]); 280 | }; 281 | }; 282 | if (legacy) { 283 | var HTMLBuiltIn = function HTMLBuiltIn() { 284 | var constructor = this.constructor; 285 | if (!classes.has(constructor)) throw new TypeError$1('Illegal constructor'); 286 | var is = classes.get(constructor); 287 | if (override) return augment(override, is); 288 | var element = createElement.call(document$1, is); 289 | return augment(setPrototypeOf(element, constructor.prototype), is); 290 | }; 291 | var createElement = document$1.createElement; 292 | var classes = new Map(); 293 | var defined = new Map(); 294 | var prototypes = new Map(); 295 | var registry = new Map(); 296 | var query = []; 297 | var handle = function handle(element, connected, selector) { 298 | var proto = prototypes.get(selector); 299 | if (connected && !proto.isPrototypeOf(element)) { 300 | var redefine = expando(element); 301 | override = setPrototypeOf(element, proto); 302 | try { 303 | new proto.constructor(); 304 | } finally { 305 | override = null; 306 | redefine(); 307 | } 308 | } 309 | var method = "".concat(connected ? '' : 'dis', "connectedCallback"); 310 | if (method in proto) element[method](); 311 | }; 312 | var _qsaObserver = qsaObserver({ 313 | query: query, 314 | handle: handle 315 | }), 316 | parse = _qsaObserver.parse; 317 | var override = null; 318 | var whenDefined = function whenDefined(name) { 319 | if (!defined.has(name)) { 320 | var _, 321 | $ = new Promise(function ($) { 322 | _ = $; 323 | }); 324 | defined.set(name, { 325 | $: $, 326 | _: _ 327 | }); 328 | } 329 | return defined.get(name).$; 330 | }; 331 | var augment = attributesObserver(whenDefined, MutationObserver$1); 332 | self.customElements = { 333 | define: function define(is, Class) { 334 | if (registry.has(is)) throw new Error("the name \"".concat(is, "\" has already been used with this registry")); 335 | classes.set(Class, is); 336 | prototypes.set(is, Class.prototype); 337 | registry.set(is, Class); 338 | query.push(is); 339 | whenDefined(is).then(function () { 340 | parse(document$1.querySelectorAll(is)); 341 | }); 342 | defined.get(is)._(Class); 343 | }, 344 | get: function get(is) { 345 | return registry.get(is); 346 | }, 347 | whenDefined: whenDefined 348 | }; 349 | defineProperty(HTMLBuiltIn.prototype = HTMLElement.prototype, 'constructor', { 350 | value: HTMLBuiltIn 351 | }); 352 | self.HTMLElement = HTMLBuiltIn; 353 | document$1.createElement = function (name, options) { 354 | var is = options && options.is; 355 | var Class = is ? registry.get(is) : registry.get(name); 356 | return Class ? new Class() : createElement.call(document$1, name); 357 | }; 358 | // in case ShadowDOM is used through a polyfill, to avoid issues 359 | // with builtin extends within shadow roots 360 | if (!('isConnected' in Node.prototype)) defineProperty(Node.prototype, 'isConnected', { 361 | configurable: true, 362 | get: function get() { 363 | return !(this.ownerDocument.compareDocumentPosition(this) & this.DOCUMENT_POSITION_DISCONNECTED); 364 | } 365 | }); 366 | } else { 367 | legacy = !self.customElements.get('extends-br'); 368 | if (legacy) { 369 | try { 370 | var BR = function BR() { 371 | return self.Reflect.construct(HTMLBRElement, [], BR); 372 | }; 373 | BR.prototype = HTMLLIElement.prototype; 374 | var is = 'extends-br'; 375 | self.customElements.define('extends-br', BR, { 376 | 'extends': 'br' 377 | }); 378 | legacy = document$1.createElement('br', { 379 | is: is 380 | }).outerHTML.indexOf(is) < 0; 381 | var _self$customElements = self.customElements, 382 | get = _self$customElements.get, 383 | _whenDefined = _self$customElements.whenDefined; 384 | self.customElements.whenDefined = function (is) { 385 | var _this = this; 386 | return _whenDefined.call(this, is).then(function (Class) { 387 | return Class || get.call(_this, is); 388 | }); 389 | }; 390 | } catch (o_O) {} 391 | } 392 | } 393 | if (legacy) { 394 | var _parseShadow = function _parseShadow(element) { 395 | var root = shadowRoots.get(element); 396 | _parse(root.querySelectorAll(this), element.isConnected); 397 | }; 398 | var customElements = self.customElements; 399 | var _createElement = document$1.createElement; 400 | var define = customElements.define, 401 | _get = customElements.get, 402 | upgrade = customElements.upgrade; 403 | var _ref = Reflect || { 404 | construct: function construct(HTMLElement) { 405 | return HTMLElement.call(this); 406 | } 407 | }, 408 | construct = _ref.construct; 409 | var shadowRoots = new WeakMap(); 410 | var shadows = new Set$1(); 411 | var _classes = new Map(); 412 | var _defined = new Map(); 413 | var _prototypes = new Map(); 414 | var _registry = new Map(); 415 | var shadowed = []; 416 | var _query = []; 417 | var getCE = function getCE(is) { 418 | return _registry.get(is) || _get.call(customElements, is); 419 | }; 420 | var _handle = function _handle(element, connected, selector) { 421 | var proto = _prototypes.get(selector); 422 | if (connected && !proto.isPrototypeOf(element)) { 423 | var redefine = expando(element); 424 | _override = setPrototypeOf(element, proto); 425 | try { 426 | new proto.constructor(); 427 | } finally { 428 | _override = null; 429 | redefine(); 430 | } 431 | } 432 | var method = "".concat(connected ? '' : 'dis', "connectedCallback"); 433 | if (method in proto) element[method](); 434 | }; 435 | var _qsaObserver2 = qsaObserver({ 436 | query: _query, 437 | handle: _handle 438 | }), 439 | _parse = _qsaObserver2.parse; 440 | var _qsaObserver3 = qsaObserver({ 441 | query: shadowed, 442 | handle: function handle(element, connected) { 443 | if (shadowRoots.has(element)) { 444 | if (connected) shadows.add(element);else shadows["delete"](element); 445 | if (_query.length) _parseShadow.call(_query, element); 446 | } 447 | } 448 | }), 449 | parseShadowed = _qsaObserver3.parse; 450 | // qsaObserver also patches attachShadow 451 | // be sure this runs *after* that 452 | var attachShadow = Element.prototype.attachShadow; 453 | if (attachShadow) Element.prototype.attachShadow = function (init) { 454 | var root = attachShadow.call(this, init); 455 | shadowRoots.set(this, root); 456 | return root; 457 | }; 458 | var _whenDefined2 = function _whenDefined2(name) { 459 | if (!_defined.has(name)) { 460 | var _, 461 | $ = new Promise(function ($) { 462 | _ = $; 463 | }); 464 | _defined.set(name, { 465 | $: $, 466 | _: _ 467 | }); 468 | } 469 | return _defined.get(name).$; 470 | }; 471 | var _augment = attributesObserver(_whenDefined2, MutationObserver$1); 472 | var _override = null; 473 | getOwnPropertyNames(self).filter(function (k) { 474 | return /^HTML.*Element$/.test(k); 475 | }).forEach(function (k) { 476 | var HTMLElement = self[k]; 477 | function HTMLBuiltIn() { 478 | var constructor = this.constructor; 479 | if (!_classes.has(constructor)) throw new TypeError$1('Illegal constructor'); 480 | var _classes$get = _classes.get(constructor), 481 | is = _classes$get.is, 482 | tag = _classes$get.tag; 483 | if (is) { 484 | if (_override) return _augment(_override, is); 485 | var element = _createElement.call(document$1, tag); 486 | element.setAttribute('is', is); 487 | return _augment(setPrototypeOf(element, constructor.prototype), is); 488 | } else return construct.call(this, HTMLElement, [], constructor); 489 | } 490 | 491 | defineProperty(HTMLBuiltIn.prototype = HTMLElement.prototype, 'constructor', { 492 | value: HTMLBuiltIn 493 | }); 494 | defineProperty(self, k, { 495 | value: HTMLBuiltIn 496 | }); 497 | }); 498 | document$1.createElement = function (name, options) { 499 | var is = options && options.is; 500 | if (is) { 501 | var Class = _registry.get(is); 502 | if (Class && _classes.get(Class).tag === name) return new Class(); 503 | } 504 | var element = _createElement.call(document$1, name); 505 | if (is) element.setAttribute('is', is); 506 | return element; 507 | }; 508 | customElements.get = getCE; 509 | customElements.whenDefined = _whenDefined2; 510 | customElements.upgrade = function (element) { 511 | var is = element.getAttribute('is'); 512 | if (is) { 513 | var _constructor = _registry.get(is); 514 | if (_constructor) { 515 | _augment(setPrototypeOf(element, _constructor.prototype), is); 516 | // apparently unnecessary because this is handled by qsa observer 517 | // if (element.isConnected && element.connectedCallback) 518 | // element.connectedCallback(); 519 | return; 520 | } 521 | } 522 | upgrade.call(customElements, element); 523 | }; 524 | customElements.define = function (is, Class, options) { 525 | if (getCE(is)) throw new Error("'".concat(is, "' has already been defined as a custom element")); 526 | var selector; 527 | var tag = options && options["extends"]; 528 | _classes.set(Class, tag ? { 529 | is: is, 530 | tag: tag 531 | } : { 532 | is: '', 533 | tag: is 534 | }); 535 | if (tag) { 536 | selector = "".concat(tag, "[is=\"").concat(is, "\"]"); 537 | _prototypes.set(selector, Class.prototype); 538 | _registry.set(is, Class); 539 | _query.push(selector); 540 | } else { 541 | define.apply(customElements, arguments); 542 | shadowed.push(selector = is); 543 | } 544 | _whenDefined2(is).then(function () { 545 | if (tag) { 546 | _parse(document$1.querySelectorAll(selector)); 547 | shadows.forEach(_parseShadow, [selector]); 548 | } else parseShadowed(document$1.querySelectorAll(selector)); 549 | }); 550 | _defined.get(is)._(Class); 551 | }; 552 | } 553 | 554 | })(); 555 | -------------------------------------------------------------------------------- /min.js: -------------------------------------------------------------------------------- 1 | /*! (c) Andrea Giammarchi @webreflection ISC */ 2 | !function(){"use strict";var e=function(e,t){var n=function(e){for(var t=0,n=e.length;te.length)&&(t=e.length);for(var n=0,r=new Array(t);n=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var l,i=!0,c=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return i=e.done,e},e:function(e){c=!0,l=e},f:function(){try{i||null==r.return||r.return()}finally{if(c)throw l}}}} 3 | /*! (c) Andrea Giammarchi - ISC */var r=!0,o=!1,a="querySelectorAll",l="querySelectorAll",i=self,c=i.document,u=i.Element,s=i.MutationObserver,f=i.Set,d=i.WeakMap,h=function(e){return l in e},v=[].filter,p=function(e){var t=new d,i=function(n,r){var o;if(r)for(var a,l=function(e){return e.matches||e.webkitMatchesSelector||e.msMatchesSelector}(n),i=0,c=y.length;i1&&void 0!==arguments[1])||arguments[1],n=0,r=e.length;n1&&void 0!==arguments[1]?arguments[1]:document,l=arguments.length>2&&void 0!==arguments[2]?arguments[2]:MutationObserver,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:["*"],c=function t(o,l,i,c,u,s){var f,d=n(o);try{for(d.s();!(f=d.n()).done;){var h=f.value;(s||a in h)&&(u?i.has(h)||(i.add(h),c.delete(h),e(h,u)):c.has(h)||(c.add(h),i.delete(h),e(h,u)),s||t(h[a](l),l,i,c,u,r))}}catch(e){d.e(e)}finally{d.f()}},u=new l((function(e){if(i.length){var t,a=i.join(","),l=new Set,u=new Set,s=n(e);try{for(s.s();!(t=s.n()).done;){var f=t.value,d=f.addedNodes,h=f.removedNodes;c(h,a,l,u,o,o),c(d,a,l,u,r,o)}}catch(e){s.e(e)}finally{s.f()}}})),s=u.observe;return(u.observe=function(e){return s.call(u,e,{subtree:r,childList:r})})(t),u}(i,g,s,y),w=u.prototype.attachShadow;return w&&(u.prototype.attachShadow=function(e){var t=w.call(this,e);return m.observe(t),t}),y.length&&p(g[l](y)),{drop:function(e){for(var n=0,r=e.length;n