From 21315860135736ee42e01db45ec20e87169b866c Mon Sep 17 00:00:00 2001 From: Patrick Arlt Date: Fri, 24 May 2019 12:33:41 -0700 Subject: [PATCH] v0.0.0-alpha.1 - add built files --- dist/calcite.js | 27 + dist/calcite/calcite.css | 1 + dist/calcite/calcite.esm.js | 1 + dist/calcite/calcite.js | 810 ++++++++ dist/calcite/p-1563a874.system.js | 1 + dist/calcite/p-229ebf7a.js | 1 + dist/calcite/p-258l18yq.system.entry.js | 1 + dist/calcite/p-549b16dd.js | 1 + dist/calcite/p-5b1e6c1f.system.js | 1 + dist/calcite/p-6baed856.js | 1 + dist/calcite/p-7889326c.system.js | 1 + dist/calcite/p-7eb7509a.js | 1 + dist/calcite/p-7fxfqsv7.entry.js | 1 + dist/calcite/p-df79bf9d.system.js | 1 + dist/calcite/p-f57d4852.system.js | 1 + dist/calcite/p-s1sy5kvf.system.entry.js | 1 + dist/calcite/p-xwf9iwah.entry.js | 1 + dist/cjs/calcite-15323450.js | 1657 ++++++++++++++++ dist/cjs/calcite-alert_8.cjs.entry.js | 400 ++++ dist/cjs/calcite.cjs.js | 7 + dist/cjs/context-consumer.cjs.entry.js | 29 + dist/cjs/css-shim-229ebf7a-56ba83b5.js | 630 ++++++ dist/cjs/dom-7eb7509a-4c879aea.js | 40 + dist/cjs/index.cjs.js | 3 + dist/cjs/loader.cjs.js | 13 + dist/cjs/shadow-css-984bac74-b2177096.js | 404 ++++ dist/collection/collection-manifest.json | 39 + .../calcite-alert/calcite-alert.css | 318 +++ .../components/calcite-alert/calcite-alert.js | 263 +++ .../calcite-alerts/calcite-alerts.css | 38 + .../calcite-alerts/calcite-alerts.js | 130 ++ .../calcite-loader/calcite-loader.css | 86 + .../calcite-loader/calcite-loader.js | 59 + .../calcite-modal/calcite-modal.css | 20 + .../components/calcite-modal/calcite-modal.js | 73 + .../calcite-tab-nav/calcite-tab-nav.css | 27 + .../calcite-tab-nav/calcite-tab-nav.js | 145 ++ .../calcite-tab-title/calcite-tab-title.css | 47 + .../calcite-tab-title/calcite-tab-title.js | 251 +++ .../components/calcite-tab/calcite-tab.css | 21 + .../components/calcite-tab/calcite-tab.js | 169 ++ .../components/calcite-tabs/calcite-tabs.css | 34 + .../components/calcite-tabs/calcite-tabs.js | 79 + dist/collection/interfaces/AlertInterface.js | 6 + dist/collection/interfaces/TabChange.js | 0 dist/collection/interfaces/TabRegister.js | 0 dist/collection/utils/guid.js | 14 + dist/collection/utils/keys.js | 8 + dist/collection/utils/utils.js | 3 + dist/esm/calcite-a092ddcb.js | 1648 ++++++++++++++++ dist/esm/calcite-alert_8.entry.js | 389 ++++ dist/esm/calcite.mjs | 5 + dist/esm/context-consumer.entry.js | 25 + dist/esm/css-shim-229ebf7a-229ebf7a.js | 628 ++++++ dist/esm/dom-7eb7509a-7eb7509a.js | 38 + dist/esm/index.mjs | 1 + dist/esm/legacy/calcite-a092ddcb.js | 1725 +++++++++++++++++ dist/esm/legacy/calcite-alert_8.entry.js | 515 +++++ dist/esm/legacy/calcite.mjs | 4 + dist/esm/legacy/context-consumer.entry.js | 28 + dist/esm/legacy/css-shim-229ebf7a-229ebf7a.js | 630 ++++++ dist/esm/legacy/dom-7eb7509a-7eb7509a.js | 254 +++ dist/esm/legacy/index.mjs | 1 + dist/esm/legacy/loader.mjs | 7 + .../legacy/shadow-css-984bac74-549b16dd.js | 431 ++++ dist/esm/loader.mjs | 9 + dist/esm/polyfills/array.js | 22 + dist/esm/polyfills/css-shim.js | 628 ++++++ dist/esm/polyfills/dom.js | 38 + dist/esm/polyfills/es5-html-element.js | 18 + dist/esm/polyfills/fetch.js | 20 + dist/esm/polyfills/index.js | 52 + dist/esm/polyfills/map.js | 7 + dist/esm/polyfills/object.js | 19 + dist/esm/polyfills/promise.js | 8 + dist/esm/polyfills/string.js | 12 + dist/esm/polyfills/system.js | 4 + dist/esm/polyfills/url.js | 6 + dist/esm/shadow-css-984bac74-549b16dd.js | 401 ++++ dist/index.js | 1 + dist/index.mjs | 1 + dist/loader/index.cjs.js | 4 + dist/loader/index.d.ts | 12 + dist/loader/index.es2017.mjs | 2 + dist/loader/index.mjs | 21 + dist/loader/package.json | 9 + dist/types/components.d.ts | 221 +++ .../calcite-alert/calcite-alert.d.ts | 19 + .../calcite-alerts/calcite-alerts.d.ts | 14 + .../calcite-loader/calcite-loader.d.ts | 6 + .../calcite-modal/calcite-modal.d.ts | 16 + .../calcite-tab-nav/calcite-tab-nav.d.ts | 17 + .../calcite-tab-title/calcite-tab-title.d.ts | 20 + .../components/calcite-tab/calcite-tab.d.ts | 16 + .../components/calcite-tabs/calcite-tabs.d.ts | 22 + dist/types/interfaces/AlertInterface.d.ts | 12 + dist/types/interfaces/TabChange.d.ts | 3 + dist/types/interfaces/TabRegister.d.ts | 4 + dist/types/stencil.core.d.ts | 1342 +++++++++++++ dist/types/utils/guid.d.ts | 1 + dist/types/utils/keys.d.ts | 8 + dist/types/utils/utils.d.ts | 1 + 102 files changed, 15210 insertions(+) create mode 100644 dist/calcite.js create mode 100644 dist/calcite/calcite.css create mode 100644 dist/calcite/calcite.esm.js create mode 100644 dist/calcite/calcite.js create mode 100644 dist/calcite/p-1563a874.system.js create mode 100644 dist/calcite/p-229ebf7a.js create mode 100644 dist/calcite/p-258l18yq.system.entry.js create mode 100644 dist/calcite/p-549b16dd.js create mode 100644 dist/calcite/p-5b1e6c1f.system.js create mode 100644 dist/calcite/p-6baed856.js create mode 100644 dist/calcite/p-7889326c.system.js create mode 100644 dist/calcite/p-7eb7509a.js create mode 100644 dist/calcite/p-7fxfqsv7.entry.js create mode 100644 dist/calcite/p-df79bf9d.system.js create mode 100644 dist/calcite/p-f57d4852.system.js create mode 100644 dist/calcite/p-s1sy5kvf.system.entry.js create mode 100644 dist/calcite/p-xwf9iwah.entry.js create mode 100644 dist/cjs/calcite-15323450.js create mode 100644 dist/cjs/calcite-alert_8.cjs.entry.js create mode 100644 dist/cjs/calcite.cjs.js create mode 100644 dist/cjs/context-consumer.cjs.entry.js create mode 100644 dist/cjs/css-shim-229ebf7a-56ba83b5.js create mode 100644 dist/cjs/dom-7eb7509a-4c879aea.js create mode 100644 dist/cjs/index.cjs.js create mode 100644 dist/cjs/loader.cjs.js create mode 100644 dist/cjs/shadow-css-984bac74-b2177096.js create mode 100644 dist/collection/collection-manifest.json create mode 100644 dist/collection/components/calcite-alert/calcite-alert.css create mode 100644 dist/collection/components/calcite-alert/calcite-alert.js create mode 100644 dist/collection/components/calcite-alerts/calcite-alerts.css create mode 100644 dist/collection/components/calcite-alerts/calcite-alerts.js create mode 100644 dist/collection/components/calcite-loader/calcite-loader.css create mode 100644 dist/collection/components/calcite-loader/calcite-loader.js create mode 100644 dist/collection/components/calcite-modal/calcite-modal.css create mode 100644 dist/collection/components/calcite-modal/calcite-modal.js create mode 100644 dist/collection/components/calcite-tab-nav/calcite-tab-nav.css create mode 100644 dist/collection/components/calcite-tab-nav/calcite-tab-nav.js create mode 100644 dist/collection/components/calcite-tab-title/calcite-tab-title.css create mode 100644 dist/collection/components/calcite-tab-title/calcite-tab-title.js create mode 100644 dist/collection/components/calcite-tab/calcite-tab.css create mode 100644 dist/collection/components/calcite-tab/calcite-tab.js create mode 100644 dist/collection/components/calcite-tabs/calcite-tabs.css create mode 100644 dist/collection/components/calcite-tabs/calcite-tabs.js create mode 100644 dist/collection/interfaces/AlertInterface.js create mode 100644 dist/collection/interfaces/TabChange.js create mode 100644 dist/collection/interfaces/TabRegister.js create mode 100644 dist/collection/utils/guid.js create mode 100644 dist/collection/utils/keys.js create mode 100644 dist/collection/utils/utils.js create mode 100644 dist/esm/calcite-a092ddcb.js create mode 100644 dist/esm/calcite-alert_8.entry.js create mode 100644 dist/esm/calcite.mjs create mode 100644 dist/esm/context-consumer.entry.js create mode 100644 dist/esm/css-shim-229ebf7a-229ebf7a.js create mode 100644 dist/esm/dom-7eb7509a-7eb7509a.js create mode 100644 dist/esm/index.mjs create mode 100644 dist/esm/legacy/calcite-a092ddcb.js create mode 100644 dist/esm/legacy/calcite-alert_8.entry.js create mode 100644 dist/esm/legacy/calcite.mjs create mode 100644 dist/esm/legacy/context-consumer.entry.js create mode 100644 dist/esm/legacy/css-shim-229ebf7a-229ebf7a.js create mode 100644 dist/esm/legacy/dom-7eb7509a-7eb7509a.js create mode 100644 dist/esm/legacy/index.mjs create mode 100644 dist/esm/legacy/loader.mjs create mode 100644 dist/esm/legacy/shadow-css-984bac74-549b16dd.js create mode 100644 dist/esm/loader.mjs create mode 100644 dist/esm/polyfills/array.js create mode 100644 dist/esm/polyfills/css-shim.js create mode 100644 dist/esm/polyfills/dom.js create mode 100644 dist/esm/polyfills/es5-html-element.js create mode 100644 dist/esm/polyfills/fetch.js create mode 100644 dist/esm/polyfills/index.js create mode 100644 dist/esm/polyfills/map.js create mode 100644 dist/esm/polyfills/object.js create mode 100644 dist/esm/polyfills/promise.js create mode 100644 dist/esm/polyfills/string.js create mode 100644 dist/esm/polyfills/system.js create mode 100644 dist/esm/polyfills/url.js create mode 100644 dist/esm/shadow-css-984bac74-549b16dd.js create mode 100644 dist/index.js create mode 100644 dist/index.mjs create mode 100644 dist/loader/index.cjs.js create mode 100644 dist/loader/index.d.ts create mode 100644 dist/loader/index.es2017.mjs create mode 100644 dist/loader/index.mjs create mode 100644 dist/loader/package.json create mode 100644 dist/types/components.d.ts create mode 100644 dist/types/components/calcite-alert/calcite-alert.d.ts create mode 100644 dist/types/components/calcite-alerts/calcite-alerts.d.ts create mode 100644 dist/types/components/calcite-loader/calcite-loader.d.ts create mode 100644 dist/types/components/calcite-modal/calcite-modal.d.ts create mode 100644 dist/types/components/calcite-tab-nav/calcite-tab-nav.d.ts create mode 100644 dist/types/components/calcite-tab-title/calcite-tab-title.d.ts create mode 100644 dist/types/components/calcite-tab/calcite-tab.d.ts create mode 100644 dist/types/components/calcite-tabs/calcite-tabs.d.ts create mode 100644 dist/types/interfaces/AlertInterface.d.ts create mode 100644 dist/types/interfaces/TabChange.d.ts create mode 100644 dist/types/interfaces/TabRegister.d.ts create mode 100644 dist/types/stencil.core.d.ts create mode 100644 dist/types/utils/guid.d.ts create mode 100644 dist/types/utils/keys.d.ts create mode 100644 dist/types/utils/utils.d.ts diff --git a/dist/calcite.js b/dist/calcite.js new file mode 100644 index 00000000000..3cd8645ffc0 --- /dev/null +++ b/dist/calcite.js @@ -0,0 +1,27 @@ + +(function(doc){ + var scriptElm = doc.scripts[doc.scripts.length - 1]; + var warn = ['[calcite] Deprecated script, please remove: ' + scriptElm.outerHTML]; + + warn.push('To improve performance it is recommended to set the differential scripts in the head as follows:') + + var parts = scriptElm.src.split('/'); + parts.pop(); + parts.push('calcite'); + var url = parts.join('/'); + + var scriptElm = doc.createElement('script'); + scriptElm.setAttribute('type', 'module'); + scriptElm.src = url + '/calcite.esm.js'; + doc.head.appendChild(scriptElm); + warn.push(scriptElm.outerHTML); + + scriptElm = doc.createElement('script'); + scriptElm.setAttribute('nomodule', ''); + scriptElm.src = url + '/calcite.js'; + doc.head.appendChild(scriptElm); + warn.push(scriptElm.outerHTML); + + console.warn(warn.join('\n')); + +})(document); \ No newline at end of file diff --git a/dist/calcite/calcite.css b/dist/calcite/calcite.css new file mode 100644 index 00000000000..28746d71126 --- /dev/null +++ b/dist/calcite/calcite.css @@ -0,0 +1 @@ +@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}} \ No newline at end of file diff --git a/dist/calcite/calcite.esm.js b/dist/calcite/calcite.esm.js new file mode 100644 index 00000000000..73d996756fb --- /dev/null +++ b/dist/calcite/calcite.esm.js @@ -0,0 +1 @@ +import{a as e,b as t}from"./p-6baed856.js";e().then(e=>t([["p-xwf9iwah",[[1,"calcite-alert",{currentAlert:[1,"current-alert"],dismiss:[4],icon:[4],id:[1],queueLength:[2,"queue-length"],color:[513],theme:[513],duration:[513],isActive:[32],close:[64]}],[1,"calcite-alerts",{id:[1],currentAlert:[32],isActive:[32],queue:[32],open:[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{isActive:[4,"is-active"],text:[1]}],[1,"calcite-modal",{first:[1],middle:[1],last:[1]}],[1,"calcite-tab",{id:[1537],tab:[1537],isActive:[1540,"is-active"],labeledBy:[32],getTabIndex:[64],registerLabeledBy:[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{id:[1537],selectedTab:[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{id:[1537],tab:[1537],isActive:[1540,"is-active"],controls:[32],getTabIndex:[64],setControledBy:[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{theme:[513],tabs:[32],tabTitles:[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["p-7fxfqsv7",[[0,"context-consumer",{context:[16],renderer:[16],subscribe:[16],unsubscribe:[32]}]]]],{resourcesUrl:e})); \ No newline at end of file diff --git a/dist/calcite/calcite.js b/dist/calcite/calcite.js new file mode 100644 index 00000000000..1d82465bd2e --- /dev/null +++ b/dist/calcite/calcite.js @@ -0,0 +1,810 @@ + +/*! +Array.prototype.fill +*/ +Array.prototype.fill||Object.defineProperty(Array.prototype,"fill",{value:function(t){var r,e,i,n,o,a,l;if(null==this)throw new TypeError("this is null or not defined");for(e=(r=Object(this)).length>>>0,n=(i=arguments[1]>>0)<0?Math.max(e+i,0):Math.min(i,e),l=(a=void 0===(o=arguments[2])?e:o>>0)<0?Math.max(e+a,0):Math.min(a,e);n>>0;if("function"!==typeof c)throw new TypeError("predicate must be a function");for(var a=0;a>>0;if("function"!==typeof c)throw new TypeError("predicate must be a function");for(var a=0;a>>0;if(0===n)return!1;var i,o,a=0|e,u=Math.max(0<=a?a:n-Math.abs(a),0);for(;uthis.length)a=this.length;return this.substring(a-b.length,a)===b}}); +/*! +String.prototype.includes +*/ +String.prototype.includes||(String.prototype.includes=function(b,a){"number"!==typeof a&&(a=0);return a+b.length>this.length?!1:-1!==this.indexOf(b,a)}); +/*! +String.prototype.startsWith +*/ +String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{writable:!0,configurable:!0,value:function(b,a){return this.substr(!a||0>a?0:+a,b.length)===b}}); +/* + Copyright (c) 2016 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +(function(){"use strict";var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);return e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e),!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return!(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var l=a.localName;if("link"===l&&"import"===a.getAttribute("rel")){if((r=a.import)instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}if("template"===l){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n)}r=r.firstChild?r.firstChild:o(t,r)}}function r(t,e,n){t[e]=n}function a(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1}function l(t,e){t.b=!0,t.c.push(e)}function c(t,e){t.b&&i(e,function(e){return s(t,e)})}function s(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;nthis.status;this.statusText="statusText"in b?b.statusText:"OK";this.headers=new d(b.headers);this.url=b.url||"";this._initBody(a)}if(!e.fetch){var D="Symbol"in e&&"iterator"in Symbol,m;if(m="FileReader"in e&&"Blob"in e)try{new Blob,m=!0}catch(a){m=!1}var g={searchParams:"URLSearchParams"in e,iterable:D, +blob:m,formData:"FormData"in e,arrayBuffer:"ArrayBuffer"in e};if(g.arrayBuffer){var E="[object Int8Array];[object Uint8Array];[object Uint8ClampedArray];[object Int16Array];[object Uint16Array];[object Int32Array];[object Uint32Array];[object Float32Array];[object Float64Array]".split(";");var y=function(a){return a&&DataView.prototype.isPrototypeOf(a)};var z=ArrayBuffer.isView||function(a){return a&&-1t[0]){return+1}else{return 0}});if(r._entries){r._entries={}}for(var e=0;e1?o(i[1]):"")}}})}})(typeof global!=="undefined"?global:typeof window!=="undefined"?window:typeof self!=="undefined"?self:this);(function(h){var e=function(){try{var e=new h.URL("b","http://a");e.pathname="c%20d";return e.href==="http://a/c%20d"&&e.searchParams}catch(e){return false}};var t=function(){var t=h.URL;var e=function(e,t){if(typeof e!=="string")e=String(e);var r=document,n;if(t&&(h.location===void 0||t!==h.location.href)){r=document.implementation.createHTMLDocument("");n=r.createElement("base");n.href=t;r.head.appendChild(n);try{if(n.href.indexOf(t)!==0)throw new Error(n.href)}catch(e){throw new Error("URL unable to set base "+t+" due to "+e)}}var i=r.createElement("a");i.href=e;if(n){r.body.appendChild(i);i.href=i.href}if(i.protocol===":"||!/:/.test(i.href)){throw new TypeError("Invalid URL")}Object.defineProperty(this,"_anchorElement",{value:i});var o=new h.URLSearchParams(this.search);var a=true;var s=true;var c=this;["append","delete","set"].forEach(function(e){var t=o[e];o[e]=function(){t.apply(o,arguments);if(a){s=false;c.search=o.toString();s=true}}});Object.defineProperty(this,"searchParams",{value:o,enumerable:true});var f=void 0;Object.defineProperty(this,"_updateSearchParams",{enumerable:false,configurable:false,writable:false,value:function(){if(this.search!==f){f=this.search;if(s){a=false;this.searchParams._fromString(this.search);a=true}}}})};var r=e.prototype;var n=function(t){Object.defineProperty(r,t,{get:function(){return this._anchorElement[t]},set:function(e){this._anchorElement[t]=e},enumerable:true})};["hash","host","hostname","port","protocol"].forEach(function(e){n(e)});Object.defineProperty(r,"search",{get:function(){return this._anchorElement["search"]},set:function(e){this._anchorElement["search"]=e;this._updateSearchParams()},enumerable:true});Object.defineProperties(r,{toString:{get:function(){var e=this;return function(){return e.href}}},href:{get:function(){return this._anchorElement.href.replace(/\?$/,"")},set:function(e){this._anchorElement.href=e;this._updateSearchParams()},enumerable:true},pathname:{get:function(){return this._anchorElement.pathname.replace(/(^\/?)/,"/")},set:function(e){this._anchorElement.pathname=e},enumerable:true},origin:{get:function(){var e={"http:":80,"https:":443,"ftp:":21}[this._anchorElement.protocol];var t=this._anchorElement.port!=e&&this._anchorElement.port!=="";return this._anchorElement.protocol+"//"+this._anchorElement.hostname+(t?":"+this._anchorElement.port:"")},enumerable:true},password:{get:function(){return""},set:function(e){},enumerable:true},username:{get:function(){return""},set:function(e){},enumerable:true}});e.createObjectURL=function(e){return t.createObjectURL.apply(t,arguments)};e.revokeObjectURL=function(e){return t.revokeObjectURL.apply(t,arguments)};h.URL=e};if(!e()){t()}if(h.location!==void 0&&!("origin"in h.location)){var r=function(){return h.location.protocol+"//"+h.location.hostname+(h.location.port?":"+h.location.port:"")};try{Object.defineProperty(h.location,"origin",{get:r,enumerable:true})}catch(e){setInterval(function(){h.location.origin=r()},100)}}})(typeof global!=="undefined"?global:typeof window!=="undefined"?window:typeof self!=="undefined"?self:this); + +/* +* SystemJS 3.1.3 +*/ +!function(){const e="undefined"!=typeof self,n=e?self:global;let t;if("undefined"!=typeof location){const e=(t=location.href.split("#")[0].split("?")[0]).lastIndexOf("/");-1!==e&&(t=t.slice(0,e+1))}const r=/\\/g,i="undefined"!=typeof Symbol,o=i&&Symbol.toStringTag,c=i?Symbol():"@";function l(){this[c]={}}const s=l.prototype;let u;s.import=function(e,n){const t=this;return Promise.resolve(t.resolve(e,n)).then(function(e){const n=function e(n,t,r){let i=n[c][t];if(i)return i;const l=[],s=Object.create(null);o&&Object.defineProperty(s,o,{value:"Module"});let u=Promise.resolve().then(function(){return n.instantiate(t,r)}).then(function(e){if(!e)throw new Error("Module "+t+" did not instantiate");const r=e[1](function(e,n){i.h=!0;let t=!1;if("object"!=typeof e)e in s&&s[e]===n||(s[e]=n,t=!0);else for(let n in e){let r=e[n];n in s&&s[n]===r||(s[n]=r,t=!0)}if(t)for(let e=0;e 0 ? fallback.join(',').trim() : undefined + }; +} +function compileVar(cssText, template, offset) { + var varMeta = parseVar(cssText, offset); + if (!varMeta) { + template.push(cssText.substring(offset, cssText.length)); + return cssText.length; + } + var propName = varMeta.propName; + var fallback = varMeta.fallback != null ? compileTemplate(varMeta.fallback) : undefined; + template.push(cssText.substring(offset, varMeta.start), function (params) { return resolveVar(params, propName, fallback); }); + return varMeta.end; +} +function executeTemplate(template, props) { + var final = ''; + for (var i = 0; i < template.length; i++) { + var s = template[i]; + final += (typeof s === 'string') + ? s + : s(props); + } + return final; +} +function findEndValue(cssText, offset) { + var onStr = false; + var double = false; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (onStr) { + if (double && c === '"') { + onStr = false; + } + if (!double && c === '\'') { + onStr = false; + } + } + else { + if (c === '"') { + onStr = true; + double = true; + } + else if (c === '\'') { + onStr = true; + double = false; + } + else if (c === ';') { + return i + 1; + } + else if (c === '}') { + return i; + } + } + } + return i; +} +function removeCustomAssigns(cssText) { + var final = ''; + var offset = 0; + while (true) { + var assignPos = findRegex(VAR_ASSIGN_START, cssText, offset); + var start = assignPos ? assignPos.start : cssText.length; + final += cssText.substring(offset, start); + if (assignPos) { + offset = findEndValue(cssText, start); + } + else { + break; + } + } + return final; +} +function compileTemplate(cssText) { + var index = 0; + cssText = cssText.replace(COMMENTS, ''); + cssText = removeCustomAssigns(cssText) + .replace(TRAILING_LINES, ''); + var segments = []; + while (index < cssText.length) { + index = compileVar(cssText, segments, index); + } + return segments; +} +function resolveValues(selectors) { + var props = {}; + selectors.forEach(function (selector) { + selector.declarations.forEach(function (dec) { + props[dec.prop] = dec.value; + }); + }); + var propsValues = {}; + var entries = Object.entries(props); + var _loop_1 = function (i) { + var dirty = false; + entries.forEach(function (_a) { + var key = _a[0], value = _a[1]; + var propValue = executeTemplate(value, propsValues); + if (propValue !== propsValues[key]) { + propsValues[key] = propValue; + dirty = true; + } + }); + if (!dirty) { + return "break"; + } + }; + for (var i = 0; i < 10; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + return propsValues; +} +function getSelectors(root, index) { + if (index === void 0) { index = 0; } + if (!root.rules) { + return []; + } + var selectors = []; + root.rules + .filter(function (rule) { return rule.type === types.STYLE_RULE; }) + .forEach(function (rule) { + var declarations = getDeclarations(rule.cssText); + if (declarations.length > 0) { + rule.parsedSelector.split(',').forEach(function (selector) { + selector = selector.trim(); + selectors.push({ + selector: selector, + declarations: declarations, + specificity: computeSpecificity(selector), + nu: index + }); + }); + } + index++; + }); + return selectors; +} +function computeSpecificity(_selector) { + return 1; +} +var IMPORTANT = '!important'; +var FIND_DECLARATIONS = /(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm; +function getDeclarations(cssText) { + var declarations = []; + var xArray; + while (xArray = FIND_DECLARATIONS.exec(cssText.trim())) { + var _a = normalizeValue(xArray[2]), value = _a.value, important = _a.important; + declarations.push({ + prop: xArray[1].trim(), + value: compileTemplate(value), + important: important, + }); + } + return declarations; +} +function normalizeValue(value) { + var regex = /\s+/gim; + value = value.replace(regex, ' ').trim(); + var important = value.endsWith(IMPORTANT); + if (important) { + value = value.substr(0, value.length - IMPORTANT.length).trim(); + } + return { + value: value, + important: important + }; +} +function getActiveSelectors(hostEl, hostScopeMap, globalScopes) { + // computes the css scopes that might affect this particular element + var scopes = globalScopes.concat(getScopesForElement(hostScopeMap, hostEl)); + // each scope might have an array of associated selectors + // let's flatten the complete array of selectors from all the scopes + var selectorSet = getSelectorsForScopes(scopes); + // we filter to only the selectors that matches the hostEl + var activeSelectors = selectorSet.filter(function (selector) { return matches(hostEl, selector.selector); }); + // sort selectors by specifity + return sortSelectors(activeSelectors); +} +function getScopesForElement(hostTemplateMap, node) { + var scopes = []; + while (node) { + var scope = hostTemplateMap.get(node); + if (scope) { + scopes.push(scope); + } + node = node.parentElement; + } + return scopes; +} +function getSelectorsForScopes(scopes) { + var selectors = []; + scopes.forEach(function (scope) { + selectors.push.apply(selectors, scope.selectors); + }); + return selectors; +} +function sortSelectors(selectors) { + selectors.sort(function (a, b) { + if (a.specificity === b.specificity) { + return a.nu - b.nu; + } + return a.specificity - b.specificity; + }); + return selectors; +} +function matches(el, selector) { + return el.matches(selector); +} +function parseCSS(original) { + var ast = parse(original); + var template = compileTemplate(original); + var selectors = getSelectors(ast); + return { + original: original, + template: template, + selectors: selectors, + isDynamic: template.length > 1 + }; +} +function addGlobalStyle(globalScopes, styleEl) { + var css = parseCSS(styleEl.innerHTML); + css.styleEl = styleEl; + globalScopes.push(css); +} +function updateGlobalScopes(scopes) { + var selectors = getSelectorsForScopes(scopes); + var props = resolveValues(selectors); + scopes.forEach(function (scope) { + if (scope.isDynamic) { + scope.styleEl.innerHTML = executeTemplate(scope.template, props); + } + }); +} +function reScope(scope, cssScopeId) { + var template = scope.template.map(function (segment) { + return (typeof segment === 'string') + ? replaceScope(segment, scope.cssScopeId, cssScopeId) + : segment; + }); + var selectors = scope.selectors.map(function (sel) { + return Object.assign({}, sel, { selector: replaceScope(sel.selector, scope.cssScopeId, cssScopeId) }); + }); + return Object.assign({}, scope, { template: template, + selectors: selectors, + cssScopeId: cssScopeId }); +} +function replaceScope(original, oldScopeId, newScopeId) { + original = replaceAll(original, "\\." + oldScopeId, "." + newScopeId); + return original; +} +function replaceAll(input, find, replace) { + return input.replace(new RegExp(find, 'g'), replace); +} +function loadDocument(doc, globalScopes) { + return loadDocumentLinks(doc, globalScopes).then(function () { + loadDocumentStyles(doc, globalScopes); + }); +} +function loadDocumentLinks(doc, globalScopes) { + var promises = []; + var linkElms = doc.querySelectorAll('link[rel="stylesheet"][href]'); + for (var i = 0; i < linkElms.length; i++) { + promises.push(addGlobalLink(doc, globalScopes, linkElms[i])); + } + return Promise.all(promises); +} +function loadDocumentStyles(doc, globalScopes) { + var styleElms = doc.querySelectorAll('style'); + for (var i = 0; i < styleElms.length; i++) { + addGlobalStyle(globalScopes, styleElms[i]); + } +} +function addGlobalLink(doc, globalScopes, linkElm) { + var url = linkElm.href; + return fetch(url).then(function (rsp) { return rsp.text(); }).then(function (text) { + if (hasCssVariables(text) && linkElm.parentNode) { + if (hasRelativeUrls(text)) { + text = fixRelativeUrls(text, url); + } + var styleEl = doc.createElement('style'); + styleEl.innerHTML = text; + addGlobalStyle(globalScopes, styleEl); + linkElm.parentNode.insertBefore(styleEl, linkElm); + linkElm.remove(); + } + }).catch(function (err) { + console.error(err); + }); +} +// This regexp tries to determine when a variable is declared, for example: +// +// .my-el { --highlight-color: green; } +// +// but we don't want to trigger when a classname uses "--" or a pseudo-class is +// used. We assume that the only characters that can preceed a variable +// declaration are "{", from an opening block, ";" from a preceeding rule, or a +// space. This prevents the regexp from matching a word in a selector, since +// they would need to start with a "." or "#". (We assume element names don't +// start with "--"). +var CSS_VARIABLE_REGEXP = /[\s;{]--[-a-zA-Z0-9]+\s*:/m; +function hasCssVariables(css) { + return css.indexOf('var(') > -1 || CSS_VARIABLE_REGEXP.test(css); +} +// This regexp find all url() usages with relative urls +var CSS_URL_REGEXP = /url[\s]*\([\s]*['"]?(?![http|/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim; +function hasRelativeUrls(css) { + CSS_URL_REGEXP.lastIndex = 0; + return CSS_URL_REGEXP.test(css); +} +function fixRelativeUrls(css, originalUrl) { + // get the basepath from the original import url + var basePath = originalUrl.replace(/[^/]*$/, ''); + // replace the relative url, with the new relative url + return css.replace(CSS_URL_REGEXP, function (fullMatch, url) { + // rhe new relative path is the base path + uri + // TODO: normalize relative URL + var relativeUrl = basePath + url; + return fullMatch.replace(url, relativeUrl); + }); +} +var CustomStyle = /** @class */ (function () { + function CustomStyle(win, doc) { + this.win = win; + this.doc = doc; + this.count = 0; + this.hostStyleMap = new WeakMap(); + this.hostScopeMap = new WeakMap(); + this.globalScopes = []; + this.scopesMap = new Map(); + } + CustomStyle.prototype.initShim = function () { + var _this = this; + return new Promise(function (resolve) { + _this.win.requestAnimationFrame(function () { + loadDocument(_this.doc, _this.globalScopes).then(function () { return resolve(); }); + }); + }); + }; + CustomStyle.prototype.addLink = function (linkEl) { + var _this = this; + return addGlobalLink(this.doc, this.globalScopes, linkEl).then(function () { + _this.updateGlobal(); + }); + }; + CustomStyle.prototype.addGlobalStyle = function (styleEl) { + addGlobalStyle(this.globalScopes, styleEl); + this.updateGlobal(); + }; + CustomStyle.prototype.createHostStyle = function (hostEl, cssScopeId, cssText) { + if (this.hostScopeMap.has(hostEl)) { + throw new Error('host style already created'); + } + var baseScope = this.registerHostTemplate(cssText, cssScopeId); + var isDynamicScoped = !!(baseScope.isDynamic && baseScope.cssScopeId); + var needStyleEl = isDynamicScoped || !baseScope.styleEl; + var styleEl = this.doc.createElement('style'); + if (!needStyleEl) { + styleEl.innerHTML = cssText; + } + else { + if (isDynamicScoped) { + styleEl['s-sc'] = cssScopeId = baseScope.cssScopeId + "-" + this.count; + styleEl.innerHTML = '/*needs update*/'; + this.hostStyleMap.set(hostEl, styleEl); + this.hostScopeMap.set(hostEl, reScope(baseScope, cssScopeId)); + this.count++; + } + else { + baseScope.styleEl = styleEl; + if (!baseScope.isDynamic) { + styleEl.innerHTML = executeTemplate(baseScope.template, {}); + } + this.globalScopes.push(baseScope); + this.updateGlobal(); + this.hostScopeMap.set(hostEl, baseScope); + } + } + return styleEl; + }; + CustomStyle.prototype.removeHost = function (hostEl) { + var css = this.hostStyleMap.get(hostEl); + if (css) { + css.remove(); + } + this.hostStyleMap.delete(hostEl); + this.hostScopeMap.delete(hostEl); + }; + CustomStyle.prototype.updateHost = function (hostEl) { + var scope = this.hostScopeMap.get(hostEl); + if (scope && scope.isDynamic && scope.cssScopeId) { + var styleEl = this.hostStyleMap.get(hostEl); + if (styleEl) { + var selectors = getActiveSelectors(hostEl, this.hostScopeMap, this.globalScopes); + var props = resolveValues(selectors); + styleEl.innerHTML = executeTemplate(scope.template, props); + } + } + }; + CustomStyle.prototype.updateGlobal = function () { + updateGlobalScopes(this.globalScopes); + }; + CustomStyle.prototype.registerHostTemplate = function (cssText, scopeId) { + var scope = this.scopesMap.get(scopeId); + if (!scope) { + scope = parseCSS(cssText); + scope.cssScopeId = scopeId; + this.scopesMap.set(scopeId, scope); + } + return scope; + }; + return CustomStyle; +}()); +var win = window; +function needsShim() { + return !(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)')); +} +if (!win.__stencil_cssshim && needsShim()) { + win.__stencil_cssshim = new CustomStyle(win, document); +} + +var doc = document; +var allScripts = doc.querySelectorAll('script'); +var scriptElm; +for (var x = allScripts.length - 1; x >= 0; x--) { + scriptElm = allScripts[x]; + if (scriptElm.src || scriptElm.hasAttribute('data-resources-url')) { + break; + } +} +var resourcesUrl = scriptElm ? scriptElm.getAttribute('data-resources-url') || scriptElm.src : ''; +var start = function() { + var url = new URL('./p-df79bf9d.system.js', resourcesUrl); + System.import(url.href); +}; + +if (win.__stencil_cssshim) { + win.__stencil_cssshim.initShim().then(start); +} else { + start(); +} diff --git a/dist/calcite/p-1563a874.system.js b/dist/calcite/p-1563a874.system.js new file mode 100644 index 00000000000..55abebc06c2 --- /dev/null +++ b/dist/calcite/p-1563a874.system.js @@ -0,0 +1 @@ +System.register([],function(t){"use strict";return{execute:function(){t("scopeCss",function(t,r,o){return(new e).shimCssText(t,r,r+"-h",r+"-s",o)});var e=function(){function t(){this.strictStyling=!0}return t.prototype.shimCssText=function(t,e,r,o,n){void 0===r&&(r=""),void 0===o&&(o=""),void 0===n&&(n=!1);var s=t.match(m)||[];t=t.replace(S,"");var c=[];if(n){var i=function(t){var e="/*!@___"+c.length+"___*/";return c.push({placeholder:e,comment:"/*!@"+t.selector+"*/"}),t.selector=e+t.selector,t};t=O(t,function(t){return"@"!==t.selector[0]?i(t):t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document")?(t.content=O(t.content,i),t):t})}var p=this._scopeCssText(t,e,r,o,n);return t=[p].concat(s).join("\n"),n&&c.forEach(function(e){t=t.replace(e.placeholder,e.comment)}),t},t.prototype._scopeCssText=function(t,e,r,o,n){return t=this._insertPolyfillHostInCssText(t),t=this._convertColonHost(t),t=this._convertColonHostContext(t),t=this._convertColonSlotted(t,o),t=this._convertShadowDOMSelectors(t),e&&(t=this._scopeSelectors(t,e,r,o,n)),(t=(t=t.replace(/-shadowcsshost-no-combinator/g,"."+r)).replace(/>\s*\*\s+([^{, ]+)/gm," $1 ")).trim()},t.prototype._convertColonHost=function(t){return this._convertColonRule(t,i,this._colonHostPartReplacer)},t.prototype._convertColonSlotted=function(t,e){return t.replace(l,function(){for(var t=[],r=0;r "+o+t[3]}return a+t[3]})},t.prototype._convertColonHostContext=function(t){return this._convertColonRule(t,p,this._colonHostContextPartReplacer)},t.prototype._convertColonRule=function(t,e,r){return t.replace(e,function(){for(var t=[],e=0;e-1?this._colonHostPartReplacer(t,e,r):t+e+r+", "+e+" "+t+r},t.prototype._colonHostPartReplacer=function(t,e,r){return t+e.replace(o,"")+r},t.prototype._convertShadowDOMSelectors=function(t){return h.reduce(function(t,e){return t.replace(e," ")},t)},t.prototype._scopeSelectors=function(t,e,r,o,n){var s=this;return O(t,function(t){var c=t.selector,i=t.content;return"@"!==t.selector[0]?c=s._scopeSelector(t.selector,e,r,o,s.strictStyling):(t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document"))&&(i=s._scopeSelectors(t.content,e,r,o,n)),c=c.replace(/\s{2,}/g," ").trim(),new H(c,i)})},t.prototype._scopeSelector=function(t,e,r,o,n){var s=this;return t.split(",").map(function(t){return o&&t.indexOf("."+o)>-1?t.trim():s._selectorNeedsScoping(t,e)?n?s._applyStrictSelectorScope(t,e,r).trim():s._applySelectorScope(t,e,r).trim():t.trim()}).join(", ")},t.prototype._selectorNeedsScoping=function(t,e){return!this._makeScopeMatcher(e).test(t)},t.prototype._makeScopeMatcher=function(t){return t=t.replace(/\[/g,"\\[").replace(/\]/g,"\\]"),new RegExp("^("+t+")"+f,"m")},t.prototype._applySelectorScope=function(t,e,r){return this._applySimpleSelectorScope(t,e,r)},t.prototype._applySimpleSelectorScope=function(t,e,r){if(_.lastIndex=0,_.test(t)){var o=this.strictStyling?"."+r:e;return t.replace(u,function(t,e){return e.replace(/([^:]*)(:*)(.*)/,function(t,e,r,n){return e+o+r+n})}).replace(_,o+" ")}return e+" "+t},t.prototype._applyStrictSelectorScope=function(t,e,o){for(var n,s=this,c="."+(e=e.replace(/\[is=([^\]]*)\]/g,function(t){for(var e=[],r=1;r-1)r=s._applySimpleSelectorScope(t,e,o);else{var n=t.replace(_,"");if(n.length>0){var i=n.match(/([^:]*)(:*)(.*)/);i&&(r=i[1]+c+i[2]+i[3])}}return r},p=new r(t),l="",u=0,h=/( |>|\+|~(?!=))\s*/g,f=!((t=p.content()).indexOf(a)>-1);null!==(n=h.exec(t));){var g=n[1],v=t.slice(u,n.index).trim();l+=((f=f||v.indexOf(a)>-1)?i(v):v)+" "+g+" ",u=h.lastIndex}var d=t.substring(u);return l+=(f=f||d.indexOf(a)>-1)?i(d):d,p.restore(l)},t.prototype._insertPolyfillHostInCssText=function(t){return t.replace(d,s).replace(g,o).replace(v,n)},t}();t("ShadowCss",e);var r=function(){function t(t){var e=this;this.placeholders=[],this.index=0,t=t.replace(/(\[[^\]]*\])/g,function(t,r){var o="__ph-"+e.index+"__";return e.placeholders.push(r),e.index++,o}),this._content=t.replace(/(:nth-[-\w]+)(\([^)]+\))/g,function(t,r,o){var n="__ph-"+e.index+"__";return e.placeholders.push(o),e.index++,r+n})}return t.prototype.restore=function(t){var e=this;return t.replace(/__ph-(\d+)__/g,function(t,r){return e.placeholders[+r]})},t.prototype.content=function(){return this._content},t}(),o="-shadowcsshost",n="-shadowcssslotted",s="-shadowcsscontext",c=")(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)",i=new RegExp("("+o+c,"gim"),p=new RegExp("("+s+c,"gim"),l=new RegExp("("+n+c,"gim"),a=o+"-no-combinator",u=/-shadowcsshost-no-combinator([^\s]*)/,h=[/::shadow/g,/::content/g],f="([>\\s~+[.,{:][\\s\\S]*)?$",_=/-shadowcsshost/gim,g=/:host/gim,v=/::slotted/gim,d=/:host-context/gim,S=/\/\*\s*[\s\S]*?\*\//g,m=/\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g,x=/(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g,y=/([{}])/g,C="{",w="}",R="%BLOCK%",H=function(t,e){this.selector=t,this.content=e};function O(t,e){var r=function(t){for(var e=t.split(y),r=[],o=[],n=0,s=[],c=0;c0?s.push(i):(s.length>0&&(o.push(s.join("")),r.push(R),s=[]),r.push(i)),i===C&&n++}return s.length>0&&(o.push(s.join("")),r.push(R)),new W(r.join(""),o)}(t),o=0;return r.escapedString.replace(x,function(){for(var t=[],n=0;n0?o.join(",").trim():void 0}}(t,r);if(!n)return e.push(t.substring(r,t.length)),t.length;var s=n.propName,i=null!=n.fallback?g(n.fallback):void 0;return e.push(t.substring(r,n.start),function(t){return function(e,r,n){return t[s]?t[s]:n?v(n,t):""}(0,0,i)}),n.end}function v(t,e){for(var r="",n=0;n0&&t.parsedSelector.split(",").forEach(function(t){t=t.trim(),n.push({selector:t,declarations:e,specificity:1,nu:r})}),r++}),n}var S="!important",E=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function b(t){var e=(t=t.replace(/\s+/gim," ").trim()).endsWith(S);return e&&(t=t.substr(0,t.length-S.length).trim()),{value:t,important:e}}function M(t){var e=[];return t.forEach(function(t){e.push.apply(e,t.selectors)}),e}function L(c){var l,u=function t(r,n){var c=n.substring(r.start,r.end-1);if(r.parsedCssText=r.cssText=c.trim(),r.parent){c=(c=(c=(c=n.substring(r.previous?r.previous.end:r.parent.start,r.start-1)).replace(/\\([0-9a-f]{1,6})\s/gi,function(){for(var t=arguments[1],e=6-t.length;e--;)t="0"+t;return"\\"+t})).replace(s.multipleSpaces," ")).substring(c.lastIndexOf(";")+1);var l=r.parsedSelector=r.selector=c.trim();r.atRule=0===l.indexOf(a),r.atRule?0===l.indexOf(o)?r.type=e.MEDIA_RULE:l.match(s.keyframesRule)&&(r.type=e.KEYFRAMES_RULE,r.keyframesName=r.selector.split(s.multipleSpaces).pop()):r.type=0===l.indexOf(i)?e.MIXIN_RULE:e.STYLE_RULE}var u=r.rules;if(u)for(var p=0,f=u.length,h=void 0;p1}}function x(t,e){var r=L(e.innerHTML);r.styleEl=e,t.push(r)}function R(t,e,r){var n;return n="."+r,t.replace(new RegExp("\\."+e,"g"),n)}function T(t,e,r){var n=r.href;return fetch(n).then(function(t){return t.text()}).then(function(s){if(((o=s).indexOf("var(")>-1||w.test(o))&&r.parentNode){(function(t){return I.lastIndex=0,I.test(t)})(s)&&(s=function(t){var e=n.replace(/[^\/]*$/,"");return t.replace(I,function(t,r){return t.replace(r,e+r)})}(s));var i=t.createElement("style");i.innerHTML=s,x(e,i),r.parentNode.insertBefore(i,r),r.remove()}var o}).catch(function(t){console.error(t)})}var w=/[\s;{]--[-a-zA-Z0-9]+\s*:/m,I=/url[\s]*\([\s]*['"]?(?![http|\/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim,k=function(){function t(t,e){this.win=t,this.doc=e,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map}return t.prototype.initShim=function(){var t=this;return new Promise(function(e){t.win.requestAnimationFrame(function(){var r,n;(r=t.doc,n=t.globalScopes,function(t,e){for(var r=[],n=t.querySelectorAll('link[rel="stylesheet"][href]'),s=0;s0&&r[r.length-1])&&(6===s[0]||2===s[0])){a=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]0?"is-active ":"")+"alert-count"},"+",this.queueLength>0?this.queueLength:1),o=this.isActive&&this.dismiss?n("div",{class:"alert-dismiss"}):"";return n(a,{theme:this.theme,"is-active":!!this.isActive,duration:this.duration},r,n("div",{class:"alert-content"},n("slot",{name:"alert-title"}),n("slot",{name:"alert-message"}),n("slot",{name:"alert-link"})),s,i,o)},Object.defineProperty(i.prototype,"el",{get:function(){return o(this)},enumerable:!0,configurable:!0}),Object.defineProperty(i,"style",{get:function(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:relative;-ms-flex-pack:center;justify-content:center;right:0;left:0;margin-right:auto;margin-left:auto;z-index:100;width:50em;max-width:90%;border-radius:2px;background-color:#fff;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,.15);box-shadow:0 0 12px 0 rgba(0,0,0,.15);height:0;opacity:0;overflow:visible;display:-ms-flexbox;display:flex;border-top:3px solid;-webkit-transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;-webkit-transform:translate3d(0,1.5rem,0);transform:translate3d(0,1.5rem,0);pointer-events:none;border-width:0}\@media only screen and (max-width:600px){:host{max-width:100%;border-radius:2px 2px 0 0;-webkit-box-shadow:0 -6px 12px 0 rgba(0,0,0,.15);box-shadow:0 -6px 12px 0 rgba(0,0,0,.15)}}:host([is-active]){visibility:visible;border-width:3px;opacity:1;height:100%;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translateZ(0);transform:translateZ(0);pointer-events:auto}:host slot[name=alert-title]::slotted(div){display:block;font-weight:500;font-size:16px}:host slot[name=alert-link]::slotted(a){display:inline-block;font-size:15px;color:#007ac2}:host slot[name=alert-message]::slotted(div){font-size:15px;color:#555;display:inline;-webkit-margin-end:.75rem;margin-inline-end:.75rem}:host([theme=dark]){background-color:#2b2b2b}:host([theme=dark]) slot[name=alert-title]::slotted(div){color:#f8f8f8}:host([theme=dark]) slot[name=alert-message]::slotted(div){color:#f3f3f3}.alert-content{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;word-wrap:break-word;-webkit-padding-before:.75rem;padding-block-start:.75rem;-webkit-padding-after:.75rem;padding-block-end:.75rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}\@media only screen and (max-width:600px){.alert-content{padding:1.5rem}}.alert-content svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-content:first-of-type{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}\@media only screen and (max-width:600px){.alert-content{-webkit-padding-before:1.5rem;padding-block-start:1.5rem;-webkit-padding-after:1.5rem;padding-block-end:1.5rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}}.alert-icon{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}\@media only screen and (max-width:600px){.alert-icon{padding:1.5rem}}.alert-icon svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-close{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-appearance:none;background-color:transparent;border:none;outline:none;cursor:pointer;border-radius:0 0 2px 0}\@media only screen and (max-width:600px){.alert-close{padding:1.5rem}}.alert-close svg{position:relative;vertical-align:top;height:16px;width:16px;fill:#151515}.alert-close:focus,.alert-close:hover{background-color:#f3f3f3}.alert-close:active{background-color:#eaeaea}.alert-close:last-child{border-radius:0 0 2px 0}:host([dir=rtl]) .alert-close:last-child{border-radius:0 0 0 2px}\@media only screen and (max-width:600px){.alert-close{border-radius:0}}:host([theme=dark]) .alert-close svg{fill:#d4d4d4}:host([theme=dark]) .alert-close:focus,:host([theme=dark]) .alert-close:hover{background-color:#202020}:host([theme=dark]) .alert-close:active{background-color:#151515}.alert-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-transition:all .15s ease-in;transition:all .15s ease-in;width:0;font-size:14px;visibility:hidden;padding:0;font-weight:500;text-align:center;background-color:transparent;color:#757575;opacity:0;border-left:1px solid transparent;border-right:1px solid transparent;cursor:default}.alert-count.is-active{visibility:visible;-webkit-transition-delay:.3s;transition-delay:.3s;opacity:1;padding:0 .375rem;width:3rem;border-left:1px solid #f3f3f3;border-right:1px solid #f3f3f3}.alert-count.is-active:last-child{border-right-color:transparent}\@media only screen and (max-width:600px){.alert-count{border-radius:0}}:host([theme=dark]) .alert-count{color:#d4d4d4}:host([theme=dark]) .alert-count.is-active{border-left:1px solid #202020;border-right:1px solid #202020}.alert-dismiss{left:0;top:0;z-index:101}.alert-dismiss,.alert-dismiss:after{display:block;position:absolute;right:0;height:3px}.alert-dismiss:after{top:-3px;border-radius:2px 2px 0 0;content:\"\";width:50%;background-color:hsla(0,0%,100%,.6);-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;z-index:200}:host([theme=dark]) .alert-dismiss:after{background-color:rgba(43,43,43,.6)}:host([duration=fast]) .alert-dismiss:after{-webkit-animation:dismissProgress 6s linear;animation:dismissProgress 6s linear}:host([duration=medium]) .alert-dismiss:after{-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear}:host([duration=slow]) .alert-dismiss:after{-webkit-animation:dismissProgress 14s linear;animation:dismissProgress 14s linear}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([color=blue]){border-top-color:#007ac2}:host([color=blue]) .alert-icon svg{fill:#007ac2}:host([color=red]){border-top-color:#d83020}:host([color=red]) .alert-icon svg{fill:#d83020}:host([color=yellow]){border-top-color:#edd317}:host([color=yellow]) .alert-icon svg{fill:#edd317}:host([color=green]){border-top-color:#35ac46}:host([color=green]) .alert-icon svg{fill:#35ac46}"},enumerable:!0,configurable:!0}),i}();i("calcite_alert",p),b.injectProps(p,["currentAlert","queueLength"]);var v=function(){function i(t){r(this,t),this.id="1",this.currentAlert="",this.isActive=!1,this.queue=[],this.alertsClose=s(this,"alertsClose",7),this.alertsOpen=s(this,"alertsOpen",7)}return i.prototype.open=function(i){return t(this,void 0,void 0,function(){return e(this,function(){return this.queue.includes(i)||(this.isActive=!0,this.currentAlert=i,this.queue.push(i),this.alertsOpen.emit({id:this.id,currentAlert:this.currentAlert,queue:this.queue})),[2]})})},i.prototype.updateQueue=function(t){var e=this;this.queue.includes(t.detail)&&(this.queue=this.queue.filter(function(e){return e!==t.detail})),this.queue.length<1&&setTimeout(function(){e.isActive=!1},300),this.alertsClose.emit({id:this.id,currentAlert:this.currentAlert,queue:this.queue})},i.prototype.componentWillUpdate=function(){this.currentAlert=this.queue.length>0?this.queue[0]:""},i.prototype.render=function(){return n(a,{"is-active":!!this.isActive},n(b.Provider,{state:{currentAlert:this.currentAlert,queueLength:this.queue.length>=2?this.queue.length-1:0}},n("slot",null)))},Object.defineProperty(i.prototype,"el",{get:function(){return o(this)},enumerable:!0,configurable:!0}),Object.defineProperty(i,"style",{get:function(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:fixed;visibility:hidden;opacity:0;left:0;right:0;bottom:1.5rem;height:0;z-index:101;pointer-events:none;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-transition-delay:.3s;transition-delay:.3s}\@media only screen and (max-width:600px){:host{bottom:0}}:host([is-active]){height:auto;visibility:visible;opacity:1}"},enumerable:!0,configurable:!0}),i}();i("calcite_alerts",v);var y=function(){function t(t){r(this,t),this.isActive=!1,this.text="Loading..."}return t.prototype.render=function(){return n(a,{"is-active":!!this.isActive},n("div",{class:"loader-bars"}),n("div",{class:"loader-text"},this.text))},Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:!0,configurable:!0}),Object.defineProperty(t,"style",{get:function(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host .loader-bars,:host .loader-bars:after,:host .loader-bars:before{background:#007ac2;-webkit-animation:load .8s ease-in-out infinite;animation:load .8s ease-in-out infinite;width:.85rem;height:2rem}:host .loader-bars:after,:host .loader-bars:before{position:absolute;top:0;content:\"\"}:host{position:relative;display:none;padding-bottom:4.5rem;padding-top:4.5rem}:host([is-active]){display:block}:host .loader-bars{text-indent:-9999em;margin:auto;position:absolute;right:calc(50% - .425rem);font-size:11px;-webkit-animation-delay:.16s;animation-delay:.16s}:host .loader-bars:before{left:-1.25rem}:host .loader-bars:after{left:1.25rem;-webkit-animation-delay:.32s;animation-delay:.32s}:host .loader-text{padding-top:4rem;text-align:center}\@-webkit-keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}\@keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}"},enumerable:!0,configurable:!0}),t}();i("calcite_loader",y);var g=function(){function t(t){r(this,t)}return t.prototype.getText=function(){return(this.first||"")+((t=this.middle)?" "+t:"")+((e=this.last)?" "+e:"");var t,e},t.prototype.render=function(){return n("div",{class:"example-class"},"Hello, World! I'm ",this.getText())},Object.defineProperty(t,"style",{get:function(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.example-class{padding:1.5rem;color:#d83020;-webkit-box-shadow:0 0 16px 0 rgba(0,0,0,.05);box-shadow:0 0 16px 0 rgba(0,0,0,.05);border:1px solid #007ac2}"},enumerable:!0,configurable:!0}),t}();function T(t){for(var e="",i=0;i{const e=`/*!@___${c.length}___*/`;return c.push({placeholder:e,comment:`/*!@${t.selector}*/`}),t.selector=e+t.selector,t};t=H(t,t=>"@"!==t.selector[0]?e(t):t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document")?(t.content=H(t.content,e),t):t)}const l=this._scopeCssText(t,e,s,o,r);return t=[l,...n].join("\n"),r&&c.forEach(({placeholder:e,comment:s})=>{t=t.replace(e,s)}),t}_scopeCssText(t,e,s,o,r){return t=this._insertPolyfillHostInCssText(t),t=this._convertColonHost(t),t=this._convertColonHostContext(t),t=this._convertColonSlotted(t,o),t=this._convertShadowDOMSelectors(t),e&&(t=this._scopeSelectors(t,e,s,o,r)),(t=(t=t.replace(/-shadowcsshost-no-combinator/g,`.${s}`)).replace(/>\s*\*\s+([^{, ]+)/gm," $1 ")).trim()}_convertColonHost(t){return this._convertColonRule(t,l,this._colonHostPartReplacer)}_convertColonSlotted(t,e){return t.replace(p,function(...t){if(t[2]){const s=t[2].trim();return"."+e+" > "+s+t[3]}return h+t[3]})}_convertColonHostContext(t){return this._convertColonRule(t,i,this._colonHostContextPartReplacer)}_convertColonRule(t,e,s){return t.replace(e,function(...t){if(t[2]){const e=t[2].split(","),o=[];for(let r=0;r-1?this._colonHostPartReplacer(t,e,s):t+e+s+", "+e+" "+t+s}_colonHostPartReplacer(t,e,s){return t+e.replace(o,"")+s}_convertShadowDOMSelectors(t){return u.reduce((t,e)=>t.replace(e," "),t)}_scopeSelectors(t,e,s,o,r){return H(t,t=>{let n=t.selector,c=t.content;return"@"!==t.selector[0]?n=this._scopeSelector(t.selector,e,s,o,this.strictStyling):(t.selector.startsWith("@media")||t.selector.startsWith("@supports")||t.selector.startsWith("@page")||t.selector.startsWith("@document"))&&(c=this._scopeSelectors(t.content,e,s,o,r)),n=n.replace(/\s{2,}/g," ").trim(),new v(n,c)})}_scopeSelector(t,e,s,o,r){return t.split(",").map(t=>o&&t.indexOf("."+o)>-1?t.trim():this._selectorNeedsScoping(t,e)?r?this._applyStrictSelectorScope(t,e,s).trim():this._applySelectorScope(t,e,s).trim():t.trim()).join(", ")}_selectorNeedsScoping(t,e){return!this._makeScopeMatcher(e).test(t)}_makeScopeMatcher(t){return t=t.replace(/\[/g,"\\[").replace(/\]/g,"\\]"),new RegExp("^("+t+")"+_,"m")}_applySelectorScope(t,e,s){return this._applySimpleSelectorScope(t,e,s)}_applySimpleSelectorScope(t,e,s){if(g.lastIndex=0,g.test(t)){const o=this.strictStyling?`.${s}`:e;return t.replace(a,(t,e)=>e.replace(/([^:]*)(:*)(.*)/,(t,e,s,r)=>e+o+s+r)).replace(g,o+" ")}return e+" "+t}_applyStrictSelectorScope(t,e,o){const r="."+(e=e.replace(/\[is=([^\]]*)\]/g,(t,...e)=>e[0])),n=t=>{let s=t.trim();if(!s)return"";if(t.indexOf(h)>-1)s=this._applySimpleSelectorScope(t,e,o);else{const e=t.replace(g,"");if(e.length>0){const t=e.match(/([^:]*)(:*)(.*)/);t&&(s=t[1]+r+t[2]+t[3])}}return s},c=new s(t);let l,i="",p=0;const a=/( |>|\+|~(?!=))\s*/g;let u=!((t=c.content()).indexOf(h)>-1);for(;null!==(l=a.exec(t));){const e=l[1],s=t.slice(p,l.index).trim();i+=`${(u=u||s.indexOf(h)>-1)?n(s):s} ${e} `,p=a.lastIndex}const _=t.substring(p);return i+=(u=u||_.indexOf(h)>-1)?n(_):_,c.restore(i)}_insertPolyfillHostInCssText(t){return t.replace(m,n).replace(d,o).replace(S,r)}}class s{constructor(t){this.placeholders=[],this.index=0,t=t.replace(/(\[[^\]]*\])/g,(t,e)=>{const s=`__ph-${this.index}__`;return this.placeholders.push(e),this.index++,s}),this._content=t.replace(/(:nth-[-\w]+)(\([^)]+\))/g,(t,e,s)=>{const o=`__ph-${this.index}__`;return this.placeholders.push(s),this.index++,e+o})}restore(t){return t.replace(/__ph-(\d+)__/g,(t,e)=>this.placeholders[+e])}content(){return this._content}}const o="-shadowcsshost",r="-shadowcssslotted",n="-shadowcsscontext",c=")(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)",l=new RegExp("("+o+c,"gim"),i=new RegExp("("+n+c,"gim"),p=new RegExp("("+r+c,"gim"),h=o+"-no-combinator",a=/-shadowcsshost-no-combinator([^\s]*)/,u=[/::shadow/g,/::content/g],_="([>\\s~+[.,{:][\\s\\S]*)?$",g=/-shadowcsshost/gim,d=/:host/gim,S=/::slotted/gim,m=/:host-context/gim,x=/\/\*\s*[\s\S]*?\*\//g,f=/\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g,C=/(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g,w=/([{}])/g,$="{",R="}",y="%BLOCK%";class v{constructor(t,e){this.selector=t,this.content=e}}function H(t,e){const s=function(t){const e=t.split(w),s=[],o=[];let r=0,n=[];for(let t=0;t0?n.push(c):(n.length>0&&(o.push(n.join("")),s.push(y),n=[]),s.push(c)),c===$&&r++}return n.length>0&&(o.push(n.join("")),s.push(y)),new O(s.join(""),o)}(t);let o=0;return s.escapedString.replace(C,function(...t){const r=t[2];let n="",c=t[4],l="";c&&c.startsWith("{"+y)&&(n=s.blocks[o++],c=c.substring(y.length+1),l="{");const i=e(new v(r,n));return`${t[1]}${i.selector}${t[3]}${l}${i.content}${c}`})}class O{constructor(t,e){this.escapedString=t,this.blocks=e}}export{e as ShadowCss,t as scopeCss}; \ No newline at end of file diff --git a/dist/calcite/p-5b1e6c1f.system.js b/dist/calcite/p-5b1e6c1f.system.js new file mode 100644 index 00000000000..b51d7a121b0 --- /dev/null +++ b/dist/calcite/p-5b1e6c1f.system.js @@ -0,0 +1 @@ +var n=this&&this.__extends||function(){var n=function(t,r){return(n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(n,t){n.__proto__=t}||function(n,t){for(var r in t)t.hasOwnProperty(r)&&(n[r]=t[r])})(t,r)};return function(t,r){function e(){this.constructor=t}n(t,r),t.prototype=null===r?Object.create(r):(e.prototype=r.prototype,new e)}}(),t=this&&this.__awaiter||function(n,t,r,e){return new(r||(r=Promise))(function(i,u){function o(n){try{f(e.next(n))}catch(n){u(n)}}function c(n){try{f(e.throw(n))}catch(n){u(n)}}function f(n){n.done?i(n.value):new r(function(t){t(n.value)}).then(o,c)}f((e=e.apply(n,t||[])).next())})},r=this&&this.__generator||function(n,t){var r,e,i,u,o={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return u={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(u[Symbol.iterator]=function(){return this}),u;function c(u){return function(c){return function(u){if(r)throw new TypeError("Generator is already executing.");for(;o;)try{if(r=1,e&&(i=2&u[0]?e.return:u[0]?e.throw||((i=e.return)&&i.call(e),0):e.next)&&!(i=i.call(e,u[1])).done)return i;switch(e=0,i&&(u=[2&u[0],i.value]),u[0]){case 0:case 1:i=u;break;case 4:return o.label++,{value:u[1],done:!1};case 5:o.label++,e=u[1],u=[0];continue;case 7:u=o.ops.pop(),o.trys.pop();continue;default:if(!(i=(i=o.trys).length>0&&i[i.length-1])&&(6===u[0]||2===u[0])){o=0;continue}if(3===u[0]&&(!i||u[1]>i[0]&&u[1]0&&(S.push.apply(S,k),k.length=0),(g=j.length+k.length+S.length>0)?f.raf(_):b=0},x=O(k),L={},M=function(n){return null!=n},U=function(n){return n.toLowerCase()};e("c",function(){return o.CSS&&o.CSS.supports&&o.CSS.supports("color","var(--c)")?Promise.resolve():i.import("./p-f57d4852.system.js")}),e("a",function(){return t(u,void 0,void 0,function(){var n,t,e;return r(this,function(r){switch(r.label){case 0:return""===(n=i.meta.url)?[3,1]:[2,Promise.resolve(new URL(".",n).href)];case 1:return t=Array.from(c.querySelectorAll("script")).find(function(n){return n.src.includes("/calcite.esm.js")||"calcite"===n.getAttribute("data-namespace")}),e=new URL(".",new URL(t.getAttribute("data-resources-url")||t.src,c.baseURI)),C(e.href),window.customElements?[3,3]:[4,i.import("./p-7889326c.system.js")];case 2:r.sent(),r.label=3;case 3:return[2,e.href]}})})});var C=function(n){var t="__sc_import_"+"calcite".replace(/\s|-/g,"_");try{o[t]=new Function("w","return import(w);")}catch(e){var r=new Map;o[t]=function(e){var i=new URL(e,n).href,u=r.get(i);if(!u){var f=c.createElement("script");f.type="module",f.src=URL.createObjectURL(new Blob(["import * as m from '"+i+"'; window."+t+".m = m;"],{type:"application/javascript"})),u=new Promise(function(n){f.onload=function(){n(o[t].m),f.remove()}}),r.set(i,u),c.head.appendChild(f)}return u}}},E="http://www.w3.org/1999/xlink",P=new WeakMap,T=function(n){return"sc-"+n},W=[];function A(n,t){for(var r,e,i=null,u=!1,o=!1,c=arguments.length;c-- >2;)W.push(arguments[c]);for(;W.length>0;){var f=W.pop();if(f&&void 0!==f.pop)for(c=f.length;c--;)W.push(f[c]);else"boolean"==typeof f&&(f=null),(o="function"!=typeof n)&&(null==f?f="":"number"==typeof f?f=String(f):"string"!=typeof f&&(o=!1)),o&&u?i[i.length-1].p+=f:null===i?i=[o?{t:0,p:f}:f]:i.push(o?{t:0,p:f}:f),u=o}if(null!=t){if(t.className&&(t.class=t.className),"object"==typeof t.class){for(c in t.class)t.class[c]&&W.push(c);t.class=W.join(" "),W.length=0}null!=t.key&&(r=t.key),null!=t.name&&(e=t.name)}if("function"==typeof n)return n(t,i||[],D);var a={g:n,j:i,k:void 0,t:0};return a.S=t,a.p=void 0,a.O=r,a.R=e,a}var F,N,q,B=e("g",{}),D={forEach:function(n,t){return n.map(G).forEach(t)},map:function(n,t){return n.map(G).map(t).map(H)}},G=function(n){return{vattrs:n.S,vchildren:n.j,vkey:n.O,vname:n.R,vtag:n.g,vtext:n.p}},H=function(n){return{t:0,S:n.vattrs,j:n.vchildren,O:n.vkey,R:n.vname,g:n.vtag,p:n.vtext}},z=function(n,t,r,e,i,u){if(r!==e)if("class"!==t||i)if("style"===t){for(var o in r)e&&null!=e[o]||(o.includes("-")?n.style.removeProperty(o):n.style[o]="");for(var o in e)r&&e[o]===r[o]||(o.includes("-")?n.style.setProperty(o,e[o]):n.style[o]=e[o])}else if("key"===t);else if("ref"===t)e&&e(n);else if(t.startsWith("on")&&!w(n,t))t=w(n,U(t))?U(t.substring(2)):U(t[2])+t.substring(3),r&&f.rel(n,t,r,!1),e&&f.ael(n,t,e,!1);else{var c=w(n,t),a=["object","function"].includes(typeof e);if((c||a&&null!==e)&&!i)try{n[t]=null==e&&-1===n.tagName.indexOf("-")?"":e}catch(n){}var s=!(!i||t===(t=t.replace(/^xlink\:?/,"")));null==e||!1===e?s?n.removeAttributeNS(E,U(t)):n.removeAttribute(t):(!c||4&u||i)&&!a&&(e=!0===e?"":e.toString(),s?n.setAttributeNS(E,U(t),e):n.setAttribute(t,e))}else{var l=I(r),v=I(n.className).filter(function(n){return!l.includes(n)});n.className=v.concat(I(e).filter(function(n){return!v.includes(n)})).join(" ")}},I=function(n){return n?n.split(" "):[]},J=function(n,t,r,e){var i=11===t.k.nodeType&&t.k.host?t.k.host:t.k,u=n&&n.S||L,o=t.S||L;for(e in u)null==o[e]&&null!=u[e]&&z(i,e,u[e],void 0,r,t.t);for(e in o)z(i,e,u[e],o[e],r,t.t)},K=!1,Q=!1,V=!1,X=!1,Y=function(n,t,r,e){var i,u,o,f=t.j[r],a=0;if(K||(V=!0,"slot"===f.g&&(F&&e.classList.add(F+"-s"),f.t|=f.j?2:1)),M(f.p))f.k=c.createTextNode(f.p);else if(1&f.t)f.k=c.createTextNode("");else{if(i=f.k=X||"svg"===f.g?c.createElementNS("http://www.w3.org/2000/svg",f.g):c.createElement(2&f.t?"slot-fb":f.g),J(null,f,X="svg"===f.g||"foreignObject"!==f.g&&X),M(F)&&i["s-si"]!==F&&i.classList.add(i["s-si"]=F),f.j)for(a=0;a=0;e--){var i=r[e];i["s-hn"]!==q&&i["s-ol"]&&(un(i).insertBefore(i,en(i)),i["s-ol"].remove(),i["s-ol"]=void 0,V=!0),t&&Z(i,t)}f.t&=-2},nn=function(n,t,r,e,i,u){var o,c=n["s-cr"]&&n["s-cr"].parentNode||n;for(c.shadowRoot&&U(c.tagName)===q&&(c=c.shadowRoot);i<=u;++i)e[i]&&(o=Y(null,r,i,n))&&(e[i].k=o,c.insertBefore(o,en(t)))},tn=function(n,t,r,e){for(;t<=r;++t)M(n[t])&&(e=n[t].k,sn(n[t],!0),Q=!0,e["s-ol"]?e["s-ol"].remove():Z(e,!0),e.remove())},rn=function(n,t){return n.g===t.g&&("slot"===n.g?n.R===t.R:n.O===t.O)},en=function(n){return n&&n["s-ol"]?n["s-ol"]:n},un=function(n){return(n["s-ol"]?n["s-ol"]:n).parentNode},on=function(n,t){var r,e=t.k=n.k,i=n.j,u=t.j;X=e&&M(e.parentNode)&&void 0!==e.ownerSVGElement,X="svg"===t.g||"foreignObject"!==t.g&&X,M(t.p)?(r=e["s-cr"])?r.parentNode.textContent=t.p:n.p!==t.p&&(e.textContent=t.p):("slot"===t.g||J(n,t,X),M(i)&&M(u)?function(n,t,r,e){for(var i,u,o=0,c=0,f=0,a=0,s=t.length-1,l=t[0],v=t[s],h=e.length-1,d=e[0],w=e[h];o<=s&&c<=h;)if(null==l)l=t[++o];else if(null==v)v=t[--s];else if(null==d)d=e[++c];else if(null==w)w=e[--h];else if(rn(l,d))on(l,d),l=t[++o],d=e[++c];else if(rn(v,w))on(v,w),v=t[--s],w=e[--h];else if(rn(l,w))"slot"!==l.g&&"slot"!==w.g||Z(l.k.parentNode,!1),on(l,w),n.insertBefore(l.k,v.k.nextSibling),l=t[++o],w=e[--h];else if(rn(v,d))"slot"!==l.g&&"slot"!==w.g||Z(v.k.parentNode,!1),on(v,d),n.insertBefore(v.k,l.k),v=t[--s],d=e[++c];else{for(f=-1,a=o;a<=s;++a)if(t[a]&&M(t[a].O)&&t[a].O===d.O){f=a;break}f>=0?((u=t[f]).g!==d.g?i=Y(t&&t[c],r,f,n):(on(u,d),t[f]=void 0,i=u.k),d=e[++c]):(i=Y(t&&t[c],r,c,n),d=e[++c]),i&&un(l.k).insertBefore(i,en(l.k))}o>s?nn(n,null==e[h+1]?null:e[h+1].k,r,e,c,h):c>h&&tn(t,o,s)}(e,i,t,u):M(u)?(M(n.p)&&(e.textContent=""),nn(e,null,t,u,0,u.length-1)):M(i)&&tn(i,0,i.length-1)),X&&"svg"===t.g&&(X=!1)},cn=function(n,t,r,e,i,u,o,c){for(e=0,i=(r=n.childNodes).length;e=0;f--)(e=i[f])["s-cn"]||e["s-nr"]||e["s-hn"]===r["s-hn"]||((3===(a=e.nodeType)||8===a)&&""===u||1===a&&null===e.getAttribute("slot")&&""===u||1===a&&e.getAttribute("slot")===u)&&(fn.some(function(n){return n.nodeToRelocate===e})||(Q=!0,e["s-sn"]=u,fn.push({slotRefNode:r,nodeToRelocate:e})));1===r.nodeType&&an(r)}},sn=function(n,t){n&&(n.S&&n.S.ref&&n.S.ref(t?null:n.k),n.j&&n.j.forEach(function(n){sn(n,t)}))},ln=function(n,e){return t(u,void 0,void 0,function(){var t;return r(this,function(r){switch(r.label){case 0:if(!n||!n[e])return[3,4];r.label=1;case 1:return r.trys.push([1,3,,4]),[4,n[e]()];case 2:return r.sent(),[3,4];case 3:return t=r.sent(),y(t),[3,4];case 4:return[2]}})})},vn=function(n,e,i,o){return t(u,void 0,void 0,function(){var t;return r(this,function(r){switch(r.label){case 0:return e.t|=16,t=e.u,o?[4,ln(t,"componentWillLoad")]:[3,2];case 1:return r.sent(),[3,4];case 2:return[4,ln(t,"componentWillUpdate")];case 3:r.sent(),r.label=4;case 4:return x(function(){return hn(n,e,i,o,t)}),[2]}})})},hn=function(n,t,r,e,i){t.t&=-17,n["s-lr"]=!1,e&&function(n,t){var r=function(n,r,e,i){var u=T(t.$),o=p.get(u);if(n=11===n.nodeType?n:c,o)if("string"==typeof o){var f=P.get(n=n.head||n),a=void 0;if(f||P.set(n,f=new Set),!f.has(u)){if(m){var s=(a=m.createHostStyle(i,u,o))["s-sc"];s&&(u=s,f=null)}else(a=c.createElement("style")).innerHTML=o;n.appendChild(a),f&&f.add(u)}}else n.adoptedStyleSheets.includes(o)||(n.adoptedStyleSheets=n.adoptedStyleSheets.concat([o]));return u}(a&&n.shadowRoot?n.shadowRoot:n.getRootNode(),0,0,n);10&t.t&&(n["s-sc"]=r,n.classList.add(r+"-h"))}(n,r),t.t|=4;try{!function(n,t,r,e){var i,u=t._||{t:0};if(q=U(n.tagName),(i=e)&&i.g===B?e.g=null:e=A(null,null,e),r.L&&(e.S=e.S||{},r.L.forEach(function(t){return e.S[t[1]]=n[t[0]]})),e.t|=4,t._=e,e.k=u.k=n.shadowRoot||n,F=n["s-sc"],N=n["s-cr"],K=a&&0!=(1&r.t),V=Q=!1,on(u,e),V){an(e.k);for(var o=0;o0&&(n["s-rc"].forEach(function(n){return n()}),n["s-rc"].length=0),dn(n,t)},dn=function(n,t,r){if(!n["s-al"]){var e=t.u,i=t.M;512&t.t||(t.t|=512,n.classList.add("hydrated"),ln(e,"componentDidLoad"),t.l(n),i||(c.documentElement.classList.add("hydrated"),setTimeout(function(){return f.t|=2},999))),i&&((r=i["s-al"])&&(r.delete(n),0===r.size&&(i["s-al"]=void 0,i["s-init"]())),t.M=void 0)}},wn=function(n,t,r,e){if(t.U){n.watchers&&(t.C=n.watchers);var i=Object.entries(t.U);if(i.forEach(function(i){var u=i[0],o=i[1][0];31&o||e&&32&o?Object.defineProperty(n.prototype,u,{get:function(){return n=u,h(this).v.get(n);var n},set:function(n){!function(n,t,r,e){var i,u,o=h(n),c=o.o,f=o.v.get(t),a=o.t;if(u=e.U[t][0],!((r=null!=(i=r)&&"object"!=typeof i&&"function"!=typeof i?4&u?"false"!==i&&(""===i||!!i):2&u?parseFloat(i):1&u?String(i):i:i)===f||8&a&&void 0!==f)&&(o.v.set(t,r),o.u)){if(e.C&&1==(9&a)){var s=e.C[t];s&&s.forEach(function(n){try{o.u[n].call(o.u,r,f,t)}catch(n){y(n)}})}2==(22&a)&&vn(c,o,e,!1)}}(this,u,n,t)},configurable:!0,enumerable:!0}):r&&64&o&&Object.defineProperty(n.prototype,u,{value:function(){for(var n=[],t=0;trequestAnimationFrame(t),ael:(t,e,n,l)=>t.addEventListener(e,n,l),rel:(t,e,n,l)=>t.removeEventListener(e,n,l)},l=!!e.documentElement.attachShadow,o=(()=>{let t=!1;try{e.addEventListener("e",null,Object.defineProperty({},"passive",{get(){t=!0}}))}catch(t){}return t})(),s=(()=>{try{return new CSSStyleSheet,!0}catch(t){}return!1})(),i=new WeakMap,c=t=>i.get(t),r=(t,e)=>i.set(e.o=t,e),a=(t,e)=>e in t,f=t=>console.error(t),u=new Map,$=t.__stencil_cssshim;let p=0,d=!1;const h=[],m=[],w=[],y=t=>e=>{t.push(e),d||(d=!0,n.raf(g))},b=(t,e)=>{let n=0,l=0;for(;n{p++,(t=>{for(let e=0;e0&&(w.push(...m),m.length=0),(d=h.length+m.length+w.length>0)?n.raf(g):p=0},v=y(m),_={},j=t=>null!=t,k=t=>t.toLowerCase(),S=()=>t.CSS&&t.CSS.supports&&t.CSS.supports("color","var(--c)")?Promise.resolve():__sc_import_calcite("./p-229ebf7a.js"),R=async()=>{{const t=Array.from(e.querySelectorAll("script")).find(t=>t.src.includes("/calcite.esm.js")||"calcite"===t.getAttribute("data-namespace")),n=new URL(".",new URL(t.getAttribute("data-resources-url")||t.src,e.baseURI));return O(n.href),window.customElements||await __sc_import_calcite("./p-7eb7509a.js"),n.href}},O=n=>{const l=`__sc_import_${"calcite".replace(/\s|-/g,"_")}`;try{t[l]=new Function("w","return import(w);")}catch(o){const s=new Map;t[l]=(o=>{const i=new URL(o,n).href;let c=s.get(i);if(!c){const n=e.createElement("script");n.type="module",n.src=URL.createObjectURL(new Blob([`import * as m from '${i}'; window.${l}.m = m;`],{type:"application/javascript"})),c=new Promise(e=>{n.onload=(()=>{e(t[l].m),n.remove()})}),s.set(i,c),e.head.appendChild(n)}return c})}},x="http://www.w3.org/1999/xlink",L=new WeakMap,M=t=>"sc-"+t,U=[];function C(t,e){let n,l,o=null,s=!1,i=!1,c=arguments.length;for(;c-- >2;)U.push(arguments[c]);for(;U.length>0;){let e=U.pop();if(e&&void 0!==e.pop)for(c=e.length;c--;)U.push(e[c]);else"boolean"==typeof e&&(e=null),(i="function"!=typeof t)&&(null==e?e="":"number"==typeof e?e=String(e):"string"!=typeof e&&(i=!1)),i&&s?o[o.length-1].s+=e:null===o?o=[i?{t:0,s:e}:e]:o.push(i?{t:0,s:e}:e),s=i}if(null!=e){if(e.className&&(e.class=e.className),"object"==typeof e.class){for(c in e.class)e.class[c]&&U.push(c);e.class=U.join(" "),U.length=0}null!=e.key&&(n=e.key),null!=e.name&&(l=e.name)}if("function"==typeof t)return t(e,o||[],T);const r={i:t,u:o,$:void 0,t:0};return r.p=e,r.s=void 0,r.h=n,r.g=l,r}const E={},T={forEach:(t,e)=>t.map(W).forEach(e),map:(t,e)=>t.map(W).map(e).map(F)},W=t=>({vattrs:t.p,vchildren:t.u,vkey:t.h,vname:t.g,vtag:t.i,vtext:t.s}),F=t=>({t:0,p:t.vattrs,u:t.vchildren,h:t.vkey,g:t.vname,i:t.vtag,s:t.vtext}),P=(t,e,l,o,s,i)=>{if(l!==o)if("class"!==e||s)if("style"===e){for(const e in l)o&&null!=o[e]||(e.includes("-")?t.style.removeProperty(e):t.style[e]="");for(const e in o)l&&o[e]===l[e]||(e.includes("-")?t.style.setProperty(e,o[e]):t.style[e]=o[e])}else if("key"===e);else if("ref"===e)o&&o(t);else if(e.startsWith("on")&&!a(t,e))e=a(t,k(e))?k(e.substring(2)):k(e[2])+e.substring(3),l&&n.rel(t,e,l,!1),o&&n.ael(t,e,o,!1);else{const n=a(t,e),l=["object","function"].includes(typeof o);if((n||l&&null!==o)&&!s)try{t[e]=null==o&&-1===t.tagName.indexOf("-")?"":o}catch(t){}const c=!(!s||e===(e=e.replace(/^xlink\:?/,"")));null==o||!1===o?c?t.removeAttributeNS(x,k(e)):t.removeAttribute(e):(!n||4&i||s)&&!l&&(o=!0===o?"":o.toString(),c?t.setAttributeNS(x,k(e),o):t.setAttribute(e,o))}else{const e=A(l),n=A(t.className).filter(t=>!e.includes(t));t.className=n.concat(A(o).filter(t=>!n.includes(t))).join(" ")}},A=t=>t?t.split(" "):[],N=(t,e,n,l)=>{const o=11===e.$.nodeType&&e.$.host?e.$.host:e.$,s=t&&t.p||_,i=e.p||_;for(l in s)null==i[l]&&null!=s[l]&&P(o,l,s[l],void 0,n,e.t);for(l in i)P(o,l,s[l],i[l],n,e.t)};let q,B,D,H=!1,z=!1,G=!1,I=!1;const J=(t,n,l,o)=>{const s=n.u[l];let i,c,r,a=0;if(H||(G=!0,"slot"===s.i&&(q&&o.classList.add(q+"-s"),s.t|=s.u?2:1)),j(s.s))s.$=e.createTextNode(s.s);else if(1&s.t)s.$=e.createTextNode("");else{if(i=s.$=I||"svg"===s.i?e.createElementNS("http://www.w3.org/2000/svg",s.i):e.createElement(2&s.t?"slot-fb":s.i),N(null,s,I="svg"===s.i||"foreignObject"!==s.i&&I),j(q)&&i["s-si"]!==q&&i.classList.add(i["s-si"]=q),s.u)for(a=0;a{n.t|=1;const l=t.childNodes;for(let t=l.length-1;t>=0;t--){const n=l[t];n["s-hn"]!==D&&n["s-ol"]&&(Z(n).insertBefore(n,Y(n)),n["s-ol"].remove(),n["s-ol"]=void 0,G=!0),e&&K(n,e)}n.t&=-2},Q=(t,e,n,l,o,s)=>{let i,c=t["s-cr"]&&t["s-cr"].parentNode||t;for(c.shadowRoot&&k(c.tagName)===D&&(c=c.shadowRoot);o<=s;++o)l[o]&&(i=J(null,n,o,t))&&(l[o].$=i,c.insertBefore(i,Y(e)))},V=(t,e,n,l)=>{for(;e<=n;++e)j(t[e])&&(l=t[e].$,ot(t[e],!0),z=!0,l["s-ol"]?l["s-ol"].remove():K(l,!0),l.remove())},X=(t,e)=>t.i===e.i&&("slot"===t.i?t.g===e.g:t.h===e.h),Y=t=>t&&t["s-ol"]?t["s-ol"]:t,Z=t=>(t["s-ol"]?t["s-ol"]:t).parentNode,tt=(t,e)=>{const n=e.$=t.$,l=t.u,o=e.u;let s;I=n&&j(n.parentNode)&&void 0!==n.ownerSVGElement,I="svg"===e.i||"foreignObject"!==e.i&&I,j(e.s)?(s=n["s-cr"])?s.parentNode.textContent=e.s:t.s!==e.s&&(n.textContent=e.s):("slot"===e.i||N(t,e,I),j(l)&&j(o)?((t,e,n,l)=>{let o,s,i=0,c=0,r=0,a=0,f=e.length-1,u=e[0],$=e[f],p=l.length-1,d=l[0],h=l[p];for(;i<=f&&c<=p;)if(null==u)u=e[++i];else if(null==$)$=e[--f];else if(null==d)d=l[++c];else if(null==h)h=l[--p];else if(X(u,d))tt(u,d),u=e[++i],d=l[++c];else if(X($,h))tt($,h),$=e[--f],h=l[--p];else if(X(u,h))"slot"!==u.i&&"slot"!==h.i||K(u.$.parentNode,!1),tt(u,h),t.insertBefore(u.$,$.$.nextSibling),u=e[++i],h=l[--p];else if(X($,d))"slot"!==u.i&&"slot"!==h.i||K($.$.parentNode,!1),tt($,d),t.insertBefore($.$,u.$),$=e[--f],d=l[++c];else{for(r=-1,a=i;a<=f;++a)if(e[a]&&j(e[a].h)&&e[a].h===d.h){r=a;break}r>=0?((s=e[r]).i!==d.i?o=J(e&&e[c],n,r,t):(tt(s,d),e[r]=void 0,o=s.$),d=l[++c]):(o=J(e&&e[c],n,c,t),d=l[++c]),o&&Z(u.$).insertBefore(o,Y(u.$))}i>f?Q(t,null==l[p+1]?null:l[p+1].$,n,l,c,p):c>p&&V(e,i,f)})(n,l,e,o):j(o)?(j(t.s)&&(n.textContent=""),Q(n,null,e,o,0,o.length-1)):j(l)&&V(l,0,l.length-1)),I&&"svg"===e.i&&(I=!1)},et=(t,e,n,l,o,s,i,c)=>{for(l=0,o=(n=t.childNodes).length;l{let e,n,l,o,s=t.childNodes,i=s.length,c=0,r=0,a=0;for(i=s.length;c=0;r--)(n=l[r])["s-cn"]||n["s-nr"]||n["s-hn"]===e["s-hn"]||((3===(a=n.nodeType)||8===a)&&""===o||1===a&&null===n.getAttribute("slot")&&""===o||1===a&&n.getAttribute("slot")===o)&&(nt.some(t=>t.nodeToRelocate===n)||(z=!0,n["s-sn"]=o,nt.push({slotRefNode:e,nodeToRelocate:n})));1===e.nodeType&<(e)}},ot=(t,e)=>{t&&(t.p&&t.p.ref&&t.p.ref(e?null:t.$),t.u&&t.u.forEach(t=>{ot(t,e)}))},st=async(t,e)=>{if(t&&t[e])try{await t[e]()}catch(t){f(t)}},it=async(t,e,n,l)=>{e.t|=16;const o=e.o;l?await st(o,"componentWillLoad"):await st(o,"componentWillUpdate"),v(()=>ct(t,e,n,l,o))},ct=(t,o,s,i,c)=>{o.t&=-17,t["s-lr"]=!1,i&&((t,n)=>{const o=((t,l,o,s)=>{let i=M(n.v),c=u.get(i);if(t=11===t.nodeType?t:e,c)if("string"==typeof c){let n,l=L.get(t=t.head||t);if(l||L.set(t,l=new Set),!l.has(i)){if($){const t=(n=$.createHostStyle(s,i,c))["s-sc"];t&&(i=t,l=null)}else(n=e.createElement("style")).innerHTML=c;t.appendChild(n),l&&l.add(i)}}else t.adoptedStyleSheets.includes(c)||(t.adoptedStyleSheets=[...t.adoptedStyleSheets,c]);return i})(l&&t.shadowRoot?t.shadowRoot:t.getRootNode(),0,0,t);10&n.t&&(t["s-sc"]=o,t.classList.add(o+"-h"))})(t,s),o.t|=4;try{((t,o,s,i)=>{const c=o._||{t:0};if(D=k(t.tagName),(t=>t&&t.i===E)(i)?i.i=null:i=C(null,null,i),s.j&&(i.p=i.p||{},s.j.forEach(([e,n])=>i.p[n]=t[e])),i.t|=4,o._=i,i.$=c.$=t.shadowRoot||t,q=t["s-sc"],B=t["s-cr"],H=l&&0!=(1&s.t),G=z=!1,tt(c,i),G){lt(i.$);for(let t=0;t0&&(t["s-rc"].forEach(t=>t()),t["s-rc"].length=0),rt(t,o)},rt=(t,l,o)=>{if(!t["s-al"]){const s=l.o,i=l.k;512&l.t||(l.t|=512,t.classList.add("hydrated"),st(s,"componentDidLoad"),l.S(t),i||(e.documentElement.classList.add("hydrated"),setTimeout(()=>n.t|=2,999))),i&&((o=i["s-al"])&&(o.delete(t),0===o.size&&(i["s-al"]=void 0,i["s-init"]())),l.k=void 0)}},at=(t,e,n,l)=>{if(e.R){t.watchers&&(e.O=t.watchers);const o=Object.entries(e.R);if(o.forEach(([o,[s]])=>{31&s||l&&32&s?Object.defineProperty(t.prototype,o,{get(){return((t,e)=>c(t).L.get(e))(this,o)},set(t){((t,e,n,l)=>{const o=c(this),s=o.M,i=o.L.get(e),r=o.t;if(!((n=((t,e)=>null!=t&&"object"!=typeof t&&"function"!=typeof t?4&e?"false"!==t&&(""===t||!!t):2&e?parseFloat(t):1&e?String(t):t:t)(n,l.R[e][0]))===i||8&r&&void 0!==i)&&(o.L.set(e,n),o.o)){if(l.O&&1==(9&r)){const t=l.O[e];t&&t.forEach(t=>{try{o.o[t].call(o.o,n,i,e)}catch(t){f(t)}})}2==(22&r)&&it(s,o,l,!1)}})(0,o,t,e)},configurable:!0,enumerable:!0}):n&&64&s&&Object.defineProperty(t.prototype,o,{value(...t){const e=c(this);return e.U.then(()=>e.o[o](...t))}})}),n){const n=new Map;t.prototype.attributeChangedCallback=function(t,e,l){const o=n.get(t);this[o]=(null!==l||"boolean"!=typeof this[o])&&l},t.observedAttributes=o.filter(([t,e])=>15&e[0]).map(([t,l])=>{const o=l[1]||t;return n.set(o,t),512&l[0]&&e.j.push([t,o]),o})}}return t},ft=async(t,e,n,l,o)=>{if(0==(256&e.t)){e.t|=256,(o=await(t=>__sc_import_calcite(`./${t.C}.entry.js`).then(e=>e[t.v.replace(/-/g,"_")],f))(n)).isProxied||(n.O=o.watchers,at(o,n,0,1),o.isProxied=!0),e.t|=8;try{new o(e)}catch(t){f(t)}if(e.t&=-9,ut(e.o),!o.isStyleRegistered&&o.style){let t=o.style,e=M(n.v);8&n.t&&(t=await __sc_import_calcite("./p-549b16dd.js").then(n=>n.scopeCss(t,e,!1))),((t,e)=>{let n=u.get(t);s?(n=n||new CSSStyleSheet).replace(e):n=e,u.set(t,n)})(e,t),o.isStyleRegistered=!0}}const i=e.k;i&&!i["s-lr"]&&i["s-rc"]?i["s-rc"].push(()=>ft(t,e,n)):it(t,e,n,!0)},ut=t=>{st(t,"connectedCallback")},$t=(s,r={})=>{const a=[],u=r.exclude||[],p=e.head,d=t.customElements,h=p.querySelector("meta[charset]"),m=e.createElement("style");Object.assign(n,r),n.l=new URL(r.resourcesUrl||"/",e.baseURI).href,r.syncQueue&&(n.t|=4),s.forEach(t=>t[1].forEach(s=>{const r={t:s[0],v:s[1],R:s[2],T:s[3],j:[],O:{}};!l&&1&r.t&&(r.t|=8);const p=r.v;r.C=t[0],u.includes(p)||d.get(p)||(a.push(p),d.define(p,at(class extends HTMLElement{constructor(t){super(t),t=this,this["s-lr"]=!1,this["s-rc"]=[],(t=>{{const e={t:0,M:t};e.U=new Promise(t=>e.S=t),e.L=new Map,i.set(t,e)}})(t),1&r.t&&(l?t.attachShadow({mode:"open"}):"shadowRoot"in t||(t.shadowRoot=t))}connectedCallback(){((t,l)=>{if(0==(1&n.t)){const s=c(t);if(l.T&&(s.W=((t,e)=>{const s=l.T.map(([l,s,i])=>{const c=((t,e)=>16&e?t.parentElement:t)(t,l),r=((t,e)=>n=>t.o?t.o[e](n):t.U.then(()=>t.o[e](n)).catch(f))(e,i),a=(t=>o?{passive:0!=(1&t),capture:0!=(2&t)}:0!=(2&t))(l);return n.ael(c,s,r,a),()=>n.rel(c,s,r,a)});return()=>s.forEach(t=>t())})(t,s)),!(1&s.t)){let n;s.t|=1,n||(4&l.t||8&l.t)&&((t,n)=>{let l;l="",(n=t["s-cr"]=e.createComment(""))["s-cn"]=!0,t.insertBefore(n,t.firstChild)})(t);{let e=t;for(;e=e.parentNode||e.host;)if(e["s-init"]&&!e["s-lr"]){s.k=e,(e["s-al"]=e["s-al"]||new Set).add(t);break}}l.R&&Object.entries(l.R).forEach(([e,[n]])=>{if(31&n&&t.hasOwnProperty(e)){const n=t[e];delete t[e],t[e]=n}}),ft(t,s,l)}ut(s.o)}})(this,r)}disconnectedCallback(){(t=>{if(0==(1&n.t)){const e=c(t);e.W&&(e.W(),e.W=void 0),$&&$.removeHost(t),st(e.o,"disconnectedCallback")}})(this)}"s-init"(){const t=c(this);t.o&&rt(this,t)}"s-hmr"(t){}forceUpdate(){it(this,c(this),r,!1)}componentOnReady(){return c(this).U}},r,1,0)))})),m.innerHTML=a+"{visibility:hidden}.hydrated{visibility:inherit}",m.setAttribute("data-styles",""),p.insertBefore(m,h?h.nextSibling:p.firstChild)},pt=(t,e,n)=>{const l=dt(t);return{emit:t=>l.dispatchEvent(new CustomEvent(e,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:t}))}},dt=t=>c(t).M;export{R as a,$t as b,S as c,C as d,r as e,pt as f,E as g,dt as h}; \ No newline at end of file diff --git a/dist/calcite/p-7889326c.system.js b/dist/calcite/p-7889326c.system.js new file mode 100644 index 00000000000..c9f0aa7268b --- /dev/null +++ b/dist/calcite/p-7889326c.system.js @@ -0,0 +1 @@ +System.register([],function(){"use strict";return{execute:function(){if(function(){var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);return e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e),!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return!(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var c=a.localName;if("link"===c&&"import"===a.getAttribute("rel")){if((r=a.import)instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}if("template"===c){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n)}r=r.firstChild?r.firstChild:o(t,r)}}function r(t,e,n){t[e]=n}function a(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1}function c(t,e){t.b=!0,t.c.push(e)}function l(t,e){t.b&&i(e,function(e){return s(t,e)})}function s(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;nnull)}connectedCallback(){null!=this.subscribe&&(this.unsubscribe=this.subscribe(this.el,"context"))}disconnectedCallback(){null!=this.unsubscribe&&this.unsubscribe()}render(){return this.renderer(Object.assign({},this.context))}get el(){return e(this)}}export{t as context_consumer}; \ No newline at end of file diff --git a/dist/calcite/p-df79bf9d.system.js b/dist/calcite/p-df79bf9d.system.js new file mode 100644 index 00000000000..4a67e39dc76 --- /dev/null +++ b/dist/calcite/p-df79bf9d.system.js @@ -0,0 +1 @@ +System.register(["./p-5b1e6c1f.system.js"],function(){"use strict";var e,t;return{setters:[function(a){e=a.a,t=a.b}],execute:function(){e().then(function(e){return t([["p-258l18yq.system",[[1,"calcite-alert",{currentAlert:[1,"current-alert"],dismiss:[4],icon:[4],id:[1],queueLength:[2,"queue-length"],color:[513],theme:[513],duration:[513],isActive:[32],close:[64]}],[1,"calcite-alerts",{id:[1],currentAlert:[32],isActive:[32],queue:[32],open:[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{isActive:[4,"is-active"],text:[1]}],[1,"calcite-modal",{first:[1],middle:[1],last:[1]}],[1,"calcite-tab",{id:[1537],tab:[1537],isActive:[1540,"is-active"],labeledBy:[32],getTabIndex:[64],registerLabeledBy:[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{id:[1537],selectedTab:[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{id:[1537],tab:[1537],isActive:[1540,"is-active"],controls:[32],getTabIndex:[64],setControledBy:[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{theme:[513],tabs:[32],tabTitles:[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["p-s1sy5kvf.system",[[0,"context-consumer",{context:[16],renderer:[16],subscribe:[16],unsubscribe:[32]}]]]],{resourcesUrl:e})})}}}); \ No newline at end of file diff --git a/dist/calcite/p-f57d4852.system.js b/dist/calcite/p-f57d4852.system.js new file mode 100644 index 00000000000..f9e5d5b1961 --- /dev/null +++ b/dist/calcite/p-f57d4852.system.js @@ -0,0 +1 @@ +System.register([],function(){"use strict";return{execute:function(){var t=function(){this.start=0,this.end=0,this.previous=null,this.parent=null,this.rules=null,this.parsedCssText="",this.cssText="",this.atRule=!1,this.type=0,this.keyframesName="",this.selector="",this.parsedSelector=""};var e={STYLE_RULE:1,KEYFRAMES_RULE:7,MEDIA_RULE:4,MIXIN_RULE:1e3},r="{",n="}",s={comments:/\/\*[^*]*\*+([^\/*][^*]*\*+)*\//gim,port:/@import[^;]*;/gim,customProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim,mixinProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim,mixinApply:/@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim,varApply:/[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim,keyframesRule:/^@[^\s]*keyframes/,multipleSpaces:/\s+/g},i="--",o="@media",a="@";function c(t,e,r){t.lastIndex=0;var n=e.substring(r).match(t);if(n){var s=r+n.index;return{start:s,end:s+n[0].length}}return null}var u=/\bvar\(/,l=/\B--[\w-]+\s*:/,p=/\/\*[^*]*\*+([^\/*][^*]*\*+)*\//gim,f=/^[\t ]+\n/gm;function h(t,e,r){var n=function(t,e){var r=c(u,t,e);if(!r)return null;var n=function(t){for(var e=0,n=r.start;n0?o.join(",").trim():void 0}}(t,r);if(!n)return e.push(t.substring(r,t.length)),t.length;var s=n.propName,i=null!=n.fallback?g(n.fallback):void 0;return e.push(t.substring(r,n.start),function(t){return function(e,r,n){return t[s]?t[s]:n?v(n,t):""}(0,0,i)}),n.end}function v(t,e){for(var r="",n=0;n0&&t.parsedSelector.split(",").forEach(function(t){t=t.trim(),n.push({selector:t,declarations:e,specificity:1,nu:r})}),r++}),n}var S="!important",E=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function b(t){var e=(t=t.replace(/\s+/gim," ").trim()).endsWith(S);return e&&(t=t.substr(0,t.length-S.length).trim()),{value:t,important:e}}function M(t){var e=[];return t.forEach(function(t){e.push.apply(e,t.selectors)}),e}function L(c){var u,l=function t(r,n){var c=n.substring(r.start,r.end-1);if(r.parsedCssText=r.cssText=c.trim(),r.parent){c=(c=(c=(c=n.substring(r.previous?r.previous.end:r.parent.start,r.start-1)).replace(/\\([0-9a-f]{1,6})\s/gi,function(){for(var t=arguments[1],e=6-t.length;e--;)t="0"+t;return"\\"+t})).replace(s.multipleSpaces," ")).substring(c.lastIndexOf(";")+1);var u=r.parsedSelector=r.selector=c.trim();r.atRule=0===u.indexOf(a),r.atRule?0===u.indexOf(o)?r.type=e.MEDIA_RULE:u.match(s.keyframesRule)&&(r.type=e.KEYFRAMES_RULE,r.keyframesName=r.selector.split(s.multipleSpaces).pop()):r.type=0===u.indexOf(i)?e.MIXIN_RULE:e.STYLE_RULE}var l=r.rules;if(l)for(var p=0,f=l.length,h=void 0;p1}}function x(t,e){var r=L(e.innerHTML);r.styleEl=e,t.push(r)}function R(t,e,r){var n;return n="."+r,t.replace(new RegExp("\\."+e,"g"),n)}function T(t,e,r){var n=r.href;return fetch(n).then(function(t){return t.text()}).then(function(s){if(((o=s).indexOf("var(")>-1||w.test(o))&&r.parentNode){(function(t){return I.lastIndex=0,I.test(t)})(s)&&(s=function(t){var e=n.replace(/[^\/]*$/,"");return t.replace(I,function(t,r){return t.replace(r,e+r)})}(s));var i=t.createElement("style");i.innerHTML=s,x(e,i),r.parentNode.insertBefore(i,r),r.remove()}var o}).catch(function(t){console.error(t)})}var w=/[\s;{]--[-a-zA-Z0-9]+\s*:/m,I=/url[\s]*\([\s]*['"]?(?![http|\/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim,k=function(){function t(t,e){this.win=t,this.doc=e,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map}return t.prototype.initShim=function(){var t=this;return new Promise(function(e){t.win.requestAnimationFrame(function(){var r,n;(r=t.doc,n=t.globalScopes,function(t,e){for(var r=[],n=t.querySelectorAll('link[rel="stylesheet"][href]'),s=0;s{let e=new Map,i={currentAlert:"",queueLength:0};const s=(t,e)=>{Array.isArray(t)?[...t].forEach(t=>{e[t]=i[t]}):e[t]=Object.assign({},i)},a=(t,i)=>(e.has(t)||(e.set(t,i),s(i,t)),()=>{e.has(t)&&e.delete(t)});return{Provider:({state:t},a)=>(i=t,e.forEach(s),a),Consumer:(e,i)=>((e,i)=>t("context-consumer",{subscribe:e,renderer:i}))(a,i[0]),injectProps:(t,i)=>{const s=t.prototype,l=s.connectedCallback,r=s.disconnectedCallback;s.connectedCallback=function(){if(a(this,i),l)return l.call(this)},s.disconnectedCallback=function(){e.delete(this),r&&r.call(this)}}}})();class o{constructor(t){e(this,t),this.currentAlert="",this.dismiss=!1,this.icon=!1,this.id="1",this.queueLength=0,this.color="blue",this.theme=null,this.duration=this.dismiss?"medium":null,this.isActive=this.id===this.currentAlert,this.alertClose=i(this,"alertClose",7),this.alertOpen=i(this,"alertOpen",7)}async close(){this.isActive&&(this.isActive=!1,this.alertClose.emit(this.id))}componentWillUpdate(){this.isActive=this.currentAlert===this.id,this.isActive&&this.alertOpen.emit(this.id),this.isActive&&this.dismiss&&setTimeout(()=>{this.close()},"fast"===this.duration?6e3:"slow"===this.duration?14e3:1e4)}setIcon(){return t("div",{class:"alert-icon"},t("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24",width:"24",viewBox:"0 0 24 24"},t("path",{d:"green"===this.color?l:"red"===this.color||"yellow"===this.color?r:c})))}render(){const e=t("button",{class:"alert-close","aria-label":"close",onClick:()=>this.close()},t("svg",{xmlns:"http://www.w3.org/2000/svg",height:"32",width:"32",viewBox:"0 0 32 32"},t("path",{d:n}))),i=this.dismiss?"":e,a=this.icon?this.setIcon():"",l=t("div",{class:`${this.queueLength>0?"is-active ":""}alert-count`},"+",this.queueLength>0?this.queueLength:1),r=this.isActive&&this.dismiss?t("div",{class:"alert-dismiss"}):"";return t(s,{theme:this.theme,"is-active":!!this.isActive,duration:this.duration},a,t("div",{class:"alert-content"},t("slot",{name:"alert-title"}),t("slot",{name:"alert-message"}),t("slot",{name:"alert-link"})),l,i,r)}get el(){return a(this)}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:relative;-ms-flex-pack:center;justify-content:center;right:0;left:0;margin-right:auto;margin-left:auto;z-index:100;width:50em;max-width:90%;border-radius:2px;background-color:#fff;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,.15);box-shadow:0 0 12px 0 rgba(0,0,0,.15);height:0;opacity:0;overflow:visible;display:-ms-flexbox;display:flex;border-top:3px solid;-webkit-transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;-webkit-transform:translate3d(0,1.5rem,0);transform:translate3d(0,1.5rem,0);pointer-events:none;border-width:0}\@media only screen and (max-width:600px){:host{max-width:100%;border-radius:2px 2px 0 0;-webkit-box-shadow:0 -6px 12px 0 rgba(0,0,0,.15);box-shadow:0 -6px 12px 0 rgba(0,0,0,.15)}}:host([is-active]){visibility:visible;border-width:3px;opacity:1;height:100%;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translateZ(0);transform:translateZ(0);pointer-events:auto}:host slot[name=alert-title]::slotted(div){display:block;font-weight:500;font-size:16px}:host slot[name=alert-link]::slotted(a){display:inline-block;font-size:15px;color:#007ac2}:host slot[name=alert-message]::slotted(div){font-size:15px;color:#555;display:inline;-webkit-margin-end:.75rem;margin-inline-end:.75rem}:host([theme=dark]){background-color:#2b2b2b}:host([theme=dark]) slot[name=alert-title]::slotted(div){color:#f8f8f8}:host([theme=dark]) slot[name=alert-message]::slotted(div){color:#f3f3f3}.alert-content{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;word-wrap:break-word;-webkit-padding-before:.75rem;padding-block-start:.75rem;-webkit-padding-after:.75rem;padding-block-end:.75rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}\@media only screen and (max-width:600px){.alert-content{padding:1.5rem}}.alert-content svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-content:first-of-type{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}\@media only screen and (max-width:600px){.alert-content{-webkit-padding-before:1.5rem;padding-block-start:1.5rem;-webkit-padding-after:1.5rem;padding-block-end:1.5rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}}.alert-icon{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}\@media only screen and (max-width:600px){.alert-icon{padding:1.5rem}}.alert-icon svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-close{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-appearance:none;background-color:transparent;border:none;outline:none;cursor:pointer;border-radius:0 0 2px 0}\@media only screen and (max-width:600px){.alert-close{padding:1.5rem}}.alert-close svg{position:relative;vertical-align:top;height:16px;width:16px;fill:#151515}.alert-close:focus,.alert-close:hover{background-color:#f3f3f3}.alert-close:active{background-color:#eaeaea}.alert-close:last-child{border-radius:0 0 2px 0}:host([dir=rtl]) .alert-close:last-child{border-radius:0 0 0 2px}\@media only screen and (max-width:600px){.alert-close{border-radius:0}}:host([theme=dark]) .alert-close svg{fill:#d4d4d4}:host([theme=dark]) .alert-close:focus,:host([theme=dark]) .alert-close:hover{background-color:#202020}:host([theme=dark]) .alert-close:active{background-color:#151515}.alert-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-transition:all .15s ease-in;transition:all .15s ease-in;width:0;font-size:14px;visibility:hidden;padding:0;font-weight:500;text-align:center;background-color:transparent;color:#757575;opacity:0;border-left:1px solid transparent;border-right:1px solid transparent;cursor:default}.alert-count.is-active{visibility:visible;-webkit-transition-delay:.3s;transition-delay:.3s;opacity:1;padding:0 .375rem;width:3rem;border-left:1px solid #f3f3f3;border-right:1px solid #f3f3f3}.alert-count.is-active:last-child{border-right-color:transparent}\@media only screen and (max-width:600px){.alert-count{border-radius:0}}:host([theme=dark]) .alert-count{color:#d4d4d4}:host([theme=dark]) .alert-count.is-active{border-left:1px solid #202020;border-right:1px solid #202020}.alert-dismiss{left:0;top:0;z-index:101}.alert-dismiss,.alert-dismiss:after{display:block;position:absolute;right:0;height:3px}.alert-dismiss:after{top:-3px;border-radius:2px 2px 0 0;content:\"\";width:50%;background-color:hsla(0,0%,100%,.6);-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;z-index:200}:host([theme=dark]) .alert-dismiss:after{background-color:rgba(43,43,43,.6)}:host([duration=fast]) .alert-dismiss:after{-webkit-animation:dismissProgress 6s linear;animation:dismissProgress 6s linear}:host([duration=medium]) .alert-dismiss:after{-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear}:host([duration=slow]) .alert-dismiss:after{-webkit-animation:dismissProgress 14s linear;animation:dismissProgress 14s linear}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([color=blue]){border-top-color:#007ac2}:host([color=blue]) .alert-icon svg{fill:#007ac2}:host([color=red]){border-top-color:#d83020}:host([color=red]) .alert-icon svg{fill:#d83020}:host([color=yellow]){border-top-color:#edd317}:host([color=yellow]) .alert-icon svg{fill:#edd317}:host([color=green]){border-top-color:#35ac46}:host([color=green]) .alert-icon svg{fill:#35ac46}"}}h.injectProps(o,["currentAlert","queueLength"]);class u{constructor(t){e(this,t),this.id="1",this.currentAlert="",this.isActive=!1,this.queue=[],this.alertsClose=i(this,"alertsClose",7),this.alertsOpen=i(this,"alertsOpen",7)}async open(t){this.queue.includes(t)||(this.isActive=!0,this.currentAlert=t,this.queue.push(t),this.alertsOpen.emit({id:this.id,currentAlert:this.currentAlert,queue:this.queue}))}updateQueue(t){this.queue.includes(t.detail)&&(this.queue=this.queue.filter(e=>e!==t.detail)),this.queue.length<1&&setTimeout(()=>{this.isActive=!1},300),this.alertsClose.emit({id:this.id,currentAlert:this.currentAlert,queue:this.queue})}componentWillUpdate(){this.currentAlert=this.queue.length>0?this.queue[0]:""}render(){return t(s,{"is-active":!!this.isActive},t(h.Provider,{state:{currentAlert:this.currentAlert,queueLength:this.queue.length>=2?this.queue.length-1:0}},t("slot",null)))}get el(){return a(this)}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:fixed;visibility:hidden;opacity:0;left:0;right:0;bottom:1.5rem;height:0;z-index:101;pointer-events:none;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-transition-delay:.3s;transition-delay:.3s}\@media only screen and (max-width:600px){:host{bottom:0}}:host([is-active]){height:auto;visibility:visible;opacity:1}"}}class d{constructor(t){e(this,t),this.isActive=!1,this.text="Loading..."}render(){return t(s,{"is-active":!!this.isActive},t("div",{class:"loader-bars"}),t("div",{class:"loader-text"},this.text))}get el(){return a(this)}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host .loader-bars,:host .loader-bars:after,:host .loader-bars:before{background:#007ac2;-webkit-animation:load .8s ease-in-out infinite;animation:load .8s ease-in-out infinite;width:.85rem;height:2rem}:host .loader-bars:after,:host .loader-bars:before{position:absolute;top:0;content:\"\"}:host{position:relative;display:none;padding-bottom:4.5rem;padding-top:4.5rem}:host([is-active]){display:block}:host .loader-bars{text-indent:-9999em;margin:auto;position:absolute;right:calc(50% - .425rem);font-size:11px;-webkit-animation-delay:.16s;animation-delay:.16s}:host .loader-bars:before{left:-1.25rem}:host .loader-bars:after{left:1.25rem;-webkit-animation-delay:.32s;animation-delay:.32s}:host .loader-text{padding-top:4rem;text-align:center}\@-webkit-keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}\@keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}"}}class b{constructor(t){e(this,t)}getText(){return(this.first||"")+((t=this.middle)?` ${t}`:"")+((e=this.last)?` ${e}`:"");var t,e}render(){return t("div",{class:"example-class"},"Hello, World! I'm ",this.getText())}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.example-class{padding:1.5rem;color:#d83020;-webkit-box-shadow:0 0 16px 0 rgba(0,0,0,.05);box-shadow:0 0 16px 0 rgba(0,0,0,.05);border:1px solid #007ac2}"}}function g(t){for(var e="",i=0;i{this.isActive=e===t.detail.tab})}componentDidLoad(){this.getTabIndex().then(t=>{this.calciteRegisterTab.emit({id:this.id,index:t})})}async getTabIndex(){return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab"),this.el))}async registerLabeledBy(t){this.labeledBy=t}render(){return t(s,{"aria-labeledby":this.labeledBy,"aria-expanded":this.isActive?"true":"false",role:"tabpanel"},t("section",null,t("slot",null)))}get el(){return a(this)}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([is-active]) section{display:block}section{display:none}"}}class A{constructor(t){e(this,t),this.id=`calite-tab-nav-${T()}`,this.selectedTab=0,this.calciteTabChange=i(this,"calciteTabChange",7)}selectedTabChanged(){this.calciteTabChange.emit({tab:this.selectedTab})}focusPreviousTabHandler(t){const e=this.el.parentElement.querySelectorAll("calcite-tab-title");(e[this.getIndexOfTabTitle(t.target)-1]||e[e.length-1]).focus()}focusNextTabHandler(t){const e=this.el.parentElement.querySelectorAll("calcite-tab-title");(e[this.getIndexOfTabTitle(t.target)+1]||e[0]).focus()}tabTitleRegistationHandler(t){t.target.setControledBy(this.id)}activateTabHandler(t){this.selectedTab=t.detail.tab?t.detail.tab:this.getIndexOfTabTitle(t.target)}getIndexOfTabTitle(t){return[...this.el.parentElement.querySelectorAll("calcite-tab-title")].indexOf(t)}componentWillLoad(){this.selectedTabChanged()}render(){return t(s,{role:"tablist"},t("nav",{class:"tab-nav"},t("slot",null)))}get el(){return a(this)}static get watchers(){return{selectedTab:["selectedTabChanged"]}}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.tab-nav{display:-ms-flexbox;display:flex;padding:.5rem 0}::slotted(calcite-tab-title){margin-right:1.25rem}:host([dir=rtl]) ::slotted(calcite-tab-title){margin-right:0;margin-left:1.25rem}"}}const m=13,L=32,p=37,y=39;class E{constructor(t){e(this,t),this.id=`calite-tab-title-${T()}`,this.isActive=!1,this.calciteActivateTab=i(this,"calciteActivateTab",7),this.calciteFocusNextTab=i(this,"calciteFocusNextTab",7),this.calciteFocusPreviousTab=i(this,"calciteFocusPreviousTab",7),this.calciteRegisterTabTitle=i(this,"calciteRegisterTabTitle",7)}tabChangeHand(t){this.tab?this.isActive=this.tab===t.detail.tab:this.getTabIndex().then(e=>{this.isActive=e===t.detail.tab})}onClick(){this.calciteActivateTab.emit({tab:this.tab})}keyDownHandler(t){switch(t.keyCode){case L:case m:this.onClick();break;case y:this.calciteFocusNextTab.emit();break;case p:this.calciteFocusPreviousTab.emit()}}componentDidLoad(){this.getTabIndex().then(t=>{this.calciteRegisterTabTitle.emit({id:this.id,index:t})})}async getTabIndex(){return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"),this.el))}async setControledBy(t){this.controls=t}render(){return t(s,{"aria-controls":this.controls,"aria-expanded":this.isActive?"true":"false",role:"tab",tabindex:"0"},t("a",null,t("slot",null)))}get el(){return a(this)}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{-ms-flex:0 1 auto;flex:0 1 auto;outline:none}:host(:active) a,:host(:focus) a,:host(:hover) a{outline:none;text-decoration:none;color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-hover)}:host([is-active]) a{color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-active)}a{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:.875rem;line-height:1.5;padding:.5rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:3px solid transparent;cursor:pointer;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;color:var(--calcite-tabs-color);outline:none}"}}class x{constructor(t){e(this,t),this.tabs={},this.tabTitles={},this.theme="light"}tabTitleRegistationHandler(t){const{index:e,id:i}=t.detail;this.tabTitles[e]={id:i,title:t.target},this.tabs[e]&&this.tabs[e].tab.registerLabeledBy(i)}tabRegistationHandler(t){const{index:e,id:i}=t.detail;this.tabs[e]={id:i,tab:t.target},this.tabTitles[e]&&this.tabs[e].tab.registerLabeledBy(this.tabTitles[e].id)}render(){return t("div",null,t("slot",{name:"tab-nav"}),t("section",{class:"tab-contents"},t("slot",null)))}static get style(){return"body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{--calcite-tabs-color:#2b2b2b;--calcite-tabs-border:#eaeaea;--calcite-tabs-border-hover:#dfdfdf;--calcite-tabs-color-active:#151515;--calcite-tabs-border-active:#007ac2}:host([theme=dark]){--calcite-tabs-color:#f3f3f3;--calcite-tabs-border:#404040;--calcite-tabs-border-hover:#757575;--calcite-tabs-color-active:#f8f8f8;--calcite-tabs-border-active:#fff}.tab-contents{margin-top:1px;border-top:1px solid var(--calcite-tabs-border)}"}}export{o as calcite_alert,u as calcite_alerts,d as calcite_loader,b as calcite_modal,v as calcite_tab,A as calcite_tab_nav,E as calcite_tab_title,x as calcite_tabs}; \ No newline at end of file diff --git a/dist/cjs/calcite-15323450.js b/dist/cjs/calcite-15323450.js new file mode 100644 index 00000000000..de3bed9b11b --- /dev/null +++ b/dist/cjs/calcite-15323450.js @@ -0,0 +1,1657 @@ +'use strict'; + +const BUILD = {"allRenderFn":true,"cmpDidLoad":true,"cmpDidUnload":false,"cmpDidUpdate":false,"cmpDidRender":false,"cmpWillLoad":true,"cmpWillUpdate":true,"cmpWillRender":false,"connectedCallback":true,"disconnectedCallback":true,"element":false,"event":true,"hasRenderFn":true,"lifecycle":true,"hostListener":true,"hostListenerTargetWindow":false,"hostListenerTargetDocument":false,"hostListenerTargetBody":false,"hostListenerTargetParent":true,"hostListenerTarget":true,"member":true,"method":true,"mode":false,"noVdomRender":false,"observeAttribute":true,"prop":true,"propMutable":true,"reflect":true,"scoped":false,"shadowDom":true,"slot":true,"slotRelocation":true,"state":true,"style":true,"svg":true,"updatable":true,"vdomAttribute":true,"vdomClass":true,"vdomFunctional":true,"vdomKey":true,"vdomListener":true,"vdomRef":true,"vdomRender":true,"vdomStyle":true,"vdomText":true,"watchCallback":true,"taskQueue":true,"lazyLoad":true,"hydrateServerSide":false,"cssVarShim":true,"hydrateClientSide":false,"isDebug":false,"isDev":false,"lifecycleDOMEvents":false,"profile":false,"hotModuleReplacement":false,"constructableCSS":true,"cssAnnotations":true}; +const NAMESPACE = 'calcite'; + +const win = window; +const doc = document; +const plt = { + $flags$: 0, + $resourcesUrl$: '', + raf: (h) => requestAnimationFrame(h), + ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts), + rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts), +}; +const supportsShadowDom = !!doc.documentElement.attachShadow; +const supportsListenerOptions = /*@__PURE__*/ (() => { + let supportsListenerOptions = false; + try { + doc.addEventListener('e', null, Object.defineProperty({}, 'passive', { + get() { supportsListenerOptions = true; } + })); + } + catch (e) { } + return supportsListenerOptions; +})(); +const supportsConstructibleStylesheets = (() => { + try { + new CSSStyleSheet(); + return true; + } + catch (e) { } + return false; +})(); + +const hostRefs = new WeakMap(); +const getHostRef = (ref) => hostRefs.get(ref); +const registerInstance = (lazyInstance, hostRef) => hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef); +const registerHost = (elm) => { + // TODO: it's so ugly, but minifies really well + { + const hostRef = { + $flags$: 0, + $hostElement$: elm + }; + hostRef.$onReadyPromise$ = new Promise(r => hostRef.$onReadyResolve$ = r); + { + hostRef.$instanceValues$ = new Map(); + } + return hostRefs.set(elm, hostRef); + } +}; +const isMemberInElement = (elm, memberName) => memberName in elm; + +const consoleError = (e) => console.error(e); + +const loadModule = (cmpMeta, hostRef, hmrVersionId) => { + // loadModuleImport + const bundleId = cmpMeta.$lazyBundleIds$; + return Promise.resolve(require( + /* webpackInclude: /\.entry\.js$/ */ + /* webpackExclude: /\.(system|cjs)\.entry\.js$/ */ + /* webpackMode: "lazy" */ + `./${bundleId}.entry.js${''}`)).then(importedModule => importedModule[cmpMeta.$tagName$.replace(/-/g, '_')], consoleError); +}; + +const styles = new Map(); +const cssVarShim = win.__stencil_cssshim; + +let queueCongestion = 0; +let queuePending = false; +const queueDomReads = []; +const queueDomWrites = []; +const queueDomWritesLow = []; +const queueTask = (queue) => (cb) => { + // queue dom reads + queue.push(cb); + if (!queuePending) { + queuePending = true; + plt.raf(flush); + } +}; +const consume = (queue) => { + for (let i = 0; i < queue.length; i++) { + try { + queue[i](performance.now()); + } + catch (e) { + consoleError(e); + } + } + queue.length = 0; +}; +const consumeTimeout = (queue, timeout) => { + let i = 0; + let ts = 0; + while (i < queue.length && (ts = performance.now()) < timeout) { + try { + queue[i++](ts); + } + catch (e) { + consoleError(e); + } + } + if (i === queue.length) { + queue.length = 0; + } + else if (i !== 0) { + queue.splice(0, i); + } +}; +const flush = () => { + queueCongestion++; + // always force a bunch of medium callbacks to run, but still have + // a throttle on how many can run in a certain time + // DOM READS!!! + consume(queueDomReads); + const timeout = (plt.$flags$ & 6 /* queueMask */) === 2 /* appLoaded */ + ? performance.now() + (7 * Math.ceil(queueCongestion * (1.0 / 22.0))) + : Infinity; + // DOM WRITES!!! + consumeTimeout(queueDomWrites, timeout); + consumeTimeout(queueDomWritesLow, timeout); + if (queueDomWrites.length > 0) { + queueDomWritesLow.push(...queueDomWrites); + queueDomWrites.length = 0; + } + if (queuePending = ((queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length) > 0)) { + // still more to do yet, but we've run out of time + // let's let this thing cool off and try again in the next tick + plt.raf(flush); + } + else { + queueCongestion = 0; + } +}; +const writeTask = /*@__PURE__*/ queueTask(queueDomWrites); + +/** + * Default style mode id + */ +/** + * Reusable empty obj/array + * Don't add values to these!! + */ +const EMPTY_OBJ = {}; +/** + * Namespaces + */ +const SVG_NS = 'http://www.w3.org/2000/svg'; + +const isDef = (v) => v != null; +const toLowerCase = (str) => str.toLowerCase(); + +function getDynamicImportFunction(namespace) { + return `__sc_import_${namespace.replace(/\s|-/g, '_')}`; +} + +const patchEsm = () => { + // @ts-ignore + if (!(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)'))) { + // @ts-ignore + return Promise.resolve(require('./css-shim-229ebf7a-56ba83b5.js')); + } + return Promise.resolve(); +}; +const patchBrowser = async () => { + // @ts-ignore + const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('calcite-15323450.js', document.baseURI).href)); + if (importMeta !== '') { + return Promise.resolve(new URL('.', importMeta).href); + } + else { + const scriptElm = Array.from(doc.querySelectorAll('script')).find(s => (s.src.includes(`/${NAMESPACE}.esm.js`) || + s.getAttribute('data-namespace') === NAMESPACE)); + const resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, doc.baseURI)); + patchDynamicImport(resourcesUrl.href); + if (!window.customElements) { + // @ts-ignore + await Promise.resolve(require('./dom-7eb7509a-4c879aea.js')); + } + return resourcesUrl.href; + } +}; +const patchDynamicImport = (base) => { + const importFunctionName = getDynamicImportFunction(NAMESPACE); + try { + win[importFunctionName] = new Function('w', 'return import(w);'); + } + catch (e) { + const moduleMap = new Map(); + win[importFunctionName] = (src) => { + const url = new URL(src, base).href; + let mod = moduleMap.get(url); + if (!mod) { + const script = doc.createElement('script'); + script.type = 'module'; + script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], { type: 'application/javascript' })); + mod = new Promise(resolve => { + script.onload = () => { + resolve(win[importFunctionName].m); + script.remove(); + }; + }); + moduleMap.set(url, mod); + doc.head.appendChild(script); + } + return mod; + }; + } +}; +const HYDRATED_CLASS = 'hydrated'; +const XLINK_NS = 'http://www.w3.org/1999/xlink'; + +const rootAppliedStyles = new WeakMap(); +const registerStyle = (scopeId, cssText) => { + let style = styles.get(scopeId); + if (supportsConstructibleStylesheets) { + style = (style || new CSSStyleSheet()); + style.replace(cssText); + } + else { + style = cssText; + } + styles.set(scopeId, style); +}; +const addStyle = (styleContainerNode, tagName, mode, hostElm) => { + let scopeId = getScopeId(tagName, mode); + let style = styles.get(scopeId); + // if an element is NOT connected then getRootNode() will return the wrong root node + // so the fallback is to always use the document for the root node in those cases + styleContainerNode = (styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc); + if (style) { + if (typeof style === 'string') { + styleContainerNode = styleContainerNode.head || styleContainerNode; + let appliedStyles = rootAppliedStyles.get(styleContainerNode); + let styleElm; + if (!appliedStyles) { + rootAppliedStyles.set(styleContainerNode, appliedStyles = new Set()); + } + if (!appliedStyles.has(scopeId)) { + { + if (cssVarShim) { + styleElm = cssVarShim.createHostStyle(hostElm, scopeId, style); + const newScopeId = styleElm['s-sc']; + if (newScopeId) { + scopeId = newScopeId; + // we don't want to add this styleID to the appliedStyles Set + // since the cssVarShim might need to apply several different + // stylesheets for the same component + appliedStyles = null; + } + } + else { + styleElm = doc.createElement('style'); + styleElm.innerHTML = style; + } + styleContainerNode.appendChild(styleElm); + } + if (appliedStyles) { + appliedStyles.add(scopeId); + } + } + } + else if (!styleContainerNode.adoptedStyleSheets.includes(style)) { + styleContainerNode.adoptedStyleSheets = [ + ...styleContainerNode.adoptedStyleSheets, + style + ]; + } + } + return scopeId; +}; +const attachStyles = (elm, cmpMeta, mode) => { + const styleId = addStyle((supportsShadowDom && elm.shadowRoot) + ? elm.shadowRoot + : elm.getRootNode(), cmpMeta.$tagName$, mode, elm); + if (cmpMeta.$flags$ & 10 /* needsScopedEncapsulation */) { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + // DOM WRITE!! + elm['s-sc'] = styleId; + elm.classList.add(styleId + '-h'); + } +}; +const getScopeId = (tagName, mode) => 'sc-' + (tagName); + +/** + * Production h() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +const stack = []; +function h(nodeName, vnodeData) { + let children = null; + let lastSimple = false; + let simple = false; + let i = arguments.length; + let vkey; + let vname; + for (; i-- > 2;) { + stack.push(arguments[i]); + } + while (stack.length > 0) { + let child = stack.pop(); + if (child && child.pop !== undefined) { + for (i = child.length; i--;) { + stack.push(child[i]); + } + } + else { + if (typeof child === 'boolean') { + child = null; + } + if ((simple = typeof nodeName !== 'function')) { + if (child == null) { + child = ''; + } + else if (typeof child === 'number') { + child = String(child); + } + else if (typeof child !== 'string') { + simple = false; + } + } + if (simple && lastSimple) { + children[children.length - 1].$text$ += child; + } + else if (children === null) { + children = [simple ? { $flags$: 0, $text$: child } : child]; + } + else { + children.push(simple ? { $flags$: 0, $text$: child } : child); + } + lastSimple = simple; + } + } + { + if (vnodeData != null) { + // normalize class / classname attributes + if (vnodeData.className) { + vnodeData['class'] = vnodeData.className; + } + if (typeof vnodeData['class'] === 'object') { + for (i in vnodeData['class']) { + if (vnodeData['class'][i]) { + stack.push(i); + } + } + vnodeData['class'] = stack.join(' '); + stack.length = 0; + } + if (vnodeData.key != null) { + vkey = vnodeData.key; + } + if (vnodeData.name != null) { + vname = vnodeData.name; + } + } + } + if (typeof nodeName === 'function') { + // nodeName is a functional component + return nodeName(vnodeData, children || [], vdomFnUtils); + } + const vnode = { + $tag$: nodeName, + $children$: children, + $elm$: undefined, + $flags$: 0 + }; + { + vnode.$attrs$ = vnodeData; + } + { + vnode.$text$ = undefined; + } + { + vnode.$key$ = vkey; + } + { + vnode.$name$ = vname; + } + return vnode; +} +const Host = {}; +const vdomFnUtils = { + 'forEach': (children, cb) => children.map(convertToPublic).forEach(cb), + 'map': (children, cb) => children.map(convertToPublic).map(cb).map(convertToPrivate) +}; +const convertToPublic = (node) => { + return { + vattrs: node.$attrs$, + vchildren: node.$children$, + vkey: node.$key$, + vname: node.$name$, + vtag: node.$tag$, + vtext: node.$text$ + }; +}; +const convertToPrivate = (node) => { + return { + $flags$: 0, + $attrs$: node.vattrs, + $children$: node.vchildren, + $key$: node.vkey, + $name$: node.vname, + $tag$: node.vtag, + $text$: node.vtext + }; +}; + +/** + * Production setAccessor() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => { + if (oldValue === newValue) { + return; + } + if (memberName === 'class' && !isSvg) { + // Class + { + const oldList = parseClassList(oldValue); + const baseList = parseClassList(elm.className).filter(item => !oldList.includes(item)); + elm.className = baseList.concat(parseClassList(newValue).filter(item => !baseList.includes(item))).join(' '); + } + } + else if (memberName === 'style') { + // update style attribute, css properties and values + { + for (const prop in oldValue) { + if (!newValue || newValue[prop] == null) { + if (prop.includes('-')) { + elm.style.removeProperty(prop); + } + else { + elm.style[prop] = ''; + } + } + } + } + for (const prop in newValue) { + if (!oldValue || newValue[prop] !== oldValue[prop]) { + if (prop.includes('-')) { + elm.style.setProperty(prop, newValue[prop]); + } + else { + elm.style[prop] = newValue[prop]; + } + } + } + } + else if (memberName === 'key') ; + else if (memberName === 'ref') { + // minifier will clean this up + if (newValue) { + newValue(elm); + } + } + else if (memberName.startsWith('on') && !isMemberInElement(elm, memberName)) { + // Event Handlers + // so if the member name starts with "on" and the 3rd characters is + // a capital letter, and it's not already a member on the element, + // then we're assuming it's an event listener + if (isMemberInElement(elm, toLowerCase(memberName))) { + // standard event + // the JSX attribute could have been "onMouseOver" and the + // member name "onmouseover" is on the element's prototype + // so let's add the listener "mouseover", which is all lowercased + memberName = toLowerCase(memberName.substring(2)); + } + else { + // custom event + // the JSX attribute could have been "onMyCustomEvent" + // so let's trim off the "on" prefix and lowercase the first character + // and add the listener "myCustomEvent" + // except for the first character, we keep the event name case + memberName = toLowerCase(memberName[2]) + memberName.substring(3); + } + if (oldValue) { + plt.rel(elm, memberName, oldValue, false); + } + if (newValue) { + plt.ael(elm, memberName, newValue, false); + } + } + else { + // Set property if it exists and it's not a SVG + const isProp = isMemberInElement(elm, memberName); + const isComplex = ['object', 'function'].includes(typeof newValue); + if ((isProp || (isComplex && newValue !== null)) && !isSvg) { + try { + elm[memberName] = newValue == null && elm.tagName.indexOf('-') === -1 ? '' : newValue; + } + catch (e) { } + } + /** + * Need to manually update attribute if: + * - memberName is not an attribute + * - if we are rendering the host element in order to reflect attribute + * - if it's a SVG, since properties might not work in + * - if the newValue is null/undefined or 'false'. + */ + const isXlinkNs = isSvg && (memberName !== (memberName = memberName.replace(/^xlink\:?/, ''))) ? true : false; + if (newValue == null || newValue === false) { + if (isXlinkNs) { + elm.removeAttributeNS(XLINK_NS, toLowerCase(memberName)); + } + else { + elm.removeAttribute(memberName); + } + } + else if ((!isProp || (flags & 4 /* isHost */) || isSvg) && !isComplex) { + newValue = newValue === true ? '' : newValue.toString(); + if (isXlinkNs) { + elm.setAttributeNS(XLINK_NS, toLowerCase(memberName), newValue); + } + else { + elm.setAttribute(memberName, newValue); + } + } + } +}; +const parseClassList = (value) => (!value) ? [] : value.split(' '); + +const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => { + // if the element passed in is a shadow root, which is a document fragment + // then we want to be adding attrs/props to the shadow root's "host" element + // if it's not a shadow root, then we add attrs/props to the same element + const elm = (newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host) ? newVnode.$elm$.host : newVnode.$elm$; + const oldVnodeAttrs = (oldVnode && oldVnode.$attrs$) || EMPTY_OBJ; + const newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ; + { + // remove attributes no longer present on the vnode by setting them to undefined + for (memberName in oldVnodeAttrs) { + if (newVnodeAttrs[memberName] == null && oldVnodeAttrs[memberName] != null) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], undefined, isSvgMode, newVnode.$flags$); + } + } + } + // add new & update changed attributes + for (memberName in newVnodeAttrs) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$); + } +}; + +let scopeId; +let contentRef; +let hostTagName; +let useNativeShadowDom = false; +let checkSlotFallbackVisibility = false; +let checkSlotRelocate = false; +let isSvgMode = false; +const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => { + const newVNode = newParentVNode.$children$[childIndex]; + let i = 0; + let elm; + let childNode; + let oldVNode; + if (!useNativeShadowDom) { + // remember for later we need to check to relocate nodes + checkSlotRelocate = true; + if (newVNode.$tag$ === 'slot') { + if (scopeId) { + // scoped css needs to add its scoped id to the parent element + parentElm.classList.add(scopeId + '-s'); + } + if (!newVNode.$children$) { + // slot element does not have fallback content + // create an html comment we'll use to always reference + // where actual slot content should sit next to + newVNode.$flags$ |= 1 /* isSlotReference */; + } + else { + // slot element has fallback content + // still create an element that "mocks" the slot element + newVNode.$flags$ |= 2 /* isSlotFallback */; + } + } + } + if (isDef(newVNode.$text$)) { + // create text node + newVNode.$elm$ = doc.createTextNode(newVNode.$text$); + } + else if (newVNode.$flags$ & 1 /* isSlotReference */) { + // create a slot reference node + newVNode.$elm$ = doc.createTextNode(''); + } + else { + // create element + elm = newVNode.$elm$ = ((isSvgMode || newVNode.$tag$ === 'svg') + ? doc.createElementNS(SVG_NS, newVNode.$tag$) + : doc.createElement((newVNode.$flags$ & 2 /* isSlotFallback */) ? 'slot-fb' : newVNode.$tag$)); + { + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + // add css classes, attrs, props, listeners, etc. + { + updateElement(null, newVNode, isSvgMode); + } + if (isDef(scopeId) && elm['s-si'] !== scopeId) { + // if there is a scopeId and this is the initial render + // then let's add the scopeId as a css class + elm.classList.add((elm['s-si'] = scopeId)); + } + if (newVNode.$children$) { + for (i = 0; i < newVNode.$children$.length; ++i) { + // create the node + childNode = createElm(oldParentVNode, newVNode, i, elm); + // return node could have been null + if (childNode) { + // append our new node + elm.appendChild(childNode); + } + } + } + if (newVNode.$tag$ === 'svg') { + // Only reset the SVG context when we're exiting SVG element + isSvgMode = false; + } + } + { + newVNode.$elm$['s-hn'] = hostTagName; + if (newVNode.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) { + // remember the content reference comment + newVNode.$elm$['s-sr'] = true; + // remember the content reference comment + newVNode.$elm$['s-cr'] = contentRef; + // remember the slot name, or empty string for default slot + newVNode.$elm$['s-sn'] = newVNode.$name$ || ''; + // check if we've got an old vnode for this slot + oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex]; + if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) { + // we've got an old slot vnode and the wrapper is being replaced + // so let's move the old slot content back to it's original location + putBackInOriginalLocation(oldParentVNode.$elm$, false); + } + } + } + return newVNode.$elm$; +}; +const putBackInOriginalLocation = (parentElm, recursive) => { + plt.$flags$ |= 1 /* isTmpDisconnected */; + const oldSlotChildNodes = parentElm.childNodes; + for (let i = oldSlotChildNodes.length - 1; i >= 0; i--) { + const childNode = oldSlotChildNodes[i]; + if (childNode['s-hn'] !== hostTagName && childNode['s-ol']) { + // // this child node in the old element is from another component + // // remove this node from the old slot's parent + // childNode.remove(); + // and relocate it back to it's original location + parentReferenceNode(childNode).insertBefore(childNode, referenceNode(childNode)); + // remove the old original location comment entirely + // later on the patch function will know what to do + // and move this to the correct spot in need be + childNode['s-ol'].remove(); + childNode['s-ol'] = undefined; + checkSlotRelocate = true; + } + if (recursive) { + putBackInOriginalLocation(childNode, recursive); + } + } + plt.$flags$ &= ~1 /* isTmpDisconnected */; +}; +const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => { + let containerElm = ((parentElm['s-cr'] && parentElm['s-cr'].parentNode) || parentElm); + let childNode; + if (containerElm.shadowRoot && toLowerCase(containerElm.tagName) === hostTagName) { + containerElm = containerElm.shadowRoot; + } + for (; startIdx <= endIdx; ++startIdx) { + if (vnodes[startIdx]) { + childNode = createElm(null, parentVNode, startIdx, parentElm); + if (childNode) { + vnodes[startIdx].$elm$ = childNode; + containerElm.insertBefore(childNode, referenceNode(before)); + } + } + } +}; +const removeVnodes = (vnodes, startIdx, endIdx, elm) => { + for (; startIdx <= endIdx; ++startIdx) { + if (isDef(vnodes[startIdx])) { + elm = vnodes[startIdx].$elm$; + callNodeRefs(vnodes[startIdx], true); + { + // we're removing this element + // so it's possible we need to show slot fallback content now + checkSlotFallbackVisibility = true; + if (elm['s-ol']) { + // remove the original location comment + elm['s-ol'].remove(); + } + else { + // it's possible that child nodes of the node + // that's being removed are slot nodes + putBackInOriginalLocation(elm, true); + } + } + // remove the vnode's element from the dom + elm.remove(); + } + } +}; +const updateChildren = (parentElm, oldCh, newVNode, newCh) => { + let oldStartIdx = 0; + let newStartIdx = 0; + let idxInOld = 0; + let i = 0; + let oldEndIdx = oldCh.length - 1; + let oldStartVnode = oldCh[0]; + let oldEndVnode = oldCh[oldEndIdx]; + let newEndIdx = newCh.length - 1; + let newStartVnode = newCh[0]; + let newEndVnode = newCh[newEndIdx]; + let node; + let elmToMove; + while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) { + if (oldStartVnode == null) { + // Vnode might have been moved left + oldStartVnode = oldCh[++oldStartIdx]; + } + else if (oldEndVnode == null) { + oldEndVnode = oldCh[--oldEndIdx]; + } + else if (newStartVnode == null) { + newStartVnode = newCh[++newStartIdx]; + } + else if (newEndVnode == null) { + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newStartVnode)) { + patch(oldStartVnode, newStartVnode); + oldStartVnode = oldCh[++oldStartIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else if (isSameVnode(oldEndVnode, newEndVnode)) { + patch(oldEndVnode, newEndVnode); + oldEndVnode = oldCh[--oldEndIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newEndVnode)) { + // Vnode moved right + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false); + } + patch(oldStartVnode, newEndVnode); + parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling); + oldStartVnode = oldCh[++oldStartIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldEndVnode, newStartVnode)) { + // Vnode moved left + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false); + } + patch(oldEndVnode, newStartVnode); + parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$); + oldEndVnode = oldCh[--oldEndIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else { + // createKeyToOldIdx + idxInOld = -1; + { + for (i = oldStartIdx; i <= oldEndIdx; ++i) { + if (oldCh[i] && isDef(oldCh[i].$key$) && oldCh[i].$key$ === newStartVnode.$key$) { + idxInOld = i; + break; + } + } + } + if (idxInOld >= 0) { + elmToMove = oldCh[idxInOld]; + if (elmToMove.$tag$ !== newStartVnode.$tag$) { + node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld, parentElm); + } + else { + patch(elmToMove, newStartVnode); + oldCh[idxInOld] = undefined; + node = elmToMove.$elm$; + } + newStartVnode = newCh[++newStartIdx]; + } + else { + // new element + node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx, parentElm); + newStartVnode = newCh[++newStartIdx]; + } + if (node) { + { + parentReferenceNode(oldStartVnode.$elm$).insertBefore(node, referenceNode(oldStartVnode.$elm$)); + } + } + } + } + if (oldStartIdx > oldEndIdx) { + addVnodes(parentElm, (newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$), newVNode, newCh, newStartIdx, newEndIdx); + } + else if (newStartIdx > newEndIdx) { + removeVnodes(oldCh, oldStartIdx, oldEndIdx); + } +}; +const isSameVnode = (vnode1, vnode2) => { + // compare if two vnode to see if they're "technically" the same + // need to have the same element tag, and same key to be the same + if (vnode1.$tag$ === vnode2.$tag$) { + if (vnode1.$tag$ === 'slot') { + return vnode1.$name$ === vnode2.$name$; + } + { + return vnode1.$key$ === vnode2.$key$; + } + return true; + } + return false; +}; +const referenceNode = (node) => { + if (node && node['s-ol']) { + // this node was relocated to a new location in the dom + // because of some other component's slot + // but we still have an html comment in place of where + // it's original location was according to it's original vdom + return node['s-ol']; + } + return node; +}; +const parentReferenceNode = (node) => (node['s-ol'] ? node['s-ol'] : node).parentNode; +const patch = (oldVNode, newVNode) => { + const elm = newVNode.$elm$ = oldVNode.$elm$; + const oldChildren = oldVNode.$children$; + const newChildren = newVNode.$children$; + let defaultHolder; + { + // test if we're rendering an svg element, or still rendering nodes inside of one + // only add this to the when the compiler sees we're using an svg somewhere + isSvgMode = elm && + isDef(elm.parentNode) && + elm.ownerSVGElement !== undefined; + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + if (!isDef(newVNode.$text$)) { + // element node + { + if (newVNode.$tag$ === 'slot') ; + else { + // either this is the first render of an element OR it's an update + // AND we already know it's possible it could have changed + // this updates the element's css classes, attrs, props, listeners, etc. + updateElement(oldVNode, newVNode, isSvgMode); + } + } + if (isDef(oldChildren) && isDef(newChildren)) { + // looks like there's child vnodes for both the old and new vnodes + updateChildren(elm, oldChildren, newVNode, newChildren); + } + else if (isDef(newChildren)) { + // no old child vnodes, but there are new child vnodes to add + if (isDef(oldVNode.$text$)) { + // the old vnode was text, so be sure to clear it out + elm.textContent = ''; + } + // add the new vnode children + addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1); + } + else if (isDef(oldChildren)) { + // no new child vnodes, but there are old child vnodes to remove + removeVnodes(oldChildren, 0, oldChildren.length - 1); + } + } + else if (defaultHolder = elm['s-cr']) { + // this element has slotted content + defaultHolder.parentNode.textContent = newVNode.$text$; + } + else if (oldVNode.$text$ !== newVNode.$text$) { + // update the text content for the text only vnode + // and also only if the text is different than before + elm.textContent = newVNode.$text$; + } + { + // reset svgMode when svg node is fully patched + if (isSvgMode && 'svg' === newVNode.$tag$) { + isSvgMode = false; + } + } +}; +const updateFallbackSlotVisibility = (elm, childNode, childNodes, i, ilen, j, slotNameAttr, nodeType) => { + childNodes = elm.childNodes; + for (i = 0, ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode.nodeType === 1 /* ElementNode */) { + if (childNode['s-sr']) { + // this is a slot fallback node + // get the slot name for this slot reference node + slotNameAttr = childNode['s-sn']; + // by default always show a fallback slot node + // then hide it if there are other slots in the light dom + childNode.hidden = false; + for (j = 0; j < ilen; j++) { + if (childNodes[j]['s-hn'] !== childNode['s-hn']) { + // this sibling node is from a different component + nodeType = childNodes[j].nodeType; + if (slotNameAttr !== '') { + // this is a named fallback slot node + if (nodeType === 1 /* ElementNode */ && slotNameAttr === childNodes[j].getAttribute('slot')) { + childNode.hidden = true; + break; + } + } + else { + // this is a default fallback slot node + // any element or text node (with content) + // should hide the default fallback slot node + if (nodeType === 1 /* ElementNode */ || (nodeType === 3 /* TextNode */ && childNodes[j].textContent.trim() !== '')) { + childNode.hidden = true; + break; + } + } + } + } + } + // keep drilling down + updateFallbackSlotVisibility(childNode); + } + } +}; +const relocateNodes = []; +const relocateSlotContent = (elm) => { + // tslint:disable-next-line: prefer-const + let childNodes = elm.childNodes; + let ilen = childNodes.length; + let i = 0; + let j = 0; + let nodeType = 0; + let childNode; + let node; + let hostContentNodes; + let slotNameAttr; + for (ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode['s-sr'] && (node = childNode['s-cr'])) { + // first got the content reference comment node + // then we got it's parent, which is where all the host content is in now + hostContentNodes = node.parentNode.childNodes; + slotNameAttr = childNode['s-sn']; + for (j = hostContentNodes.length - 1; j >= 0; j--) { + node = hostContentNodes[j]; + if (!node['s-cn'] && !node['s-nr'] && node['s-hn'] !== childNode['s-hn']) { + // let's do some relocating to its new home + // but never relocate a content reference node + // that is suppose to always represent the original content location + nodeType = node.nodeType; + if (((nodeType === 3 /* TextNode */ || nodeType === 8 /* CommentNode */) && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === null && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === slotNameAttr)) { + // it's possible we've already decided to relocate this node + if (!relocateNodes.some(r => r.nodeToRelocate === node)) { + // made some changes to slots + // let's make sure we also double check + // fallbacks are correctly hidden or shown + checkSlotFallbackVisibility = true; + node['s-sn'] = slotNameAttr; + // add to our list of nodes to relocate + relocateNodes.push({ + slotRefNode: childNode, + nodeToRelocate: node + }); + } + } + } + } + } + if (childNode.nodeType === 1 /* ElementNode */) { + relocateSlotContent(childNode); + } + } +}; +const callNodeRefs = (vNode, isDestroy) => { + if (vNode) { + vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(isDestroy ? null : vNode.$elm$); + vNode.$children$ && vNode.$children$.forEach(vChild => { + callNodeRefs(vChild, isDestroy); + }); + } +}; +const isHost = (node) => { + return node && node.$tag$ === Host; +}; +const renderVdom = (hostElm, hostRef, cmpMeta, renderFnResults) => { + const oldVNode = hostRef.$vnode$ || { $flags$: 0 }; + hostTagName = toLowerCase(hostElm.tagName); + if (isHost(renderFnResults)) { + renderFnResults.$tag$ = null; + } + else { + renderFnResults = h(null, null, renderFnResults); + } + if (cmpMeta.$attrsToReflect$) { + renderFnResults.$attrs$ = renderFnResults.$attrs$ || {}; + cmpMeta.$attrsToReflect$.forEach(([propName, attribute]) => renderFnResults.$attrs$[attribute] = hostElm[propName]); + } + renderFnResults.$flags$ |= 4 /* isHost */; + hostRef.$vnode$ = renderFnResults; + renderFnResults.$elm$ = oldVNode.$elm$ = (hostElm.shadowRoot || hostElm); + { + scopeId = hostElm['s-sc']; + } + { + contentRef = hostElm['s-cr']; + useNativeShadowDom = supportsShadowDom && (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0; + // always reset + checkSlotRelocate = checkSlotFallbackVisibility = false; + } + // synchronous patch + patch(oldVNode, renderFnResults); + { + if (checkSlotRelocate) { + relocateSlotContent(renderFnResults.$elm$); + for (let i = 0; i < relocateNodes.length; i++) { + const relocateNode = relocateNodes[i]; + if (!relocateNode.nodeToRelocate['s-ol']) { + // add a reference node marking this node's original location + // keep a reference to this node for later lookups + const orgLocationNode = doc.createTextNode(''); + orgLocationNode['s-nr'] = relocateNode.nodeToRelocate; + relocateNode.nodeToRelocate.parentNode.insertBefore((relocateNode.nodeToRelocate['s-ol'] = orgLocationNode), relocateNode.nodeToRelocate); + } + } + // while we're moving nodes around existing nodes, temporarily disable + // the disconnectCallback from working + plt.$flags$ |= 1 /* isTmpDisconnected */; + for (let i = 0; i < relocateNodes.length; i++) { + const relocateNode = relocateNodes[i]; + // by default we're just going to insert it directly + // after the slot reference node + const parentNodeRef = relocateNode.slotRefNode.parentNode; + let insertBeforeNode = relocateNode.slotRefNode.nextSibling; + let orgLocationNode = relocateNode.nodeToRelocate['s-ol']; + while (orgLocationNode = orgLocationNode.previousSibling) { + let refNode = orgLocationNode['s-nr']; + if (refNode && refNode) { + if (refNode['s-sn'] === relocateNode.nodeToRelocate['s-sn']) { + if (parentNodeRef === refNode.parentNode) { + if ((refNode = refNode.nextSibling) && refNode && !refNode['s-nr']) { + insertBeforeNode = refNode; + break; + } + } + } + } + } + if ((!insertBeforeNode && parentNodeRef !== relocateNode.nodeToRelocate.parentNode) || + (relocateNode.nodeToRelocate.nextSibling !== insertBeforeNode)) { + // we've checked that it's worth while to relocate + // since that the node to relocate + // has a different next sibling or parent relocated + if (relocateNode.nodeToRelocate !== insertBeforeNode) { + // add it back to the dom but in its new home + parentNodeRef.insertBefore(relocateNode.nodeToRelocate, insertBeforeNode); + } + } + } + // done moving nodes around + // allow the disconnect callback to work again + plt.$flags$ &= ~1 /* isTmpDisconnected */; + } + if (checkSlotFallbackVisibility) { + updateFallbackSlotVisibility(renderFnResults.$elm$); + } + // always reset + relocateNodes.length = 0; + } +}; + +const safeCall = async (instance, method) => { + if (instance && instance[method]) { + try { + await instance[method](); + } + catch (e) { + consoleError(e); + } + } +}; +const scheduleUpdate = async (elm, hostRef, cmpMeta, isInitialLoad) => { + { + hostRef.$flags$ |= 16 /* isQueuedForUpdate */; + } + const instance = hostRef.$lazyInstance$; + if (isInitialLoad) { + { + await safeCall(instance, 'componentWillLoad'); + } + } + else { + { + await safeCall(instance, 'componentWillUpdate'); + } + } + // there is no ancestorc omponent or the ancestor component + // has already fired off its lifecycle update then + // fire off the initial update + { + writeTask(() => updateComponent(elm, hostRef, cmpMeta, isInitialLoad, instance)); + } +}; +const updateComponent = (elm, hostRef, cmpMeta, isInitialLoad, instance) => { + // updateComponent + { + hostRef.$flags$ &= ~16 /* isQueuedForUpdate */; + } + { + elm['s-lr'] = false; + } + if (isInitialLoad) { + // DOM WRITE! + attachStyles(elm, cmpMeta, hostRef.$modeName$); + } + { + { + // tell the platform we're actively rendering + // if a value is changed within a render() then + // this tells the platform not to queue the change + hostRef.$flags$ |= 4 /* isActiveRender */; + try { + // looks like we've got child nodes to render into this host element + // or we need to update the css class/attrs on the host element + // DOM WRITE! + renderVdom(elm, hostRef, cmpMeta, instance.render()); + } + catch (e) { + consoleError(e); + } + hostRef.$flags$ &= ~4 /* isActiveRender */; + } + } + if (cssVarShim) { + cssVarShim.updateHost(elm); + } + // set that this component lifecycle rendering has completed + { + elm['s-lr'] = true; + } + { + hostRef.$flags$ |= 2 /* hasRendered */; + } + if (elm['s-rc'].length > 0) { + // ok, so turns out there are some child host elements + // waiting on this parent element to load + // let's fire off all update callbacks waiting + elm['s-rc'].forEach(cb => cb()); + elm['s-rc'].length = 0; + } + postUpdateComponent(elm, hostRef); +}; +const postUpdateComponent = (elm, hostRef, ancestorsActivelyLoadingChildren) => { + if (!elm['s-al']) { + const instance = hostRef.$lazyInstance$; + const ancestorComponent = hostRef.$ancestorComponent$; + if (!(hostRef.$flags$ & 512 /* hasLoadedComponent */)) { + hostRef.$flags$ |= 512 /* hasLoadedComponent */; + { + // DOM WRITE! + // add the css class that this element has officially hydrated + elm.classList.add(HYDRATED_CLASS); + } + { + safeCall(instance, 'componentDidLoad'); + } + { + hostRef.$onReadyResolve$(elm); + } + if (!ancestorComponent) { + // on appload + // we have finish the first big initial render + doc.documentElement.classList.add(HYDRATED_CLASS); + { + setTimeout(() => plt.$flags$ |= 2 /* appLoaded */, 999); + } + } + } + // load events fire from bottom to top + // the deepest elements load first then bubbles up + if (ancestorComponent) { + // ok so this element already has a known ancestor component + // let's make sure we remove this element from its ancestor's + // known list of child elements which are actively loading + if (ancestorsActivelyLoadingChildren = ancestorComponent['s-al']) { + // remove this element from the actively loading map + ancestorsActivelyLoadingChildren.delete(elm); + // the ancestor's initializeComponent method will do the actual checks + // to see if the ancestor is actually loaded or not + // then let's call the ancestor's initializeComponent method if there's no length + // (which actually ends up as this method again but for the ancestor) + if (ancestorsActivelyLoadingChildren.size === 0) { + ancestorComponent['s-al'] = undefined; + ancestorComponent['s-init'](); + } + } + hostRef.$ancestorComponent$ = undefined; + } + // ( •_•) + // ( •_•)>⌐■-■ + // (⌐■_■) + } +}; + +const disconnectedCallback = (elm) => { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + const hostRef = getHostRef(elm); + { + if (hostRef.$rmListeners$) { + hostRef.$rmListeners$(); + hostRef.$rmListeners$ = undefined; + } + } + // clear CSS var-shim tracking + if (cssVarShim) { + cssVarShim.removeHost(elm); + } + const instance = hostRef.$lazyInstance$; + { + safeCall(instance, 'disconnectedCallback'); + } + } +}; + +const parsePropertyValue = (propValue, expectedPropType) => { + // ensure this value is of the correct prop type + if (propValue != null && typeof propValue !== 'object' && typeof propValue !== 'function') { + if (expectedPropType & 4 /* Boolean */) { + // per the HTML spec, any string value means it is a boolean true value + // but we'll cheat here and say that the string "false" is the boolean false + return (propValue === 'false' ? false : propValue === '' || !!propValue); + } + if (expectedPropType & 2 /* Number */) { + // force it to be a number + return parseFloat(propValue); + } + if (expectedPropType & 1 /* String */) { + // could have been passed as a number or boolean + // but we still want it as a string + return String(propValue); + } + // redundant return here for better minification + return propValue; + } + // not sure exactly what type we want + // so no need to change to a different type + return propValue; +}; + +const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName); +const setValue = (ref, propName, newVal, cmpMeta) => { + // check our new property value against our internal value + const hostRef = getHostRef(ref); + const elm = hostRef.$hostElement$; + const oldVal = hostRef.$instanceValues$.get(propName); + const flags = hostRef.$flags$; + newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]); + if (newVal !== oldVal && (!(flags & 8 /* isConstructingInstance */) || oldVal === undefined)) { + // gadzooks! the property's value has changed!! + // set our new value! + hostRef.$instanceValues$.set(propName, newVal); + if (hostRef.$lazyInstance$) { + // get an array of method names of watch functions to call + if (cmpMeta.$watchers$ && + (flags & (1 /* hasConnected */ | 8 /* isConstructingInstance */)) === 1 /* hasConnected */) { + const watchMethods = cmpMeta.$watchers$[propName]; + if (watchMethods) { + // this instance is watching for when this property changed + watchMethods.forEach(watchMethodName => { + try { + // fire off each of the watch methods that are watching this property + (hostRef.$lazyInstance$)[watchMethodName].call((hostRef.$lazyInstance$), newVal, oldVal, propName); + } + catch (e) { + consoleError(e); + } + }); + } + } + if ((flags & (4 /* isActiveRender */ | 2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) { + // looks like this value actually changed, so we've got work to do! + // but only if we've already rendered, otherwise just chill out + // queue that we need to do an update, but don't worry about queuing + // up millions cuz this function ensures it only runs once + scheduleUpdate(elm, hostRef, cmpMeta, false); + } + } + } +}; + +const proxyComponent = (Cstr, cmpMeta, isElementConstructor, proxyState) => { + if (cmpMeta.$members$) { + if (Cstr.watchers) { + cmpMeta.$watchers$ = Cstr.watchers; + } + // It's better to have a const than two Object.entries() + const members = Object.entries(cmpMeta.$members$); + members.forEach(([memberName, [memberFlags]]) => { + if ((memberFlags & 31) || (proxyState && (memberFlags & 32 /* State */))) { + // proxyComponent - prop + Object.defineProperty(Cstr.prototype, memberName, { + get() { + // proxyComponent, get value + return getValue(this, memberName); + }, + set(newValue) { + // proxyComponent, set value + setValue(this, memberName, newValue, cmpMeta); + }, + configurable: true, + enumerable: true + }); + } + else if (isElementConstructor && (memberFlags & 64 /* Method */)) { + // proxyComponent - method + Object.defineProperty(Cstr.prototype, memberName, { + value(...args) { + const ref = getHostRef(this); + return ref.$onReadyPromise$.then(() => ref.$lazyInstance$[memberName](...args)); + } + }); + } + }); + if (isElementConstructor) { + const attrNameToPropName = new Map(); + Cstr.prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) { + const propName = attrNameToPropName.get(attrName); + this[propName] = newValue === null && typeof this[propName] === 'boolean' + ? false + : newValue; + }; + // create an array of attributes to observe + // and also create a map of html attribute name to js property name + Cstr.observedAttributes = members + .filter(([_, m]) => m[0] & 15 /* HasAttribute */) // filter to only keep props that should match attributes + .map(([propName, m]) => { + const attrName = m[1] || propName; + attrNameToPropName.set(attrName, propName); + if (m[0] & 512 /* ReflectAttr */) { + cmpMeta.$attrsToReflect$.push([propName, attrName]); + } + return attrName; + }); + } + } + return Cstr; +}; + +const addEventListeners = (elm, hostRef, listeners) => { + const removeFns = listeners.map(([flags, name, method]) => { + const target = (getHostListenerTarget(elm, flags)); + const handler = hostListenerProxy(hostRef, method); + const opts = hostListenerOpts(flags); + plt.ael(target, name, handler, opts); + return () => plt.rel(target, name, handler, opts); + }); + return () => removeFns.forEach(fn => fn()); +}; +const hostListenerProxy = (hostRef, methodName) => { + return (ev) => { + { + if (hostRef.$lazyInstance$) { + // instance is ready, let's call it's member method for this event + return hostRef.$lazyInstance$[methodName](ev); + } + else { + return hostRef.$onReadyPromise$.then(() => hostRef.$lazyInstance$[methodName](ev)).catch(consoleError); + } + } + }; +}; +const getHostListenerTarget = (elm, flags) => { + if (flags & 16 /* TargetParent */) + return elm.parentElement; + return elm; +}; +const hostListenerOpts = (flags) => supportsListenerOptions ? + { + 'passive': (flags & 1 /* Passive */) !== 0, + 'capture': (flags & 2 /* Capture */) !== 0, + } + : (flags & 2 /* Capture */) !== 0; + +const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => { + // initializeComponent + if ((hostRef.$flags$ & 256 /* hasInitializedComponent */) === 0) { + // we haven't initialized this element yet + hostRef.$flags$ |= 256 /* hasInitializedComponent */; + { + // lazy loaded components + // request the component's implementation to be + // wired up with the host element + Cstr = await loadModule(cmpMeta, hostRef, hmrVersionId); + if (!Cstr.isProxied) { + // we'eve never proxied this Constructor before + // let's add the getters/setters to its prototype before + // the first time we create an instance of the implementation + { + cmpMeta.$watchers$ = Cstr.watchers; + } + proxyComponent(Cstr, cmpMeta, 0, 1); + Cstr.isProxied = true; + } + // ok, time to construct the instance + // but let's keep track of when we start and stop + // so that the getters/setters don't incorrectly step on data + { + hostRef.$flags$ |= 8 /* isConstructingInstance */; + } + // construct the lazy-loaded component implementation + // passing the hostRef is very important during + // construction in order to directly wire together the + // host element and the lazy-loaded instance + try { + new Cstr(hostRef); + } + catch (e) { + consoleError(e); + } + { + hostRef.$flags$ &= ~8 /* isConstructingInstance */; + } + fireConnectedCallback(hostRef.$lazyInstance$); + } + if (!Cstr.isStyleRegistered && Cstr.style) { + // this component has styles but we haven't registered them yet + let style = Cstr.style; + let scopeId = getScopeId(cmpMeta.$tagName$, hostRef.$modeName$); + if (cmpMeta.$flags$ & 8 /* needsShadowDomShim */) { + style = await Promise.resolve(require('./shadow-css-984bac74-b2177096.js')).then(m => m.scopeCss(style, scopeId, false)); + } + registerStyle(scopeId, style); + Cstr.isStyleRegistered = true; + } + } + // we've successfully created a lazy instance + const ancestorComponent = hostRef.$ancestorComponent$; + if (ancestorComponent && !ancestorComponent['s-lr'] && ancestorComponent['s-rc']) { + // this is the intial load and this component it has an ancestor component + // but the ancestor component has NOT fired its will update lifecycle yet + // so let's just cool our jets and wait for the ancestor to continue first + ancestorComponent['s-rc'].push(() => + // this will get fired off when the ancestor component + // finally gets around to rendering its lazy self + // fire off the initial update + initializeComponent(elm, hostRef, cmpMeta)); + } + else { + scheduleUpdate(elm, hostRef, cmpMeta, true); + } +}; + +const fireConnectedCallback = (instance) => { + { + safeCall(instance, 'connectedCallback'); + } +}; +const connectedCallback = (elm, cmpMeta) => { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + // connectedCallback + const hostRef = getHostRef(elm); + if (cmpMeta.$listeners$) { + // initialize our event listeners on the host element + // we do this now so that we can listening to events that may + // have fired even before the instance is ready + hostRef.$rmListeners$ = addEventListeners(elm, hostRef, cmpMeta.$listeners$); + } + if (!(hostRef.$flags$ & 1 /* hasConnected */)) { + // first time this component has connected + hostRef.$flags$ |= 1 /* hasConnected */; + let hostId; + if (!hostId) { + // initUpdate + // if the slot polyfill is required we'll need to put some nodes + // in here to act as original content anchors as we move nodes around + // host element has been connected to the DOM + if (cmpMeta.$flags$ & 4 || + (cmpMeta.$flags$ & 8 /* needsShadowDomShim */)) { + setContentReference(elm); + } + } + { + // find the first ancestor component (if there is one) and register + // this component as one of the actively loading child components for its ancestor + let ancestorComponent = elm; + while ((ancestorComponent = (ancestorComponent.parentNode || ancestorComponent.host))) { + // climb up the ancestors looking for the first + // component that hasn't finished its lifecycle update yet + if ((ancestorComponent['s-init'] && !ancestorComponent['s-lr']) || (BUILD.hydrateClientSide && ancestorComponent.nodeType === 1 /* ElementNode */ && ancestorComponent.hasAttribute('s-id'))) { + // we found this components first ancestor component + // keep a reference to this component's ancestor component + hostRef.$ancestorComponent$ = ancestorComponent; + // ensure there is an array to contain a reference to each of the child components + // and set this component as one of the ancestor's child components it should wait on + (ancestorComponent['s-al'] = ancestorComponent['s-al'] || new Set()).add(elm); + break; + } + } + } + // Lazy properties + // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties + if (cmpMeta.$members$) { + Object.entries(cmpMeta.$members$).forEach(([memberName, [memberFlags]]) => { + if (memberFlags & 31 /* Prop */ && elm.hasOwnProperty(memberName)) { + const value = elm[memberName]; + delete elm[memberName]; + elm[memberName] = value; + } + }); + } + { + initializeComponent(elm, hostRef, cmpMeta); + } + } + fireConnectedCallback(hostRef.$lazyInstance$); + } +}; +const setContentReference = (elm, contentRefElm) => { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + let crName; + { + crName = ''; + } + contentRefElm = elm['s-cr'] = doc.createComment(crName); + contentRefElm['s-cn'] = true; + elm.insertBefore(contentRefElm, elm.firstChild); +}; + +const bootstrapLazy = (lazyBundles, options = {}) => { + const cmpTags = []; + const exclude = options.exclude || []; + const head = doc.head; + const customElements = win.customElements; + const y = /*@__PURE__*/ head.querySelector('meta[charset]'); + const visibilityStyle = /*@__PURE__*/ doc.createElement('style'); + Object.assign(plt, options); + plt.$resourcesUrl$ = new URL(options.resourcesUrl || '/', doc.baseURI).href; + if (options.syncQueue) { + plt.$flags$ |= 4 /* queueSync */; + } + lazyBundles.forEach(lazyBundle => lazyBundle[1].forEach(compactMeta => { + const cmpMeta = { + $flags$: compactMeta[0], + $tagName$: compactMeta[1], + $members$: compactMeta[2], + $listeners$: compactMeta[3], + }; + { + cmpMeta.$attrsToReflect$ = []; + } + { + cmpMeta.$watchers$ = {}; + } + if (!supportsShadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + cmpMeta.$flags$ |= 8 /* needsShadowDomShim */; + } + const tagName = cmpMeta.$tagName$; + const HostElement = class extends HTMLElement { + // StencilLazyHost + constructor(self) { + // @ts-ignore + super(self); + self = this; + { + this['s-lr'] = false; + this['s-rc'] = []; + } + registerHost(self); + if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + // this component is using shadow dom + // and this browser supports shadow dom + // add the read-only property "shadowRoot" to the host element + if (supportsShadowDom) { + self.attachShadow({ 'mode': 'open' }); + } + else if (!('shadowRoot' in self)) { + self.shadowRoot = self; + } + } + } + connectedCallback() { + connectedCallback(this, cmpMeta); + } + disconnectedCallback() { + disconnectedCallback(this); + } + 's-init'() { + const hostRef = getHostRef(this); + if (hostRef.$lazyInstance$) { + postUpdateComponent(this, hostRef); + } + } + 's-hmr'(hmrVersionId) { + } + forceUpdate() { + { + const hostRef = getHostRef(this); + scheduleUpdate(this, hostRef, cmpMeta, false); + } + } + componentOnReady() { + return getHostRef(this).$onReadyPromise$; + } + }; + cmpMeta.$lazyBundleIds$ = lazyBundle[0]; + if (!exclude.includes(tagName) && !customElements.get(tagName)) { + cmpTags.push(tagName); + customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1, 0)); + } + })); + // visibilityStyle.innerHTML = cmpTags.map(t => `${t}:not(.hydrated)`) + '{display:none}'; + visibilityStyle.innerHTML = cmpTags + '{visibility:hidden}.hydrated{visibility:inherit}'; + visibilityStyle.setAttribute('data-styles', ''); + head.insertBefore(visibilityStyle, y ? y.nextSibling : head.firstChild); +}; + +const createEvent = (ref, name, flags) => { + const elm = getElement(ref); + return { + emit: (detail) => elm.dispatchEvent(new (CustomEvent)(name, { + bubbles: !!(flags & 4 /* Bubbles */), + composed: !!(flags & 2 /* Composed */), + cancelable: !!(flags & 1 /* Cancellable */), + detail + })) + }; +}; + +const getElement = (ref) => getHostRef(ref).$hostElement$; + +exports.Host = Host; +exports.bootstrapLazy = bootstrapLazy; +exports.createEvent = createEvent; +exports.getElement = getElement; +exports.h = h; +exports.patchBrowser = patchBrowser; +exports.patchEsm = patchEsm; +exports.registerInstance = registerInstance; diff --git a/dist/cjs/calcite-alert_8.cjs.entry.js b/dist/cjs/calcite-alert_8.cjs.entry.js new file mode 100644 index 00000000000..a5f60adfd62 --- /dev/null +++ b/dist/cjs/calcite-alert_8.cjs.entry.js @@ -0,0 +1,400 @@ +'use strict'; + +Object.defineProperty(exports, '__esModule', { value: true }); + +const __chunk_1 = require('./calcite-15323450.js'); + +// File generated automatically by path-data.js, do not edit directly +const checkCircle24F = "M23 11.5A11.5 11.5 0 1 1 11.5 0 11.5 11.5 0 0 1 23 11.5zm-5.5-6.018l-8.5 8.5-3.5-3.5-2 2L9.018 18l.018-.018L11.018 16l8.5-8.5z"; +const exclamationMarkTriangle24F = "M22.3 19.795l-9-17.901a1.5 1.5 0 0 0-2.597 0L1.7 19.795a1.502 1.502 0 0 0 0 1.502A1.456 1.456 0 0 0 2.998 22H21a1.458 1.458 0 0 0 1.299-.703 1.506 1.506 0 0 0 .001-1.502zM13 19h-2v-2h2zm0-3h-2V8h2z"; +const lightbulb24F = "M11 13h1v4h-1zm3.895 5.45a.311.311 0 0 0-.12-.27l-.232-.18h-6.19l-.232.18a.312.312 0 0 0 .04.518l1.387.771-1.367.76a.311.311 0 0 0-.028.526l3.09 2.18a.356.356 0 0 0 .41 0l3.09-2.18a.311.311 0 0 0-.029-.527l-1.366-.759 1.388-.77a.312.312 0 0 0 .159-.25zM11.59 0l-.173.002L11.244 0a6.2 6.2 0 0 0-6.182 6.698c.31 2.575 2.784 5.207 2.939 6.134.13.78.116 1.844.199 2.472A2.542 2.542 0 0 0 9.088 17H10v-4.412L8.83 9.37l.94-.342L10.85 12h1.3l1.08-2.97.94.341L13 12.588V17h.745a2.542 2.542 0 0 0 .889-1.696c.083-.628.068-1.692.199-2.472.154-.927 2.628-3.559 2.938-6.134A6.2 6.2 0 0 0 11.59 0z"; +const x32 = "M16.707 16l10.607 10.606-.708.707L16 16.707 5.394 27.313l-.708-.707L15.293 16 4.686 5.394l.708-.707L16 15.293 26.606 4.687l.708.707z"; + +const createProviderConsumer = (defaultState, consumerRender) => { + let listeners = new Map(); + let currentState = defaultState; + const updateListener = (fields, instance) => { + if (Array.isArray(fields)) { + [...fields].forEach(fieldName => { + instance[fieldName] = currentState[fieldName]; + }); + } + else { + instance[fields] = Object.assign({}, currentState); + } + }; + const subscribe = (instance, propList) => { + if (!listeners.has(instance)) { + listeners.set(instance, propList); + updateListener(propList, instance); + } + return () => { + if (listeners.has(instance)) { + listeners.delete(instance); + } + }; + }; + const Provider = ({ state }, children) => { + currentState = state; + listeners.forEach(updateListener); + return children; + }; + const Consumer = (props, children) => { + // The casting on subscribe is to allow for crossover through the stencil compiler + // In the future we should allow for generics in components. + return consumerRender(subscribe, children[0]); + }; + const injectProps = (Cstr, fieldList) => { + const CstrPrototype = Cstr.prototype; + const cstrConnectedCallback = CstrPrototype.connectedCallback; + const cstrDisconnectedCallback = CstrPrototype.disconnectedCallback; + CstrPrototype.connectedCallback = function () { + subscribe(this, fieldList); + if (cstrConnectedCallback) { + return cstrConnectedCallback.call(this); + } + }; + CstrPrototype.disconnectedCallback = function () { + listeners.delete(this); + if (cstrDisconnectedCallback) { + cstrDisconnectedCallback.call(this); + } + }; + }; + return { + Provider, + Consumer, + injectProps + }; +}; + +const AlertInterface = createProviderConsumer({ + currentAlert: '', + queueLength: 0 +}, (subscribe, child) => (__chunk_1.h("context-consumer", { subscribe: subscribe, renderer: child }))); + +class CalciteAlert { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.currentAlert = ''; + this.dismiss = false; + this.icon = false; + this.id = '1'; + this.queueLength = 0; + this.color = 'blue'; + this.theme = null; + this.duration = this.dismiss ? 'medium' : null; + this.isActive = this.id === this.currentAlert; + this.alertClose = __chunk_1.createEvent(this, "alertClose", 7); + this.alertOpen = __chunk_1.createEvent(this, "alertOpen", 7); + } + async close() { + if (this.isActive) { + this.isActive = false; + this.alertClose.emit(this.id); + } + } + componentWillUpdate() { + this.isActive = this.currentAlert === this.id; + if (this.isActive) + this.alertOpen.emit(this.id); + if (this.isActive && this.dismiss) + setTimeout(() => { this.close(); }, this.duration === 'fast' ? 6000 : this.duration === 'slow' ? 14000 : 10000); + } + setIcon() { + var path = this.color === 'green' ? checkCircle24F : (this.color === 'red' || this.color === 'yellow') ? exclamationMarkTriangle24F : lightbulb24F; + return (__chunk_1.h("div", { class: "alert-icon" }, __chunk_1.h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '24', width: '24', viewBox: '0 0 24 24' }, __chunk_1.h("path", { d: path })))); + } + render() { + const closeButton = (__chunk_1.h("button", { class: "alert-close", "aria-label": "close", onClick: () => this.close() }, __chunk_1.h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '32', width: '32', viewBox: '0 0 32 32' }, __chunk_1.h("path", { d: x32 })))); + const close = !this.dismiss ? closeButton : ''; + const icon = this.icon ? this.setIcon() : ''; + const count = __chunk_1.h("div", { class: `${this.queueLength > 0 ? 'is-active ' : ''}alert-count` }, "+", this.queueLength > 0 ? this.queueLength : 1); + const progress = this.isActive && this.dismiss ? __chunk_1.h("div", { class: "alert-dismiss" }) : ''; + return (__chunk_1.h(__chunk_1.Host, { theme: this.theme, "is-active": !!this.isActive, duration: this.duration }, icon, __chunk_1.h("div", { class: "alert-content" }, __chunk_1.h("slot", { name: "alert-title" }), __chunk_1.h("slot", { name: "alert-message" }), __chunk_1.h("slot", { name: "alert-link" })), count, close, progress)); + } + get el() { return __chunk_1.getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:relative;-ms-flex-pack:center;justify-content:center;right:0;left:0;margin-right:auto;margin-left:auto;z-index:100;width:50em;max-width:90%;border-radius:2px;background-color:#fff;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,.15);box-shadow:0 0 12px 0 rgba(0,0,0,.15);height:0;opacity:0;overflow:visible;display:-ms-flexbox;display:flex;border-top:3px solid;-webkit-transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;-webkit-transform:translate3d(0,1.5rem,0);transform:translate3d(0,1.5rem,0);pointer-events:none;border-width:0}\@media only screen and (max-width:600px){:host{max-width:100%;border-radius:2px 2px 0 0;-webkit-box-shadow:0 -6px 12px 0 rgba(0,0,0,.15);box-shadow:0 -6px 12px 0 rgba(0,0,0,.15)}}:host([is-active]){visibility:visible;border-width:3px;opacity:1;height:100%;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translateZ(0);transform:translateZ(0);pointer-events:auto}:host slot[name=alert-title]::slotted(div){display:block;font-weight:500;font-size:16px}:host slot[name=alert-link]::slotted(a){display:inline-block;font-size:15px;color:#007ac2}:host slot[name=alert-message]::slotted(div){font-size:15px;color:#555;display:inline;-webkit-margin-end:.75rem;margin-inline-end:.75rem}:host([theme=dark]){background-color:#2b2b2b}:host([theme=dark]) slot[name=alert-title]::slotted(div){color:#f8f8f8}:host([theme=dark]) slot[name=alert-message]::slotted(div){color:#f3f3f3}.alert-content{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;word-wrap:break-word;-webkit-padding-before:.75rem;padding-block-start:.75rem;-webkit-padding-after:.75rem;padding-block-end:.75rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}\@media only screen and (max-width:600px){.alert-content{padding:1.5rem}}.alert-content svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-content:first-of-type{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}\@media only screen and (max-width:600px){.alert-content{-webkit-padding-before:1.5rem;padding-block-start:1.5rem;-webkit-padding-after:1.5rem;padding-block-end:1.5rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}}.alert-icon{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}\@media only screen and (max-width:600px){.alert-icon{padding:1.5rem}}.alert-icon svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-close{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-appearance:none;background-color:transparent;border:none;outline:none;cursor:pointer;border-radius:0 0 2px 0}\@media only screen and (max-width:600px){.alert-close{padding:1.5rem}}.alert-close svg{position:relative;vertical-align:top;height:16px;width:16px;fill:#151515}.alert-close:focus,.alert-close:hover{background-color:#f3f3f3}.alert-close:active{background-color:#eaeaea}.alert-close:last-child{border-radius:0 0 2px 0}:host([dir=rtl]) .alert-close:last-child{border-radius:0 0 0 2px}\@media only screen and (max-width:600px){.alert-close{border-radius:0}}:host([theme=dark]) .alert-close svg{fill:#d4d4d4}:host([theme=dark]) .alert-close:focus,:host([theme=dark]) .alert-close:hover{background-color:#202020}:host([theme=dark]) .alert-close:active{background-color:#151515}.alert-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-transition:all .15s ease-in;transition:all .15s ease-in;width:0;font-size:14px;visibility:hidden;padding:0;font-weight:500;text-align:center;background-color:transparent;color:#757575;opacity:0;border-left:1px solid transparent;border-right:1px solid transparent;cursor:default}.alert-count.is-active{visibility:visible;-webkit-transition-delay:.3s;transition-delay:.3s;opacity:1;padding:0 .375rem;width:3rem;border-left:1px solid #f3f3f3;border-right:1px solid #f3f3f3}.alert-count.is-active:last-child{border-right-color:transparent}\@media only screen and (max-width:600px){.alert-count{border-radius:0}}:host([theme=dark]) .alert-count{color:#d4d4d4}:host([theme=dark]) .alert-count.is-active{border-left:1px solid #202020;border-right:1px solid #202020}.alert-dismiss{left:0;top:0;z-index:101}.alert-dismiss,.alert-dismiss:after{display:block;position:absolute;right:0;height:3px}.alert-dismiss:after{top:-3px;border-radius:2px 2px 0 0;content:\"\";width:50%;background-color:hsla(0,0%,100%,.6);-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;z-index:200}:host([theme=dark]) .alert-dismiss:after{background-color:rgba(43,43,43,.6)}:host([duration=fast]) .alert-dismiss:after{-webkit-animation:dismissProgress 6s linear;animation:dismissProgress 6s linear}:host([duration=medium]) .alert-dismiss:after{-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear}:host([duration=slow]) .alert-dismiss:after{-webkit-animation:dismissProgress 14s linear;animation:dismissProgress 14s linear}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([color=blue]){border-top-color:#007ac2}:host([color=blue]) .alert-icon svg{fill:#007ac2}:host([color=red]){border-top-color:#d83020}:host([color=red]) .alert-icon svg{fill:#d83020}:host([color=yellow]){border-top-color:#edd317}:host([color=yellow]) .alert-icon svg{fill:#edd317}:host([color=green]){border-top-color:#35ac46}:host([color=green]) .alert-icon svg{fill:#35ac46}"; } +} +AlertInterface.injectProps(CalciteAlert, ['currentAlert', 'queueLength']); + +class CalciteAlerts { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.id = '1'; + this.currentAlert = ''; + this.isActive = false; + this.queue = []; + this.alertsClose = __chunk_1.createEvent(this, "alertsClose", 7); + this.alertsOpen = __chunk_1.createEvent(this, "alertsOpen", 7); + } + async open(requestedAlert) { + if (!this.queue.includes(requestedAlert)) { + this.isActive = true; + this.currentAlert = requestedAlert; + this.queue.push(requestedAlert); + this.alertsOpen.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + } + updateQueue(event) { + if (this.queue.includes(event.detail)) + this.queue = this.queue.filter(e => e !== event.detail); + if (this.queue.length < 1) + setTimeout(() => { this.isActive = false; }, 300); + this.alertsClose.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + componentWillUpdate() { + this.currentAlert = this.queue.length > 0 ? this.queue[0] : ''; + } + render() { + const alertState = { + currentAlert: this.currentAlert, + queueLength: this.queue.length >= 2 ? this.queue.length - 1 : 0 + }; + return (__chunk_1.h(__chunk_1.Host, { "is-active": !!this.isActive }, __chunk_1.h(AlertInterface.Provider, { state: alertState }, __chunk_1.h("slot", null)))); + } + get el() { return __chunk_1.getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:fixed;visibility:hidden;opacity:0;left:0;right:0;bottom:1.5rem;height:0;z-index:101;pointer-events:none;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-transition-delay:.3s;transition-delay:.3s}\@media only screen and (max-width:600px){:host{bottom:0}}:host([is-active]){height:auto;visibility:visible;opacity:1}"; } +} + +class CalciteLoader { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.isActive = false; + this.text = "Loading..."; + } + render() { + return (__chunk_1.h(__chunk_1.Host, { "is-active": !!this.isActive }, __chunk_1.h("div", { class: "loader-bars" }), __chunk_1.h("div", { class: "loader-text" }, this.text))); + } + get el() { return __chunk_1.getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host .loader-bars,:host .loader-bars:after,:host .loader-bars:before{background:#007ac2;-webkit-animation:load .8s ease-in-out infinite;animation:load .8s ease-in-out infinite;width:.85rem;height:2rem}:host .loader-bars:after,:host .loader-bars:before{position:absolute;top:0;content:\"\"}:host{position:relative;display:none;padding-bottom:4.5rem;padding-top:4.5rem}:host([is-active]){display:block}:host .loader-bars{text-indent:-9999em;margin:auto;position:absolute;right:calc(50% - .425rem);font-size:11px;-webkit-animation-delay:.16s;animation-delay:.16s}:host .loader-bars:before{left:-1.25rem}:host .loader-bars:after{left:1.25rem;-webkit-animation-delay:.32s;animation-delay:.32s}:host .loader-text{padding-top:4rem;text-align:center}\@-webkit-keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}\@keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}"; } +} + +function format(first, middle, last) { + return ((first || "") + (middle ? ` ${middle}` : "") + (last ? ` ${last}` : "")); +} + +class CalciteModal { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + } + getText() { + return format(this.first, this.middle, this.last); + } + render() { + return __chunk_1.h("div", { class: "example-class" }, "Hello, World! I'm ", this.getText()); + } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.example-class{padding:1.5rem;color:#d83020;-webkit-box-shadow:0 0 16px 0 rgba(0,0,0,.05);box-shadow:0 0 16px 0 rgba(0,0,0,.05);border:1px solid #007ac2}"; } +} + +// from https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues#Examples +function random() { + return window.crypto.getRandomValues(new Uint32Array(1))[0] / 1e10; +} +function gen(count) { + var out = ""; + for (var i = 0; i < count; i++) { + out += (((1 + random()) * 0x10000) | 0).toString(16).substring(1); + } + return out; +} +function guid() { + return [gen(2), gen(1), gen(1), gen(1), gen(3)].join("-"); +} + +class CalciteTab { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.id = `calite-tab-${guid()}`; + this.isActive = false; + this.calciteRegisterTab = __chunk_1.createEvent(this, "calciteRegisterTab", 7); + } + tabChangeHandler(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTab.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab"), this.el)); + } + async registerLabeledBy(id) { + this.labeledBy = id; + } + render() { + return (__chunk_1.h(__chunk_1.Host, { "aria-labeledby": this.labeledBy, "aria-expanded": this.isActive ? "true" : "false", role: "tabpanel" }, __chunk_1.h("section", null, __chunk_1.h("slot", null)))); + } + get el() { return __chunk_1.getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([is-active]) section{display:block}section{display:none}"; } +} + +class CalciteTabNav { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.id = `calite-tab-nav-${guid()}`; + this.selectedTab = 0; + this.calciteTabChange = __chunk_1.createEvent(this, "calciteTabChange", 7); + } + selectedTabChanged() { + this.calciteTabChange.emit({ + tab: this.selectedTab + }); + } + focusPreviousTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const previousTab = tabs[currentIndex - 1] || tabs[tabs.length - 1]; + previousTab.focus(); + } + focusNextTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const nextTab = tabs[currentIndex + 1] || tabs[0]; + nextTab.focus(); + } + tabTitleRegistationHandler(e) { + e.target.setControledBy(this.id); + } + activateTabHandler(e) { + if (e.detail.tab) { + this.selectedTab = e.detail.tab; + } + else { + this.selectedTab = this.getIndexOfTabTitle(e.target); + } + } + getIndexOfTabTitle(el) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + return [...tabs].indexOf(el); + } + componentWillLoad() { + this.selectedTabChanged(); + } + render() { + return (__chunk_1.h(__chunk_1.Host, { role: "tablist" }, __chunk_1.h("nav", { class: "tab-nav" }, __chunk_1.h("slot", null)))); + } + get el() { return __chunk_1.getElement(this); } + static get watchers() { return { + "selectedTab": ["selectedTabChanged"] + }; } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.tab-nav{display:-ms-flexbox;display:flex;padding:.5rem 0}::slotted(calcite-tab-title){margin-right:1.25rem}:host([dir=rtl]) ::slotted(calcite-tab-title){margin-right:0;margin-left:1.25rem}"; } +} + +const ENTER = 13; +const SPACE = 32; +const LEFT = 37; +const RIGHT = 39; + +class CalciteTabTitle { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.id = `calite-tab-title-${guid()}`; + this.isActive = false; + this.calciteActivateTab = __chunk_1.createEvent(this, "calciteActivateTab", 7); + this.calciteFocusNextTab = __chunk_1.createEvent(this, "calciteFocusNextTab", 7); + this.calciteFocusPreviousTab = __chunk_1.createEvent(this, "calciteFocusPreviousTab", 7); + this.calciteRegisterTabTitle = __chunk_1.createEvent(this, "calciteRegisterTabTitle", 7); + } + tabChangeHand(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + onClick() { + this.calciteActivateTab.emit({ + tab: this.tab + }); + } + keyDownHandler(e) { + switch (e.keyCode) { + case SPACE: + case ENTER: + this.onClick(); + break; + case RIGHT: + this.calciteFocusNextTab.emit(); + break; + case LEFT: + this.calciteFocusPreviousTab.emit(); + break; + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTabTitle.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"), this.el)); + } + async setControledBy(id) { + this.controls = id; + } + render() { + return (__chunk_1.h(__chunk_1.Host, { "aria-controls": this.controls, "aria-expanded": this.isActive ? "true" : "false", role: "tab", tabindex: "0" }, __chunk_1.h("a", null, __chunk_1.h("slot", null)))); + } + get el() { return __chunk_1.getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{-ms-flex:0 1 auto;flex:0 1 auto;outline:none}:host(:active) a,:host(:focus) a,:host(:hover) a{outline:none;text-decoration:none;color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-hover)}:host([is-active]) a{color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-active)}a{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:.875rem;line-height:1.5;padding:.5rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:3px solid transparent;cursor:pointer;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;color:var(--calcite-tabs-color);outline:none}"; } +} + +class CalciteTabs { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.tabs = {}; + this.tabTitles = {}; + this.theme = "light"; + } + tabTitleRegistationHandler(e) { + const { index, id } = e.detail; + this.tabTitles[index] = { + id: id, + title: e.target + }; + if (this.tabs[index]) { + this.tabs[index].tab.registerLabeledBy(id); + } + } + tabRegistationHandler(e) { + const { index, id } = e.detail; + this.tabs[index] = { + id: id, + tab: e.target + }; + if (this.tabTitles[index]) { + this.tabs[index].tab.registerLabeledBy(this.tabTitles[index].id); + } + } + render() { + return (__chunk_1.h("div", null, __chunk_1.h("slot", { name: "tab-nav" }), __chunk_1.h("section", { class: "tab-contents" }, __chunk_1.h("slot", null)))); + } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{--calcite-tabs-color:#2b2b2b;--calcite-tabs-border:#eaeaea;--calcite-tabs-border-hover:#dfdfdf;--calcite-tabs-color-active:#151515;--calcite-tabs-border-active:#007ac2}:host([theme=dark]){--calcite-tabs-color:#f3f3f3;--calcite-tabs-border:#404040;--calcite-tabs-border-hover:#757575;--calcite-tabs-color-active:#f8f8f8;--calcite-tabs-border-active:#fff}.tab-contents{margin-top:1px;border-top:1px solid var(--calcite-tabs-border)}"; } +} + +exports.calcite_alert = CalciteAlert; +exports.calcite_alerts = CalciteAlerts; +exports.calcite_loader = CalciteLoader; +exports.calcite_modal = CalciteModal; +exports.calcite_tab = CalciteTab; +exports.calcite_tab_nav = CalciteTabNav; +exports.calcite_tab_title = CalciteTabTitle; +exports.calcite_tabs = CalciteTabs; diff --git a/dist/cjs/calcite.cjs.js b/dist/cjs/calcite.cjs.js new file mode 100644 index 00000000000..4383aa2115f --- /dev/null +++ b/dist/cjs/calcite.cjs.js @@ -0,0 +1,7 @@ +'use strict'; + +const __chunk_1 = require('./calcite-15323450.js'); + +__chunk_1.patchBrowser().then(resourcesUrl => { + return __chunk_1.bootstrapLazy([["calcite-alert_8.cjs",[[1,"calcite-alert",{"currentAlert":[1,"current-alert"],"dismiss":[4],"icon":[4],"id":[1],"queueLength":[2,"queue-length"],"color":[513],"theme":[513],"duration":[513],"isActive":[32],"close":[64]}],[1,"calcite-alerts",{"id":[1],"currentAlert":[32],"isActive":[32],"queue":[32],"open":[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{"isActive":[4,"is-active"],"text":[1]}],[1,"calcite-modal",{"first":[1],"middle":[1],"last":[1]}],[1,"calcite-tab",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"labeledBy":[32],"getTabIndex":[64],"registerLabeledBy":[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{"id":[1537],"selectedTab":[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"controls":[32],"getTabIndex":[64],"setControledBy":[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{"theme":[513],"tabs":[32],"tabTitles":[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]]], { resourcesUrl }); +}); diff --git a/dist/cjs/context-consumer.cjs.entry.js b/dist/cjs/context-consumer.cjs.entry.js new file mode 100644 index 00000000000..a5ae018df15 --- /dev/null +++ b/dist/cjs/context-consumer.cjs.entry.js @@ -0,0 +1,29 @@ +'use strict'; + +Object.defineProperty(exports, '__esModule', { value: true }); + +const __chunk_1 = require('./calcite-15323450.js'); + +class ContextConsumer { + constructor(hostRef) { + __chunk_1.registerInstance(this, hostRef); + this.context = {}; + this.renderer = () => null; + } + connectedCallback() { + if (this.subscribe != null) { + this.unsubscribe = this.subscribe(this.el, 'context'); + } + } + disconnectedCallback() { + if (this.unsubscribe != null) { + this.unsubscribe(); + } + } + render() { + return this.renderer(Object.assign({}, this.context)); + } + get el() { return __chunk_1.getElement(this); } +} + +exports.context_consumer = ContextConsumer; diff --git a/dist/cjs/css-shim-229ebf7a-56ba83b5.js b/dist/cjs/css-shim-229ebf7a-56ba83b5.js new file mode 100644 index 00000000000..e1a9712912b --- /dev/null +++ b/dist/cjs/css-shim-229ebf7a-56ba83b5.js @@ -0,0 +1,630 @@ +'use strict'; + +/* +Extremely simple css parser. Intended to be not more than what we need +and definitely not necessarily correct =). +*/ +/** @unrestricted */ +var StyleNode = /** @class */ (function () { + function StyleNode() { + this.start = 0; + this.end = 0; + this.previous = null; + this.parent = null; + this.rules = null; + this.parsedCssText = ''; + this.cssText = ''; + this.atRule = false; + this.type = 0; + this.keyframesName = ''; + this.selector = ''; + this.parsedSelector = ''; + } + return StyleNode; +}()); +// given a string of css, return a simple rule tree +/** + * @param {string} text + * @return {StyleNode} + */ +function parse(text) { + text = clean(text); + return parseCss(lex(text), text); +} +// remove stuff we don't care about that may hinder parsing +/** + * @param {string} cssText + * @return {string} + */ +function clean(cssText) { + return cssText.replace(RX.comments, '').replace(RX.port, ''); +} +// super simple {...} lexer that returns a node tree +/** + * @param {string} text + * @return {StyleNode} + */ +function lex(text) { + var root = new StyleNode(); + root['start'] = 0; + root['end'] = text.length; + var n = root; + for (var i = 0, l = text.length; i < l; i++) { + if (text[i] === OPEN_BRACE) { + if (!n['rules']) { + n['rules'] = []; + } + var p = n; + var previous = p['rules'][p['rules'].length - 1] || null; + n = new StyleNode(); + n['start'] = i + 1; + n['parent'] = p; + n['previous'] = previous; + p['rules'].push(n); + } + else if (text[i] === CLOSE_BRACE) { + n['end'] = i + 1; + n = n['parent'] || root; + } + } + return root; +} +// add selectors/cssText to node tree +/** + * @param {StyleNode} node + * @param {string} text + * @return {StyleNode} + */ +function parseCss(node, text) { + var t = text.substring(node['start'], node['end'] - 1); + node['parsedCssText'] = node['cssText'] = t.trim(); + if (node.parent) { + var ss = node.previous ? node.previous['end'] : node.parent['start']; + t = text.substring(ss, node['start'] - 1); + t = _expandUnicodeEscapes(t); + t = t.replace(RX.multipleSpaces, ' '); + // TODO(sorvell): ad hoc; make selector include only after last ; + // helps with mixin syntax + t = t.substring(t.lastIndexOf(';') + 1); + var s = node['parsedSelector'] = node['selector'] = t.trim(); + node['atRule'] = (s.indexOf(AT_START) === 0); + // note, support a subset of rule types... + if (node['atRule']) { + if (s.indexOf(MEDIA_START) === 0) { + node['type'] = types.MEDIA_RULE; + } + else if (s.match(RX.keyframesRule)) { + node['type'] = types.KEYFRAMES_RULE; + node['keyframesName'] = node['selector'].split(RX.multipleSpaces).pop(); + } + } + else { + if (s.indexOf(VAR_START) === 0) { + node['type'] = types.MIXIN_RULE; + } + else { + node['type'] = types.STYLE_RULE; + } + } + } + var r$ = node['rules']; + if (r$) { + for (var i = 0, l = r$.length, r = void 0; (i < l) && (r = r$[i]); i++) { + parseCss(r, text); + } + } + return node; +} +/** + * conversion of sort unicode escapes with spaces like `\33 ` (and longer) into + * expanded form that doesn't require trailing space `\000033` + * @param {string} s + * @return {string} + */ +function _expandUnicodeEscapes(s) { + return s.replace(/\\([0-9a-f]{1,6})\s/gi, function () { + var code = arguments[1], repeat = 6 - code.length; + while (repeat--) { + code = '0' + code; + } + return '\\' + code; + }); +} +/** @enum {number} */ +var types = { + STYLE_RULE: 1, + KEYFRAMES_RULE: 7, + MEDIA_RULE: 4, + MIXIN_RULE: 1000 +}; +var OPEN_BRACE = '{'; +var CLOSE_BRACE = '}'; +// helper regexp's +var RX = { + comments: /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim, + port: /@import[^;]*;/gim, + customProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim, + mixinProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim, + mixinApply: /@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim, + varApply: /[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim, + keyframesRule: /^@[^\s]*keyframes/, + multipleSpaces: /\s+/g +}; +var VAR_START = '--'; +var MEDIA_START = '@media'; +var AT_START = '@'; +function findRegex(regex, cssText, offset) { + regex['lastIndex'] = 0; + var r = cssText.substring(offset).match(regex); + if (r) { + var start = offset + r['index']; + return { + start: start, + end: start + r[0].length + }; + } + return null; +} +var VAR_USAGE_START = /\bvar\(/; +var VAR_ASSIGN_START = /\B--[\w-]+\s*:/; +var COMMENTS = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim; +var TRAILING_LINES = /^[\t ]+\n/gm; +function resolveVar(props, prop, fallback) { + if (props[prop]) { + return props[prop]; + } + if (fallback) { + return executeTemplate(fallback, props); + } + return ''; +} +function findVarEndIndex(cssText, offset) { + var count = 0; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (c === '(') { + count++; + } + else if (c === ')') { + count--; + if (count <= 0) { + return i + 1; + } + } + } + return i; +} +function parseVar(cssText, offset) { + var varPos = findRegex(VAR_USAGE_START, cssText, offset); + if (!varPos) { + return null; + } + var endVar = findVarEndIndex(cssText, varPos.start); + var varContent = cssText.substring(varPos.end, endVar - 1); + var _a = varContent.split(','), propName = _a[0], fallback = _a.slice(1); + return { + start: varPos.start, + end: endVar, + propName: propName.trim(), + fallback: fallback.length > 0 ? fallback.join(',').trim() : undefined + }; +} +function compileVar(cssText, template, offset) { + var varMeta = parseVar(cssText, offset); + if (!varMeta) { + template.push(cssText.substring(offset, cssText.length)); + return cssText.length; + } + var propName = varMeta.propName; + var fallback = varMeta.fallback != null ? compileTemplate(varMeta.fallback) : undefined; + template.push(cssText.substring(offset, varMeta.start), function (params) { return resolveVar(params, propName, fallback); }); + return varMeta.end; +} +function executeTemplate(template, props) { + var final = ''; + for (var i = 0; i < template.length; i++) { + var s = template[i]; + final += (typeof s === 'string') + ? s + : s(props); + } + return final; +} +function findEndValue(cssText, offset) { + var onStr = false; + var double = false; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (onStr) { + if (double && c === '"') { + onStr = false; + } + if (!double && c === '\'') { + onStr = false; + } + } + else { + if (c === '"') { + onStr = true; + double = true; + } + else if (c === '\'') { + onStr = true; + double = false; + } + else if (c === ';') { + return i + 1; + } + else if (c === '}') { + return i; + } + } + } + return i; +} +function removeCustomAssigns(cssText) { + var final = ''; + var offset = 0; + while (true) { + var assignPos = findRegex(VAR_ASSIGN_START, cssText, offset); + var start = assignPos ? assignPos.start : cssText.length; + final += cssText.substring(offset, start); + if (assignPos) { + offset = findEndValue(cssText, start); + } + else { + break; + } + } + return final; +} +function compileTemplate(cssText) { + var index = 0; + cssText = cssText.replace(COMMENTS, ''); + cssText = removeCustomAssigns(cssText) + .replace(TRAILING_LINES, ''); + var segments = []; + while (index < cssText.length) { + index = compileVar(cssText, segments, index); + } + return segments; +} +function resolveValues(selectors) { + var props = {}; + selectors.forEach(function (selector) { + selector.declarations.forEach(function (dec) { + props[dec.prop] = dec.value; + }); + }); + var propsValues = {}; + var entries = Object.entries(props); + var _loop_1 = function (i) { + var dirty = false; + entries.forEach(function (_a) { + var key = _a[0], value = _a[1]; + var propValue = executeTemplate(value, propsValues); + if (propValue !== propsValues[key]) { + propsValues[key] = propValue; + dirty = true; + } + }); + if (!dirty) { + return "break"; + } + }; + for (var i = 0; i < 10; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + return propsValues; +} +function getSelectors(root, index) { + if (index === void 0) { index = 0; } + if (!root.rules) { + return []; + } + var selectors = []; + root.rules + .filter(function (rule) { return rule.type === types.STYLE_RULE; }) + .forEach(function (rule) { + var declarations = getDeclarations(rule.cssText); + if (declarations.length > 0) { + rule.parsedSelector.split(',').forEach(function (selector) { + selector = selector.trim(); + selectors.push({ + selector: selector, + declarations: declarations, + specificity: computeSpecificity(selector), + nu: index + }); + }); + } + index++; + }); + return selectors; +} +function computeSpecificity(_selector) { + return 1; +} +var IMPORTANT = '!important'; +var FIND_DECLARATIONS = /(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm; +function getDeclarations(cssText) { + var declarations = []; + var xArray; + while (xArray = FIND_DECLARATIONS.exec(cssText.trim())) { + var _a = normalizeValue(xArray[2]), value = _a.value, important = _a.important; + declarations.push({ + prop: xArray[1].trim(), + value: compileTemplate(value), + important: important, + }); + } + return declarations; +} +function normalizeValue(value) { + var regex = /\s+/gim; + value = value.replace(regex, ' ').trim(); + var important = value.endsWith(IMPORTANT); + if (important) { + value = value.substr(0, value.length - IMPORTANT.length).trim(); + } + return { + value: value, + important: important + }; +} +function getActiveSelectors(hostEl, hostScopeMap, globalScopes) { + // computes the css scopes that might affect this particular element + var scopes = globalScopes.concat(getScopesForElement(hostScopeMap, hostEl)); + // each scope might have an array of associated selectors + // let's flatten the complete array of selectors from all the scopes + var selectorSet = getSelectorsForScopes(scopes); + // we filter to only the selectors that matches the hostEl + var activeSelectors = selectorSet.filter(function (selector) { return matches(hostEl, selector.selector); }); + // sort selectors by specifity + return sortSelectors(activeSelectors); +} +function getScopesForElement(hostTemplateMap, node) { + var scopes = []; + while (node) { + var scope = hostTemplateMap.get(node); + if (scope) { + scopes.push(scope); + } + node = node.parentElement; + } + return scopes; +} +function getSelectorsForScopes(scopes) { + var selectors = []; + scopes.forEach(function (scope) { + selectors.push.apply(selectors, scope.selectors); + }); + return selectors; +} +function sortSelectors(selectors) { + selectors.sort(function (a, b) { + if (a.specificity === b.specificity) { + return a.nu - b.nu; + } + return a.specificity - b.specificity; + }); + return selectors; +} +function matches(el, selector) { + return el.matches(selector); +} +function parseCSS(original) { + var ast = parse(original); + var template = compileTemplate(original); + var selectors = getSelectors(ast); + return { + original: original, + template: template, + selectors: selectors, + isDynamic: template.length > 1 + }; +} +function addGlobalStyle(globalScopes, styleEl) { + var css = parseCSS(styleEl.innerHTML); + css.styleEl = styleEl; + globalScopes.push(css); +} +function updateGlobalScopes(scopes) { + var selectors = getSelectorsForScopes(scopes); + var props = resolveValues(selectors); + scopes.forEach(function (scope) { + if (scope.isDynamic) { + scope.styleEl.innerHTML = executeTemplate(scope.template, props); + } + }); +} +function reScope(scope, cssScopeId) { + var template = scope.template.map(function (segment) { + return (typeof segment === 'string') + ? replaceScope(segment, scope.cssScopeId, cssScopeId) + : segment; + }); + var selectors = scope.selectors.map(function (sel) { + return Object.assign({}, sel, { selector: replaceScope(sel.selector, scope.cssScopeId, cssScopeId) }); + }); + return Object.assign({}, scope, { template: template, + selectors: selectors, + cssScopeId: cssScopeId }); +} +function replaceScope(original, oldScopeId, newScopeId) { + original = replaceAll(original, "\\." + oldScopeId, "." + newScopeId); + return original; +} +function replaceAll(input, find, replace) { + return input.replace(new RegExp(find, 'g'), replace); +} +function loadDocument(doc, globalScopes) { + return loadDocumentLinks(doc, globalScopes).then(function () { + loadDocumentStyles(doc, globalScopes); + }); +} +function loadDocumentLinks(doc, globalScopes) { + var promises = []; + var linkElms = doc.querySelectorAll('link[rel="stylesheet"][href]'); + for (var i = 0; i < linkElms.length; i++) { + promises.push(addGlobalLink(doc, globalScopes, linkElms[i])); + } + return Promise.all(promises); +} +function loadDocumentStyles(doc, globalScopes) { + var styleElms = doc.querySelectorAll('style'); + for (var i = 0; i < styleElms.length; i++) { + addGlobalStyle(globalScopes, styleElms[i]); + } +} +function addGlobalLink(doc, globalScopes, linkElm) { + var url = linkElm.href; + return fetch(url).then(function (rsp) { return rsp.text(); }).then(function (text) { + if (hasCssVariables(text) && linkElm.parentNode) { + if (hasRelativeUrls(text)) { + text = fixRelativeUrls(text, url); + } + var styleEl = doc.createElement('style'); + styleEl.innerHTML = text; + addGlobalStyle(globalScopes, styleEl); + linkElm.parentNode.insertBefore(styleEl, linkElm); + linkElm.remove(); + } + }).catch(function (err) { + console.error(err); + }); +} +// This regexp tries to determine when a variable is declared, for example: +// +// .my-el { --highlight-color: green; } +// +// but we don't want to trigger when a classname uses "--" or a pseudo-class is +// used. We assume that the only characters that can preceed a variable +// declaration are "{", from an opening block, ";" from a preceeding rule, or a +// space. This prevents the regexp from matching a word in a selector, since +// they would need to start with a "." or "#". (We assume element names don't +// start with "--"). +var CSS_VARIABLE_REGEXP = /[\s;{]--[-a-zA-Z0-9]+\s*:/m; +function hasCssVariables(css) { + return css.indexOf('var(') > -1 || CSS_VARIABLE_REGEXP.test(css); +} +// This regexp find all url() usages with relative urls +var CSS_URL_REGEXP = /url[\s]*\([\s]*['"]?(?![http|/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim; +function hasRelativeUrls(css) { + CSS_URL_REGEXP.lastIndex = 0; + return CSS_URL_REGEXP.test(css); +} +function fixRelativeUrls(css, originalUrl) { + // get the basepath from the original import url + var basePath = originalUrl.replace(/[^/]*$/, ''); + // replace the relative url, with the new relative url + return css.replace(CSS_URL_REGEXP, function (fullMatch, url) { + // rhe new relative path is the base path + uri + // TODO: normalize relative URL + var relativeUrl = basePath + url; + return fullMatch.replace(url, relativeUrl); + }); +} +var CustomStyle = /** @class */ (function () { + function CustomStyle(win, doc) { + this.win = win; + this.doc = doc; + this.count = 0; + this.hostStyleMap = new WeakMap(); + this.hostScopeMap = new WeakMap(); + this.globalScopes = []; + this.scopesMap = new Map(); + } + CustomStyle.prototype.initShim = function () { + var _this = this; + return new Promise(function (resolve) { + _this.win.requestAnimationFrame(function () { + loadDocument(_this.doc, _this.globalScopes).then(function () { return resolve(); }); + }); + }); + }; + CustomStyle.prototype.addLink = function (linkEl) { + var _this = this; + return addGlobalLink(this.doc, this.globalScopes, linkEl).then(function () { + _this.updateGlobal(); + }); + }; + CustomStyle.prototype.addGlobalStyle = function (styleEl) { + addGlobalStyle(this.globalScopes, styleEl); + this.updateGlobal(); + }; + CustomStyle.prototype.createHostStyle = function (hostEl, cssScopeId, cssText) { + if (this.hostScopeMap.has(hostEl)) { + throw new Error('host style already created'); + } + var baseScope = this.registerHostTemplate(cssText, cssScopeId); + var isDynamicScoped = !!(baseScope.isDynamic && baseScope.cssScopeId); + var needStyleEl = isDynamicScoped || !baseScope.styleEl; + var styleEl = this.doc.createElement('style'); + if (!needStyleEl) { + styleEl.innerHTML = cssText; + } + else { + if (isDynamicScoped) { + styleEl['s-sc'] = cssScopeId = baseScope.cssScopeId + "-" + this.count; + styleEl.innerHTML = '/*needs update*/'; + this.hostStyleMap.set(hostEl, styleEl); + this.hostScopeMap.set(hostEl, reScope(baseScope, cssScopeId)); + this.count++; + } + else { + baseScope.styleEl = styleEl; + if (!baseScope.isDynamic) { + styleEl.innerHTML = executeTemplate(baseScope.template, {}); + } + this.globalScopes.push(baseScope); + this.updateGlobal(); + this.hostScopeMap.set(hostEl, baseScope); + } + } + return styleEl; + }; + CustomStyle.prototype.removeHost = function (hostEl) { + var css = this.hostStyleMap.get(hostEl); + if (css) { + css.remove(); + } + this.hostStyleMap.delete(hostEl); + this.hostScopeMap.delete(hostEl); + }; + CustomStyle.prototype.updateHost = function (hostEl) { + var scope = this.hostScopeMap.get(hostEl); + if (scope && scope.isDynamic && scope.cssScopeId) { + var styleEl = this.hostStyleMap.get(hostEl); + if (styleEl) { + var selectors = getActiveSelectors(hostEl, this.hostScopeMap, this.globalScopes); + var props = resolveValues(selectors); + styleEl.innerHTML = executeTemplate(scope.template, props); + } + } + }; + CustomStyle.prototype.updateGlobal = function () { + updateGlobalScopes(this.globalScopes); + }; + CustomStyle.prototype.registerHostTemplate = function (cssText, scopeId) { + var scope = this.scopesMap.get(scopeId); + if (!scope) { + scope = parseCSS(cssText); + scope.cssScopeId = scopeId; + this.scopesMap.set(scopeId, scope); + } + return scope; + }; + return CustomStyle; +}()); +var win = window; +function needsShim() { + return !(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)')); +} +if (!win.__stencil_cssshim && needsShim()) { + win.__stencil_cssshim = new CustomStyle(win, document); +} diff --git a/dist/cjs/dom-7eb7509a-4c879aea.js b/dist/cjs/dom-7eb7509a-4c879aea.js new file mode 100644 index 00000000000..013b2fcdf23 --- /dev/null +++ b/dist/cjs/dom-7eb7509a-4c879aea.js @@ -0,0 +1,40 @@ +'use strict'; + +/* + Copyright (c) 2016 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +(function(){var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);return e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e),!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return !(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var l=a.localName;if("link"===l&&"import"===a.getAttribute("rel")){if((r=a.import)instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}if("template"===l){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n);}r=r.firstChild?r.firstChild:o(t,r);}}function r(t,e,n){t[e]=n;}function a(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1;}function l(t,e){t.b=!0,t.c.push(e);}function c(t,e){t.b&&i(e,function(e){return s(t,e)});}function s(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;n { + return __chunk_1.patchEsm().then(() => { + __chunk_1.bootstrapLazy([["calcite-alert_8.cjs",[[1,"calcite-alert",{"currentAlert":[1,"current-alert"],"dismiss":[4],"icon":[4],"id":[1],"queueLength":[2,"queue-length"],"color":[513],"theme":[513],"duration":[513],"isActive":[32],"close":[64]}],[1,"calcite-alerts",{"id":[1],"currentAlert":[32],"isActive":[32],"queue":[32],"open":[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{"isActive":[4,"is-active"],"text":[1]}],[1,"calcite-modal",{"first":[1],"middle":[1],"last":[1]}],[1,"calcite-tab",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"labeledBy":[32],"getTabIndex":[64],"registerLabeledBy":[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{"id":[1537],"selectedTab":[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"controls":[32],"getTabIndex":[64],"setControledBy":[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{"theme":[513],"tabs":[32],"tabTitles":[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]]], options); + }); +}; + +exports.defineCustomElements = defineCustomElements; diff --git a/dist/cjs/shadow-css-984bac74-b2177096.js b/dist/cjs/shadow-css-984bac74-b2177096.js new file mode 100644 index 00000000000..96de3ebc33a --- /dev/null +++ b/dist/cjs/shadow-css-984bac74-b2177096.js @@ -0,0 +1,404 @@ +'use strict'; + +/** + * @license + * Copyright Google Inc. All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + * + * This file is a port of shadowCSS from webcomponents.js to TypeScript. + * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js + * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts + */ +function scopeCss(cssText, scopeId, commentOriginalSelector) { + const sc = new ShadowCss(); + return sc.shimCssText(cssText, scopeId, scopeId + '-h', scopeId + '-s', commentOriginalSelector); +} +class ShadowCss { + constructor() { + this.strictStyling = true; + } + shimCssText(cssText, scopeId, hostScopeId = '', slotScopeId = '', commentOriginalSelector = false) { + const commentsWithHash = extractCommentsWithHash(cssText); + cssText = stripComments(cssText); + const orgSelectors = []; + if (commentOriginalSelector) { + const processCommentedSelector = (rule) => { + const placeholder = `/*!@___${orgSelectors.length}___*/`; + const comment = `/*!@${rule.selector}*/`; + orgSelectors.push({ placeholder, comment }); + rule.selector = placeholder + rule.selector; + return rule; + }; + cssText = processRules(cssText, rule => { + if (rule.selector[0] !== '@') { + return processCommentedSelector(rule); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + rule.content = processRules(rule.content, processCommentedSelector); + return rule; + } + return rule; + }); + } + const scopedCssText = this._scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + cssText = [scopedCssText, ...commentsWithHash].join('\n'); + if (commentOriginalSelector) { + orgSelectors.forEach(({ placeholder, comment }) => { + cssText = cssText.replace(placeholder, comment); + }); + } + return cssText; + } + _scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) { + // replace :host and :host-context -shadowcsshost and -shadowcsshost respectively + cssText = this._insertPolyfillHostInCssText(cssText); + cssText = this._convertColonHost(cssText); + cssText = this._convertColonHostContext(cssText); + cssText = this._convertColonSlotted(cssText, slotScopeId); + cssText = this._convertShadowDOMSelectors(cssText); + if (scopeId) { + cssText = this._scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + } + cssText = cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`); + cssText = cssText.replace(/>\s*\*\s+([^{, ]+)/gm, ' $1 '); + return cssText.trim(); + } + /* + * convert a rule like :host(.foo) > .bar { } + * + * to + * + * .foo > .bar + */ + _convertColonHost(cssText) { + return this._convertColonRule(cssText, _cssColonHostRe, this._colonHostPartReplacer); + } + /* + * convert a rule like ::slotted(.foo) { } + */ + _convertColonSlotted(cssText, slotAttr) { + const regExp = _cssColonSlottedRe; + return cssText.replace(regExp, function (...m) { + if (m[2]) { + const compound = m[2].trim(); + const suffix = m[3]; + const sel = '.' + slotAttr + ' > ' + compound + suffix; + return sel; + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + } + /* + * convert a rule like :host-context(.foo) > .bar { } + * + * to + * + * .foo > .bar, .foo scopeName > .bar { } + * + * and + * + * :host-context(.foo:host) .bar { ... } + * + * to + * + * .foo .bar { ... } + */ + _convertColonHostContext(cssText) { + return this._convertColonRule(cssText, _cssColonHostContextRe, this._colonHostContextPartReplacer); + } + _convertColonRule(cssText, regExp, partReplacer) { + // m[1] = :host(-context), m[2] = contents of (), m[3] rest of rule + return cssText.replace(regExp, function (...m) { + if (m[2]) { + const parts = m[2].split(','); + const r = []; + for (let i = 0; i < parts.length; i++) { + const p = parts[i].trim(); + if (!p) + break; + r.push(partReplacer(_polyfillHostNoCombinator, p, m[3])); + } + return r.join(','); + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + } + _colonHostContextPartReplacer(host, part, suffix) { + if (part.indexOf(_polyfillHost) > -1) { + return this._colonHostPartReplacer(host, part, suffix); + } + else { + return host + part + suffix + ', ' + part + ' ' + host + suffix; + } + } + _colonHostPartReplacer(host, part, suffix) { + return host + part.replace(_polyfillHost, '') + suffix; + } + /* + * Convert combinators like ::shadow and pseudo-elements like ::content + * by replacing with space. + */ + _convertShadowDOMSelectors(cssText) { + return _shadowDOMSelectorsRe.reduce((result, pattern) => result.replace(pattern, ' '), cssText); + } + // change a selector like 'div' to 'name div' + _scopeSelectors(cssText, scopeSelector, hostSelector, slotSelector, commentOriginalSelector) { + return processRules(cssText, (rule) => { + let selector = rule.selector; + let content = rule.content; + if (rule.selector[0] !== '@') { + selector = + this._scopeSelector(rule.selector, scopeSelector, hostSelector, slotSelector, this.strictStyling); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + content = this._scopeSelectors(rule.content, scopeSelector, hostSelector, slotSelector, commentOriginalSelector); + } + selector = selector.replace(/\s{2,}/g, ' ').trim(); + return new CssRule(selector, content); + }); + } + _scopeSelector(selector, scopeSelector, hostSelector, slotSelector, strict) { + return selector.split(',') + .map(shallowPart => { + if (slotSelector && shallowPart.indexOf('.' + slotSelector) > -1) { + return shallowPart.trim(); + } + if (this._selectorNeedsScoping(shallowPart, scopeSelector)) { + return strict ? + this._applyStrictSelectorScope(shallowPart, scopeSelector, hostSelector).trim() : + this._applySelectorScope(shallowPart, scopeSelector, hostSelector).trim(); + } + else { + return shallowPart.trim(); + } + }) + .join(', '); + } + _selectorNeedsScoping(selector, scopeSelector) { + const re = this._makeScopeMatcher(scopeSelector); + return !re.test(selector); + } + _makeScopeMatcher(scopeSelector) { + const lre = /\[/g; + const rre = /\]/g; + scopeSelector = scopeSelector.replace(lre, '\\[').replace(rre, '\\]'); + return new RegExp('^(' + scopeSelector + ')' + _selectorReSuffix, 'm'); + } + _applySelectorScope(selector, scopeSelector, hostSelector) { + // Difference from webcomponents.js: scopeSelector could not be an array + return this._applySimpleSelectorScope(selector, scopeSelector, hostSelector); + } + // scope via name and [is=name] + _applySimpleSelectorScope(selector, scopeSelector, hostSelector) { + // In Android browser, the lastIndex is not reset when the regex is used in String.replace() + _polyfillHostRe.lastIndex = 0; + if (_polyfillHostRe.test(selector)) { + const replaceBy = this.strictStyling ? `.${hostSelector}` : scopeSelector; + return selector + .replace(_polyfillHostNoCombinatorRe, (_, selector) => { + return selector.replace(/([^:]*)(:*)(.*)/, (_, before, colon, after) => { + return before + replaceBy + colon + after; + }); + }) + .replace(_polyfillHostRe, replaceBy + ' '); + } + return scopeSelector + ' ' + selector; + } + _applyStrictSelectorScope(selector, scopeSelector, hostSelector) { + const isRe = /\[is=([^\]]*)\]/g; + scopeSelector = scopeSelector.replace(isRe, (_, ...parts) => parts[0]); + const className = '.' + scopeSelector; + const _scopeSelectorPart = (p) => { + let scopedP = p.trim(); + if (!scopedP) { + return ''; + } + if (p.indexOf(_polyfillHostNoCombinator) > -1) { + scopedP = this._applySimpleSelectorScope(p, scopeSelector, hostSelector); + } + else { + // remove :host since it should be unnecessary + const t = p.replace(_polyfillHostRe, ''); + if (t.length > 0) { + const matches = t.match(/([^:]*)(:*)(.*)/); + if (matches) { + scopedP = matches[1] + className + matches[2] + matches[3]; + } + } + } + return scopedP; + }; + const safeContent = new SafeSelector(selector); + selector = safeContent.content(); + let scopedSelector = ''; + let startIndex = 0; + let res; + const sep = /( |>|\+|~(?!=))\s*/g; + // If a selector appears before :host it should not be shimmed as it + // matches on ancestor elements and not on elements in the host's shadow + // `:host-context(div)` is transformed to + // `-shadowcsshost-no-combinatordiv, div -shadowcsshost-no-combinator` + // the `div` is not part of the component in the 2nd selectors and should not be scoped. + // Historically `component-tag:host` was matching the component so we also want to preserve + // this behavior to avoid breaking legacy apps (it should not match). + // The behavior should be: + // - `tag:host` -> `tag[h]` (this is to avoid breaking legacy apps, should not match anything) + // - `tag :host` -> `tag [h]` (`tag` is not scoped because it's considered part of a + // `:host-context(tag)`) + const hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1; + // Only scope parts after the first `-shadowcsshost-no-combinator` when it is present + let shouldScope = !hasHost; + while ((res = sep.exec(selector)) !== null) { + const separator = res[1]; + const part = selector.slice(startIndex, res.index).trim(); + shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1; + const scopedPart = shouldScope ? _scopeSelectorPart(part) : part; + scopedSelector += `${scopedPart} ${separator} `; + startIndex = sep.lastIndex; + } + const part = selector.substring(startIndex); + shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1; + scopedSelector += shouldScope ? _scopeSelectorPart(part) : part; + // replace the placeholders with their original values + return safeContent.restore(scopedSelector); + } + _insertPolyfillHostInCssText(selector) { + selector = selector + .replace(_colonHostContextRe, _polyfillHostContext) + .replace(_colonHostRe, _polyfillHost) + .replace(_colonSlottedRe, _polyfillSlotted); + return selector; + } +} +class SafeSelector { + constructor(selector) { + this.placeholders = []; + this.index = 0; + // Replaces attribute selectors with placeholders. + // The WS in [attr="va lue"] would otherwise be interpreted as a selector separator. + selector = selector.replace(/(\[[^\]]*\])/g, (_, keep) => { + const replaceBy = `__ph-${this.index}__`; + this.placeholders.push(keep); + this.index++; + return replaceBy; + }); + // Replaces the expression in `:nth-child(2n + 1)` with a placeholder. + // WS and "+" would otherwise be interpreted as selector separators. + this._content = selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, (_, pseudo, exp) => { + const replaceBy = `__ph-${this.index}__`; + this.placeholders.push(exp); + this.index++; + return pseudo + replaceBy; + }); + } + restore(content) { + return content.replace(/__ph-(\d+)__/g, (_, index) => this.placeholders[+index]); + } + content() { return this._content; } +} +const _polyfillHost = '-shadowcsshost'; +const _polyfillSlotted = '-shadowcssslotted'; +// note: :host-context pre-processed to -shadowcsshostcontext. +const _polyfillHostContext = '-shadowcsscontext'; +const _parenSuffix = ')(?:\\((' + + '(?:\\([^)(]*\\)|[^)(]*)+?' + + ')\\))?([^,{]*)'; +const _cssColonHostRe = new RegExp('(' + _polyfillHost + _parenSuffix, 'gim'); +const _cssColonHostContextRe = new RegExp('(' + _polyfillHostContext + _parenSuffix, 'gim'); +const _cssColonSlottedRe = new RegExp('(' + _polyfillSlotted + _parenSuffix, 'gim'); +const _polyfillHostNoCombinator = _polyfillHost + '-no-combinator'; +const _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/; +const _shadowDOMSelectorsRe = [ + /::shadow/g, + /::content/g +]; +const _selectorReSuffix = '([>\\s~+\[.,{:][\\s\\S]*)?$'; +const _polyfillHostRe = /-shadowcsshost/gim; +const _colonHostRe = /:host/gim; +const _colonSlottedRe = /::slotted/gim; +const _colonHostContextRe = /:host-context/gim; +const _commentRe = /\/\*\s*[\s\S]*?\*\//g; +function stripComments(input) { + return input.replace(_commentRe, ''); +} +const _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g; +function extractCommentsWithHash(input) { + return input.match(_commentWithHashRe) || []; +} +const _ruleRe = /(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g; +const _curlyRe = /([{}])/g; +const OPEN_CURLY = '{'; +const CLOSE_CURLY = '}'; +const BLOCK_PLACEHOLDER = '%BLOCK%'; +class CssRule { + constructor(selector, content) { + this.selector = selector; + this.content = content; + } +} +function processRules(input, ruleCallback) { + const inputWithEscapedBlocks = escapeBlocks(input); + let nextBlockIndex = 0; + return inputWithEscapedBlocks.escapedString.replace(_ruleRe, function (...m) { + const selector = m[2]; + let content = ''; + let suffix = m[4]; + let contentPrefix = ''; + if (suffix && suffix.startsWith('{' + BLOCK_PLACEHOLDER)) { + content = inputWithEscapedBlocks.blocks[nextBlockIndex++]; + suffix = suffix.substring(BLOCK_PLACEHOLDER.length + 1); + contentPrefix = '{'; + } + const rule = ruleCallback(new CssRule(selector, content)); + return `${m[1]}${rule.selector}${m[3]}${contentPrefix}${rule.content}${suffix}`; + }); +} +class StringWithEscapedBlocks { + constructor(escapedString, blocks) { + this.escapedString = escapedString; + this.blocks = blocks; + } +} +function escapeBlocks(input) { + const inputParts = input.split(_curlyRe); + const resultParts = []; + const escapedBlocks = []; + let bracketCount = 0; + let currentBlockParts = []; + for (let partIndex = 0; partIndex < inputParts.length; partIndex++) { + const part = inputParts[partIndex]; + if (part === CLOSE_CURLY) { + bracketCount--; + } + if (bracketCount > 0) { + currentBlockParts.push(part); + } + else { + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + currentBlockParts = []; + } + resultParts.push(part); + } + if (part === OPEN_CURLY) { + bracketCount++; + } + } + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + } + return new StringWithEscapedBlocks(resultParts.join(''), escapedBlocks); +} + +exports.ShadowCss = ShadowCss; +exports.scopeCss = scopeCss; diff --git a/dist/collection/collection-manifest.json b/dist/collection/collection-manifest.json new file mode 100644 index 00000000000..65b16579767 --- /dev/null +++ b/dist/collection/collection-manifest.json @@ -0,0 +1,39 @@ +{ + "entries": [ + "components/calcite-loader/calcite-loader.js", + "components/calcite-modal/calcite-modal.js", + "components/calcite-tabs/calcite-tabs.js", + "components/calcite-alert/calcite-alert.js", + "components/calcite-alerts/calcite-alerts.js", + "components/calcite-tab-nav/calcite-tab-nav.js", + "components/calcite-tab-title/calcite-tab-title.js", + "components/calcite-tab/calcite-tab.js" + ], + "compiler": { + "name": "@stencil/core", + "version": "1.0.0-beta.5", + "typescriptVersion": "3.4.5" + }, + "collections": [ + { + "name": "@stencil/state-tunnel", + "tags": [ + "context-consumer" + ] + } + ], + "bundles": [ + { + "components": [ + "calcite-alert", + "calcite-alerts", + "calcite-loader", + "calcite-modal", + "calcite-tab", + "calcite-tab-nav", + "calcite-tab-title", + "calcite-tabs" + ] + } + ] +} \ No newline at end of file diff --git a/dist/collection/components/calcite-alert/calcite-alert.css b/dist/collection/components/calcite-alert/calcite-alert.css new file mode 100644 index 00000000000..0d6cc2b5486 --- /dev/null +++ b/dist/collection/components/calcite-alert/calcite-alert.css @@ -0,0 +1,318 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host { + position: relative; + justify-content: center; + right: 0; + left: 0; + margin-right: auto; + margin-left: auto; + z-index: 100; + width: 50em; + max-width: 90%; + border-radius: 2px; + background-color: #ffffff; + box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.15); + height: 0; + opacity: 0; + overflow: visible; + display: flex; + border-top: 3px solid; + transition: visibility 0ms linear 300ms, opacity 300ms cubic-bezier(0.215, 0.44, 0.42, 0.88), all 0.15s ease-in-out; + transform: translate3d(0, 1.5rem, 0); + pointer-events: none; + border-width: 0px; +} +@media only screen and (max-width: 600px) { + :host { + max-width: 100%; + border-radius: 2px 2px 0 0; + box-shadow: 0 -6px 12px 0 rgba(0, 0, 0, 0.15); + } +} + +:host([is-active]) { + visibility: visible; + border-width: 3px; + opacity: 1; + height: 100%; + transition-delay: 300ms; + transform: translate3d(0, 0, 0); + pointer-events: initial; +} + +:host slot[name=alert-title]::slotted(div) { + display: block; + font-weight: 500; + font-size: 16px; +} + +:host slot[name=alert-link]::slotted(a) { + display: inline-block; + font-size: 15px; + color: #007ac2; +} + +:host slot[name=alert-message]::slotted(div) { + font-size: 15px; + color: #555555; + display: inline; + margin-inline-end: 0.75rem; +} + +:host([theme=dark]) { + background-color: #2b2b2b; +} + +:host([theme=dark]) slot[name=alert-title]::slotted(div) { + color: #f8f8f8; +} + +:host([theme=dark]) slot[name=alert-message]::slotted(div) { + color: #f3f3f3; +} + +.alert-content { + padding: 0.75rem 1.5rem; + flex: 0 0 auto; + transition-delay: 300ms; + transition: all 0.15s ease-in-out; + flex: 1 1 auto; + min-width: 0; + word-wrap: break-word; + padding-block-start: 0.75rem; + padding-block-end: 0.75rem; + padding-inline-end: 0.75rem; + padding-inline-start: 0; +} +@media only screen and (max-width: 600px) { + .alert-content { + padding: 1.5rem; + } +} +.alert-content svg { + position: relative; + vertical-align: top; + height: 16px; + width: 16px; +} +.alert-content:first-of-type { + padding-inline-start: 1.5rem; +} +@media only screen and (max-width: 600px) { + .alert-content { + padding-block-start: 1.5rem; + padding-block-end: 1.5rem; + padding-inline-end: 0.75rem; + padding-inline-start: 0; + } +} + +.alert-icon { + padding: 0.75rem 1.5rem; + flex: 0 0 auto; + transition-delay: 300ms; + transition: all 0.15s ease-in-out; + display: flex; + align-items: center; +} +@media only screen and (max-width: 600px) { + .alert-icon { + padding: 1.5rem; + } +} +.alert-icon svg { + position: relative; + vertical-align: top; + height: 16px; + width: 16px; +} + +.alert-close { + padding: 0.75rem 1.5rem; + flex: 0 0 auto; + transition-delay: 300ms; + transition: all 0.15s ease-in-out; + -webkit-appearance: none; + background-color: transparent; + border: none; + outline: none; + cursor: pointer; + border-radius: 0 0 2px 0; +} +@media only screen and (max-width: 600px) { + .alert-close { + padding: 1.5rem; + } +} +.alert-close svg { + position: relative; + vertical-align: top; + height: 16px; + width: 16px; +} +.alert-close svg { + fill: #151515; +} +.alert-close:hover, .alert-close:focus { + background-color: #f3f3f3; +} +.alert-close:active { + background-color: #eaeaea; +} +.alert-close:last-child { + border-radius: 0 0 2px 0; +} +:host([dir=rtl]) .alert-close:last-child { + border-radius: 0 0 0 2px; +} +@media only screen and (max-width: 600px) { + .alert-close { + border-radius: 0; + } +} + +:host([theme=dark]) .alert-close svg { + fill: #d4d4d4; +} +:host([theme=dark]) .alert-close:hover, :host([theme=dark]) .alert-close:focus { + background-color: #202020; +} +:host([theme=dark]) .alert-close:active { + background-color: #151515; +} + +.alert-count { + display: flex; + align-items: center; + justify-content: space-evenly; + transition: all 0.15s ease-in; + width: 0; + font-size: 14px; + visibility: hidden; + padding: 0; + font-weight: 500; + text-align: center; + background-color: transparent; + color: #757575; + opacity: 0; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + cursor: default; +} +.alert-count.is-active { + visibility: visible; + transition-delay: 300ms; + opacity: 1; + padding: 0 0.375rem; + width: 3rem; + border-left: 1px solid #f3f3f3; + border-right: 1px solid #f3f3f3; +} +.alert-count.is-active:last-child { + border-right-color: transparent; +} +@media only screen and (max-width: 600px) { + .alert-count { + border-radius: 0; + } +} + +:host([theme=dark]) .alert-count { + color: #d4d4d4; +} +:host([theme=dark]) .alert-count.is-active { + border-left: 1px solid #202020; + border-right: 1px solid #202020; +} + +.alert-dismiss { + display: block; + position: absolute; + top: 0; + left: 0; + right: 0; + top: 0; + height: 3px; + z-index: 101; +} +.alert-dismiss:after { + height: 3px; + top: -3px; + right: 0; + display: block; + position: absolute; + border-radius: 2px 2px 0 0; + content: ""; + width: 50%; + background-color: rgba(255, 255, 255, 0.6); + animation: dismissProgress 10000ms linear; + transition: all 0.15s ease-in-out; + z-index: 200; +} + +:host([theme=dark]) .alert-dismiss:after { + background-color: rgba(43, 43, 43, 0.6); +} + +:host([duration=fast]) .alert-dismiss:after { + animation: dismissProgress 6000ms linear; +} + +:host([duration=medium]) .alert-dismiss:after { + animation: dismissProgress 10000ms linear; +} + +:host([duration=slow]) .alert-dismiss:after { + animation: dismissProgress 14000ms linear; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host([color=blue]) { + border-top-color: #007ac2; +} +:host([color=blue]) .alert-icon svg { + fill: #007ac2; +} + +:host([color=red]) { + border-top-color: #d83020; +} +:host([color=red]) .alert-icon svg { + fill: #d83020; +} + +:host([color=yellow]) { + border-top-color: #edd317; +} +:host([color=yellow]) .alert-icon svg { + fill: #edd317; +} + +:host([color=green]) { + border-top-color: #35ac46; +} +:host([color=green]) .alert-icon svg { + fill: #35ac46; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-alert/calcite-alert.js b/dist/collection/components/calcite-alert/calcite-alert.js new file mode 100644 index 00000000000..d46fc6d1e0f --- /dev/null +++ b/dist/collection/components/calcite-alert/calcite-alert.js @@ -0,0 +1,263 @@ +import { h, Host } from '@stencil/core'; +import { lightbulb24F, exclamationMarkTriangle24F, checkCircle24F, x32 } from '@esri/calcite-ui-icons'; +import AlertInterface from '../../interfaces/AlertInterface'; +export class CalciteAlert { + constructor() { + this.currentAlert = ''; + this.dismiss = false; + this.icon = false; + this.id = '1'; + this.queueLength = 0; + this.color = 'blue'; + this.theme = null; + this.duration = this.dismiss ? 'medium' : null; + this.isActive = this.id === this.currentAlert; + } + async close() { + if (this.isActive) { + this.isActive = false; + this.alertClose.emit(this.id); + } + } + componentWillUpdate() { + this.isActive = this.currentAlert === this.id; + if (this.isActive) + this.alertOpen.emit(this.id); + if (this.isActive && this.dismiss) + setTimeout(() => { this.close(); }, this.duration === 'fast' ? 6000 : this.duration === 'slow' ? 14000 : 10000); + } + setIcon() { + var path = this.color === 'green' ? checkCircle24F : (this.color === 'red' || this.color === 'yellow') ? exclamationMarkTriangle24F : lightbulb24F; + return (h("div", { class: "alert-icon" }, + h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '24', width: '24', viewBox: '0 0 24 24' }, + h("path", { d: path })))); + } + render() { + const closeButton = (h("button", { class: "alert-close", "aria-label": "close", onClick: () => this.close() }, + h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '32', width: '32', viewBox: '0 0 32 32' }, + h("path", { d: x32 })))); + const close = !this.dismiss ? closeButton : ''; + const icon = this.icon ? this.setIcon() : ''; + const count = h("div", { class: `${this.queueLength > 0 ? 'is-active ' : ''}alert-count` }, + "+", + this.queueLength > 0 ? this.queueLength : 1); + const progress = this.isActive && this.dismiss ? h("div", { class: "alert-dismiss" }) : ''; + return (h(Host, { theme: this.theme, "is-active": !!this.isActive, duration: this.duration }, + icon, + h("div", { class: "alert-content" }, + h("slot", { name: "alert-title" }), + h("slot", { name: "alert-message" }), + h("slot", { name: "alert-link" })), + count, + close, + progress)); + } + static get is() { return "calcite-alert"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-alert.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-alert.css"] + }; } + static get properties() { return { + "currentAlert": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "current-alert", + "reflect": false, + "defaultValue": "''" + }, + "dismiss": { + "type": "boolean", + "mutable": false, + "complexType": { + "original": "boolean", + "resolved": "boolean", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "dismiss", + "reflect": false, + "defaultValue": "false" + }, + "icon": { + "type": "boolean", + "mutable": false, + "complexType": { + "original": "boolean", + "resolved": "boolean", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "icon", + "reflect": false, + "defaultValue": "false" + }, + "id": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "id", + "reflect": false, + "defaultValue": "'1'" + }, + "queueLength": { + "type": "number", + "mutable": false, + "complexType": { + "original": "number", + "resolved": "number", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "queue-length", + "reflect": false, + "defaultValue": "0" + }, + "color": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "color", + "reflect": true, + "defaultValue": "'blue'" + }, + "theme": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "theme", + "reflect": true, + "defaultValue": "null" + }, + "duration": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "duration", + "reflect": true, + "defaultValue": "this.dismiss ? 'medium' : null" + } + }; } + static get states() { return { + "isActive": {} + }; } + static get events() { return [{ + "method": "alertClose", + "name": "alertClose", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }, { + "method": "alertOpen", + "name": "alertOpen", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }]; } + static get methods() { return { + "close": { + "complexType": { + "signature": "() => Promise", + "parameters": [], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + } + }; } + static get elementRef() { return "el"; } +} +AlertInterface.injectProps(CalciteAlert, ['currentAlert', 'queueLength']); diff --git a/dist/collection/components/calcite-alerts/calcite-alerts.css b/dist/collection/components/calcite-alerts/calcite-alerts.css new file mode 100644 index 00000000000..06977cec1ee --- /dev/null +++ b/dist/collection/components/calcite-alerts/calcite-alerts.css @@ -0,0 +1,38 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host { + position: fixed; + visibility: hidden; + opacity: 0; + left: 0; + right: 0; + bottom: 1.5rem; + height: 0; + z-index: 101; + pointer-events: none; + transition: all 0.15s ease-in-out; + transition-delay: 300ms; +} +@media only screen and (max-width: 600px) { + :host { + bottom: 0px; + } +} + +:host([is-active]) { + height: auto; + visibility: visible; + opacity: 1; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-alerts/calcite-alerts.js b/dist/collection/components/calcite-alerts/calcite-alerts.js new file mode 100644 index 00000000000..550195f9a5a --- /dev/null +++ b/dist/collection/components/calcite-alerts/calcite-alerts.js @@ -0,0 +1,130 @@ +import { h, Host } from '@stencil/core'; +import AlertInterface from '../../interfaces/AlertInterface'; +export class CalciteAlerts { + constructor() { + this.id = '1'; + this.currentAlert = ''; + this.isActive = false; + this.queue = []; + } + async open(requestedAlert) { + if (!this.queue.includes(requestedAlert)) { + this.isActive = true; + this.currentAlert = requestedAlert; + this.queue.push(requestedAlert); + this.alertsOpen.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + } + updateQueue(event) { + if (this.queue.includes(event.detail)) + this.queue = this.queue.filter(e => e !== event.detail); + if (this.queue.length < 1) + setTimeout(() => { this.isActive = false; }, 300); + this.alertsClose.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + componentWillUpdate() { + this.currentAlert = this.queue.length > 0 ? this.queue[0] : ''; + } + render() { + const alertState = { + currentAlert: this.currentAlert, + queueLength: this.queue.length >= 2 ? this.queue.length - 1 : 0 + }; + return (h(Host, { "is-active": !!this.isActive }, + h(AlertInterface.Provider, { state: alertState }, + h("slot", null)))); + } + static get is() { return "calcite-alerts"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-alerts.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-alerts.css"] + }; } + static get properties() { return { + "id": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "id", + "reflect": false, + "defaultValue": "'1'" + } + }; } + static get states() { return { + "currentAlert": {}, + "isActive": {}, + "queue": {} + }; } + static get events() { return [{ + "method": "alertsClose", + "name": "alertsClose", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }, { + "method": "alertsOpen", + "name": "alertsOpen", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }]; } + static get methods() { return { + "open": { + "complexType": { + "signature": "(requestedAlert: any) => Promise", + "parameters": [{ + "tags": [], + "text": "" + }], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + } + }; } + static get elementRef() { return "el"; } + static get listeners() { return [{ + "name": "alertClose", + "method": "updateQueue", + "target": undefined, + "capture": false, + "passive": false + }]; } +} diff --git a/dist/collection/components/calcite-loader/calcite-loader.css b/dist/collection/components/calcite-loader/calcite-loader.css new file mode 100644 index 00000000000..3291cbe9664 --- /dev/null +++ b/dist/collection/components/calcite-loader/calcite-loader.css @@ -0,0 +1,86 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host .loader-bars, :host .loader-bars:after, :host .loader-bars:before { + background: #007ac2; + -webkit-animation: load 0.8s infinite ease-in-out; + animation: load 0.8s infinite ease-in-out; + width: 0.85rem; + height: 2rem; +} + +:host .loader-bars:after, :host .loader-bars:before { + position: absolute; + top: 0; + content: ""; +} + +:host { + position: relative; + display: none; + padding-bottom: 4.5rem; + padding-top: 4.5rem; +} + +:host([is-active]) { + display: block; +} + +:host .loader-bars { + text-indent: -9999em; + margin: auto; + position: absolute; + right: calc(50% - 0.425rem); + font-size: 11px; + -webkit-animation-delay: 0.16s; + animation-delay: 0.16s; +} +:host .loader-bars:before { + left: -1.25rem; +} +:host .loader-bars:after { + left: 1.25rem; + -webkit-animation-delay: 0.32s; + animation-delay: 0.32s; +} + +:host .loader-text { + padding-top: 4rem; + text-align: center; +} + +@-webkit-keyframes load { + 0%, 80%, 100% { + opacity: 0.75; + box-shadow: 0 0 #007ac2; + height: 2rem; + } + 40% { + opacity: 1; + box-shadow: 0 -0.5rem #007ac2; + height: 2.5rem; + } +} +@keyframes load { + 0%, 80%, 100% { + opacity: 0.75; + box-shadow: 0 0 #007ac2; + height: 2rem; + } + 40% { + opacity: 1; + box-shadow: 0 -0.5rem #007ac2; + height: 2.5rem; + } +} \ No newline at end of file diff --git a/dist/collection/components/calcite-loader/calcite-loader.js b/dist/collection/components/calcite-loader/calcite-loader.js new file mode 100644 index 00000000000..c3126decc48 --- /dev/null +++ b/dist/collection/components/calcite-loader/calcite-loader.js @@ -0,0 +1,59 @@ +import { h, Host } from "@stencil/core"; +export class CalciteLoader { + constructor() { + this.isActive = false; + this.text = "Loading..."; + } + render() { + return (h(Host, { "is-active": !!this.isActive }, + h("div", { class: "loader-bars" }), + h("div", { class: "loader-text" }, this.text))); + } + static get is() { return "calcite-loader"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-loader.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-loader.css"] + }; } + static get properties() { return { + "isActive": { + "type": "boolean", + "mutable": false, + "complexType": { + "original": "boolean", + "resolved": "boolean", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "is-active", + "reflect": false, + "defaultValue": "false" + }, + "text": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "text", + "reflect": false, + "defaultValue": "\"Loading...\"" + } + }; } + static get elementRef() { return "el"; } +} diff --git a/dist/collection/components/calcite-modal/calcite-modal.css b/dist/collection/components/calcite-modal/calcite-modal.css new file mode 100644 index 00000000000..c2a998b90ab --- /dev/null +++ b/dist/collection/components/calcite-modal/calcite-modal.css @@ -0,0 +1,20 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +.example-class { + padding: 1.5rem; + color: #d83020; + box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.05); + border: 1px solid #007ac2; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-modal/calcite-modal.js b/dist/collection/components/calcite-modal/calcite-modal.js new file mode 100644 index 00000000000..23c09c8761f --- /dev/null +++ b/dist/collection/components/calcite-modal/calcite-modal.js @@ -0,0 +1,73 @@ +import { h } from "@stencil/core"; +import { format } from "../../utils/utils"; +export class CalciteModal { + getText() { + return format(this.first, this.middle, this.last); + } + render() { + return h("div", { class: "example-class" }, + "Hello, World! I'm ", + this.getText()); + } + static get is() { return "calcite-modal"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-modal.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-modal.css"] + }; } + static get properties() { return { + "first": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "The first name" + }, + "attribute": "first", + "reflect": false + }, + "middle": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "The middle name" + }, + "attribute": "middle", + "reflect": false + }, + "last": { + "type": "string", + "mutable": false, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "The last name" + }, + "attribute": "last", + "reflect": false + } + }; } +} diff --git a/dist/collection/components/calcite-tab-nav/calcite-tab-nav.css b/dist/collection/components/calcite-tab-nav/calcite-tab-nav.css new file mode 100644 index 00000000000..82980eb8eba --- /dev/null +++ b/dist/collection/components/calcite-tab-nav/calcite-tab-nav.css @@ -0,0 +1,27 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +.tab-nav { + display: flex; + padding: 0.5rem 0; +} + +::slotted(calcite-tab-title) { + margin-right: 1.25rem; +} + +:host([dir=rtl]) ::slotted(calcite-tab-title) { + margin-right: 0; + margin-left: 1.25rem; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-tab-nav/calcite-tab-nav.js b/dist/collection/components/calcite-tab-nav/calcite-tab-nav.js new file mode 100644 index 00000000000..112339f237d --- /dev/null +++ b/dist/collection/components/calcite-tab-nav/calcite-tab-nav.js @@ -0,0 +1,145 @@ +import { h, Host } from "@stencil/core"; +import { guid } from "../../utils/guid"; +export class CalciteTabNav { + constructor() { + this.id = `calite-tab-nav-${guid()}`; + this.selectedTab = 0; + } + selectedTabChanged() { + this.calciteTabChange.emit({ + tab: this.selectedTab + }); + } + focusPreviousTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const previousTab = tabs[currentIndex - 1] || tabs[tabs.length - 1]; + previousTab.focus(); + } + focusNextTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const nextTab = tabs[currentIndex + 1] || tabs[0]; + nextTab.focus(); + } + tabTitleRegistationHandler(e) { + e.target.setControledBy(this.id); + } + activateTabHandler(e) { + if (e.detail.tab) { + this.selectedTab = e.detail.tab; + } + else { + this.selectedTab = this.getIndexOfTabTitle(e.target); + } + } + getIndexOfTabTitle(el) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + return [...tabs].indexOf(el); + } + componentWillLoad() { + this.selectedTabChanged(); + } + render() { + return (h(Host, { role: "tablist" }, + h("nav", { class: "tab-nav" }, + h("slot", null)))); + } + static get is() { return "calcite-tab-nav"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-tab-nav.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-tab-nav.css"] + }; } + static get properties() { return { + "id": { + "type": "string", + "mutable": true, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "id", + "reflect": true, + "defaultValue": "`calite-tab-nav-${guid()}`" + }, + "selectedTab": { + "type": "any", + "mutable": true, + "complexType": { + "original": "number | string", + "resolved": "number | string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "selected-tab", + "reflect": false, + "defaultValue": "0" + } + }; } + static get events() { return [{ + "method": "calciteTabChange", + "name": "calciteTabChange", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "TabChangeEventDetail", + "resolved": "TabChangeEventDetail", + "references": { + "TabChangeEventDetail": { + "location": "import", + "path": "../../interfaces/TabChange" + } + } + } + }]; } + static get elementRef() { return "el"; } + static get watchers() { return [{ + "propName": "selectedTab", + "methodName": "selectedTabChanged" + }]; } + static get listeners() { return [{ + "name": "calciteFocusPreviousTab", + "method": "focusPreviousTabHandler", + "target": undefined, + "capture": false, + "passive": false + }, { + "name": "calciteFocusNextTab", + "method": "focusNextTabHandler", + "target": undefined, + "capture": false, + "passive": false + }, { + "name": "calciteRegisterTabTitle", + "method": "tabTitleRegistationHandler", + "target": undefined, + "capture": false, + "passive": false + }, { + "name": "calciteActivateTab", + "method": "activateTabHandler", + "target": undefined, + "capture": false, + "passive": false + }]; } +} diff --git a/dist/collection/components/calcite-tab-title/calcite-tab-title.css b/dist/collection/components/calcite-tab-title/calcite-tab-title.css new file mode 100644 index 00000000000..476ab289501 --- /dev/null +++ b/dist/collection/components/calcite-tab-title/calcite-tab-title.css @@ -0,0 +1,47 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host { + flex: 0 1 auto; + outline: none; +} + +:host(:active) a, +:host(:focus) a, +:host(:hover) a { + outline: none; + text-decoration: none; + color: var(--calcite-tabs-color-active); + border-bottom-color: var(--calcite-tabs-border-hover); +} + +:host([is-active]) a { + color: var(--calcite-tabs-color-active); + border-bottom-color: var(--calcite-tabs-border-active); +} + +a { + box-sizing: border-box; + font-size: 0.875rem; + line-height: 1.5; + padding: 0.5rem 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + border-bottom: 3px solid transparent; + cursor: pointer; + transition: all 0.15s ease-in-out; + color: var(--calcite-tabs-color); + outline: none; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-tab-title/calcite-tab-title.js b/dist/collection/components/calcite-tab-title/calcite-tab-title.js new file mode 100644 index 00000000000..09a9c02ad59 --- /dev/null +++ b/dist/collection/components/calcite-tab-title/calcite-tab-title.js @@ -0,0 +1,251 @@ +import { h, Host } from "@stencil/core"; +import { guid } from "../../utils/guid"; +import { SPACE, ENTER, LEFT, RIGHT } from "../../utils/keys"; +export class CalciteTabTitle { + constructor() { + this.id = `calite-tab-title-${guid()}`; + this.isActive = false; + } + tabChangeHand(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + onClick() { + this.calciteActivateTab.emit({ + tab: this.tab + }); + } + keyDownHandler(e) { + switch (e.keyCode) { + case SPACE: + case ENTER: + this.onClick(); + break; + case RIGHT: + this.calciteFocusNextTab.emit(); + break; + case LEFT: + this.calciteFocusPreviousTab.emit(); + break; + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTabTitle.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"), this.el)); + } + async setControledBy(id) { + this.controls = id; + } + render() { + return (h(Host, { "aria-controls": this.controls, "aria-expanded": this.isActive ? "true" : "false", role: "tab", tabindex: "0" }, + h("a", null, + h("slot", null)))); + } + static get is() { return "calcite-tab-title"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-tab-title.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-tab-title.css"] + }; } + static get properties() { return { + "id": { + "type": "string", + "mutable": true, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "id", + "reflect": true, + "defaultValue": "`calite-tab-title-${guid()}`" + }, + "tab": { + "type": "string", + "mutable": true, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "tab", + "reflect": true + }, + "isActive": { + "type": "boolean", + "mutable": true, + "complexType": { + "original": "boolean", + "resolved": "boolean", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "is-active", + "reflect": true, + "defaultValue": "false" + } + }; } + static get states() { return { + "controls": {} + }; } + static get events() { return [{ + "method": "calciteActivateTab", + "name": "calciteActivateTab", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "TabChangeEventDetail", + "resolved": "TabChangeEventDetail", + "references": { + "TabChangeEventDetail": { + "location": "import", + "path": "../../interfaces/TabChange" + } + } + } + }, { + "method": "calciteFocusNextTab", + "name": "calciteFocusNextTab", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }, { + "method": "calciteFocusPreviousTab", + "name": "calciteFocusPreviousTab", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "any", + "resolved": "any", + "references": {} + } + }, { + "method": "calciteRegisterTabTitle", + "name": "calciteRegisterTabTitle", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "TabRegisterEventDetail", + "resolved": "TabRegisterEventDetail", + "references": { + "TabRegisterEventDetail": { + "location": "import", + "path": "../../interfaces/TabRegister" + } + } + } + }]; } + static get methods() { return { + "getTabIndex": { + "complexType": { + "signature": "() => Promise", + "parameters": [], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + }, + "setControledBy": { + "complexType": { + "signature": "(id: string) => Promise", + "parameters": [{ + "tags": [], + "text": "" + }], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + } + }; } + static get elementRef() { return "el"; } + static get listeners() { return [{ + "name": "calciteTabChange", + "method": "tabChangeHand", + "target": "parent", + "capture": false, + "passive": false + }, { + "name": "click", + "method": "onClick", + "target": undefined, + "capture": false, + "passive": false + }, { + "name": "keydown", + "method": "keyDownHandler", + "target": undefined, + "capture": false, + "passive": false + }]; } +} diff --git a/dist/collection/components/calcite-tab/calcite-tab.css b/dist/collection/components/calcite-tab/calcite-tab.css new file mode 100644 index 00000000000..7fc8a2e9d22 --- /dev/null +++ b/dist/collection/components/calcite-tab/calcite-tab.css @@ -0,0 +1,21 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host([is-active]) section { + display: block; +} + +section { + display: none; +} \ No newline at end of file diff --git a/dist/collection/components/calcite-tab/calcite-tab.js b/dist/collection/components/calcite-tab/calcite-tab.js new file mode 100644 index 00000000000..7570fd724e3 --- /dev/null +++ b/dist/collection/components/calcite-tab/calcite-tab.js @@ -0,0 +1,169 @@ +import { h, Host } from "@stencil/core"; +import { guid } from "../../utils/guid"; +export class CalciteTab { + constructor() { + this.id = `calite-tab-${guid()}`; + this.isActive = false; + } + tabChangeHandler(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTab.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab"), this.el)); + } + async registerLabeledBy(id) { + this.labeledBy = id; + } + render() { + return (h(Host, { "aria-labeledby": this.labeledBy, "aria-expanded": this.isActive ? "true" : "false", role: "tabpanel" }, + h("section", null, + h("slot", null)))); + } + static get is() { return "calcite-tab"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-tab.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-tab.css"] + }; } + static get properties() { return { + "id": { + "type": "string", + "mutable": true, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "id", + "reflect": true, + "defaultValue": "`calite-tab-${guid()}`" + }, + "tab": { + "type": "string", + "mutable": true, + "complexType": { + "original": "string", + "resolved": "string", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "tab", + "reflect": true + }, + "isActive": { + "type": "boolean", + "mutable": true, + "complexType": { + "original": "boolean", + "resolved": "boolean", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "is-active", + "reflect": true, + "defaultValue": "false" + } + }; } + static get states() { return { + "labeledBy": {} + }; } + static get events() { return [{ + "method": "calciteRegisterTab", + "name": "calciteRegisterTab", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": { + "tags": [], + "text": "" + }, + "complexType": { + "original": "TabRegisterEventDetail", + "resolved": "TabRegisterEventDetail", + "references": { + "TabRegisterEventDetail": { + "location": "import", + "path": "../../interfaces/TabRegister" + } + } + } + }]; } + static get methods() { return { + "getTabIndex": { + "complexType": { + "signature": "() => Promise", + "parameters": [], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + }, + "registerLabeledBy": { + "complexType": { + "signature": "(id: any) => Promise", + "parameters": [{ + "tags": [], + "text": "" + }], + "references": { + "Promise": { + "location": "global" + } + }, + "return": "Promise" + }, + "docs": { + "text": "", + "tags": [] + } + } + }; } + static get elementRef() { return "el"; } + static get listeners() { return [{ + "name": "calciteTabChange", + "method": "tabChangeHandler", + "target": "parent", + "capture": false, + "passive": false + }]; } +} diff --git a/dist/collection/components/calcite-tabs/calcite-tabs.css b/dist/collection/components/calcite-tabs/calcite-tabs.css new file mode 100644 index 00000000000..9efd98a5b01 --- /dev/null +++ b/dist/collection/components/calcite-tabs/calcite-tabs.css @@ -0,0 +1,34 @@ +body { + font-family: "Avenir Next W01", "Avenir Next W00", "Avenir Next", "Avenir", "Helvetica Neue", sans-serif; +} + +@keyframes dismissProgress { + 0% { + width: 0; + opacity: 0; + } + 100% { + width: 100%; + opacity: 1; + } +} +:host { + --calcite-tabs-color: #2b2b2b; + --calcite-tabs-border: #eaeaea; + --calcite-tabs-border-hover: #dfdfdf; + --calcite-tabs-color-active: #151515; + --calcite-tabs-border-active: #007ac2; +} + +:host([theme=dark]) { + --calcite-tabs-color: #f3f3f3; + --calcite-tabs-border: #404040; + --calcite-tabs-border-hover: #757575; + --calcite-tabs-color-active: #f8f8f8; + --calcite-tabs-border-active: #fff; +} + +.tab-contents { + margin-top: 1px; + border-top: 1px solid var(--calcite-tabs-border); +} \ No newline at end of file diff --git a/dist/collection/components/calcite-tabs/calcite-tabs.js b/dist/collection/components/calcite-tabs/calcite-tabs.js new file mode 100644 index 00000000000..d35d441be23 --- /dev/null +++ b/dist/collection/components/calcite-tabs/calcite-tabs.js @@ -0,0 +1,79 @@ +import { h } from "@stencil/core"; +export class CalciteTabs { + constructor() { + this.tabs = {}; + this.tabTitles = {}; + this.theme = "light"; + } + tabTitleRegistationHandler(e) { + const { index, id } = e.detail; + this.tabTitles[index] = { + id: id, + title: e.target + }; + if (this.tabs[index]) { + this.tabs[index].tab.registerLabeledBy(id); + } + } + tabRegistationHandler(e) { + const { index, id } = e.detail; + this.tabs[index] = { + id: id, + tab: e.target + }; + if (this.tabTitles[index]) { + this.tabs[index].tab.registerLabeledBy(this.tabTitles[index].id); + } + } + render() { + return (h("div", null, + h("slot", { name: "tab-nav" }), + h("section", { class: "tab-contents" }, + h("slot", null)))); + } + static get is() { return "calcite-tabs"; } + static get encapsulation() { return "shadow"; } + static get originalStyleUrls() { return { + "$": ["calcite-tabs.scss"] + }; } + static get styleUrls() { return { + "$": ["calcite-tabs.css"] + }; } + static get properties() { return { + "theme": { + "type": "string", + "mutable": false, + "complexType": { + "original": "\"light\" | \"dark\"", + "resolved": "\"dark\" | \"light\"", + "references": {} + }, + "required": false, + "optional": false, + "docs": { + "tags": [], + "text": "" + }, + "attribute": "theme", + "reflect": true, + "defaultValue": "\"light\"" + } + }; } + static get states() { return { + "tabs": {}, + "tabTitles": {} + }; } + static get listeners() { return [{ + "name": "calciteRegisterTabTitle", + "method": "tabTitleRegistationHandler", + "target": undefined, + "capture": false, + "passive": false + }, { + "name": "calciteRegisterTab", + "method": "tabRegistationHandler", + "target": undefined, + "capture": false, + "passive": false + }]; } +} diff --git a/dist/collection/interfaces/AlertInterface.js b/dist/collection/interfaces/AlertInterface.js new file mode 100644 index 00000000000..bb8a1e888bf --- /dev/null +++ b/dist/collection/interfaces/AlertInterface.js @@ -0,0 +1,6 @@ +import { h } from '@stencil/core'; +import { createProviderConsumer } from '@stencil/state-tunnel'; +export default createProviderConsumer({ + currentAlert: '', + queueLength: 0 +}, (subscribe, child) => (h("context-consumer", { subscribe: subscribe, renderer: child }))); diff --git a/dist/collection/interfaces/TabChange.js b/dist/collection/interfaces/TabChange.js new file mode 100644 index 00000000000..e69de29bb2d diff --git a/dist/collection/interfaces/TabRegister.js b/dist/collection/interfaces/TabRegister.js new file mode 100644 index 00000000000..e69de29bb2d diff --git a/dist/collection/utils/guid.js b/dist/collection/utils/guid.js new file mode 100644 index 00000000000..d8225a71d78 --- /dev/null +++ b/dist/collection/utils/guid.js @@ -0,0 +1,14 @@ +// from https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues#Examples +function random() { + return window.crypto.getRandomValues(new Uint32Array(1))[0] / 1e10; +} +function gen(count) { + var out = ""; + for (var i = 0; i < count; i++) { + out += (((1 + random()) * 0x10000) | 0).toString(16).substring(1); + } + return out; +} +export function guid() { + return [gen(2), gen(1), gen(1), gen(1), gen(3)].join("-"); +} diff --git a/dist/collection/utils/keys.js b/dist/collection/utils/keys.js new file mode 100644 index 00000000000..4e58c1453a0 --- /dev/null +++ b/dist/collection/utils/keys.js @@ -0,0 +1,8 @@ +export const ESCAPE = 27; +export const ENTER = 13; +export const SPACE = 32; +export const TAB = 9; +export const UP = 38; +export const DOWN = 40; +export const LEFT = 37; +export const RIGHT = 39; diff --git a/dist/collection/utils/utils.js b/dist/collection/utils/utils.js new file mode 100644 index 00000000000..b6e0c443f5b --- /dev/null +++ b/dist/collection/utils/utils.js @@ -0,0 +1,3 @@ +export function format(first, middle, last) { + return ((first || "") + (middle ? ` ${middle}` : "") + (last ? ` ${last}` : "")); +} diff --git a/dist/esm/calcite-a092ddcb.js b/dist/esm/calcite-a092ddcb.js new file mode 100644 index 00000000000..184f3786b73 --- /dev/null +++ b/dist/esm/calcite-a092ddcb.js @@ -0,0 +1,1648 @@ +const BUILD = {"allRenderFn":true,"cmpDidLoad":true,"cmpDidUnload":false,"cmpDidUpdate":false,"cmpDidRender":false,"cmpWillLoad":true,"cmpWillUpdate":true,"cmpWillRender":false,"connectedCallback":true,"disconnectedCallback":true,"element":false,"event":true,"hasRenderFn":true,"lifecycle":true,"hostListener":true,"hostListenerTargetWindow":false,"hostListenerTargetDocument":false,"hostListenerTargetBody":false,"hostListenerTargetParent":true,"hostListenerTarget":true,"member":true,"method":true,"mode":false,"noVdomRender":false,"observeAttribute":true,"prop":true,"propMutable":true,"reflect":true,"scoped":false,"shadowDom":true,"slot":true,"slotRelocation":true,"state":true,"style":true,"svg":true,"updatable":true,"vdomAttribute":true,"vdomClass":true,"vdomFunctional":true,"vdomKey":true,"vdomListener":true,"vdomRef":true,"vdomRender":true,"vdomStyle":true,"vdomText":true,"watchCallback":true,"taskQueue":true,"lazyLoad":true,"hydrateServerSide":false,"cssVarShim":true,"hydrateClientSide":false,"isDebug":false,"isDev":false,"lifecycleDOMEvents":false,"profile":false,"hotModuleReplacement":false,"constructableCSS":true,"cssAnnotations":true}; +const NAMESPACE = 'calcite'; + +const win = window; +const doc = document; +const plt = { + $flags$: 0, + $resourcesUrl$: '', + raf: (h) => requestAnimationFrame(h), + ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts), + rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts), +}; +const supportsShadowDom = !!doc.documentElement.attachShadow; +const supportsListenerOptions = /*@__PURE__*/ (() => { + let supportsListenerOptions = false; + try { + doc.addEventListener('e', null, Object.defineProperty({}, 'passive', { + get() { supportsListenerOptions = true; } + })); + } + catch (e) { } + return supportsListenerOptions; +})(); +const supportsConstructibleStylesheets = (() => { + try { + new CSSStyleSheet(); + return true; + } + catch (e) { } + return false; +})(); + +const hostRefs = new WeakMap(); +const getHostRef = (ref) => hostRefs.get(ref); +const registerInstance = (lazyInstance, hostRef) => hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef); +const registerHost = (elm) => { + // TODO: it's so ugly, but minifies really well + { + const hostRef = { + $flags$: 0, + $hostElement$: elm + }; + hostRef.$onReadyPromise$ = new Promise(r => hostRef.$onReadyResolve$ = r); + { + hostRef.$instanceValues$ = new Map(); + } + return hostRefs.set(elm, hostRef); + } +}; +const isMemberInElement = (elm, memberName) => memberName in elm; + +const consoleError = (e) => console.error(e); + +const loadModule = (cmpMeta, hostRef, hmrVersionId) => { + // loadModuleImport + const bundleId = cmpMeta.$lazyBundleIds$; + return import( + /* webpackInclude: /\.entry\.js$/ */ + /* webpackExclude: /\.(system|cjs)\.entry\.js$/ */ + /* webpackMode: "lazy" */ + `./${bundleId}.entry.js${''}`).then(importedModule => importedModule[cmpMeta.$tagName$.replace(/-/g, '_')], consoleError); +}; + +const styles = new Map(); +const cssVarShim = win.__stencil_cssshim; + +let queueCongestion = 0; +let queuePending = false; +const queueDomReads = []; +const queueDomWrites = []; +const queueDomWritesLow = []; +const queueTask = (queue) => (cb) => { + // queue dom reads + queue.push(cb); + if (!queuePending) { + queuePending = true; + plt.raf(flush); + } +}; +const consume = (queue) => { + for (let i = 0; i < queue.length; i++) { + try { + queue[i](performance.now()); + } + catch (e) { + consoleError(e); + } + } + queue.length = 0; +}; +const consumeTimeout = (queue, timeout) => { + let i = 0; + let ts = 0; + while (i < queue.length && (ts = performance.now()) < timeout) { + try { + queue[i++](ts); + } + catch (e) { + consoleError(e); + } + } + if (i === queue.length) { + queue.length = 0; + } + else if (i !== 0) { + queue.splice(0, i); + } +}; +const flush = () => { + queueCongestion++; + // always force a bunch of medium callbacks to run, but still have + // a throttle on how many can run in a certain time + // DOM READS!!! + consume(queueDomReads); + const timeout = (plt.$flags$ & 6 /* queueMask */) === 2 /* appLoaded */ + ? performance.now() + (7 * Math.ceil(queueCongestion * (1.0 / 22.0))) + : Infinity; + // DOM WRITES!!! + consumeTimeout(queueDomWrites, timeout); + consumeTimeout(queueDomWritesLow, timeout); + if (queueDomWrites.length > 0) { + queueDomWritesLow.push(...queueDomWrites); + queueDomWrites.length = 0; + } + if (queuePending = ((queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length) > 0)) { + // still more to do yet, but we've run out of time + // let's let this thing cool off and try again in the next tick + plt.raf(flush); + } + else { + queueCongestion = 0; + } +}; +const writeTask = /*@__PURE__*/ queueTask(queueDomWrites); + +/** + * Default style mode id + */ +/** + * Reusable empty obj/array + * Don't add values to these!! + */ +const EMPTY_OBJ = {}; +/** + * Namespaces + */ +const SVG_NS = 'http://www.w3.org/2000/svg'; + +const isDef = (v) => v != null; +const toLowerCase = (str) => str.toLowerCase(); + +function getDynamicImportFunction(namespace) { + return `__sc_import_${namespace.replace(/\s|-/g, '_')}`; +} + +const patchEsm = () => { + // @ts-ignore + if (!(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)'))) { + // @ts-ignore + return import('./css-shim-229ebf7a-229ebf7a.js'); + } + return Promise.resolve(); +}; +const patchBrowser = async () => { + // @ts-ignore + const importMeta = ""; + if (importMeta !== '') { + return Promise.resolve(new URL('.', importMeta).href); + } + else { + const scriptElm = Array.from(doc.querySelectorAll('script')).find(s => (s.src.includes(`/${NAMESPACE}.esm.js`) || + s.getAttribute('data-namespace') === NAMESPACE)); + const resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, doc.baseURI)); + patchDynamicImport(resourcesUrl.href); + if (!window.customElements) { + // @ts-ignore + await import('./dom-7eb7509a-7eb7509a.js'); + } + return resourcesUrl.href; + } +}; +const patchDynamicImport = (base) => { + const importFunctionName = getDynamicImportFunction(NAMESPACE); + try { + win[importFunctionName] = new Function('w', 'return import(w);'); + } + catch (e) { + const moduleMap = new Map(); + win[importFunctionName] = (src) => { + const url = new URL(src, base).href; + let mod = moduleMap.get(url); + if (!mod) { + const script = doc.createElement('script'); + script.type = 'module'; + script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], { type: 'application/javascript' })); + mod = new Promise(resolve => { + script.onload = () => { + resolve(win[importFunctionName].m); + script.remove(); + }; + }); + moduleMap.set(url, mod); + doc.head.appendChild(script); + } + return mod; + }; + } +}; +const HYDRATED_CLASS = 'hydrated'; +const XLINK_NS = 'http://www.w3.org/1999/xlink'; + +const rootAppliedStyles = new WeakMap(); +const registerStyle = (scopeId, cssText) => { + let style = styles.get(scopeId); + if (supportsConstructibleStylesheets) { + style = (style || new CSSStyleSheet()); + style.replace(cssText); + } + else { + style = cssText; + } + styles.set(scopeId, style); +}; +const addStyle = (styleContainerNode, tagName, mode, hostElm) => { + let scopeId = getScopeId(tagName, mode); + let style = styles.get(scopeId); + // if an element is NOT connected then getRootNode() will return the wrong root node + // so the fallback is to always use the document for the root node in those cases + styleContainerNode = (styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc); + if (style) { + if (typeof style === 'string') { + styleContainerNode = styleContainerNode.head || styleContainerNode; + let appliedStyles = rootAppliedStyles.get(styleContainerNode); + let styleElm; + if (!appliedStyles) { + rootAppliedStyles.set(styleContainerNode, appliedStyles = new Set()); + } + if (!appliedStyles.has(scopeId)) { + { + if (cssVarShim) { + styleElm = cssVarShim.createHostStyle(hostElm, scopeId, style); + const newScopeId = styleElm['s-sc']; + if (newScopeId) { + scopeId = newScopeId; + // we don't want to add this styleID to the appliedStyles Set + // since the cssVarShim might need to apply several different + // stylesheets for the same component + appliedStyles = null; + } + } + else { + styleElm = doc.createElement('style'); + styleElm.innerHTML = style; + } + styleContainerNode.appendChild(styleElm); + } + if (appliedStyles) { + appliedStyles.add(scopeId); + } + } + } + else if (!styleContainerNode.adoptedStyleSheets.includes(style)) { + styleContainerNode.adoptedStyleSheets = [ + ...styleContainerNode.adoptedStyleSheets, + style + ]; + } + } + return scopeId; +}; +const attachStyles = (elm, cmpMeta, mode) => { + const styleId = addStyle((supportsShadowDom && elm.shadowRoot) + ? elm.shadowRoot + : elm.getRootNode(), cmpMeta.$tagName$, mode, elm); + if (cmpMeta.$flags$ & 10 /* needsScopedEncapsulation */) { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + // DOM WRITE!! + elm['s-sc'] = styleId; + elm.classList.add(styleId + '-h'); + } +}; +const getScopeId = (tagName, mode) => 'sc-' + (tagName); + +/** + * Production h() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +const stack = []; +function h(nodeName, vnodeData) { + let children = null; + let lastSimple = false; + let simple = false; + let i = arguments.length; + let vkey; + let vname; + for (; i-- > 2;) { + stack.push(arguments[i]); + } + while (stack.length > 0) { + let child = stack.pop(); + if (child && child.pop !== undefined) { + for (i = child.length; i--;) { + stack.push(child[i]); + } + } + else { + if (typeof child === 'boolean') { + child = null; + } + if ((simple = typeof nodeName !== 'function')) { + if (child == null) { + child = ''; + } + else if (typeof child === 'number') { + child = String(child); + } + else if (typeof child !== 'string') { + simple = false; + } + } + if (simple && lastSimple) { + children[children.length - 1].$text$ += child; + } + else if (children === null) { + children = [simple ? { $flags$: 0, $text$: child } : child]; + } + else { + children.push(simple ? { $flags$: 0, $text$: child } : child); + } + lastSimple = simple; + } + } + { + if (vnodeData != null) { + // normalize class / classname attributes + if (vnodeData.className) { + vnodeData['class'] = vnodeData.className; + } + if (typeof vnodeData['class'] === 'object') { + for (i in vnodeData['class']) { + if (vnodeData['class'][i]) { + stack.push(i); + } + } + vnodeData['class'] = stack.join(' '); + stack.length = 0; + } + if (vnodeData.key != null) { + vkey = vnodeData.key; + } + if (vnodeData.name != null) { + vname = vnodeData.name; + } + } + } + if (typeof nodeName === 'function') { + // nodeName is a functional component + return nodeName(vnodeData, children || [], vdomFnUtils); + } + const vnode = { + $tag$: nodeName, + $children$: children, + $elm$: undefined, + $flags$: 0 + }; + { + vnode.$attrs$ = vnodeData; + } + { + vnode.$text$ = undefined; + } + { + vnode.$key$ = vkey; + } + { + vnode.$name$ = vname; + } + return vnode; +} +const Host = {}; +const vdomFnUtils = { + 'forEach': (children, cb) => children.map(convertToPublic).forEach(cb), + 'map': (children, cb) => children.map(convertToPublic).map(cb).map(convertToPrivate) +}; +const convertToPublic = (node) => { + return { + vattrs: node.$attrs$, + vchildren: node.$children$, + vkey: node.$key$, + vname: node.$name$, + vtag: node.$tag$, + vtext: node.$text$ + }; +}; +const convertToPrivate = (node) => { + return { + $flags$: 0, + $attrs$: node.vattrs, + $children$: node.vchildren, + $key$: node.vkey, + $name$: node.vname, + $tag$: node.vtag, + $text$: node.vtext + }; +}; + +/** + * Production setAccessor() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => { + if (oldValue === newValue) { + return; + } + if (memberName === 'class' && !isSvg) { + // Class + { + const oldList = parseClassList(oldValue); + const baseList = parseClassList(elm.className).filter(item => !oldList.includes(item)); + elm.className = baseList.concat(parseClassList(newValue).filter(item => !baseList.includes(item))).join(' '); + } + } + else if (memberName === 'style') { + // update style attribute, css properties and values + { + for (const prop in oldValue) { + if (!newValue || newValue[prop] == null) { + if (prop.includes('-')) { + elm.style.removeProperty(prop); + } + else { + elm.style[prop] = ''; + } + } + } + } + for (const prop in newValue) { + if (!oldValue || newValue[prop] !== oldValue[prop]) { + if (prop.includes('-')) { + elm.style.setProperty(prop, newValue[prop]); + } + else { + elm.style[prop] = newValue[prop]; + } + } + } + } + else if (memberName === 'key') ; + else if (memberName === 'ref') { + // minifier will clean this up + if (newValue) { + newValue(elm); + } + } + else if (memberName.startsWith('on') && !isMemberInElement(elm, memberName)) { + // Event Handlers + // so if the member name starts with "on" and the 3rd characters is + // a capital letter, and it's not already a member on the element, + // then we're assuming it's an event listener + if (isMemberInElement(elm, toLowerCase(memberName))) { + // standard event + // the JSX attribute could have been "onMouseOver" and the + // member name "onmouseover" is on the element's prototype + // so let's add the listener "mouseover", which is all lowercased + memberName = toLowerCase(memberName.substring(2)); + } + else { + // custom event + // the JSX attribute could have been "onMyCustomEvent" + // so let's trim off the "on" prefix and lowercase the first character + // and add the listener "myCustomEvent" + // except for the first character, we keep the event name case + memberName = toLowerCase(memberName[2]) + memberName.substring(3); + } + if (oldValue) { + plt.rel(elm, memberName, oldValue, false); + } + if (newValue) { + plt.ael(elm, memberName, newValue, false); + } + } + else { + // Set property if it exists and it's not a SVG + const isProp = isMemberInElement(elm, memberName); + const isComplex = ['object', 'function'].includes(typeof newValue); + if ((isProp || (isComplex && newValue !== null)) && !isSvg) { + try { + elm[memberName] = newValue == null && elm.tagName.indexOf('-') === -1 ? '' : newValue; + } + catch (e) { } + } + /** + * Need to manually update attribute if: + * - memberName is not an attribute + * - if we are rendering the host element in order to reflect attribute + * - if it's a SVG, since properties might not work in + * - if the newValue is null/undefined or 'false'. + */ + const isXlinkNs = isSvg && (memberName !== (memberName = memberName.replace(/^xlink\:?/, ''))) ? true : false; + if (newValue == null || newValue === false) { + if (isXlinkNs) { + elm.removeAttributeNS(XLINK_NS, toLowerCase(memberName)); + } + else { + elm.removeAttribute(memberName); + } + } + else if ((!isProp || (flags & 4 /* isHost */) || isSvg) && !isComplex) { + newValue = newValue === true ? '' : newValue.toString(); + if (isXlinkNs) { + elm.setAttributeNS(XLINK_NS, toLowerCase(memberName), newValue); + } + else { + elm.setAttribute(memberName, newValue); + } + } + } +}; +const parseClassList = (value) => (!value) ? [] : value.split(' '); + +const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => { + // if the element passed in is a shadow root, which is a document fragment + // then we want to be adding attrs/props to the shadow root's "host" element + // if it's not a shadow root, then we add attrs/props to the same element + const elm = (newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host) ? newVnode.$elm$.host : newVnode.$elm$; + const oldVnodeAttrs = (oldVnode && oldVnode.$attrs$) || EMPTY_OBJ; + const newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ; + { + // remove attributes no longer present on the vnode by setting them to undefined + for (memberName in oldVnodeAttrs) { + if (newVnodeAttrs[memberName] == null && oldVnodeAttrs[memberName] != null) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], undefined, isSvgMode, newVnode.$flags$); + } + } + } + // add new & update changed attributes + for (memberName in newVnodeAttrs) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$); + } +}; + +let scopeId; +let contentRef; +let hostTagName; +let useNativeShadowDom = false; +let checkSlotFallbackVisibility = false; +let checkSlotRelocate = false; +let isSvgMode = false; +const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => { + const newVNode = newParentVNode.$children$[childIndex]; + let i = 0; + let elm; + let childNode; + let oldVNode; + if (!useNativeShadowDom) { + // remember for later we need to check to relocate nodes + checkSlotRelocate = true; + if (newVNode.$tag$ === 'slot') { + if (scopeId) { + // scoped css needs to add its scoped id to the parent element + parentElm.classList.add(scopeId + '-s'); + } + if (!newVNode.$children$) { + // slot element does not have fallback content + // create an html comment we'll use to always reference + // where actual slot content should sit next to + newVNode.$flags$ |= 1 /* isSlotReference */; + } + else { + // slot element has fallback content + // still create an element that "mocks" the slot element + newVNode.$flags$ |= 2 /* isSlotFallback */; + } + } + } + if (isDef(newVNode.$text$)) { + // create text node + newVNode.$elm$ = doc.createTextNode(newVNode.$text$); + } + else if (newVNode.$flags$ & 1 /* isSlotReference */) { + // create a slot reference node + newVNode.$elm$ = doc.createTextNode(''); + } + else { + // create element + elm = newVNode.$elm$ = ((isSvgMode || newVNode.$tag$ === 'svg') + ? doc.createElementNS(SVG_NS, newVNode.$tag$) + : doc.createElement((newVNode.$flags$ & 2 /* isSlotFallback */) ? 'slot-fb' : newVNode.$tag$)); + { + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + // add css classes, attrs, props, listeners, etc. + { + updateElement(null, newVNode, isSvgMode); + } + if (isDef(scopeId) && elm['s-si'] !== scopeId) { + // if there is a scopeId and this is the initial render + // then let's add the scopeId as a css class + elm.classList.add((elm['s-si'] = scopeId)); + } + if (newVNode.$children$) { + for (i = 0; i < newVNode.$children$.length; ++i) { + // create the node + childNode = createElm(oldParentVNode, newVNode, i, elm); + // return node could have been null + if (childNode) { + // append our new node + elm.appendChild(childNode); + } + } + } + if (newVNode.$tag$ === 'svg') { + // Only reset the SVG context when we're exiting SVG element + isSvgMode = false; + } + } + { + newVNode.$elm$['s-hn'] = hostTagName; + if (newVNode.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) { + // remember the content reference comment + newVNode.$elm$['s-sr'] = true; + // remember the content reference comment + newVNode.$elm$['s-cr'] = contentRef; + // remember the slot name, or empty string for default slot + newVNode.$elm$['s-sn'] = newVNode.$name$ || ''; + // check if we've got an old vnode for this slot + oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex]; + if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) { + // we've got an old slot vnode and the wrapper is being replaced + // so let's move the old slot content back to it's original location + putBackInOriginalLocation(oldParentVNode.$elm$, false); + } + } + } + return newVNode.$elm$; +}; +const putBackInOriginalLocation = (parentElm, recursive) => { + plt.$flags$ |= 1 /* isTmpDisconnected */; + const oldSlotChildNodes = parentElm.childNodes; + for (let i = oldSlotChildNodes.length - 1; i >= 0; i--) { + const childNode = oldSlotChildNodes[i]; + if (childNode['s-hn'] !== hostTagName && childNode['s-ol']) { + // // this child node in the old element is from another component + // // remove this node from the old slot's parent + // childNode.remove(); + // and relocate it back to it's original location + parentReferenceNode(childNode).insertBefore(childNode, referenceNode(childNode)); + // remove the old original location comment entirely + // later on the patch function will know what to do + // and move this to the correct spot in need be + childNode['s-ol'].remove(); + childNode['s-ol'] = undefined; + checkSlotRelocate = true; + } + if (recursive) { + putBackInOriginalLocation(childNode, recursive); + } + } + plt.$flags$ &= ~1 /* isTmpDisconnected */; +}; +const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => { + let containerElm = ((parentElm['s-cr'] && parentElm['s-cr'].parentNode) || parentElm); + let childNode; + if (containerElm.shadowRoot && toLowerCase(containerElm.tagName) === hostTagName) { + containerElm = containerElm.shadowRoot; + } + for (; startIdx <= endIdx; ++startIdx) { + if (vnodes[startIdx]) { + childNode = createElm(null, parentVNode, startIdx, parentElm); + if (childNode) { + vnodes[startIdx].$elm$ = childNode; + containerElm.insertBefore(childNode, referenceNode(before)); + } + } + } +}; +const removeVnodes = (vnodes, startIdx, endIdx, elm) => { + for (; startIdx <= endIdx; ++startIdx) { + if (isDef(vnodes[startIdx])) { + elm = vnodes[startIdx].$elm$; + callNodeRefs(vnodes[startIdx], true); + { + // we're removing this element + // so it's possible we need to show slot fallback content now + checkSlotFallbackVisibility = true; + if (elm['s-ol']) { + // remove the original location comment + elm['s-ol'].remove(); + } + else { + // it's possible that child nodes of the node + // that's being removed are slot nodes + putBackInOriginalLocation(elm, true); + } + } + // remove the vnode's element from the dom + elm.remove(); + } + } +}; +const updateChildren = (parentElm, oldCh, newVNode, newCh) => { + let oldStartIdx = 0; + let newStartIdx = 0; + let idxInOld = 0; + let i = 0; + let oldEndIdx = oldCh.length - 1; + let oldStartVnode = oldCh[0]; + let oldEndVnode = oldCh[oldEndIdx]; + let newEndIdx = newCh.length - 1; + let newStartVnode = newCh[0]; + let newEndVnode = newCh[newEndIdx]; + let node; + let elmToMove; + while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) { + if (oldStartVnode == null) { + // Vnode might have been moved left + oldStartVnode = oldCh[++oldStartIdx]; + } + else if (oldEndVnode == null) { + oldEndVnode = oldCh[--oldEndIdx]; + } + else if (newStartVnode == null) { + newStartVnode = newCh[++newStartIdx]; + } + else if (newEndVnode == null) { + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newStartVnode)) { + patch(oldStartVnode, newStartVnode); + oldStartVnode = oldCh[++oldStartIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else if (isSameVnode(oldEndVnode, newEndVnode)) { + patch(oldEndVnode, newEndVnode); + oldEndVnode = oldCh[--oldEndIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newEndVnode)) { + // Vnode moved right + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false); + } + patch(oldStartVnode, newEndVnode); + parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling); + oldStartVnode = oldCh[++oldStartIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldEndVnode, newStartVnode)) { + // Vnode moved left + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false); + } + patch(oldEndVnode, newStartVnode); + parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$); + oldEndVnode = oldCh[--oldEndIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else { + // createKeyToOldIdx + idxInOld = -1; + { + for (i = oldStartIdx; i <= oldEndIdx; ++i) { + if (oldCh[i] && isDef(oldCh[i].$key$) && oldCh[i].$key$ === newStartVnode.$key$) { + idxInOld = i; + break; + } + } + } + if (idxInOld >= 0) { + elmToMove = oldCh[idxInOld]; + if (elmToMove.$tag$ !== newStartVnode.$tag$) { + node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld, parentElm); + } + else { + patch(elmToMove, newStartVnode); + oldCh[idxInOld] = undefined; + node = elmToMove.$elm$; + } + newStartVnode = newCh[++newStartIdx]; + } + else { + // new element + node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx, parentElm); + newStartVnode = newCh[++newStartIdx]; + } + if (node) { + { + parentReferenceNode(oldStartVnode.$elm$).insertBefore(node, referenceNode(oldStartVnode.$elm$)); + } + } + } + } + if (oldStartIdx > oldEndIdx) { + addVnodes(parentElm, (newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$), newVNode, newCh, newStartIdx, newEndIdx); + } + else if (newStartIdx > newEndIdx) { + removeVnodes(oldCh, oldStartIdx, oldEndIdx); + } +}; +const isSameVnode = (vnode1, vnode2) => { + // compare if two vnode to see if they're "technically" the same + // need to have the same element tag, and same key to be the same + if (vnode1.$tag$ === vnode2.$tag$) { + if (vnode1.$tag$ === 'slot') { + return vnode1.$name$ === vnode2.$name$; + } + { + return vnode1.$key$ === vnode2.$key$; + } + return true; + } + return false; +}; +const referenceNode = (node) => { + if (node && node['s-ol']) { + // this node was relocated to a new location in the dom + // because of some other component's slot + // but we still have an html comment in place of where + // it's original location was according to it's original vdom + return node['s-ol']; + } + return node; +}; +const parentReferenceNode = (node) => (node['s-ol'] ? node['s-ol'] : node).parentNode; +const patch = (oldVNode, newVNode) => { + const elm = newVNode.$elm$ = oldVNode.$elm$; + const oldChildren = oldVNode.$children$; + const newChildren = newVNode.$children$; + let defaultHolder; + { + // test if we're rendering an svg element, or still rendering nodes inside of one + // only add this to the when the compiler sees we're using an svg somewhere + isSvgMode = elm && + isDef(elm.parentNode) && + elm.ownerSVGElement !== undefined; + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + if (!isDef(newVNode.$text$)) { + // element node + { + if (newVNode.$tag$ === 'slot') ; + else { + // either this is the first render of an element OR it's an update + // AND we already know it's possible it could have changed + // this updates the element's css classes, attrs, props, listeners, etc. + updateElement(oldVNode, newVNode, isSvgMode); + } + } + if (isDef(oldChildren) && isDef(newChildren)) { + // looks like there's child vnodes for both the old and new vnodes + updateChildren(elm, oldChildren, newVNode, newChildren); + } + else if (isDef(newChildren)) { + // no old child vnodes, but there are new child vnodes to add + if (isDef(oldVNode.$text$)) { + // the old vnode was text, so be sure to clear it out + elm.textContent = ''; + } + // add the new vnode children + addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1); + } + else if (isDef(oldChildren)) { + // no new child vnodes, but there are old child vnodes to remove + removeVnodes(oldChildren, 0, oldChildren.length - 1); + } + } + else if (defaultHolder = elm['s-cr']) { + // this element has slotted content + defaultHolder.parentNode.textContent = newVNode.$text$; + } + else if (oldVNode.$text$ !== newVNode.$text$) { + // update the text content for the text only vnode + // and also only if the text is different than before + elm.textContent = newVNode.$text$; + } + { + // reset svgMode when svg node is fully patched + if (isSvgMode && 'svg' === newVNode.$tag$) { + isSvgMode = false; + } + } +}; +const updateFallbackSlotVisibility = (elm, childNode, childNodes, i, ilen, j, slotNameAttr, nodeType) => { + childNodes = elm.childNodes; + for (i = 0, ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode.nodeType === 1 /* ElementNode */) { + if (childNode['s-sr']) { + // this is a slot fallback node + // get the slot name for this slot reference node + slotNameAttr = childNode['s-sn']; + // by default always show a fallback slot node + // then hide it if there are other slots in the light dom + childNode.hidden = false; + for (j = 0; j < ilen; j++) { + if (childNodes[j]['s-hn'] !== childNode['s-hn']) { + // this sibling node is from a different component + nodeType = childNodes[j].nodeType; + if (slotNameAttr !== '') { + // this is a named fallback slot node + if (nodeType === 1 /* ElementNode */ && slotNameAttr === childNodes[j].getAttribute('slot')) { + childNode.hidden = true; + break; + } + } + else { + // this is a default fallback slot node + // any element or text node (with content) + // should hide the default fallback slot node + if (nodeType === 1 /* ElementNode */ || (nodeType === 3 /* TextNode */ && childNodes[j].textContent.trim() !== '')) { + childNode.hidden = true; + break; + } + } + } + } + } + // keep drilling down + updateFallbackSlotVisibility(childNode); + } + } +}; +const relocateNodes = []; +const relocateSlotContent = (elm) => { + // tslint:disable-next-line: prefer-const + let childNodes = elm.childNodes; + let ilen = childNodes.length; + let i = 0; + let j = 0; + let nodeType = 0; + let childNode; + let node; + let hostContentNodes; + let slotNameAttr; + for (ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode['s-sr'] && (node = childNode['s-cr'])) { + // first got the content reference comment node + // then we got it's parent, which is where all the host content is in now + hostContentNodes = node.parentNode.childNodes; + slotNameAttr = childNode['s-sn']; + for (j = hostContentNodes.length - 1; j >= 0; j--) { + node = hostContentNodes[j]; + if (!node['s-cn'] && !node['s-nr'] && node['s-hn'] !== childNode['s-hn']) { + // let's do some relocating to its new home + // but never relocate a content reference node + // that is suppose to always represent the original content location + nodeType = node.nodeType; + if (((nodeType === 3 /* TextNode */ || nodeType === 8 /* CommentNode */) && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === null && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === slotNameAttr)) { + // it's possible we've already decided to relocate this node + if (!relocateNodes.some(r => r.nodeToRelocate === node)) { + // made some changes to slots + // let's make sure we also double check + // fallbacks are correctly hidden or shown + checkSlotFallbackVisibility = true; + node['s-sn'] = slotNameAttr; + // add to our list of nodes to relocate + relocateNodes.push({ + slotRefNode: childNode, + nodeToRelocate: node + }); + } + } + } + } + } + if (childNode.nodeType === 1 /* ElementNode */) { + relocateSlotContent(childNode); + } + } +}; +const callNodeRefs = (vNode, isDestroy) => { + if (vNode) { + vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(isDestroy ? null : vNode.$elm$); + vNode.$children$ && vNode.$children$.forEach(vChild => { + callNodeRefs(vChild, isDestroy); + }); + } +}; +const isHost = (node) => { + return node && node.$tag$ === Host; +}; +const renderVdom = (hostElm, hostRef, cmpMeta, renderFnResults) => { + const oldVNode = hostRef.$vnode$ || { $flags$: 0 }; + hostTagName = toLowerCase(hostElm.tagName); + if (isHost(renderFnResults)) { + renderFnResults.$tag$ = null; + } + else { + renderFnResults = h(null, null, renderFnResults); + } + if (cmpMeta.$attrsToReflect$) { + renderFnResults.$attrs$ = renderFnResults.$attrs$ || {}; + cmpMeta.$attrsToReflect$.forEach(([propName, attribute]) => renderFnResults.$attrs$[attribute] = hostElm[propName]); + } + renderFnResults.$flags$ |= 4 /* isHost */; + hostRef.$vnode$ = renderFnResults; + renderFnResults.$elm$ = oldVNode.$elm$ = (hostElm.shadowRoot || hostElm); + { + scopeId = hostElm['s-sc']; + } + { + contentRef = hostElm['s-cr']; + useNativeShadowDom = supportsShadowDom && (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0; + // always reset + checkSlotRelocate = checkSlotFallbackVisibility = false; + } + // synchronous patch + patch(oldVNode, renderFnResults); + { + if (checkSlotRelocate) { + relocateSlotContent(renderFnResults.$elm$); + for (let i = 0; i < relocateNodes.length; i++) { + const relocateNode = relocateNodes[i]; + if (!relocateNode.nodeToRelocate['s-ol']) { + // add a reference node marking this node's original location + // keep a reference to this node for later lookups + const orgLocationNode = doc.createTextNode(''); + orgLocationNode['s-nr'] = relocateNode.nodeToRelocate; + relocateNode.nodeToRelocate.parentNode.insertBefore((relocateNode.nodeToRelocate['s-ol'] = orgLocationNode), relocateNode.nodeToRelocate); + } + } + // while we're moving nodes around existing nodes, temporarily disable + // the disconnectCallback from working + plt.$flags$ |= 1 /* isTmpDisconnected */; + for (let i = 0; i < relocateNodes.length; i++) { + const relocateNode = relocateNodes[i]; + // by default we're just going to insert it directly + // after the slot reference node + const parentNodeRef = relocateNode.slotRefNode.parentNode; + let insertBeforeNode = relocateNode.slotRefNode.nextSibling; + let orgLocationNode = relocateNode.nodeToRelocate['s-ol']; + while (orgLocationNode = orgLocationNode.previousSibling) { + let refNode = orgLocationNode['s-nr']; + if (refNode && refNode) { + if (refNode['s-sn'] === relocateNode.nodeToRelocate['s-sn']) { + if (parentNodeRef === refNode.parentNode) { + if ((refNode = refNode.nextSibling) && refNode && !refNode['s-nr']) { + insertBeforeNode = refNode; + break; + } + } + } + } + } + if ((!insertBeforeNode && parentNodeRef !== relocateNode.nodeToRelocate.parentNode) || + (relocateNode.nodeToRelocate.nextSibling !== insertBeforeNode)) { + // we've checked that it's worth while to relocate + // since that the node to relocate + // has a different next sibling or parent relocated + if (relocateNode.nodeToRelocate !== insertBeforeNode) { + // add it back to the dom but in its new home + parentNodeRef.insertBefore(relocateNode.nodeToRelocate, insertBeforeNode); + } + } + } + // done moving nodes around + // allow the disconnect callback to work again + plt.$flags$ &= ~1 /* isTmpDisconnected */; + } + if (checkSlotFallbackVisibility) { + updateFallbackSlotVisibility(renderFnResults.$elm$); + } + // always reset + relocateNodes.length = 0; + } +}; + +const safeCall = async (instance, method) => { + if (instance && instance[method]) { + try { + await instance[method](); + } + catch (e) { + consoleError(e); + } + } +}; +const scheduleUpdate = async (elm, hostRef, cmpMeta, isInitialLoad) => { + { + hostRef.$flags$ |= 16 /* isQueuedForUpdate */; + } + const instance = hostRef.$lazyInstance$; + if (isInitialLoad) { + { + await safeCall(instance, 'componentWillLoad'); + } + } + else { + { + await safeCall(instance, 'componentWillUpdate'); + } + } + // there is no ancestorc omponent or the ancestor component + // has already fired off its lifecycle update then + // fire off the initial update + { + writeTask(() => updateComponent(elm, hostRef, cmpMeta, isInitialLoad, instance)); + } +}; +const updateComponent = (elm, hostRef, cmpMeta, isInitialLoad, instance) => { + // updateComponent + { + hostRef.$flags$ &= ~16 /* isQueuedForUpdate */; + } + { + elm['s-lr'] = false; + } + if (isInitialLoad) { + // DOM WRITE! + attachStyles(elm, cmpMeta, hostRef.$modeName$); + } + { + { + // tell the platform we're actively rendering + // if a value is changed within a render() then + // this tells the platform not to queue the change + hostRef.$flags$ |= 4 /* isActiveRender */; + try { + // looks like we've got child nodes to render into this host element + // or we need to update the css class/attrs on the host element + // DOM WRITE! + renderVdom(elm, hostRef, cmpMeta, instance.render()); + } + catch (e) { + consoleError(e); + } + hostRef.$flags$ &= ~4 /* isActiveRender */; + } + } + if (cssVarShim) { + cssVarShim.updateHost(elm); + } + // set that this component lifecycle rendering has completed + { + elm['s-lr'] = true; + } + { + hostRef.$flags$ |= 2 /* hasRendered */; + } + if (elm['s-rc'].length > 0) { + // ok, so turns out there are some child host elements + // waiting on this parent element to load + // let's fire off all update callbacks waiting + elm['s-rc'].forEach(cb => cb()); + elm['s-rc'].length = 0; + } + postUpdateComponent(elm, hostRef); +}; +const postUpdateComponent = (elm, hostRef, ancestorsActivelyLoadingChildren) => { + if (!elm['s-al']) { + const instance = hostRef.$lazyInstance$; + const ancestorComponent = hostRef.$ancestorComponent$; + if (!(hostRef.$flags$ & 512 /* hasLoadedComponent */)) { + hostRef.$flags$ |= 512 /* hasLoadedComponent */; + { + // DOM WRITE! + // add the css class that this element has officially hydrated + elm.classList.add(HYDRATED_CLASS); + } + { + safeCall(instance, 'componentDidLoad'); + } + { + hostRef.$onReadyResolve$(elm); + } + if (!ancestorComponent) { + // on appload + // we have finish the first big initial render + doc.documentElement.classList.add(HYDRATED_CLASS); + { + setTimeout(() => plt.$flags$ |= 2 /* appLoaded */, 999); + } + } + } + // load events fire from bottom to top + // the deepest elements load first then bubbles up + if (ancestorComponent) { + // ok so this element already has a known ancestor component + // let's make sure we remove this element from its ancestor's + // known list of child elements which are actively loading + if (ancestorsActivelyLoadingChildren = ancestorComponent['s-al']) { + // remove this element from the actively loading map + ancestorsActivelyLoadingChildren.delete(elm); + // the ancestor's initializeComponent method will do the actual checks + // to see if the ancestor is actually loaded or not + // then let's call the ancestor's initializeComponent method if there's no length + // (which actually ends up as this method again but for the ancestor) + if (ancestorsActivelyLoadingChildren.size === 0) { + ancestorComponent['s-al'] = undefined; + ancestorComponent['s-init'](); + } + } + hostRef.$ancestorComponent$ = undefined; + } + // ( •_•) + // ( •_•)>⌐■-■ + // (⌐■_■) + } +}; + +const disconnectedCallback = (elm) => { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + const hostRef = getHostRef(elm); + { + if (hostRef.$rmListeners$) { + hostRef.$rmListeners$(); + hostRef.$rmListeners$ = undefined; + } + } + // clear CSS var-shim tracking + if (cssVarShim) { + cssVarShim.removeHost(elm); + } + const instance = hostRef.$lazyInstance$; + { + safeCall(instance, 'disconnectedCallback'); + } + } +}; + +const parsePropertyValue = (propValue, expectedPropType) => { + // ensure this value is of the correct prop type + if (propValue != null && typeof propValue !== 'object' && typeof propValue !== 'function') { + if (expectedPropType & 4 /* Boolean */) { + // per the HTML spec, any string value means it is a boolean true value + // but we'll cheat here and say that the string "false" is the boolean false + return (propValue === 'false' ? false : propValue === '' || !!propValue); + } + if (expectedPropType & 2 /* Number */) { + // force it to be a number + return parseFloat(propValue); + } + if (expectedPropType & 1 /* String */) { + // could have been passed as a number or boolean + // but we still want it as a string + return String(propValue); + } + // redundant return here for better minification + return propValue; + } + // not sure exactly what type we want + // so no need to change to a different type + return propValue; +}; + +const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName); +const setValue = (ref, propName, newVal, cmpMeta) => { + // check our new property value against our internal value + const hostRef = getHostRef(ref); + const elm = hostRef.$hostElement$; + const oldVal = hostRef.$instanceValues$.get(propName); + const flags = hostRef.$flags$; + newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]); + if (newVal !== oldVal && (!(flags & 8 /* isConstructingInstance */) || oldVal === undefined)) { + // gadzooks! the property's value has changed!! + // set our new value! + hostRef.$instanceValues$.set(propName, newVal); + if (hostRef.$lazyInstance$) { + // get an array of method names of watch functions to call + if (cmpMeta.$watchers$ && + (flags & (1 /* hasConnected */ | 8 /* isConstructingInstance */)) === 1 /* hasConnected */) { + const watchMethods = cmpMeta.$watchers$[propName]; + if (watchMethods) { + // this instance is watching for when this property changed + watchMethods.forEach(watchMethodName => { + try { + // fire off each of the watch methods that are watching this property + (hostRef.$lazyInstance$)[watchMethodName].call((hostRef.$lazyInstance$), newVal, oldVal, propName); + } + catch (e) { + consoleError(e); + } + }); + } + } + if ((flags & (4 /* isActiveRender */ | 2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) { + // looks like this value actually changed, so we've got work to do! + // but only if we've already rendered, otherwise just chill out + // queue that we need to do an update, but don't worry about queuing + // up millions cuz this function ensures it only runs once + scheduleUpdate(elm, hostRef, cmpMeta, false); + } + } + } +}; + +const proxyComponent = (Cstr, cmpMeta, isElementConstructor, proxyState) => { + if (cmpMeta.$members$) { + if (Cstr.watchers) { + cmpMeta.$watchers$ = Cstr.watchers; + } + // It's better to have a const than two Object.entries() + const members = Object.entries(cmpMeta.$members$); + members.forEach(([memberName, [memberFlags]]) => { + if ((memberFlags & 31) || (proxyState && (memberFlags & 32 /* State */))) { + // proxyComponent - prop + Object.defineProperty(Cstr.prototype, memberName, { + get() { + // proxyComponent, get value + return getValue(this, memberName); + }, + set(newValue) { + // proxyComponent, set value + setValue(this, memberName, newValue, cmpMeta); + }, + configurable: true, + enumerable: true + }); + } + else if (isElementConstructor && (memberFlags & 64 /* Method */)) { + // proxyComponent - method + Object.defineProperty(Cstr.prototype, memberName, { + value(...args) { + const ref = getHostRef(this); + return ref.$onReadyPromise$.then(() => ref.$lazyInstance$[memberName](...args)); + } + }); + } + }); + if (isElementConstructor) { + const attrNameToPropName = new Map(); + Cstr.prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) { + const propName = attrNameToPropName.get(attrName); + this[propName] = newValue === null && typeof this[propName] === 'boolean' + ? false + : newValue; + }; + // create an array of attributes to observe + // and also create a map of html attribute name to js property name + Cstr.observedAttributes = members + .filter(([_, m]) => m[0] & 15 /* HasAttribute */) // filter to only keep props that should match attributes + .map(([propName, m]) => { + const attrName = m[1] || propName; + attrNameToPropName.set(attrName, propName); + if (m[0] & 512 /* ReflectAttr */) { + cmpMeta.$attrsToReflect$.push([propName, attrName]); + } + return attrName; + }); + } + } + return Cstr; +}; + +const addEventListeners = (elm, hostRef, listeners) => { + const removeFns = listeners.map(([flags, name, method]) => { + const target = (getHostListenerTarget(elm, flags)); + const handler = hostListenerProxy(hostRef, method); + const opts = hostListenerOpts(flags); + plt.ael(target, name, handler, opts); + return () => plt.rel(target, name, handler, opts); + }); + return () => removeFns.forEach(fn => fn()); +}; +const hostListenerProxy = (hostRef, methodName) => { + return (ev) => { + { + if (hostRef.$lazyInstance$) { + // instance is ready, let's call it's member method for this event + return hostRef.$lazyInstance$[methodName](ev); + } + else { + return hostRef.$onReadyPromise$.then(() => hostRef.$lazyInstance$[methodName](ev)).catch(consoleError); + } + } + }; +}; +const getHostListenerTarget = (elm, flags) => { + if (flags & 16 /* TargetParent */) + return elm.parentElement; + return elm; +}; +const hostListenerOpts = (flags) => supportsListenerOptions ? + { + 'passive': (flags & 1 /* Passive */) !== 0, + 'capture': (flags & 2 /* Capture */) !== 0, + } + : (flags & 2 /* Capture */) !== 0; + +const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => { + // initializeComponent + if ((hostRef.$flags$ & 256 /* hasInitializedComponent */) === 0) { + // we haven't initialized this element yet + hostRef.$flags$ |= 256 /* hasInitializedComponent */; + { + // lazy loaded components + // request the component's implementation to be + // wired up with the host element + Cstr = await loadModule(cmpMeta, hostRef, hmrVersionId); + if (!Cstr.isProxied) { + // we'eve never proxied this Constructor before + // let's add the getters/setters to its prototype before + // the first time we create an instance of the implementation + { + cmpMeta.$watchers$ = Cstr.watchers; + } + proxyComponent(Cstr, cmpMeta, 0, 1); + Cstr.isProxied = true; + } + // ok, time to construct the instance + // but let's keep track of when we start and stop + // so that the getters/setters don't incorrectly step on data + { + hostRef.$flags$ |= 8 /* isConstructingInstance */; + } + // construct the lazy-loaded component implementation + // passing the hostRef is very important during + // construction in order to directly wire together the + // host element and the lazy-loaded instance + try { + new Cstr(hostRef); + } + catch (e) { + consoleError(e); + } + { + hostRef.$flags$ &= ~8 /* isConstructingInstance */; + } + fireConnectedCallback(hostRef.$lazyInstance$); + } + if (!Cstr.isStyleRegistered && Cstr.style) { + // this component has styles but we haven't registered them yet + let style = Cstr.style; + let scopeId = getScopeId(cmpMeta.$tagName$, hostRef.$modeName$); + if (cmpMeta.$flags$ & 8 /* needsShadowDomShim */) { + style = await import('./shadow-css-984bac74-549b16dd.js').then(m => m.scopeCss(style, scopeId, false)); + } + registerStyle(scopeId, style); + Cstr.isStyleRegistered = true; + } + } + // we've successfully created a lazy instance + const ancestorComponent = hostRef.$ancestorComponent$; + if (ancestorComponent && !ancestorComponent['s-lr'] && ancestorComponent['s-rc']) { + // this is the intial load and this component it has an ancestor component + // but the ancestor component has NOT fired its will update lifecycle yet + // so let's just cool our jets and wait for the ancestor to continue first + ancestorComponent['s-rc'].push(() => + // this will get fired off when the ancestor component + // finally gets around to rendering its lazy self + // fire off the initial update + initializeComponent(elm, hostRef, cmpMeta)); + } + else { + scheduleUpdate(elm, hostRef, cmpMeta, true); + } +}; + +const fireConnectedCallback = (instance) => { + { + safeCall(instance, 'connectedCallback'); + } +}; +const connectedCallback = (elm, cmpMeta) => { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + // connectedCallback + const hostRef = getHostRef(elm); + if (cmpMeta.$listeners$) { + // initialize our event listeners on the host element + // we do this now so that we can listening to events that may + // have fired even before the instance is ready + hostRef.$rmListeners$ = addEventListeners(elm, hostRef, cmpMeta.$listeners$); + } + if (!(hostRef.$flags$ & 1 /* hasConnected */)) { + // first time this component has connected + hostRef.$flags$ |= 1 /* hasConnected */; + let hostId; + if (!hostId) { + // initUpdate + // if the slot polyfill is required we'll need to put some nodes + // in here to act as original content anchors as we move nodes around + // host element has been connected to the DOM + if (cmpMeta.$flags$ & 4 || + (cmpMeta.$flags$ & 8 /* needsShadowDomShim */)) { + setContentReference(elm); + } + } + { + // find the first ancestor component (if there is one) and register + // this component as one of the actively loading child components for its ancestor + let ancestorComponent = elm; + while ((ancestorComponent = (ancestorComponent.parentNode || ancestorComponent.host))) { + // climb up the ancestors looking for the first + // component that hasn't finished its lifecycle update yet + if ((ancestorComponent['s-init'] && !ancestorComponent['s-lr']) || (BUILD.hydrateClientSide && ancestorComponent.nodeType === 1 /* ElementNode */ && ancestorComponent.hasAttribute('s-id'))) { + // we found this components first ancestor component + // keep a reference to this component's ancestor component + hostRef.$ancestorComponent$ = ancestorComponent; + // ensure there is an array to contain a reference to each of the child components + // and set this component as one of the ancestor's child components it should wait on + (ancestorComponent['s-al'] = ancestorComponent['s-al'] || new Set()).add(elm); + break; + } + } + } + // Lazy properties + // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties + if (cmpMeta.$members$) { + Object.entries(cmpMeta.$members$).forEach(([memberName, [memberFlags]]) => { + if (memberFlags & 31 /* Prop */ && elm.hasOwnProperty(memberName)) { + const value = elm[memberName]; + delete elm[memberName]; + elm[memberName] = value; + } + }); + } + { + initializeComponent(elm, hostRef, cmpMeta); + } + } + fireConnectedCallback(hostRef.$lazyInstance$); + } +}; +const setContentReference = (elm, contentRefElm) => { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + let crName; + { + crName = ''; + } + contentRefElm = elm['s-cr'] = doc.createComment(crName); + contentRefElm['s-cn'] = true; + elm.insertBefore(contentRefElm, elm.firstChild); +}; + +const bootstrapLazy = (lazyBundles, options = {}) => { + const cmpTags = []; + const exclude = options.exclude || []; + const head = doc.head; + const customElements = win.customElements; + const y = /*@__PURE__*/ head.querySelector('meta[charset]'); + const visibilityStyle = /*@__PURE__*/ doc.createElement('style'); + Object.assign(plt, options); + plt.$resourcesUrl$ = new URL(options.resourcesUrl || '/', doc.baseURI).href; + if (options.syncQueue) { + plt.$flags$ |= 4 /* queueSync */; + } + lazyBundles.forEach(lazyBundle => lazyBundle[1].forEach(compactMeta => { + const cmpMeta = { + $flags$: compactMeta[0], + $tagName$: compactMeta[1], + $members$: compactMeta[2], + $listeners$: compactMeta[3], + }; + { + cmpMeta.$attrsToReflect$ = []; + } + { + cmpMeta.$watchers$ = {}; + } + if (!supportsShadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + cmpMeta.$flags$ |= 8 /* needsShadowDomShim */; + } + const tagName = cmpMeta.$tagName$; + const HostElement = class extends HTMLElement { + // StencilLazyHost + constructor(self) { + // @ts-ignore + super(self); + self = this; + { + this['s-lr'] = false; + this['s-rc'] = []; + } + registerHost(self); + if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + // this component is using shadow dom + // and this browser supports shadow dom + // add the read-only property "shadowRoot" to the host element + if (supportsShadowDom) { + self.attachShadow({ 'mode': 'open' }); + } + else if (!('shadowRoot' in self)) { + self.shadowRoot = self; + } + } + } + connectedCallback() { + connectedCallback(this, cmpMeta); + } + disconnectedCallback() { + disconnectedCallback(this); + } + 's-init'() { + const hostRef = getHostRef(this); + if (hostRef.$lazyInstance$) { + postUpdateComponent(this, hostRef); + } + } + 's-hmr'(hmrVersionId) { + } + forceUpdate() { + { + const hostRef = getHostRef(this); + scheduleUpdate(this, hostRef, cmpMeta, false); + } + } + componentOnReady() { + return getHostRef(this).$onReadyPromise$; + } + }; + cmpMeta.$lazyBundleIds$ = lazyBundle[0]; + if (!exclude.includes(tagName) && !customElements.get(tagName)) { + cmpTags.push(tagName); + customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1, 0)); + } + })); + // visibilityStyle.innerHTML = cmpTags.map(t => `${t}:not(.hydrated)`) + '{display:none}'; + visibilityStyle.innerHTML = cmpTags + '{visibility:hidden}.hydrated{visibility:inherit}'; + visibilityStyle.setAttribute('data-styles', ''); + head.insertBefore(visibilityStyle, y ? y.nextSibling : head.firstChild); +}; + +const createEvent = (ref, name, flags) => { + const elm = getElement(ref); + return { + emit: (detail) => elm.dispatchEvent(new (CustomEvent)(name, { + bubbles: !!(flags & 4 /* Bubbles */), + composed: !!(flags & 2 /* Composed */), + cancelable: !!(flags & 1 /* Cancellable */), + detail + })) + }; +}; + +const getElement = (ref) => getHostRef(ref).$hostElement$; + +export { patchBrowser as a, bootstrapLazy as b, patchEsm as c, h as d, registerInstance as e, createEvent as f, Host as g, getElement as h }; diff --git a/dist/esm/calcite-alert_8.entry.js b/dist/esm/calcite-alert_8.entry.js new file mode 100644 index 00000000000..c36b223795e --- /dev/null +++ b/dist/esm/calcite-alert_8.entry.js @@ -0,0 +1,389 @@ +import { d as h, e as registerInstance, f as createEvent, g as Host, h as getElement } from './calcite-a092ddcb.js'; + +// File generated automatically by path-data.js, do not edit directly +const checkCircle24F = "M23 11.5A11.5 11.5 0 1 1 11.5 0 11.5 11.5 0 0 1 23 11.5zm-5.5-6.018l-8.5 8.5-3.5-3.5-2 2L9.018 18l.018-.018L11.018 16l8.5-8.5z"; +const exclamationMarkTriangle24F = "M22.3 19.795l-9-17.901a1.5 1.5 0 0 0-2.597 0L1.7 19.795a1.502 1.502 0 0 0 0 1.502A1.456 1.456 0 0 0 2.998 22H21a1.458 1.458 0 0 0 1.299-.703 1.506 1.506 0 0 0 .001-1.502zM13 19h-2v-2h2zm0-3h-2V8h2z"; +const lightbulb24F = "M11 13h1v4h-1zm3.895 5.45a.311.311 0 0 0-.12-.27l-.232-.18h-6.19l-.232.18a.312.312 0 0 0 .04.518l1.387.771-1.367.76a.311.311 0 0 0-.028.526l3.09 2.18a.356.356 0 0 0 .41 0l3.09-2.18a.311.311 0 0 0-.029-.527l-1.366-.759 1.388-.77a.312.312 0 0 0 .159-.25zM11.59 0l-.173.002L11.244 0a6.2 6.2 0 0 0-6.182 6.698c.31 2.575 2.784 5.207 2.939 6.134.13.78.116 1.844.199 2.472A2.542 2.542 0 0 0 9.088 17H10v-4.412L8.83 9.37l.94-.342L10.85 12h1.3l1.08-2.97.94.341L13 12.588V17h.745a2.542 2.542 0 0 0 .889-1.696c.083-.628.068-1.692.199-2.472.154-.927 2.628-3.559 2.938-6.134A6.2 6.2 0 0 0 11.59 0z"; +const x32 = "M16.707 16l10.607 10.606-.708.707L16 16.707 5.394 27.313l-.708-.707L15.293 16 4.686 5.394l.708-.707L16 15.293 26.606 4.687l.708.707z"; + +const createProviderConsumer = (defaultState, consumerRender) => { + let listeners = new Map(); + let currentState = defaultState; + const updateListener = (fields, instance) => { + if (Array.isArray(fields)) { + [...fields].forEach(fieldName => { + instance[fieldName] = currentState[fieldName]; + }); + } + else { + instance[fields] = Object.assign({}, currentState); + } + }; + const subscribe = (instance, propList) => { + if (!listeners.has(instance)) { + listeners.set(instance, propList); + updateListener(propList, instance); + } + return () => { + if (listeners.has(instance)) { + listeners.delete(instance); + } + }; + }; + const Provider = ({ state }, children) => { + currentState = state; + listeners.forEach(updateListener); + return children; + }; + const Consumer = (props, children) => { + // The casting on subscribe is to allow for crossover through the stencil compiler + // In the future we should allow for generics in components. + return consumerRender(subscribe, children[0]); + }; + const injectProps = (Cstr, fieldList) => { + const CstrPrototype = Cstr.prototype; + const cstrConnectedCallback = CstrPrototype.connectedCallback; + const cstrDisconnectedCallback = CstrPrototype.disconnectedCallback; + CstrPrototype.connectedCallback = function () { + subscribe(this, fieldList); + if (cstrConnectedCallback) { + return cstrConnectedCallback.call(this); + } + }; + CstrPrototype.disconnectedCallback = function () { + listeners.delete(this); + if (cstrDisconnectedCallback) { + cstrDisconnectedCallback.call(this); + } + }; + }; + return { + Provider, + Consumer, + injectProps + }; +}; + +const AlertInterface = createProviderConsumer({ + currentAlert: '', + queueLength: 0 +}, (subscribe, child) => (h("context-consumer", { subscribe: subscribe, renderer: child }))); + +class CalciteAlert { + constructor(hostRef) { + registerInstance(this, hostRef); + this.currentAlert = ''; + this.dismiss = false; + this.icon = false; + this.id = '1'; + this.queueLength = 0; + this.color = 'blue'; + this.theme = null; + this.duration = this.dismiss ? 'medium' : null; + this.isActive = this.id === this.currentAlert; + this.alertClose = createEvent(this, "alertClose", 7); + this.alertOpen = createEvent(this, "alertOpen", 7); + } + async close() { + if (this.isActive) { + this.isActive = false; + this.alertClose.emit(this.id); + } + } + componentWillUpdate() { + this.isActive = this.currentAlert === this.id; + if (this.isActive) + this.alertOpen.emit(this.id); + if (this.isActive && this.dismiss) + setTimeout(() => { this.close(); }, this.duration === 'fast' ? 6000 : this.duration === 'slow' ? 14000 : 10000); + } + setIcon() { + var path = this.color === 'green' ? checkCircle24F : (this.color === 'red' || this.color === 'yellow') ? exclamationMarkTriangle24F : lightbulb24F; + return (h("div", { class: "alert-icon" }, h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '24', width: '24', viewBox: '0 0 24 24' }, h("path", { d: path })))); + } + render() { + const closeButton = (h("button", { class: "alert-close", "aria-label": "close", onClick: () => this.close() }, h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '32', width: '32', viewBox: '0 0 32 32' }, h("path", { d: x32 })))); + const close = !this.dismiss ? closeButton : ''; + const icon = this.icon ? this.setIcon() : ''; + const count = h("div", { class: `${this.queueLength > 0 ? 'is-active ' : ''}alert-count` }, "+", this.queueLength > 0 ? this.queueLength : 1); + const progress = this.isActive && this.dismiss ? h("div", { class: "alert-dismiss" }) : ''; + return (h(Host, { theme: this.theme, "is-active": !!this.isActive, duration: this.duration }, icon, h("div", { class: "alert-content" }, h("slot", { name: "alert-title" }), h("slot", { name: "alert-message" }), h("slot", { name: "alert-link" })), count, close, progress)); + } + get el() { return getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:relative;-ms-flex-pack:center;justify-content:center;right:0;left:0;margin-right:auto;margin-left:auto;z-index:100;width:50em;max-width:90%;border-radius:2px;background-color:#fff;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,.15);box-shadow:0 0 12px 0 rgba(0,0,0,.15);height:0;opacity:0;overflow:visible;display:-ms-flexbox;display:flex;border-top:3px solid;-webkit-transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;-webkit-transform:translate3d(0,1.5rem,0);transform:translate3d(0,1.5rem,0);pointer-events:none;border-width:0}\@media only screen and (max-width:600px){:host{max-width:100%;border-radius:2px 2px 0 0;-webkit-box-shadow:0 -6px 12px 0 rgba(0,0,0,.15);box-shadow:0 -6px 12px 0 rgba(0,0,0,.15)}}:host([is-active]){visibility:visible;border-width:3px;opacity:1;height:100%;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translateZ(0);transform:translateZ(0);pointer-events:auto}:host slot[name=alert-title]::slotted(div){display:block;font-weight:500;font-size:16px}:host slot[name=alert-link]::slotted(a){display:inline-block;font-size:15px;color:#007ac2}:host slot[name=alert-message]::slotted(div){font-size:15px;color:#555;display:inline;-webkit-margin-end:.75rem;margin-inline-end:.75rem}:host([theme=dark]){background-color:#2b2b2b}:host([theme=dark]) slot[name=alert-title]::slotted(div){color:#f8f8f8}:host([theme=dark]) slot[name=alert-message]::slotted(div){color:#f3f3f3}.alert-content{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;word-wrap:break-word;-webkit-padding-before:.75rem;padding-block-start:.75rem;-webkit-padding-after:.75rem;padding-block-end:.75rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}\@media only screen and (max-width:600px){.alert-content{padding:1.5rem}}.alert-content svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-content:first-of-type{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}\@media only screen and (max-width:600px){.alert-content{-webkit-padding-before:1.5rem;padding-block-start:1.5rem;-webkit-padding-after:1.5rem;padding-block-end:1.5rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}}.alert-icon{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}\@media only screen and (max-width:600px){.alert-icon{padding:1.5rem}}.alert-icon svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-close{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-appearance:none;background-color:transparent;border:none;outline:none;cursor:pointer;border-radius:0 0 2px 0}\@media only screen and (max-width:600px){.alert-close{padding:1.5rem}}.alert-close svg{position:relative;vertical-align:top;height:16px;width:16px;fill:#151515}.alert-close:focus,.alert-close:hover{background-color:#f3f3f3}.alert-close:active{background-color:#eaeaea}.alert-close:last-child{border-radius:0 0 2px 0}:host([dir=rtl]) .alert-close:last-child{border-radius:0 0 0 2px}\@media only screen and (max-width:600px){.alert-close{border-radius:0}}:host([theme=dark]) .alert-close svg{fill:#d4d4d4}:host([theme=dark]) .alert-close:focus,:host([theme=dark]) .alert-close:hover{background-color:#202020}:host([theme=dark]) .alert-close:active{background-color:#151515}.alert-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-transition:all .15s ease-in;transition:all .15s ease-in;width:0;font-size:14px;visibility:hidden;padding:0;font-weight:500;text-align:center;background-color:transparent;color:#757575;opacity:0;border-left:1px solid transparent;border-right:1px solid transparent;cursor:default}.alert-count.is-active{visibility:visible;-webkit-transition-delay:.3s;transition-delay:.3s;opacity:1;padding:0 .375rem;width:3rem;border-left:1px solid #f3f3f3;border-right:1px solid #f3f3f3}.alert-count.is-active:last-child{border-right-color:transparent}\@media only screen and (max-width:600px){.alert-count{border-radius:0}}:host([theme=dark]) .alert-count{color:#d4d4d4}:host([theme=dark]) .alert-count.is-active{border-left:1px solid #202020;border-right:1px solid #202020}.alert-dismiss{left:0;top:0;z-index:101}.alert-dismiss,.alert-dismiss:after{display:block;position:absolute;right:0;height:3px}.alert-dismiss:after{top:-3px;border-radius:2px 2px 0 0;content:\"\";width:50%;background-color:hsla(0,0%,100%,.6);-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;z-index:200}:host([theme=dark]) .alert-dismiss:after{background-color:rgba(43,43,43,.6)}:host([duration=fast]) .alert-dismiss:after{-webkit-animation:dismissProgress 6s linear;animation:dismissProgress 6s linear}:host([duration=medium]) .alert-dismiss:after{-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear}:host([duration=slow]) .alert-dismiss:after{-webkit-animation:dismissProgress 14s linear;animation:dismissProgress 14s linear}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([color=blue]){border-top-color:#007ac2}:host([color=blue]) .alert-icon svg{fill:#007ac2}:host([color=red]){border-top-color:#d83020}:host([color=red]) .alert-icon svg{fill:#d83020}:host([color=yellow]){border-top-color:#edd317}:host([color=yellow]) .alert-icon svg{fill:#edd317}:host([color=green]){border-top-color:#35ac46}:host([color=green]) .alert-icon svg{fill:#35ac46}"; } +} +AlertInterface.injectProps(CalciteAlert, ['currentAlert', 'queueLength']); + +class CalciteAlerts { + constructor(hostRef) { + registerInstance(this, hostRef); + this.id = '1'; + this.currentAlert = ''; + this.isActive = false; + this.queue = []; + this.alertsClose = createEvent(this, "alertsClose", 7); + this.alertsOpen = createEvent(this, "alertsOpen", 7); + } + async open(requestedAlert) { + if (!this.queue.includes(requestedAlert)) { + this.isActive = true; + this.currentAlert = requestedAlert; + this.queue.push(requestedAlert); + this.alertsOpen.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + } + updateQueue(event) { + if (this.queue.includes(event.detail)) + this.queue = this.queue.filter(e => e !== event.detail); + if (this.queue.length < 1) + setTimeout(() => { this.isActive = false; }, 300); + this.alertsClose.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + componentWillUpdate() { + this.currentAlert = this.queue.length > 0 ? this.queue[0] : ''; + } + render() { + const alertState = { + currentAlert: this.currentAlert, + queueLength: this.queue.length >= 2 ? this.queue.length - 1 : 0 + }; + return (h(Host, { "is-active": !!this.isActive }, h(AlertInterface.Provider, { state: alertState }, h("slot", null)))); + } + get el() { return getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:fixed;visibility:hidden;opacity:0;left:0;right:0;bottom:1.5rem;height:0;z-index:101;pointer-events:none;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-transition-delay:.3s;transition-delay:.3s}\@media only screen and (max-width:600px){:host{bottom:0}}:host([is-active]){height:auto;visibility:visible;opacity:1}"; } +} + +class CalciteLoader { + constructor(hostRef) { + registerInstance(this, hostRef); + this.isActive = false; + this.text = "Loading..."; + } + render() { + return (h(Host, { "is-active": !!this.isActive }, h("div", { class: "loader-bars" }), h("div", { class: "loader-text" }, this.text))); + } + get el() { return getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host .loader-bars,:host .loader-bars:after,:host .loader-bars:before{background:#007ac2;-webkit-animation:load .8s ease-in-out infinite;animation:load .8s ease-in-out infinite;width:.85rem;height:2rem}:host .loader-bars:after,:host .loader-bars:before{position:absolute;top:0;content:\"\"}:host{position:relative;display:none;padding-bottom:4.5rem;padding-top:4.5rem}:host([is-active]){display:block}:host .loader-bars{text-indent:-9999em;margin:auto;position:absolute;right:calc(50% - .425rem);font-size:11px;-webkit-animation-delay:.16s;animation-delay:.16s}:host .loader-bars:before{left:-1.25rem}:host .loader-bars:after{left:1.25rem;-webkit-animation-delay:.32s;animation-delay:.32s}:host .loader-text{padding-top:4rem;text-align:center}\@-webkit-keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}\@keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}"; } +} + +function format(first, middle, last) { + return ((first || "") + (middle ? ` ${middle}` : "") + (last ? ` ${last}` : "")); +} + +class CalciteModal { + constructor(hostRef) { + registerInstance(this, hostRef); + } + getText() { + return format(this.first, this.middle, this.last); + } + render() { + return h("div", { class: "example-class" }, "Hello, World! I'm ", this.getText()); + } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.example-class{padding:1.5rem;color:#d83020;-webkit-box-shadow:0 0 16px 0 rgba(0,0,0,.05);box-shadow:0 0 16px 0 rgba(0,0,0,.05);border:1px solid #007ac2}"; } +} + +// from https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues#Examples +function random() { + return window.crypto.getRandomValues(new Uint32Array(1))[0] / 1e10; +} +function gen(count) { + var out = ""; + for (var i = 0; i < count; i++) { + out += (((1 + random()) * 0x10000) | 0).toString(16).substring(1); + } + return out; +} +function guid() { + return [gen(2), gen(1), gen(1), gen(1), gen(3)].join("-"); +} + +class CalciteTab { + constructor(hostRef) { + registerInstance(this, hostRef); + this.id = `calite-tab-${guid()}`; + this.isActive = false; + this.calciteRegisterTab = createEvent(this, "calciteRegisterTab", 7); + } + tabChangeHandler(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTab.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab"), this.el)); + } + async registerLabeledBy(id) { + this.labeledBy = id; + } + render() { + return (h(Host, { "aria-labeledby": this.labeledBy, "aria-expanded": this.isActive ? "true" : "false", role: "tabpanel" }, h("section", null, h("slot", null)))); + } + get el() { return getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([is-active]) section{display:block}section{display:none}"; } +} + +class CalciteTabNav { + constructor(hostRef) { + registerInstance(this, hostRef); + this.id = `calite-tab-nav-${guid()}`; + this.selectedTab = 0; + this.calciteTabChange = createEvent(this, "calciteTabChange", 7); + } + selectedTabChanged() { + this.calciteTabChange.emit({ + tab: this.selectedTab + }); + } + focusPreviousTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const previousTab = tabs[currentIndex - 1] || tabs[tabs.length - 1]; + previousTab.focus(); + } + focusNextTabHandler(e) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + const currentIndex = this.getIndexOfTabTitle(e.target); + const nextTab = tabs[currentIndex + 1] || tabs[0]; + nextTab.focus(); + } + tabTitleRegistationHandler(e) { + e.target.setControledBy(this.id); + } + activateTabHandler(e) { + if (e.detail.tab) { + this.selectedTab = e.detail.tab; + } + else { + this.selectedTab = this.getIndexOfTabTitle(e.target); + } + } + getIndexOfTabTitle(el) { + const tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + return [...tabs].indexOf(el); + } + componentWillLoad() { + this.selectedTabChanged(); + } + render() { + return (h(Host, { role: "tablist" }, h("nav", { class: "tab-nav" }, h("slot", null)))); + } + get el() { return getElement(this); } + static get watchers() { return { + "selectedTab": ["selectedTabChanged"] + }; } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.tab-nav{display:-ms-flexbox;display:flex;padding:.5rem 0}::slotted(calcite-tab-title){margin-right:1.25rem}:host([dir=rtl]) ::slotted(calcite-tab-title){margin-right:0;margin-left:1.25rem}"; } +} + +const ENTER = 13; +const SPACE = 32; +const LEFT = 37; +const RIGHT = 39; + +class CalciteTabTitle { + constructor(hostRef) { + registerInstance(this, hostRef); + this.id = `calite-tab-title-${guid()}`; + this.isActive = false; + this.calciteActivateTab = createEvent(this, "calciteActivateTab", 7); + this.calciteFocusNextTab = createEvent(this, "calciteFocusNextTab", 7); + this.calciteFocusPreviousTab = createEvent(this, "calciteFocusPreviousTab", 7); + this.calciteRegisterTabTitle = createEvent(this, "calciteRegisterTabTitle", 7); + } + tabChangeHand(event) { + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(index => { + this.isActive = index === event.detail.tab; + }); + } + } + onClick() { + this.calciteActivateTab.emit({ + tab: this.tab + }); + } + keyDownHandler(e) { + switch (e.keyCode) { + case SPACE: + case ENTER: + this.onClick(); + break; + case RIGHT: + this.calciteFocusNextTab.emit(); + break; + case LEFT: + this.calciteFocusPreviousTab.emit(); + break; + } + } + componentDidLoad() { + this.getTabIndex().then(index => { + this.calciteRegisterTabTitle.emit({ + id: this.id, + index + }); + }); + } + async getTabIndex() { + return Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"), this.el)); + } + async setControledBy(id) { + this.controls = id; + } + render() { + return (h(Host, { "aria-controls": this.controls, "aria-expanded": this.isActive ? "true" : "false", role: "tab", tabindex: "0" }, h("a", null, h("slot", null)))); + } + get el() { return getElement(this); } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{-ms-flex:0 1 auto;flex:0 1 auto;outline:none}:host(:active) a,:host(:focus) a,:host(:hover) a{outline:none;text-decoration:none;color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-hover)}:host([is-active]) a{color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-active)}a{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:.875rem;line-height:1.5;padding:.5rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:3px solid transparent;cursor:pointer;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;color:var(--calcite-tabs-color);outline:none}"; } +} + +class CalciteTabs { + constructor(hostRef) { + registerInstance(this, hostRef); + this.tabs = {}; + this.tabTitles = {}; + this.theme = "light"; + } + tabTitleRegistationHandler(e) { + const { index, id } = e.detail; + this.tabTitles[index] = { + id: id, + title: e.target + }; + if (this.tabs[index]) { + this.tabs[index].tab.registerLabeledBy(id); + } + } + tabRegistationHandler(e) { + const { index, id } = e.detail; + this.tabs[index] = { + id: id, + tab: e.target + }; + if (this.tabTitles[index]) { + this.tabs[index].tab.registerLabeledBy(this.tabTitles[index].id); + } + } + render() { + return (h("div", null, h("slot", { name: "tab-nav" }), h("section", { class: "tab-contents" }, h("slot", null)))); + } + static get style() { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{--calcite-tabs-color:#2b2b2b;--calcite-tabs-border:#eaeaea;--calcite-tabs-border-hover:#dfdfdf;--calcite-tabs-color-active:#151515;--calcite-tabs-border-active:#007ac2}:host([theme=dark]){--calcite-tabs-color:#f3f3f3;--calcite-tabs-border:#404040;--calcite-tabs-border-hover:#757575;--calcite-tabs-color-active:#f8f8f8;--calcite-tabs-border-active:#fff}.tab-contents{margin-top:1px;border-top:1px solid var(--calcite-tabs-border)}"; } +} + +export { CalciteAlert as calcite_alert, CalciteAlerts as calcite_alerts, CalciteLoader as calcite_loader, CalciteModal as calcite_modal, CalciteTab as calcite_tab, CalciteTabNav as calcite_tab_nav, CalciteTabTitle as calcite_tab_title, CalciteTabs as calcite_tabs }; diff --git a/dist/esm/calcite.mjs b/dist/esm/calcite.mjs new file mode 100644 index 00000000000..9035cf88d97 --- /dev/null +++ b/dist/esm/calcite.mjs @@ -0,0 +1,5 @@ +import { a as patchBrowser, b as bootstrapLazy } from './calcite-a092ddcb.js'; + +patchBrowser().then(resourcesUrl => { + return bootstrapLazy([["calcite-alert_8",[[1,"calcite-alert",{"currentAlert":[1,"current-alert"],"dismiss":[4],"icon":[4],"id":[1],"queueLength":[2,"queue-length"],"color":[513],"theme":[513],"duration":[513],"isActive":[32],"close":[64]}],[1,"calcite-alerts",{"id":[1],"currentAlert":[32],"isActive":[32],"queue":[32],"open":[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{"isActive":[4,"is-active"],"text":[1]}],[1,"calcite-modal",{"first":[1],"middle":[1],"last":[1]}],[1,"calcite-tab",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"labeledBy":[32],"getTabIndex":[64],"registerLabeledBy":[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{"id":[1537],"selectedTab":[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"controls":[32],"getTabIndex":[64],"setControledBy":[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{"theme":[513],"tabs":[32],"tabTitles":[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]]], { resourcesUrl }); +}); diff --git a/dist/esm/context-consumer.entry.js b/dist/esm/context-consumer.entry.js new file mode 100644 index 00000000000..927a1f73886 --- /dev/null +++ b/dist/esm/context-consumer.entry.js @@ -0,0 +1,25 @@ +import { e as registerInstance, h as getElement } from './calcite-a092ddcb.js'; + +class ContextConsumer { + constructor(hostRef) { + registerInstance(this, hostRef); + this.context = {}; + this.renderer = () => null; + } + connectedCallback() { + if (this.subscribe != null) { + this.unsubscribe = this.subscribe(this.el, 'context'); + } + } + disconnectedCallback() { + if (this.unsubscribe != null) { + this.unsubscribe(); + } + } + render() { + return this.renderer(Object.assign({}, this.context)); + } + get el() { return getElement(this); } +} + +export { ContextConsumer as context_consumer }; diff --git a/dist/esm/css-shim-229ebf7a-229ebf7a.js b/dist/esm/css-shim-229ebf7a-229ebf7a.js new file mode 100644 index 00000000000..dfd3a351678 --- /dev/null +++ b/dist/esm/css-shim-229ebf7a-229ebf7a.js @@ -0,0 +1,628 @@ +/* +Extremely simple css parser. Intended to be not more than what we need +and definitely not necessarily correct =). +*/ +/** @unrestricted */ +var StyleNode = /** @class */ (function () { + function StyleNode() { + this.start = 0; + this.end = 0; + this.previous = null; + this.parent = null; + this.rules = null; + this.parsedCssText = ''; + this.cssText = ''; + this.atRule = false; + this.type = 0; + this.keyframesName = ''; + this.selector = ''; + this.parsedSelector = ''; + } + return StyleNode; +}()); +// given a string of css, return a simple rule tree +/** + * @param {string} text + * @return {StyleNode} + */ +function parse(text) { + text = clean(text); + return parseCss(lex(text), text); +} +// remove stuff we don't care about that may hinder parsing +/** + * @param {string} cssText + * @return {string} + */ +function clean(cssText) { + return cssText.replace(RX.comments, '').replace(RX.port, ''); +} +// super simple {...} lexer that returns a node tree +/** + * @param {string} text + * @return {StyleNode} + */ +function lex(text) { + var root = new StyleNode(); + root['start'] = 0; + root['end'] = text.length; + var n = root; + for (var i = 0, l = text.length; i < l; i++) { + if (text[i] === OPEN_BRACE) { + if (!n['rules']) { + n['rules'] = []; + } + var p = n; + var previous = p['rules'][p['rules'].length - 1] || null; + n = new StyleNode(); + n['start'] = i + 1; + n['parent'] = p; + n['previous'] = previous; + p['rules'].push(n); + } + else if (text[i] === CLOSE_BRACE) { + n['end'] = i + 1; + n = n['parent'] || root; + } + } + return root; +} +// add selectors/cssText to node tree +/** + * @param {StyleNode} node + * @param {string} text + * @return {StyleNode} + */ +function parseCss(node, text) { + var t = text.substring(node['start'], node['end'] - 1); + node['parsedCssText'] = node['cssText'] = t.trim(); + if (node.parent) { + var ss = node.previous ? node.previous['end'] : node.parent['start']; + t = text.substring(ss, node['start'] - 1); + t = _expandUnicodeEscapes(t); + t = t.replace(RX.multipleSpaces, ' '); + // TODO(sorvell): ad hoc; make selector include only after last ; + // helps with mixin syntax + t = t.substring(t.lastIndexOf(';') + 1); + var s = node['parsedSelector'] = node['selector'] = t.trim(); + node['atRule'] = (s.indexOf(AT_START) === 0); + // note, support a subset of rule types... + if (node['atRule']) { + if (s.indexOf(MEDIA_START) === 0) { + node['type'] = types.MEDIA_RULE; + } + else if (s.match(RX.keyframesRule)) { + node['type'] = types.KEYFRAMES_RULE; + node['keyframesName'] = node['selector'].split(RX.multipleSpaces).pop(); + } + } + else { + if (s.indexOf(VAR_START) === 0) { + node['type'] = types.MIXIN_RULE; + } + else { + node['type'] = types.STYLE_RULE; + } + } + } + var r$ = node['rules']; + if (r$) { + for (var i = 0, l = r$.length, r = void 0; (i < l) && (r = r$[i]); i++) { + parseCss(r, text); + } + } + return node; +} +/** + * conversion of sort unicode escapes with spaces like `\33 ` (and longer) into + * expanded form that doesn't require trailing space `\000033` + * @param {string} s + * @return {string} + */ +function _expandUnicodeEscapes(s) { + return s.replace(/\\([0-9a-f]{1,6})\s/gi, function () { + var code = arguments[1], repeat = 6 - code.length; + while (repeat--) { + code = '0' + code; + } + return '\\' + code; + }); +} +/** @enum {number} */ +var types = { + STYLE_RULE: 1, + KEYFRAMES_RULE: 7, + MEDIA_RULE: 4, + MIXIN_RULE: 1000 +}; +var OPEN_BRACE = '{'; +var CLOSE_BRACE = '}'; +// helper regexp's +var RX = { + comments: /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim, + port: /@import[^;]*;/gim, + customProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim, + mixinProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim, + mixinApply: /@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim, + varApply: /[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim, + keyframesRule: /^@[^\s]*keyframes/, + multipleSpaces: /\s+/g +}; +var VAR_START = '--'; +var MEDIA_START = '@media'; +var AT_START = '@'; +function findRegex(regex, cssText, offset) { + regex['lastIndex'] = 0; + var r = cssText.substring(offset).match(regex); + if (r) { + var start = offset + r['index']; + return { + start: start, + end: start + r[0].length + }; + } + return null; +} +var VAR_USAGE_START = /\bvar\(/; +var VAR_ASSIGN_START = /\B--[\w-]+\s*:/; +var COMMENTS = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim; +var TRAILING_LINES = /^[\t ]+\n/gm; +function resolveVar(props, prop, fallback) { + if (props[prop]) { + return props[prop]; + } + if (fallback) { + return executeTemplate(fallback, props); + } + return ''; +} +function findVarEndIndex(cssText, offset) { + var count = 0; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (c === '(') { + count++; + } + else if (c === ')') { + count--; + if (count <= 0) { + return i + 1; + } + } + } + return i; +} +function parseVar(cssText, offset) { + var varPos = findRegex(VAR_USAGE_START, cssText, offset); + if (!varPos) { + return null; + } + var endVar = findVarEndIndex(cssText, varPos.start); + var varContent = cssText.substring(varPos.end, endVar - 1); + var _a = varContent.split(','), propName = _a[0], fallback = _a.slice(1); + return { + start: varPos.start, + end: endVar, + propName: propName.trim(), + fallback: fallback.length > 0 ? fallback.join(',').trim() : undefined + }; +} +function compileVar(cssText, template, offset) { + var varMeta = parseVar(cssText, offset); + if (!varMeta) { + template.push(cssText.substring(offset, cssText.length)); + return cssText.length; + } + var propName = varMeta.propName; + var fallback = varMeta.fallback != null ? compileTemplate(varMeta.fallback) : undefined; + template.push(cssText.substring(offset, varMeta.start), function (params) { return resolveVar(params, propName, fallback); }); + return varMeta.end; +} +function executeTemplate(template, props) { + var final = ''; + for (var i = 0; i < template.length; i++) { + var s = template[i]; + final += (typeof s === 'string') + ? s + : s(props); + } + return final; +} +function findEndValue(cssText, offset) { + var onStr = false; + var double = false; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (onStr) { + if (double && c === '"') { + onStr = false; + } + if (!double && c === '\'') { + onStr = false; + } + } + else { + if (c === '"') { + onStr = true; + double = true; + } + else if (c === '\'') { + onStr = true; + double = false; + } + else if (c === ';') { + return i + 1; + } + else if (c === '}') { + return i; + } + } + } + return i; +} +function removeCustomAssigns(cssText) { + var final = ''; + var offset = 0; + while (true) { + var assignPos = findRegex(VAR_ASSIGN_START, cssText, offset); + var start = assignPos ? assignPos.start : cssText.length; + final += cssText.substring(offset, start); + if (assignPos) { + offset = findEndValue(cssText, start); + } + else { + break; + } + } + return final; +} +function compileTemplate(cssText) { + var index = 0; + cssText = cssText.replace(COMMENTS, ''); + cssText = removeCustomAssigns(cssText) + .replace(TRAILING_LINES, ''); + var segments = []; + while (index < cssText.length) { + index = compileVar(cssText, segments, index); + } + return segments; +} +function resolveValues(selectors) { + var props = {}; + selectors.forEach(function (selector) { + selector.declarations.forEach(function (dec) { + props[dec.prop] = dec.value; + }); + }); + var propsValues = {}; + var entries = Object.entries(props); + var _loop_1 = function (i) { + var dirty = false; + entries.forEach(function (_a) { + var key = _a[0], value = _a[1]; + var propValue = executeTemplate(value, propsValues); + if (propValue !== propsValues[key]) { + propsValues[key] = propValue; + dirty = true; + } + }); + if (!dirty) { + return "break"; + } + }; + for (var i = 0; i < 10; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + return propsValues; +} +function getSelectors(root, index) { + if (index === void 0) { index = 0; } + if (!root.rules) { + return []; + } + var selectors = []; + root.rules + .filter(function (rule) { return rule.type === types.STYLE_RULE; }) + .forEach(function (rule) { + var declarations = getDeclarations(rule.cssText); + if (declarations.length > 0) { + rule.parsedSelector.split(',').forEach(function (selector) { + selector = selector.trim(); + selectors.push({ + selector: selector, + declarations: declarations, + specificity: computeSpecificity(selector), + nu: index + }); + }); + } + index++; + }); + return selectors; +} +function computeSpecificity(_selector) { + return 1; +} +var IMPORTANT = '!important'; +var FIND_DECLARATIONS = /(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm; +function getDeclarations(cssText) { + var declarations = []; + var xArray; + while (xArray = FIND_DECLARATIONS.exec(cssText.trim())) { + var _a = normalizeValue(xArray[2]), value = _a.value, important = _a.important; + declarations.push({ + prop: xArray[1].trim(), + value: compileTemplate(value), + important: important, + }); + } + return declarations; +} +function normalizeValue(value) { + var regex = /\s+/gim; + value = value.replace(regex, ' ').trim(); + var important = value.endsWith(IMPORTANT); + if (important) { + value = value.substr(0, value.length - IMPORTANT.length).trim(); + } + return { + value: value, + important: important + }; +} +function getActiveSelectors(hostEl, hostScopeMap, globalScopes) { + // computes the css scopes that might affect this particular element + var scopes = globalScopes.concat(getScopesForElement(hostScopeMap, hostEl)); + // each scope might have an array of associated selectors + // let's flatten the complete array of selectors from all the scopes + var selectorSet = getSelectorsForScopes(scopes); + // we filter to only the selectors that matches the hostEl + var activeSelectors = selectorSet.filter(function (selector) { return matches(hostEl, selector.selector); }); + // sort selectors by specifity + return sortSelectors(activeSelectors); +} +function getScopesForElement(hostTemplateMap, node) { + var scopes = []; + while (node) { + var scope = hostTemplateMap.get(node); + if (scope) { + scopes.push(scope); + } + node = node.parentElement; + } + return scopes; +} +function getSelectorsForScopes(scopes) { + var selectors = []; + scopes.forEach(function (scope) { + selectors.push.apply(selectors, scope.selectors); + }); + return selectors; +} +function sortSelectors(selectors) { + selectors.sort(function (a, b) { + if (a.specificity === b.specificity) { + return a.nu - b.nu; + } + return a.specificity - b.specificity; + }); + return selectors; +} +function matches(el, selector) { + return el.matches(selector); +} +function parseCSS(original) { + var ast = parse(original); + var template = compileTemplate(original); + var selectors = getSelectors(ast); + return { + original: original, + template: template, + selectors: selectors, + isDynamic: template.length > 1 + }; +} +function addGlobalStyle(globalScopes, styleEl) { + var css = parseCSS(styleEl.innerHTML); + css.styleEl = styleEl; + globalScopes.push(css); +} +function updateGlobalScopes(scopes) { + var selectors = getSelectorsForScopes(scopes); + var props = resolveValues(selectors); + scopes.forEach(function (scope) { + if (scope.isDynamic) { + scope.styleEl.innerHTML = executeTemplate(scope.template, props); + } + }); +} +function reScope(scope, cssScopeId) { + var template = scope.template.map(function (segment) { + return (typeof segment === 'string') + ? replaceScope(segment, scope.cssScopeId, cssScopeId) + : segment; + }); + var selectors = scope.selectors.map(function (sel) { + return Object.assign({}, sel, { selector: replaceScope(sel.selector, scope.cssScopeId, cssScopeId) }); + }); + return Object.assign({}, scope, { template: template, + selectors: selectors, + cssScopeId: cssScopeId }); +} +function replaceScope(original, oldScopeId, newScopeId) { + original = replaceAll(original, "\\." + oldScopeId, "." + newScopeId); + return original; +} +function replaceAll(input, find, replace) { + return input.replace(new RegExp(find, 'g'), replace); +} +function loadDocument(doc, globalScopes) { + return loadDocumentLinks(doc, globalScopes).then(function () { + loadDocumentStyles(doc, globalScopes); + }); +} +function loadDocumentLinks(doc, globalScopes) { + var promises = []; + var linkElms = doc.querySelectorAll('link[rel="stylesheet"][href]'); + for (var i = 0; i < linkElms.length; i++) { + promises.push(addGlobalLink(doc, globalScopes, linkElms[i])); + } + return Promise.all(promises); +} +function loadDocumentStyles(doc, globalScopes) { + var styleElms = doc.querySelectorAll('style'); + for (var i = 0; i < styleElms.length; i++) { + addGlobalStyle(globalScopes, styleElms[i]); + } +} +function addGlobalLink(doc, globalScopes, linkElm) { + var url = linkElm.href; + return fetch(url).then(function (rsp) { return rsp.text(); }).then(function (text) { + if (hasCssVariables(text) && linkElm.parentNode) { + if (hasRelativeUrls(text)) { + text = fixRelativeUrls(text, url); + } + var styleEl = doc.createElement('style'); + styleEl.innerHTML = text; + addGlobalStyle(globalScopes, styleEl); + linkElm.parentNode.insertBefore(styleEl, linkElm); + linkElm.remove(); + } + }).catch(function (err) { + console.error(err); + }); +} +// This regexp tries to determine when a variable is declared, for example: +// +// .my-el { --highlight-color: green; } +// +// but we don't want to trigger when a classname uses "--" or a pseudo-class is +// used. We assume that the only characters that can preceed a variable +// declaration are "{", from an opening block, ";" from a preceeding rule, or a +// space. This prevents the regexp from matching a word in a selector, since +// they would need to start with a "." or "#". (We assume element names don't +// start with "--"). +var CSS_VARIABLE_REGEXP = /[\s;{]--[-a-zA-Z0-9]+\s*:/m; +function hasCssVariables(css) { + return css.indexOf('var(') > -1 || CSS_VARIABLE_REGEXP.test(css); +} +// This regexp find all url() usages with relative urls +var CSS_URL_REGEXP = /url[\s]*\([\s]*['"]?(?![http|/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim; +function hasRelativeUrls(css) { + CSS_URL_REGEXP.lastIndex = 0; + return CSS_URL_REGEXP.test(css); +} +function fixRelativeUrls(css, originalUrl) { + // get the basepath from the original import url + var basePath = originalUrl.replace(/[^/]*$/, ''); + // replace the relative url, with the new relative url + return css.replace(CSS_URL_REGEXP, function (fullMatch, url) { + // rhe new relative path is the base path + uri + // TODO: normalize relative URL + var relativeUrl = basePath + url; + return fullMatch.replace(url, relativeUrl); + }); +} +var CustomStyle = /** @class */ (function () { + function CustomStyle(win, doc) { + this.win = win; + this.doc = doc; + this.count = 0; + this.hostStyleMap = new WeakMap(); + this.hostScopeMap = new WeakMap(); + this.globalScopes = []; + this.scopesMap = new Map(); + } + CustomStyle.prototype.initShim = function () { + var _this = this; + return new Promise(function (resolve) { + _this.win.requestAnimationFrame(function () { + loadDocument(_this.doc, _this.globalScopes).then(function () { return resolve(); }); + }); + }); + }; + CustomStyle.prototype.addLink = function (linkEl) { + var _this = this; + return addGlobalLink(this.doc, this.globalScopes, linkEl).then(function () { + _this.updateGlobal(); + }); + }; + CustomStyle.prototype.addGlobalStyle = function (styleEl) { + addGlobalStyle(this.globalScopes, styleEl); + this.updateGlobal(); + }; + CustomStyle.prototype.createHostStyle = function (hostEl, cssScopeId, cssText) { + if (this.hostScopeMap.has(hostEl)) { + throw new Error('host style already created'); + } + var baseScope = this.registerHostTemplate(cssText, cssScopeId); + var isDynamicScoped = !!(baseScope.isDynamic && baseScope.cssScopeId); + var needStyleEl = isDynamicScoped || !baseScope.styleEl; + var styleEl = this.doc.createElement('style'); + if (!needStyleEl) { + styleEl.innerHTML = cssText; + } + else { + if (isDynamicScoped) { + styleEl['s-sc'] = cssScopeId = baseScope.cssScopeId + "-" + this.count; + styleEl.innerHTML = '/*needs update*/'; + this.hostStyleMap.set(hostEl, styleEl); + this.hostScopeMap.set(hostEl, reScope(baseScope, cssScopeId)); + this.count++; + } + else { + baseScope.styleEl = styleEl; + if (!baseScope.isDynamic) { + styleEl.innerHTML = executeTemplate(baseScope.template, {}); + } + this.globalScopes.push(baseScope); + this.updateGlobal(); + this.hostScopeMap.set(hostEl, baseScope); + } + } + return styleEl; + }; + CustomStyle.prototype.removeHost = function (hostEl) { + var css = this.hostStyleMap.get(hostEl); + if (css) { + css.remove(); + } + this.hostStyleMap.delete(hostEl); + this.hostScopeMap.delete(hostEl); + }; + CustomStyle.prototype.updateHost = function (hostEl) { + var scope = this.hostScopeMap.get(hostEl); + if (scope && scope.isDynamic && scope.cssScopeId) { + var styleEl = this.hostStyleMap.get(hostEl); + if (styleEl) { + var selectors = getActiveSelectors(hostEl, this.hostScopeMap, this.globalScopes); + var props = resolveValues(selectors); + styleEl.innerHTML = executeTemplate(scope.template, props); + } + } + }; + CustomStyle.prototype.updateGlobal = function () { + updateGlobalScopes(this.globalScopes); + }; + CustomStyle.prototype.registerHostTemplate = function (cssText, scopeId) { + var scope = this.scopesMap.get(scopeId); + if (!scope) { + scope = parseCSS(cssText); + scope.cssScopeId = scopeId; + this.scopesMap.set(scopeId, scope); + } + return scope; + }; + return CustomStyle; +}()); +var win = window; +function needsShim() { + return !(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)')); +} +if (!win.__stencil_cssshim && needsShim()) { + win.__stencil_cssshim = new CustomStyle(win, document); +} diff --git a/dist/esm/dom-7eb7509a-7eb7509a.js b/dist/esm/dom-7eb7509a-7eb7509a.js new file mode 100644 index 00000000000..49afb7af2e5 --- /dev/null +++ b/dist/esm/dom-7eb7509a-7eb7509a.js @@ -0,0 +1,38 @@ +/* + Copyright (c) 2016 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +(function(){var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);return e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e),!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return !(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var l=a.localName;if("link"===l&&"import"===a.getAttribute("rel")){if((r=a.import)instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}if("template"===l){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n);}r=r.firstChild?r.firstChild:o(t,r);}}function r(t,e,n){t[e]=n;}function a(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1;}function l(t,e){t.b=!0,t.c.push(e);}function c(t,e){t.b&&i(e,function(e){return s(t,e)});}function s(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;n 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +}; +var _this = this; +var BUILD = { "allRenderFn": true, "cmpDidLoad": true, "cmpDidUnload": false, "cmpDidUpdate": false, "cmpDidRender": false, "cmpWillLoad": true, "cmpWillUpdate": true, "cmpWillRender": false, "connectedCallback": true, "disconnectedCallback": true, "element": false, "event": true, "hasRenderFn": true, "lifecycle": true, "hostListener": true, "hostListenerTargetWindow": false, "hostListenerTargetDocument": false, "hostListenerTargetBody": false, "hostListenerTargetParent": true, "hostListenerTarget": true, "member": true, "method": true, "mode": false, "noVdomRender": false, "observeAttribute": true, "prop": true, "propMutable": true, "reflect": true, "scoped": false, "shadowDom": true, "slot": true, "slotRelocation": true, "state": true, "style": true, "svg": true, "updatable": true, "vdomAttribute": true, "vdomClass": true, "vdomFunctional": true, "vdomKey": true, "vdomListener": true, "vdomRef": true, "vdomRender": true, "vdomStyle": true, "vdomText": true, "watchCallback": true, "taskQueue": true, "lazyLoad": true, "hydrateServerSide": false, "cssVarShim": true, "hydrateClientSide": false, "isDebug": false, "isDev": false, "lifecycleDOMEvents": false, "profile": false, "hotModuleReplacement": false, "constructableCSS": true, "cssAnnotations": true }; +var NAMESPACE = 'calcite'; +var win = window; +var doc = document; +var plt = { + $flags$: 0, + $resourcesUrl$: '', + raf: function (h) { return requestAnimationFrame(h); }, + ael: function (el, eventName, listener, opts) { return el.addEventListener(eventName, listener, opts); }, + rel: function (el, eventName, listener, opts) { return el.removeEventListener(eventName, listener, opts); }, +}; +var supportsShadowDom = !!doc.documentElement.attachShadow; +var supportsListenerOptions = /*@__PURE__*/ (function () { + var supportsListenerOptions = false; + try { + doc.addEventListener('e', null, Object.defineProperty({}, 'passive', { + get: function () { supportsListenerOptions = true; } + })); + } + catch (e) { } + return supportsListenerOptions; +})(); +var supportsConstructibleStylesheets = (function () { + try { + new CSSStyleSheet(); + return true; + } + catch (e) { } + return false; +})(); +var hostRefs = new WeakMap(); +var getHostRef = function (ref) { return hostRefs.get(ref); }; +var registerInstance = function (lazyInstance, hostRef) { return hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef); }; +var registerHost = function (elm) { + // TODO: it's so ugly, but minifies really well + { + var hostRef_1 = { + $flags$: 0, + $hostElement$: elm + }; + hostRef_1.$onReadyPromise$ = new Promise(function (r) { return hostRef_1.$onReadyResolve$ = r; }); + { + hostRef_1.$instanceValues$ = new Map(); + } + return hostRefs.set(elm, hostRef_1); + } +}; +var isMemberInElement = function (elm, memberName) { return memberName in elm; }; +var consoleError = function (e) { return console.error(e); }; +var loadModule = function (cmpMeta, hostRef, hmrVersionId) { + // loadModuleImport + var bundleId = cmpMeta.$lazyBundleIds$; + return import( + /* webpackInclude: /\.entry\.js$/ */ + /* webpackExclude: /\.(system|cjs)\.entry\.js$/ */ + /* webpackMode: "lazy" */ + "./" + bundleId + ".entry.js" + '').then(function (importedModule) { return importedModule[cmpMeta.$tagName$.replace(/-/g, '_')]; }, consoleError); +}; +var styles = new Map(); +var cssVarShim = win.__stencil_cssshim; +var queueCongestion = 0; +var queuePending = false; +var queueDomReads = []; +var queueDomWrites = []; +var queueDomWritesLow = []; +var queueTask = function (queue) { return function (cb) { + // queue dom reads + queue.push(cb); + if (!queuePending) { + queuePending = true; + plt.raf(flush); + } +}; }; +var consume = function (queue) { + for (var i = 0; i < queue.length; i++) { + try { + queue[i](performance.now()); + } + catch (e) { + consoleError(e); + } + } + queue.length = 0; +}; +var consumeTimeout = function (queue, timeout) { + var i = 0; + var ts = 0; + while (i < queue.length && (ts = performance.now()) < timeout) { + try { + queue[i++](ts); + } + catch (e) { + consoleError(e); + } + } + if (i === queue.length) { + queue.length = 0; + } + else if (i !== 0) { + queue.splice(0, i); + } +}; +var flush = function () { + queueCongestion++; + // always force a bunch of medium callbacks to run, but still have + // a throttle on how many can run in a certain time + // DOM READS!!! + consume(queueDomReads); + var timeout = (plt.$flags$ & 6 /* queueMask */) === 2 /* appLoaded */ + ? performance.now() + (7 * Math.ceil(queueCongestion * (1.0 / 22.0))) + : Infinity; + // DOM WRITES!!! + consumeTimeout(queueDomWrites, timeout); + consumeTimeout(queueDomWritesLow, timeout); + if (queueDomWrites.length > 0) { + queueDomWritesLow.push.apply(queueDomWritesLow, queueDomWrites); + queueDomWrites.length = 0; + } + if (queuePending = ((queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length) > 0)) { + // still more to do yet, but we've run out of time + // let's let this thing cool off and try again in the next tick + plt.raf(flush); + } + else { + queueCongestion = 0; + } +}; +var writeTask = /*@__PURE__*/ queueTask(queueDomWrites); +/** + * Default style mode id + */ +/** + * Reusable empty obj/array + * Don't add values to these!! + */ +var EMPTY_OBJ = {}; +/** + * Namespaces + */ +var SVG_NS = 'http://www.w3.org/2000/svg'; +var isDef = function (v) { return v != null; }; +var toLowerCase = function (str) { return str.toLowerCase(); }; +function getDynamicImportFunction(namespace) { + return "__sc_import_" + namespace.replace(/\s|-/g, '_'); +} +var patchEsm = function () { + // @ts-ignore + if (!(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)'))) { + // @ts-ignore + return import('./css-shim-229ebf7a-229ebf7a.js'); + } + return Promise.resolve(); +}; +var patchBrowser = function () { return __awaiter(_this, void 0, void 0, function () { + var importMeta, scriptElm, resourcesUrl; + return __generator(this, function (_a) { + switch (_a.label) { + case 0: + importMeta = ""; + if (!(importMeta !== '')) return [3 /*break*/, 1]; + return [2 /*return*/, Promise.resolve(new URL('.', importMeta).href)]; + case 1: + scriptElm = Array.from(doc.querySelectorAll('script')).find(function (s) { return (s.src.includes("/" + NAMESPACE + ".esm.js") || + s.getAttribute('data-namespace') === NAMESPACE); }); + resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, doc.baseURI)); + patchDynamicImport(resourcesUrl.href); + if (!!window.customElements) return [3 /*break*/, 3]; + // @ts-ignore + return [4 /*yield*/, import('./dom-7eb7509a-7eb7509a.js')]; + case 2: + // @ts-ignore + _a.sent(); + _a.label = 3; + case 3: return [2 /*return*/, resourcesUrl.href]; + } + }); +}); }; +var patchDynamicImport = function (base) { + var importFunctionName = getDynamicImportFunction(NAMESPACE); + try { + win[importFunctionName] = new Function('w', 'return import(w);'); + } + catch (e) { + var moduleMap_1 = new Map(); + win[importFunctionName] = function (src) { + var url = new URL(src, base).href; + var mod = moduleMap_1.get(url); + if (!mod) { + var script_1 = doc.createElement('script'); + script_1.type = 'module'; + script_1.src = URL.createObjectURL(new Blob(["import * as m from '" + url + "'; window." + importFunctionName + ".m = m;"], { type: 'application/javascript' })); + mod = new Promise(function (resolve) { + script_1.onload = function () { + resolve(win[importFunctionName].m); + script_1.remove(); + }; + }); + moduleMap_1.set(url, mod); + doc.head.appendChild(script_1); + } + return mod; + }; + } +}; +var HYDRATED_CLASS = 'hydrated'; +var XLINK_NS = 'http://www.w3.org/1999/xlink'; +var rootAppliedStyles = new WeakMap(); +var registerStyle = function (scopeId, cssText) { + var style = styles.get(scopeId); + if (supportsConstructibleStylesheets) { + style = (style || new CSSStyleSheet()); + style.replace(cssText); + } + else { + style = cssText; + } + styles.set(scopeId, style); +}; +var addStyle = function (styleContainerNode, tagName, mode, hostElm) { + var scopeId = getScopeId(tagName, mode); + var style = styles.get(scopeId); + // if an element is NOT connected then getRootNode() will return the wrong root node + // so the fallback is to always use the document for the root node in those cases + styleContainerNode = (styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc); + if (style) { + if (typeof style === 'string') { + styleContainerNode = styleContainerNode.head || styleContainerNode; + var appliedStyles = rootAppliedStyles.get(styleContainerNode); + var styleElm = void 0; + if (!appliedStyles) { + rootAppliedStyles.set(styleContainerNode, appliedStyles = new Set()); + } + if (!appliedStyles.has(scopeId)) { + { + if (cssVarShim) { + styleElm = cssVarShim.createHostStyle(hostElm, scopeId, style); + var newScopeId = styleElm['s-sc']; + if (newScopeId) { + scopeId = newScopeId; + // we don't want to add this styleID to the appliedStyles Set + // since the cssVarShim might need to apply several different + // stylesheets for the same component + appliedStyles = null; + } + } + else { + styleElm = doc.createElement('style'); + styleElm.innerHTML = style; + } + styleContainerNode.appendChild(styleElm); + } + if (appliedStyles) { + appliedStyles.add(scopeId); + } + } + } + else if (!styleContainerNode.adoptedStyleSheets.includes(style)) { + styleContainerNode.adoptedStyleSheets = styleContainerNode.adoptedStyleSheets.concat([ + style + ]); + } + } + return scopeId; +}; +var attachStyles = function (elm, cmpMeta, mode) { + var styleId = addStyle((supportsShadowDom && elm.shadowRoot) + ? elm.shadowRoot + : elm.getRootNode(), cmpMeta.$tagName$, mode, elm); + if (cmpMeta.$flags$ & 10 /* needsScopedEncapsulation */) { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + // DOM WRITE!! + elm['s-sc'] = styleId; + elm.classList.add(styleId + '-h'); + } +}; +var getScopeId = function (tagName, mode) { return 'sc-' + (tagName); }; +/** + * Production h() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +var stack = []; +function h(nodeName, vnodeData) { + var children = null; + var lastSimple = false; + var simple = false; + var i = arguments.length; + var vkey; + var vname; + for (; i-- > 2;) { + stack.push(arguments[i]); + } + while (stack.length > 0) { + var child = stack.pop(); + if (child && child.pop !== undefined) { + for (i = child.length; i--;) { + stack.push(child[i]); + } + } + else { + if (typeof child === 'boolean') { + child = null; + } + if ((simple = typeof nodeName !== 'function')) { + if (child == null) { + child = ''; + } + else if (typeof child === 'number') { + child = String(child); + } + else if (typeof child !== 'string') { + simple = false; + } + } + if (simple && lastSimple) { + children[children.length - 1].$text$ += child; + } + else if (children === null) { + children = [simple ? { $flags$: 0, $text$: child } : child]; + } + else { + children.push(simple ? { $flags$: 0, $text$: child } : child); + } + lastSimple = simple; + } + } + { + if (vnodeData != null) { + // normalize class / classname attributes + if (vnodeData.className) { + vnodeData['class'] = vnodeData.className; + } + if (typeof vnodeData['class'] === 'object') { + for (i in vnodeData['class']) { + if (vnodeData['class'][i]) { + stack.push(i); + } + } + vnodeData['class'] = stack.join(' '); + stack.length = 0; + } + if (vnodeData.key != null) { + vkey = vnodeData.key; + } + if (vnodeData.name != null) { + vname = vnodeData.name; + } + } + } + if (typeof nodeName === 'function') { + // nodeName is a functional component + return nodeName(vnodeData, children || [], vdomFnUtils); + } + var vnode = { + $tag$: nodeName, + $children$: children, + $elm$: undefined, + $flags$: 0 + }; + { + vnode.$attrs$ = vnodeData; + } + { + vnode.$text$ = undefined; + } + { + vnode.$key$ = vkey; + } + { + vnode.$name$ = vname; + } + return vnode; +} +var Host = {}; +var vdomFnUtils = { + 'forEach': function (children, cb) { return children.map(convertToPublic).forEach(cb); }, + 'map': function (children, cb) { return children.map(convertToPublic).map(cb).map(convertToPrivate); } +}; +var convertToPublic = function (node) { + return { + vattrs: node.$attrs$, + vchildren: node.$children$, + vkey: node.$key$, + vname: node.$name$, + vtag: node.$tag$, + vtext: node.$text$ + }; +}; +var convertToPrivate = function (node) { + return { + $flags$: 0, + $attrs$: node.vattrs, + $children$: node.vchildren, + $key$: node.vkey, + $name$: node.vname, + $tag$: node.vtag, + $text$: node.vtext + }; +}; +/** + * Production setAccessor() function based on Preact by + * Jason Miller (@developit) + * Licensed under the MIT License + * https://github.com/developit/preact/blob/master/LICENSE + * + * Modified for Stencil's compiler and vdom + */ +var setAccessor = function (elm, memberName, oldValue, newValue, isSvg, flags) { + if (oldValue === newValue) { + return; + } + if (memberName === 'class' && !isSvg) { + // Class + { + var oldList_1 = parseClassList(oldValue); + var baseList_1 = parseClassList(elm.className).filter(function (item) { return !oldList_1.includes(item); }); + elm.className = baseList_1.concat(parseClassList(newValue).filter(function (item) { return !baseList_1.includes(item); })).join(' '); + } + } + else if (memberName === 'style') { + // update style attribute, css properties and values + { + for (var prop in oldValue) { + if (!newValue || newValue[prop] == null) { + if (prop.includes('-')) { + elm.style.removeProperty(prop); + } + else { + elm.style[prop] = ''; + } + } + } + } + for (var prop in newValue) { + if (!oldValue || newValue[prop] !== oldValue[prop]) { + if (prop.includes('-')) { + elm.style.setProperty(prop, newValue[prop]); + } + else { + elm.style[prop] = newValue[prop]; + } + } + } + } + else if (memberName === 'key') + ; + else if (memberName === 'ref') { + // minifier will clean this up + if (newValue) { + newValue(elm); + } + } + else if (memberName.startsWith('on') && !isMemberInElement(elm, memberName)) { + // Event Handlers + // so if the member name starts with "on" and the 3rd characters is + // a capital letter, and it's not already a member on the element, + // then we're assuming it's an event listener + if (isMemberInElement(elm, toLowerCase(memberName))) { + // standard event + // the JSX attribute could have been "onMouseOver" and the + // member name "onmouseover" is on the element's prototype + // so let's add the listener "mouseover", which is all lowercased + memberName = toLowerCase(memberName.substring(2)); + } + else { + // custom event + // the JSX attribute could have been "onMyCustomEvent" + // so let's trim off the "on" prefix and lowercase the first character + // and add the listener "myCustomEvent" + // except for the first character, we keep the event name case + memberName = toLowerCase(memberName[2]) + memberName.substring(3); + } + if (oldValue) { + plt.rel(elm, memberName, oldValue, false); + } + if (newValue) { + plt.ael(elm, memberName, newValue, false); + } + } + else { + // Set property if it exists and it's not a SVG + var isProp = isMemberInElement(elm, memberName); + var isComplex = ['object', 'function'].includes(typeof newValue); + if ((isProp || (isComplex && newValue !== null)) && !isSvg) { + try { + elm[memberName] = newValue == null && elm.tagName.indexOf('-') === -1 ? '' : newValue; + } + catch (e) { } + } + /** + * Need to manually update attribute if: + * - memberName is not an attribute + * - if we are rendering the host element in order to reflect attribute + * - if it's a SVG, since properties might not work in + * - if the newValue is null/undefined or 'false'. + */ + var isXlinkNs = isSvg && (memberName !== (memberName = memberName.replace(/^xlink\:?/, ''))) ? true : false; + if (newValue == null || newValue === false) { + if (isXlinkNs) { + elm.removeAttributeNS(XLINK_NS, toLowerCase(memberName)); + } + else { + elm.removeAttribute(memberName); + } + } + else if ((!isProp || (flags & 4 /* isHost */) || isSvg) && !isComplex) { + newValue = newValue === true ? '' : newValue.toString(); + if (isXlinkNs) { + elm.setAttributeNS(XLINK_NS, toLowerCase(memberName), newValue); + } + else { + elm.setAttribute(memberName, newValue); + } + } + } +}; +var parseClassList = function (value) { return (!value) ? [] : value.split(' '); }; +var updateElement = function (oldVnode, newVnode, isSvgMode, memberName) { + // if the element passed in is a shadow root, which is a document fragment + // then we want to be adding attrs/props to the shadow root's "host" element + // if it's not a shadow root, then we add attrs/props to the same element + var elm = (newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host) ? newVnode.$elm$.host : newVnode.$elm$; + var oldVnodeAttrs = (oldVnode && oldVnode.$attrs$) || EMPTY_OBJ; + var newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ; + { + // remove attributes no longer present on the vnode by setting them to undefined + for (memberName in oldVnodeAttrs) { + if (newVnodeAttrs[memberName] == null && oldVnodeAttrs[memberName] != null) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], undefined, isSvgMode, newVnode.$flags$); + } + } + } + // add new & update changed attributes + for (memberName in newVnodeAttrs) { + setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$); + } +}; +var scopeId; +var contentRef; +var hostTagName; +var useNativeShadowDom = false; +var checkSlotFallbackVisibility = false; +var checkSlotRelocate = false; +var isSvgMode = false; +var createElm = function (oldParentVNode, newParentVNode, childIndex, parentElm) { + var newVNode = newParentVNode.$children$[childIndex]; + var i = 0; + var elm; + var childNode; + var oldVNode; + if (!useNativeShadowDom) { + // remember for later we need to check to relocate nodes + checkSlotRelocate = true; + if (newVNode.$tag$ === 'slot') { + if (scopeId) { + // scoped css needs to add its scoped id to the parent element + parentElm.classList.add(scopeId + '-s'); + } + if (!newVNode.$children$) { + // slot element does not have fallback content + // create an html comment we'll use to always reference + // where actual slot content should sit next to + newVNode.$flags$ |= 1 /* isSlotReference */; + } + else { + // slot element has fallback content + // still create an element that "mocks" the slot element + newVNode.$flags$ |= 2 /* isSlotFallback */; + } + } + } + if (isDef(newVNode.$text$)) { + // create text node + newVNode.$elm$ = doc.createTextNode(newVNode.$text$); + } + else if (newVNode.$flags$ & 1 /* isSlotReference */) { + // create a slot reference node + newVNode.$elm$ = doc.createTextNode(''); + } + else { + // create element + elm = newVNode.$elm$ = ((isSvgMode || newVNode.$tag$ === 'svg') + ? doc.createElementNS(SVG_NS, newVNode.$tag$) + : doc.createElement((newVNode.$flags$ & 2 /* isSlotFallback */) ? 'slot-fb' : newVNode.$tag$)); + { + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + // add css classes, attrs, props, listeners, etc. + { + updateElement(null, newVNode, isSvgMode); + } + if (isDef(scopeId) && elm['s-si'] !== scopeId) { + // if there is a scopeId and this is the initial render + // then let's add the scopeId as a css class + elm.classList.add((elm['s-si'] = scopeId)); + } + if (newVNode.$children$) { + for (i = 0; i < newVNode.$children$.length; ++i) { + // create the node + childNode = createElm(oldParentVNode, newVNode, i, elm); + // return node could have been null + if (childNode) { + // append our new node + elm.appendChild(childNode); + } + } + } + if (newVNode.$tag$ === 'svg') { + // Only reset the SVG context when we're exiting SVG element + isSvgMode = false; + } + } + { + newVNode.$elm$['s-hn'] = hostTagName; + if (newVNode.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) { + // remember the content reference comment + newVNode.$elm$['s-sr'] = true; + // remember the content reference comment + newVNode.$elm$['s-cr'] = contentRef; + // remember the slot name, or empty string for default slot + newVNode.$elm$['s-sn'] = newVNode.$name$ || ''; + // check if we've got an old vnode for this slot + oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex]; + if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) { + // we've got an old slot vnode and the wrapper is being replaced + // so let's move the old slot content back to it's original location + putBackInOriginalLocation(oldParentVNode.$elm$, false); + } + } + } + return newVNode.$elm$; +}; +var putBackInOriginalLocation = function (parentElm, recursive) { + plt.$flags$ |= 1 /* isTmpDisconnected */; + var oldSlotChildNodes = parentElm.childNodes; + for (var i = oldSlotChildNodes.length - 1; i >= 0; i--) { + var childNode = oldSlotChildNodes[i]; + if (childNode['s-hn'] !== hostTagName && childNode['s-ol']) { + // // this child node in the old element is from another component + // // remove this node from the old slot's parent + // childNode.remove(); + // and relocate it back to it's original location + parentReferenceNode(childNode).insertBefore(childNode, referenceNode(childNode)); + // remove the old original location comment entirely + // later on the patch function will know what to do + // and move this to the correct spot in need be + childNode['s-ol'].remove(); + childNode['s-ol'] = undefined; + checkSlotRelocate = true; + } + if (recursive) { + putBackInOriginalLocation(childNode, recursive); + } + } + plt.$flags$ &= ~1 /* isTmpDisconnected */; +}; +var addVnodes = function (parentElm, before, parentVNode, vnodes, startIdx, endIdx) { + var containerElm = ((parentElm['s-cr'] && parentElm['s-cr'].parentNode) || parentElm); + var childNode; + if (containerElm.shadowRoot && toLowerCase(containerElm.tagName) === hostTagName) { + containerElm = containerElm.shadowRoot; + } + for (; startIdx <= endIdx; ++startIdx) { + if (vnodes[startIdx]) { + childNode = createElm(null, parentVNode, startIdx, parentElm); + if (childNode) { + vnodes[startIdx].$elm$ = childNode; + containerElm.insertBefore(childNode, referenceNode(before)); + } + } + } +}; +var removeVnodes = function (vnodes, startIdx, endIdx, elm) { + for (; startIdx <= endIdx; ++startIdx) { + if (isDef(vnodes[startIdx])) { + elm = vnodes[startIdx].$elm$; + callNodeRefs(vnodes[startIdx], true); + { + // we're removing this element + // so it's possible we need to show slot fallback content now + checkSlotFallbackVisibility = true; + if (elm['s-ol']) { + // remove the original location comment + elm['s-ol'].remove(); + } + else { + // it's possible that child nodes of the node + // that's being removed are slot nodes + putBackInOriginalLocation(elm, true); + } + } + // remove the vnode's element from the dom + elm.remove(); + } + } +}; +var updateChildren = function (parentElm, oldCh, newVNode, newCh) { + var oldStartIdx = 0; + var newStartIdx = 0; + var idxInOld = 0; + var i = 0; + var oldEndIdx = oldCh.length - 1; + var oldStartVnode = oldCh[0]; + var oldEndVnode = oldCh[oldEndIdx]; + var newEndIdx = newCh.length - 1; + var newStartVnode = newCh[0]; + var newEndVnode = newCh[newEndIdx]; + var node; + var elmToMove; + while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) { + if (oldStartVnode == null) { + // Vnode might have been moved left + oldStartVnode = oldCh[++oldStartIdx]; + } + else if (oldEndVnode == null) { + oldEndVnode = oldCh[--oldEndIdx]; + } + else if (newStartVnode == null) { + newStartVnode = newCh[++newStartIdx]; + } + else if (newEndVnode == null) { + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newStartVnode)) { + patch(oldStartVnode, newStartVnode); + oldStartVnode = oldCh[++oldStartIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else if (isSameVnode(oldEndVnode, newEndVnode)) { + patch(oldEndVnode, newEndVnode); + oldEndVnode = oldCh[--oldEndIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldStartVnode, newEndVnode)) { + // Vnode moved right + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false); + } + patch(oldStartVnode, newEndVnode); + parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling); + oldStartVnode = oldCh[++oldStartIdx]; + newEndVnode = newCh[--newEndIdx]; + } + else if (isSameVnode(oldEndVnode, newStartVnode)) { + // Vnode moved left + if (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot') { + putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false); + } + patch(oldEndVnode, newStartVnode); + parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$); + oldEndVnode = oldCh[--oldEndIdx]; + newStartVnode = newCh[++newStartIdx]; + } + else { + // createKeyToOldIdx + idxInOld = -1; + { + for (i = oldStartIdx; i <= oldEndIdx; ++i) { + if (oldCh[i] && isDef(oldCh[i].$key$) && oldCh[i].$key$ === newStartVnode.$key$) { + idxInOld = i; + break; + } + } + } + if (idxInOld >= 0) { + elmToMove = oldCh[idxInOld]; + if (elmToMove.$tag$ !== newStartVnode.$tag$) { + node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld, parentElm); + } + else { + patch(elmToMove, newStartVnode); + oldCh[idxInOld] = undefined; + node = elmToMove.$elm$; + } + newStartVnode = newCh[++newStartIdx]; + } + else { + // new element + node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx, parentElm); + newStartVnode = newCh[++newStartIdx]; + } + if (node) { + { + parentReferenceNode(oldStartVnode.$elm$).insertBefore(node, referenceNode(oldStartVnode.$elm$)); + } + } + } + } + if (oldStartIdx > oldEndIdx) { + addVnodes(parentElm, (newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$), newVNode, newCh, newStartIdx, newEndIdx); + } + else if (newStartIdx > newEndIdx) { + removeVnodes(oldCh, oldStartIdx, oldEndIdx); + } +}; +var isSameVnode = function (vnode1, vnode2) { + // compare if two vnode to see if they're "technically" the same + // need to have the same element tag, and same key to be the same + if (vnode1.$tag$ === vnode2.$tag$) { + if (vnode1.$tag$ === 'slot') { + return vnode1.$name$ === vnode2.$name$; + } + { + return vnode1.$key$ === vnode2.$key$; + } + return true; + } + return false; +}; +var referenceNode = function (node) { + if (node && node['s-ol']) { + // this node was relocated to a new location in the dom + // because of some other component's slot + // but we still have an html comment in place of where + // it's original location was according to it's original vdom + return node['s-ol']; + } + return node; +}; +var parentReferenceNode = function (node) { return (node['s-ol'] ? node['s-ol'] : node).parentNode; }; +var patch = function (oldVNode, newVNode) { + var elm = newVNode.$elm$ = oldVNode.$elm$; + var oldChildren = oldVNode.$children$; + var newChildren = newVNode.$children$; + var defaultHolder; + { + // test if we're rendering an svg element, or still rendering nodes inside of one + // only add this to the when the compiler sees we're using an svg somewhere + isSvgMode = elm && + isDef(elm.parentNode) && + elm.ownerSVGElement !== undefined; + isSvgMode = newVNode.$tag$ === 'svg' ? true : (newVNode.$tag$ === 'foreignObject' ? false : isSvgMode); + } + if (!isDef(newVNode.$text$)) { + // element node + { + if (newVNode.$tag$ === 'slot') + ; + else { + // either this is the first render of an element OR it's an update + // AND we already know it's possible it could have changed + // this updates the element's css classes, attrs, props, listeners, etc. + updateElement(oldVNode, newVNode, isSvgMode); + } + } + if (isDef(oldChildren) && isDef(newChildren)) { + // looks like there's child vnodes for both the old and new vnodes + updateChildren(elm, oldChildren, newVNode, newChildren); + } + else if (isDef(newChildren)) { + // no old child vnodes, but there are new child vnodes to add + if (isDef(oldVNode.$text$)) { + // the old vnode was text, so be sure to clear it out + elm.textContent = ''; + } + // add the new vnode children + addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1); + } + else if (isDef(oldChildren)) { + // no new child vnodes, but there are old child vnodes to remove + removeVnodes(oldChildren, 0, oldChildren.length - 1); + } + } + else if (defaultHolder = elm['s-cr']) { + // this element has slotted content + defaultHolder.parentNode.textContent = newVNode.$text$; + } + else if (oldVNode.$text$ !== newVNode.$text$) { + // update the text content for the text only vnode + // and also only if the text is different than before + elm.textContent = newVNode.$text$; + } + { + // reset svgMode when svg node is fully patched + if (isSvgMode && 'svg' === newVNode.$tag$) { + isSvgMode = false; + } + } +}; +var updateFallbackSlotVisibility = function (elm, childNode, childNodes, i, ilen, j, slotNameAttr, nodeType) { + childNodes = elm.childNodes; + for (i = 0, ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode.nodeType === 1 /* ElementNode */) { + if (childNode['s-sr']) { + // this is a slot fallback node + // get the slot name for this slot reference node + slotNameAttr = childNode['s-sn']; + // by default always show a fallback slot node + // then hide it if there are other slots in the light dom + childNode.hidden = false; + for (j = 0; j < ilen; j++) { + if (childNodes[j]['s-hn'] !== childNode['s-hn']) { + // this sibling node is from a different component + nodeType = childNodes[j].nodeType; + if (slotNameAttr !== '') { + // this is a named fallback slot node + if (nodeType === 1 /* ElementNode */ && slotNameAttr === childNodes[j].getAttribute('slot')) { + childNode.hidden = true; + break; + } + } + else { + // this is a default fallback slot node + // any element or text node (with content) + // should hide the default fallback slot node + if (nodeType === 1 /* ElementNode */ || (nodeType === 3 /* TextNode */ && childNodes[j].textContent.trim() !== '')) { + childNode.hidden = true; + break; + } + } + } + } + } + // keep drilling down + updateFallbackSlotVisibility(childNode); + } + } +}; +var relocateNodes = []; +var relocateSlotContent = function (elm) { + // tslint:disable-next-line: prefer-const + var childNodes = elm.childNodes; + var ilen = childNodes.length; + var i = 0; + var j = 0; + var nodeType = 0; + var childNode; + var node; + var hostContentNodes; + var slotNameAttr; + for (ilen = childNodes.length; i < ilen; i++) { + childNode = childNodes[i]; + if (childNode['s-sr'] && (node = childNode['s-cr'])) { + // first got the content reference comment node + // then we got it's parent, which is where all the host content is in now + hostContentNodes = node.parentNode.childNodes; + slotNameAttr = childNode['s-sn']; + for (j = hostContentNodes.length - 1; j >= 0; j--) { + node = hostContentNodes[j]; + if (!node['s-cn'] && !node['s-nr'] && node['s-hn'] !== childNode['s-hn']) { + // let's do some relocating to its new home + // but never relocate a content reference node + // that is suppose to always represent the original content location + nodeType = node.nodeType; + if (((nodeType === 3 /* TextNode */ || nodeType === 8 /* CommentNode */) && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === null && slotNameAttr === '') || + (nodeType === 1 /* ElementNode */ && node.getAttribute('slot') === slotNameAttr)) { + // it's possible we've already decided to relocate this node + if (!relocateNodes.some(function (r) { return r.nodeToRelocate === node; })) { + // made some changes to slots + // let's make sure we also double check + // fallbacks are correctly hidden or shown + checkSlotFallbackVisibility = true; + node['s-sn'] = slotNameAttr; + // add to our list of nodes to relocate + relocateNodes.push({ + slotRefNode: childNode, + nodeToRelocate: node + }); + } + } + } + } + } + if (childNode.nodeType === 1 /* ElementNode */) { + relocateSlotContent(childNode); + } + } +}; +var callNodeRefs = function (vNode, isDestroy) { + if (vNode) { + vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(isDestroy ? null : vNode.$elm$); + vNode.$children$ && vNode.$children$.forEach(function (vChild) { + callNodeRefs(vChild, isDestroy); + }); + } +}; +var isHost = function (node) { + return node && node.$tag$ === Host; +}; +var renderVdom = function (hostElm, hostRef, cmpMeta, renderFnResults) { + var oldVNode = hostRef.$vnode$ || { $flags$: 0 }; + hostTagName = toLowerCase(hostElm.tagName); + if (isHost(renderFnResults)) { + renderFnResults.$tag$ = null; + } + else { + renderFnResults = h(null, null, renderFnResults); + } + if (cmpMeta.$attrsToReflect$) { + renderFnResults.$attrs$ = renderFnResults.$attrs$ || {}; + cmpMeta.$attrsToReflect$.forEach(function (_a) { + var propName = _a[0], attribute = _a[1]; + return renderFnResults.$attrs$[attribute] = hostElm[propName]; + }); + } + renderFnResults.$flags$ |= 4 /* isHost */; + hostRef.$vnode$ = renderFnResults; + renderFnResults.$elm$ = oldVNode.$elm$ = (hostElm.shadowRoot || hostElm); + { + scopeId = hostElm['s-sc']; + } + { + contentRef = hostElm['s-cr']; + useNativeShadowDom = supportsShadowDom && (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0; + // always reset + checkSlotRelocate = checkSlotFallbackVisibility = false; + } + // synchronous patch + patch(oldVNode, renderFnResults); + { + if (checkSlotRelocate) { + relocateSlotContent(renderFnResults.$elm$); + for (var i = 0; i < relocateNodes.length; i++) { + var relocateNode = relocateNodes[i]; + if (!relocateNode.nodeToRelocate['s-ol']) { + // add a reference node marking this node's original location + // keep a reference to this node for later lookups + var orgLocationNode = doc.createTextNode(''); + orgLocationNode['s-nr'] = relocateNode.nodeToRelocate; + relocateNode.nodeToRelocate.parentNode.insertBefore((relocateNode.nodeToRelocate['s-ol'] = orgLocationNode), relocateNode.nodeToRelocate); + } + } + // while we're moving nodes around existing nodes, temporarily disable + // the disconnectCallback from working + plt.$flags$ |= 1 /* isTmpDisconnected */; + for (var i = 0; i < relocateNodes.length; i++) { + var relocateNode = relocateNodes[i]; + // by default we're just going to insert it directly + // after the slot reference node + var parentNodeRef = relocateNode.slotRefNode.parentNode; + var insertBeforeNode = relocateNode.slotRefNode.nextSibling; + var orgLocationNode = relocateNode.nodeToRelocate['s-ol']; + while (orgLocationNode = orgLocationNode.previousSibling) { + var refNode = orgLocationNode['s-nr']; + if (refNode && refNode) { + if (refNode['s-sn'] === relocateNode.nodeToRelocate['s-sn']) { + if (parentNodeRef === refNode.parentNode) { + if ((refNode = refNode.nextSibling) && refNode && !refNode['s-nr']) { + insertBeforeNode = refNode; + break; + } + } + } + } + } + if ((!insertBeforeNode && parentNodeRef !== relocateNode.nodeToRelocate.parentNode) || + (relocateNode.nodeToRelocate.nextSibling !== insertBeforeNode)) { + // we've checked that it's worth while to relocate + // since that the node to relocate + // has a different next sibling or parent relocated + if (relocateNode.nodeToRelocate !== insertBeforeNode) { + // add it back to the dom but in its new home + parentNodeRef.insertBefore(relocateNode.nodeToRelocate, insertBeforeNode); + } + } + } + // done moving nodes around + // allow the disconnect callback to work again + plt.$flags$ &= ~1 /* isTmpDisconnected */; + } + if (checkSlotFallbackVisibility) { + updateFallbackSlotVisibility(renderFnResults.$elm$); + } + // always reset + relocateNodes.length = 0; + } +}; +var safeCall = function (instance, method) { return __awaiter(_this, void 0, void 0, function () { + var e_1; + return __generator(this, function (_a) { + switch (_a.label) { + case 0: + if (!(instance && instance[method])) return [3 /*break*/, 4]; + _a.label = 1; + case 1: + _a.trys.push([1, 3, , 4]); + return [4 /*yield*/, instance[method]()]; + case 2: + _a.sent(); + return [3 /*break*/, 4]; + case 3: + e_1 = _a.sent(); + consoleError(e_1); + return [3 /*break*/, 4]; + case 4: return [2 /*return*/]; + } + }); +}); }; +var scheduleUpdate = function (elm, hostRef, cmpMeta, isInitialLoad) { return __awaiter(_this, void 0, void 0, function () { + var instance; + return __generator(this, function (_a) { + switch (_a.label) { + case 0: + { + hostRef.$flags$ |= 16 /* isQueuedForUpdate */; + } + instance = hostRef.$lazyInstance$; + if (!isInitialLoad) return [3 /*break*/, 2]; + return [4 /*yield*/, safeCall(instance, 'componentWillLoad')]; + case 1: + _a.sent(); + return [3 /*break*/, 4]; + case 2: return [4 /*yield*/, safeCall(instance, 'componentWillUpdate')]; + case 3: + _a.sent(); + _a.label = 4; + case 4: + // there is no ancestorc omponent or the ancestor component + // has already fired off its lifecycle update then + // fire off the initial update + { + writeTask(function () { return updateComponent(elm, hostRef, cmpMeta, isInitialLoad, instance); }); + } + return [2 /*return*/]; + } + }); +}); }; +var updateComponent = function (elm, hostRef, cmpMeta, isInitialLoad, instance) { + // updateComponent + { + hostRef.$flags$ &= ~16 /* isQueuedForUpdate */; + } + { + elm['s-lr'] = false; + } + if (isInitialLoad) { + // DOM WRITE! + attachStyles(elm, cmpMeta, hostRef.$modeName$); + } + { + { + // tell the platform we're actively rendering + // if a value is changed within a render() then + // this tells the platform not to queue the change + hostRef.$flags$ |= 4 /* isActiveRender */; + try { + // looks like we've got child nodes to render into this host element + // or we need to update the css class/attrs on the host element + // DOM WRITE! + renderVdom(elm, hostRef, cmpMeta, instance.render()); + } + catch (e) { + consoleError(e); + } + hostRef.$flags$ &= ~4 /* isActiveRender */; + } + } + if (cssVarShim) { + cssVarShim.updateHost(elm); + } + // set that this component lifecycle rendering has completed + { + elm['s-lr'] = true; + } + { + hostRef.$flags$ |= 2 /* hasRendered */; + } + if (elm['s-rc'].length > 0) { + // ok, so turns out there are some child host elements + // waiting on this parent element to load + // let's fire off all update callbacks waiting + elm['s-rc'].forEach(function (cb) { return cb(); }); + elm['s-rc'].length = 0; + } + postUpdateComponent(elm, hostRef); +}; +var postUpdateComponent = function (elm, hostRef, ancestorsActivelyLoadingChildren) { + if (!elm['s-al']) { + var instance = hostRef.$lazyInstance$; + var ancestorComponent = hostRef.$ancestorComponent$; + if (!(hostRef.$flags$ & 512 /* hasLoadedComponent */)) { + hostRef.$flags$ |= 512 /* hasLoadedComponent */; + { + // DOM WRITE! + // add the css class that this element has officially hydrated + elm.classList.add(HYDRATED_CLASS); + } + { + safeCall(instance, 'componentDidLoad'); + } + { + hostRef.$onReadyResolve$(elm); + } + if (!ancestorComponent) { + // on appload + // we have finish the first big initial render + doc.documentElement.classList.add(HYDRATED_CLASS); + { + setTimeout(function () { return plt.$flags$ |= 2; } /* appLoaded */, 999); + } + } + } + // load events fire from bottom to top + // the deepest elements load first then bubbles up + if (ancestorComponent) { + // ok so this element already has a known ancestor component + // let's make sure we remove this element from its ancestor's + // known list of child elements which are actively loading + if (ancestorsActivelyLoadingChildren = ancestorComponent['s-al']) { + // remove this element from the actively loading map + ancestorsActivelyLoadingChildren.delete(elm); + // the ancestor's initializeComponent method will do the actual checks + // to see if the ancestor is actually loaded or not + // then let's call the ancestor's initializeComponent method if there's no length + // (which actually ends up as this method again but for the ancestor) + if (ancestorsActivelyLoadingChildren.size === 0) { + ancestorComponent['s-al'] = undefined; + ancestorComponent['s-init'](); + } + } + hostRef.$ancestorComponent$ = undefined; + } + // ( •_•) + // ( •_•)>⌐■-■ + // (⌐■_■) + } +}; +var disconnectedCallback = function (elm) { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + var hostRef = getHostRef(elm); + { + if (hostRef.$rmListeners$) { + hostRef.$rmListeners$(); + hostRef.$rmListeners$ = undefined; + } + } + // clear CSS var-shim tracking + if (cssVarShim) { + cssVarShim.removeHost(elm); + } + var instance = hostRef.$lazyInstance$; + { + safeCall(instance, 'disconnectedCallback'); + } + } +}; +var parsePropertyValue = function (propValue, expectedPropType) { + // ensure this value is of the correct prop type + if (propValue != null && typeof propValue !== 'object' && typeof propValue !== 'function') { + if (expectedPropType & 4 /* Boolean */) { + // per the HTML spec, any string value means it is a boolean true value + // but we'll cheat here and say that the string "false" is the boolean false + return (propValue === 'false' ? false : propValue === '' || !!propValue); + } + if (expectedPropType & 2 /* Number */) { + // force it to be a number + return parseFloat(propValue); + } + if (expectedPropType & 1 /* String */) { + // could have been passed as a number or boolean + // but we still want it as a string + return String(propValue); + } + // redundant return here for better minification + return propValue; + } + // not sure exactly what type we want + // so no need to change to a different type + return propValue; +}; +var getValue = function (ref, propName) { return getHostRef(ref).$instanceValues$.get(propName); }; +var setValue = function (ref, propName, newVal, cmpMeta) { + // check our new property value against our internal value + var hostRef = getHostRef(ref); + var elm = hostRef.$hostElement$; + var oldVal = hostRef.$instanceValues$.get(propName); + var flags = hostRef.$flags$; + newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]); + if (newVal !== oldVal && (!(flags & 8 /* isConstructingInstance */) || oldVal === undefined)) { + // gadzooks! the property's value has changed!! + // set our new value! + hostRef.$instanceValues$.set(propName, newVal); + if (hostRef.$lazyInstance$) { + // get an array of method names of watch functions to call + if (cmpMeta.$watchers$ && + (flags & (1 /* hasConnected */ | 8 /* isConstructingInstance */)) === 1 /* hasConnected */) { + var watchMethods = cmpMeta.$watchers$[propName]; + if (watchMethods) { + // this instance is watching for when this property changed + watchMethods.forEach(function (watchMethodName) { + try { + // fire off each of the watch methods that are watching this property + (hostRef.$lazyInstance$)[watchMethodName].call((hostRef.$lazyInstance$), newVal, oldVal, propName); + } + catch (e) { + consoleError(e); + } + }); + } + } + if ((flags & (4 /* isActiveRender */ | 2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) { + // looks like this value actually changed, so we've got work to do! + // but only if we've already rendered, otherwise just chill out + // queue that we need to do an update, but don't worry about queuing + // up millions cuz this function ensures it only runs once + scheduleUpdate(elm, hostRef, cmpMeta, false); + } + } + } +}; +var proxyComponent = function (Cstr, cmpMeta, isElementConstructor, proxyState) { + if (cmpMeta.$members$) { + if (Cstr.watchers) { + cmpMeta.$watchers$ = Cstr.watchers; + } + // It's better to have a const than two Object.entries() + var members = Object.entries(cmpMeta.$members$); + members.forEach(function (_a) { + var memberName = _a[0], memberFlags = _a[1][0]; + if ((memberFlags & 31) || (proxyState && (memberFlags & 32 /* State */))) { + // proxyComponent - prop + Object.defineProperty(Cstr.prototype, memberName, { + get: function () { + // proxyComponent, get value + return getValue(this, memberName); + }, + set: function (newValue) { + // proxyComponent, set value + setValue(this, memberName, newValue, cmpMeta); + }, + configurable: true, + enumerable: true + }); + } + else if (isElementConstructor && (memberFlags & 64 /* Method */)) { + // proxyComponent - method + Object.defineProperty(Cstr.prototype, memberName, { + value: function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var ref = getHostRef(this); + return ref.$onReadyPromise$.then(function () { + var _a; + return (_a = ref.$lazyInstance$)[memberName].apply(_a, args); + }); + } + }); + } + }); + if (isElementConstructor) { + var attrNameToPropName_1 = new Map(); + Cstr.prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) { + var propName = attrNameToPropName_1.get(attrName); + this[propName] = newValue === null && typeof this[propName] === 'boolean' + ? false + : newValue; + }; + // create an array of attributes to observe + // and also create a map of html attribute name to js property name + Cstr.observedAttributes = members + .filter(function (_a) { + var _ = _a[0], m = _a[1]; + return m[0] & 15; + } /* HasAttribute */) // filter to only keep props that should match attributes + .map(function (_a) { + var propName = _a[0], m = _a[1]; + var attrName = m[1] || propName; + attrNameToPropName_1.set(attrName, propName); + if (m[0] & 512 /* ReflectAttr */) { + cmpMeta.$attrsToReflect$.push([propName, attrName]); + } + return attrName; + }); + } + } + return Cstr; +}; +var addEventListeners = function (elm, hostRef, listeners) { + var removeFns = listeners.map(function (_a) { + var flags = _a[0], name = _a[1], method = _a[2]; + var target = (getHostListenerTarget(elm, flags)); + var handler = hostListenerProxy(hostRef, method); + var opts = hostListenerOpts(flags); + plt.ael(target, name, handler, opts); + return function () { return plt.rel(target, name, handler, opts); }; + }); + return function () { return removeFns.forEach(function (fn) { return fn(); }); }; +}; +var hostListenerProxy = function (hostRef, methodName) { + return function (ev) { + { + if (hostRef.$lazyInstance$) { + // instance is ready, let's call it's member method for this event + return hostRef.$lazyInstance$[methodName](ev); + } + else { + return hostRef.$onReadyPromise$.then(function () { return hostRef.$lazyInstance$[methodName](ev); }).catch(consoleError); + } + } + }; +}; +var getHostListenerTarget = function (elm, flags) { + if (flags & 16 /* TargetParent */) + return elm.parentElement; + return elm; +}; +var hostListenerOpts = function (flags) { return supportsListenerOptions ? + { + 'passive': (flags & 1 /* Passive */) !== 0, + 'capture': (flags & 2 /* Capture */) !== 0, + } + : (flags & 2 /* Capture */) !== 0; }; +var initializeComponent = function (elm, hostRef, cmpMeta, hmrVersionId, Cstr) { return __awaiter(_this, void 0, void 0, function () { + var style_1, scopeId_1, ancestorComponent; + return __generator(this, function (_a) { + switch (_a.label) { + case 0: + if (!((hostRef.$flags$ & 256 /* hasInitializedComponent */) === 0)) return [3 /*break*/, 4]; + // we haven't initialized this element yet + hostRef.$flags$ |= 256 /* hasInitializedComponent */; + return [4 /*yield*/, loadModule(cmpMeta, hostRef, hmrVersionId)]; + case 1: + // lazy loaded components + // request the component's implementation to be + // wired up with the host element + Cstr = _a.sent(); + if (!Cstr.isProxied) { + // we'eve never proxied this Constructor before + // let's add the getters/setters to its prototype before + // the first time we create an instance of the implementation + { + cmpMeta.$watchers$ = Cstr.watchers; + } + proxyComponent(Cstr, cmpMeta, 0, 1); + Cstr.isProxied = true; + } + // ok, time to construct the instance + // but let's keep track of when we start and stop + // so that the getters/setters don't incorrectly step on data + { + hostRef.$flags$ |= 8 /* isConstructingInstance */; + } + // construct the lazy-loaded component implementation + // passing the hostRef is very important during + // construction in order to directly wire together the + // host element and the lazy-loaded instance + try { + new Cstr(hostRef); + } + catch (e) { + consoleError(e); + } + { + hostRef.$flags$ &= ~8 /* isConstructingInstance */; + } + fireConnectedCallback(hostRef.$lazyInstance$); + if (!(!Cstr.isStyleRegistered && Cstr.style)) return [3 /*break*/, 4]; + style_1 = Cstr.style; + scopeId_1 = getScopeId(cmpMeta.$tagName$, hostRef.$modeName$); + if (!(cmpMeta.$flags$ & 8) /* needsShadowDomShim */) return [3 /*break*/, 3]; /* needsShadowDomShim */ + return [4 /*yield*/, import('./shadow-css-984bac74-549b16dd.js').then(function (m) { return m.scopeCss(style_1, scopeId_1, false); })]; + case 2: + style_1 = _a.sent(); + _a.label = 3; + case 3: + registerStyle(scopeId_1, style_1); + Cstr.isStyleRegistered = true; + _a.label = 4; + case 4: + ancestorComponent = hostRef.$ancestorComponent$; + if (ancestorComponent && !ancestorComponent['s-lr'] && ancestorComponent['s-rc']) { + // this is the intial load and this component it has an ancestor component + // but the ancestor component has NOT fired its will update lifecycle yet + // so let's just cool our jets and wait for the ancestor to continue first + ancestorComponent['s-rc'].push(function () { + // this will get fired off when the ancestor component + // finally gets around to rendering its lazy self + // fire off the initial update + return initializeComponent(elm, hostRef, cmpMeta); + }); + } + else { + scheduleUpdate(elm, hostRef, cmpMeta, true); + } + return [2 /*return*/]; + } + }); +}); }; +var fireConnectedCallback = function (instance) { + { + safeCall(instance, 'connectedCallback'); + } +}; +var connectedCallback = function (elm, cmpMeta) { + if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) { + // connectedCallback + var hostRef = getHostRef(elm); + if (cmpMeta.$listeners$) { + // initialize our event listeners on the host element + // we do this now so that we can listening to events that may + // have fired even before the instance is ready + hostRef.$rmListeners$ = addEventListeners(elm, hostRef, cmpMeta.$listeners$); + } + if (!(hostRef.$flags$ & 1 /* hasConnected */)) { + // first time this component has connected + hostRef.$flags$ |= 1 /* hasConnected */; + var hostId = void 0; + if (!hostId) { + // initUpdate + // if the slot polyfill is required we'll need to put some nodes + // in here to act as original content anchors as we move nodes around + // host element has been connected to the DOM + if (cmpMeta.$flags$ & 4 || + (cmpMeta.$flags$ & 8 /* needsShadowDomShim */)) { + setContentReference(elm); + } + } + { + // find the first ancestor component (if there is one) and register + // this component as one of the actively loading child components for its ancestor + var ancestorComponent = elm; + while ((ancestorComponent = (ancestorComponent.parentNode || ancestorComponent.host))) { + // climb up the ancestors looking for the first + // component that hasn't finished its lifecycle update yet + if ((ancestorComponent['s-init'] && !ancestorComponent['s-lr']) || (BUILD.hydrateClientSide && ancestorComponent.nodeType === 1 /* ElementNode */ && ancestorComponent.hasAttribute('s-id'))) { + // we found this components first ancestor component + // keep a reference to this component's ancestor component + hostRef.$ancestorComponent$ = ancestorComponent; + // ensure there is an array to contain a reference to each of the child components + // and set this component as one of the ancestor's child components it should wait on + (ancestorComponent['s-al'] = ancestorComponent['s-al'] || new Set()).add(elm); + break; + } + } + } + // Lazy properties + // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties + if (cmpMeta.$members$) { + Object.entries(cmpMeta.$members$).forEach(function (_a) { + var memberName = _a[0], memberFlags = _a[1][0]; + if (memberFlags & 31 /* Prop */ && elm.hasOwnProperty(memberName)) { + var value = elm[memberName]; + delete elm[memberName]; + elm[memberName] = value; + } + }); + } + { + initializeComponent(elm, hostRef, cmpMeta); + } + } + fireConnectedCallback(hostRef.$lazyInstance$); + } +}; +var setContentReference = function (elm, contentRefElm) { + // only required when we're NOT using native shadow dom (slot) + // or this browser doesn't support native shadow dom + // and this host element was NOT created with SSR + // let's pick out the inner content for slot projection + // create a node to represent where the original + // content was first placed, which is useful later on + var crName; + { + crName = ''; + } + contentRefElm = elm['s-cr'] = doc.createComment(crName); + contentRefElm['s-cn'] = true; + elm.insertBefore(contentRefElm, elm.firstChild); +}; +var bootstrapLazy = function (lazyBundles, options) { + if (options === void 0) { options = {}; } + var cmpTags = []; + var exclude = options.exclude || []; + var head = doc.head; + var customElements = win.customElements; + var y = /*@__PURE__*/ head.querySelector('meta[charset]'); + var visibilityStyle = /*@__PURE__*/ doc.createElement('style'); + Object.assign(plt, options); + plt.$resourcesUrl$ = new URL(options.resourcesUrl || '/', doc.baseURI).href; + if (options.syncQueue) { + plt.$flags$ |= 4 /* queueSync */; + } + lazyBundles.forEach(function (lazyBundle) { return lazyBundle[1].forEach(function (compactMeta) { + var cmpMeta = { + $flags$: compactMeta[0], + $tagName$: compactMeta[1], + $members$: compactMeta[2], + $listeners$: compactMeta[3], + }; + { + cmpMeta.$attrsToReflect$ = []; + } + { + cmpMeta.$watchers$ = {}; + } + if (!supportsShadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + cmpMeta.$flags$ |= 8 /* needsShadowDomShim */; + } + var tagName = cmpMeta.$tagName$; + var HostElement = /** @class */ (function (_super) { + __extends(class_1, _super); + // StencilLazyHost + function class_1(self) { + var _this = + // @ts-ignore + _super.call(this, self) || this; + self = _this; + { + _this['s-lr'] = false; + _this['s-rc'] = []; + } + registerHost(self); + if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) { + // this component is using shadow dom + // and this browser supports shadow dom + // add the read-only property "shadowRoot" to the host element + if (supportsShadowDom) { + self.attachShadow({ 'mode': 'open' }); + } + else if (!('shadowRoot' in self)) { + self.shadowRoot = self; + } + } + return _this; + } + class_1.prototype.connectedCallback = function () { + connectedCallback(this, cmpMeta); + }; + class_1.prototype.disconnectedCallback = function () { + disconnectedCallback(this); + }; + class_1.prototype['s-init'] = function () { + var hostRef = getHostRef(this); + if (hostRef.$lazyInstance$) { + postUpdateComponent(this, hostRef); + } + }; + class_1.prototype['s-hmr'] = function (hmrVersionId) { + }; + class_1.prototype.forceUpdate = function () { + { + var hostRef = getHostRef(this); + scheduleUpdate(this, hostRef, cmpMeta, false); + } + }; + class_1.prototype.componentOnReady = function () { + return getHostRef(this).$onReadyPromise$; + }; + return class_1; + }(HTMLElement)); + cmpMeta.$lazyBundleIds$ = lazyBundle[0]; + if (!exclude.includes(tagName) && !customElements.get(tagName)) { + cmpTags.push(tagName); + customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1, 0)); + } + }); }); + // visibilityStyle.innerHTML = cmpTags.map(t => `${t}:not(.hydrated)`) + '{display:none}'; + visibilityStyle.innerHTML = cmpTags + '{visibility:hidden}.hydrated{visibility:inherit}'; + visibilityStyle.setAttribute('data-styles', ''); + head.insertBefore(visibilityStyle, y ? y.nextSibling : head.firstChild); +}; +var createEvent = function (ref, name, flags) { + var elm = getElement(ref); + return { + emit: function (detail) { return elm.dispatchEvent(new (CustomEvent)(name, { + bubbles: !!(flags & 4 /* Bubbles */), + composed: !!(flags & 2 /* Composed */), + cancelable: !!(flags & 1 /* Cancellable */), + detail: detail + })); } + }; +}; +var getElement = function (ref) { return getHostRef(ref).$hostElement$; }; +export { patchBrowser as a, bootstrapLazy as b, patchEsm as c, h as d, registerInstance as e, createEvent as f, Host as g, getElement as h }; diff --git a/dist/esm/legacy/calcite-alert_8.entry.js b/dist/esm/legacy/calcite-alert_8.entry.js new file mode 100644 index 00000000000..e9c7be3eca5 --- /dev/null +++ b/dist/esm/legacy/calcite-alert_8.entry.js @@ -0,0 +1,515 @@ +var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +}; +var __generator = (this && this.__generator) || function (thisArg, body) { + var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; + return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + function verb(n) { return function (v) { return step([n, v]); }; } + function step(op) { + if (f) throw new TypeError("Generator is already executing."); + while (_) try { + if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; + if (y = 0, t) op = [op[0] & 2, t.value]; + switch (op[0]) { + case 0: case 1: t = op; break; + case 4: _.label++; return { value: op[1], done: false }; + case 5: _.label++; y = op[1]; op = [0]; continue; + case 7: op = _.ops.pop(); _.trys.pop(); continue; + default: + if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +}; +import { d as h, e as registerInstance, f as createEvent, g as Host, h as getElement } from './calcite-a092ddcb.js'; +// File generated automatically by path-data.js, do not edit directly +var checkCircle24F = "M23 11.5A11.5 11.5 0 1 1 11.5 0 11.5 11.5 0 0 1 23 11.5zm-5.5-6.018l-8.5 8.5-3.5-3.5-2 2L9.018 18l.018-.018L11.018 16l8.5-8.5z"; +var exclamationMarkTriangle24F = "M22.3 19.795l-9-17.901a1.5 1.5 0 0 0-2.597 0L1.7 19.795a1.502 1.502 0 0 0 0 1.502A1.456 1.456 0 0 0 2.998 22H21a1.458 1.458 0 0 0 1.299-.703 1.506 1.506 0 0 0 .001-1.502zM13 19h-2v-2h2zm0-3h-2V8h2z"; +var lightbulb24F = "M11 13h1v4h-1zm3.895 5.45a.311.311 0 0 0-.12-.27l-.232-.18h-6.19l-.232.18a.312.312 0 0 0 .04.518l1.387.771-1.367.76a.311.311 0 0 0-.028.526l3.09 2.18a.356.356 0 0 0 .41 0l3.09-2.18a.311.311 0 0 0-.029-.527l-1.366-.759 1.388-.77a.312.312 0 0 0 .159-.25zM11.59 0l-.173.002L11.244 0a6.2 6.2 0 0 0-6.182 6.698c.31 2.575 2.784 5.207 2.939 6.134.13.78.116 1.844.199 2.472A2.542 2.542 0 0 0 9.088 17H10v-4.412L8.83 9.37l.94-.342L10.85 12h1.3l1.08-2.97.94.341L13 12.588V17h.745a2.542 2.542 0 0 0 .889-1.696c.083-.628.068-1.692.199-2.472.154-.927 2.628-3.559 2.938-6.134A6.2 6.2 0 0 0 11.59 0z"; +var x32 = "M16.707 16l10.607 10.606-.708.707L16 16.707 5.394 27.313l-.708-.707L15.293 16 4.686 5.394l.708-.707L16 15.293 26.606 4.687l.708.707z"; +var createProviderConsumer = function (defaultState, consumerRender) { + var listeners = new Map(); + var currentState = defaultState; + var updateListener = function (fields, instance) { + if (Array.isArray(fields)) { + fields.slice().forEach(function (fieldName) { + instance[fieldName] = currentState[fieldName]; + }); + } + else { + instance[fields] = Object.assign({}, currentState); + } + }; + var subscribe = function (instance, propList) { + if (!listeners.has(instance)) { + listeners.set(instance, propList); + updateListener(propList, instance); + } + return function () { + if (listeners.has(instance)) { + listeners.delete(instance); + } + }; + }; + var Provider = function (_a, children) { + var state = _a.state; + currentState = state; + listeners.forEach(updateListener); + return children; + }; + var Consumer = function (props, children) { + // The casting on subscribe is to allow for crossover through the stencil compiler + // In the future we should allow for generics in components. + return consumerRender(subscribe, children[0]); + }; + var injectProps = function (Cstr, fieldList) { + var CstrPrototype = Cstr.prototype; + var cstrConnectedCallback = CstrPrototype.connectedCallback; + var cstrDisconnectedCallback = CstrPrototype.disconnectedCallback; + CstrPrototype.connectedCallback = function () { + subscribe(this, fieldList); + if (cstrConnectedCallback) { + return cstrConnectedCallback.call(this); + } + }; + CstrPrototype.disconnectedCallback = function () { + listeners.delete(this); + if (cstrDisconnectedCallback) { + cstrDisconnectedCallback.call(this); + } + }; + }; + return { + Provider: Provider, + Consumer: Consumer, + injectProps: injectProps + }; +}; +var AlertInterface = createProviderConsumer({ + currentAlert: '', + queueLength: 0 +}, function (subscribe, child) { return (h("context-consumer", { subscribe: subscribe, renderer: child })); }); +var CalciteAlert = /** @class */ (function () { + function CalciteAlert(hostRef) { + registerInstance(this, hostRef); + this.currentAlert = ''; + this.dismiss = false; + this.icon = false; + this.id = '1'; + this.queueLength = 0; + this.color = 'blue'; + this.theme = null; + this.duration = this.dismiss ? 'medium' : null; + this.isActive = this.id === this.currentAlert; + this.alertClose = createEvent(this, "alertClose", 7); + this.alertOpen = createEvent(this, "alertOpen", 7); + } + CalciteAlert.prototype.close = function () { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + if (this.isActive) { + this.isActive = false; + this.alertClose.emit(this.id); + } + return [2 /*return*/]; + }); + }); + }; + CalciteAlert.prototype.componentWillUpdate = function () { + var _this = this; + this.isActive = this.currentAlert === this.id; + if (this.isActive) + this.alertOpen.emit(this.id); + if (this.isActive && this.dismiss) + setTimeout(function () { _this.close(); }, this.duration === 'fast' ? 6000 : this.duration === 'slow' ? 14000 : 10000); + }; + CalciteAlert.prototype.setIcon = function () { + var path = this.color === 'green' ? checkCircle24F : (this.color === 'red' || this.color === 'yellow') ? exclamationMarkTriangle24F : lightbulb24F; + return (h("div", { class: "alert-icon" }, h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '24', width: '24', viewBox: '0 0 24 24' }, h("path", { d: path })))); + }; + CalciteAlert.prototype.render = function () { + var _this = this; + var closeButton = (h("button", { class: "alert-close", "aria-label": "close", onClick: function () { return _this.close(); } }, h("svg", { xmlns: 'http://www.w3.org/2000/svg', height: '32', width: '32', viewBox: '0 0 32 32' }, h("path", { d: x32 })))); + var close = !this.dismiss ? closeButton : ''; + var icon = this.icon ? this.setIcon() : ''; + var count = h("div", { class: (this.queueLength > 0 ? 'is-active ' : '') + "alert-count" }, "+", this.queueLength > 0 ? this.queueLength : 1); + var progress = this.isActive && this.dismiss ? h("div", { class: "alert-dismiss" }) : ''; + return (h(Host, { theme: this.theme, "is-active": !!this.isActive, duration: this.duration }, icon, h("div", { class: "alert-content" }, h("slot", { name: "alert-title" }), h("slot", { name: "alert-message" }), h("slot", { name: "alert-link" })), count, close, progress)); + }; + Object.defineProperty(CalciteAlert.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteAlert, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:relative;-ms-flex-pack:center;justify-content:center;right:0;left:0;margin-right:auto;margin-left:auto;z-index:100;width:50em;max-width:90%;border-radius:2px;background-color:#fff;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,.15);box-shadow:0 0 12px 0 rgba(0,0,0,.15);height:0;opacity:0;overflow:visible;display:-ms-flexbox;display:flex;border-top:3px solid;-webkit-transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;transition:visibility 0ms linear .3s,opacity .3s cubic-bezier(.215,.44,.42,.88),all .15s ease-in-out;-webkit-transform:translate3d(0,1.5rem,0);transform:translate3d(0,1.5rem,0);pointer-events:none;border-width:0}\@media only screen and (max-width:600px){:host{max-width:100%;border-radius:2px 2px 0 0;-webkit-box-shadow:0 -6px 12px 0 rgba(0,0,0,.15);box-shadow:0 -6px 12px 0 rgba(0,0,0,.15)}}:host([is-active]){visibility:visible;border-width:3px;opacity:1;height:100%;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translateZ(0);transform:translateZ(0);pointer-events:auto}:host slot[name=alert-title]::slotted(div){display:block;font-weight:500;font-size:16px}:host slot[name=alert-link]::slotted(a){display:inline-block;font-size:15px;color:#007ac2}:host slot[name=alert-message]::slotted(div){font-size:15px;color:#555;display:inline;-webkit-margin-end:.75rem;margin-inline-end:.75rem}:host([theme=dark]){background-color:#2b2b2b}:host([theme=dark]) slot[name=alert-title]::slotted(div){color:#f8f8f8}:host([theme=dark]) slot[name=alert-message]::slotted(div){color:#f3f3f3}.alert-content{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;word-wrap:break-word;-webkit-padding-before:.75rem;padding-block-start:.75rem;-webkit-padding-after:.75rem;padding-block-end:.75rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}\@media only screen and (max-width:600px){.alert-content{padding:1.5rem}}.alert-content svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-content:first-of-type{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}\@media only screen and (max-width:600px){.alert-content{-webkit-padding-before:1.5rem;padding-block-start:1.5rem;-webkit-padding-after:1.5rem;padding-block-end:1.5rem;-webkit-padding-end:.75rem;padding-inline-end:.75rem;-webkit-padding-start:0;padding-inline-start:0}}.alert-icon{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}\@media only screen and (max-width:600px){.alert-icon{padding:1.5rem}}.alert-icon svg{position:relative;vertical-align:top;height:16px;width:16px}.alert-close{padding:.75rem 1.5rem;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-appearance:none;background-color:transparent;border:none;outline:none;cursor:pointer;border-radius:0 0 2px 0}\@media only screen and (max-width:600px){.alert-close{padding:1.5rem}}.alert-close svg{position:relative;vertical-align:top;height:16px;width:16px;fill:#151515}.alert-close:focus,.alert-close:hover{background-color:#f3f3f3}.alert-close:active{background-color:#eaeaea}.alert-close:last-child{border-radius:0 0 2px 0}:host([dir=rtl]) .alert-close:last-child{border-radius:0 0 0 2px}\@media only screen and (max-width:600px){.alert-close{border-radius:0}}:host([theme=dark]) .alert-close svg{fill:#d4d4d4}:host([theme=dark]) .alert-close:focus,:host([theme=dark]) .alert-close:hover{background-color:#202020}:host([theme=dark]) .alert-close:active{background-color:#151515}.alert-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;-webkit-transition:all .15s ease-in;transition:all .15s ease-in;width:0;font-size:14px;visibility:hidden;padding:0;font-weight:500;text-align:center;background-color:transparent;color:#757575;opacity:0;border-left:1px solid transparent;border-right:1px solid transparent;cursor:default}.alert-count.is-active{visibility:visible;-webkit-transition-delay:.3s;transition-delay:.3s;opacity:1;padding:0 .375rem;width:3rem;border-left:1px solid #f3f3f3;border-right:1px solid #f3f3f3}.alert-count.is-active:last-child{border-right-color:transparent}\@media only screen and (max-width:600px){.alert-count{border-radius:0}}:host([theme=dark]) .alert-count{color:#d4d4d4}:host([theme=dark]) .alert-count.is-active{border-left:1px solid #202020;border-right:1px solid #202020}.alert-dismiss{left:0;top:0;z-index:101}.alert-dismiss,.alert-dismiss:after{display:block;position:absolute;right:0;height:3px}.alert-dismiss:after{top:-3px;border-radius:2px 2px 0 0;content:\"\";width:50%;background-color:hsla(0,0%,100%,.6);-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;z-index:200}:host([theme=dark]) .alert-dismiss:after{background-color:rgba(43,43,43,.6)}:host([duration=fast]) .alert-dismiss:after{-webkit-animation:dismissProgress 6s linear;animation:dismissProgress 6s linear}:host([duration=medium]) .alert-dismiss:after{-webkit-animation:dismissProgress 10s linear;animation:dismissProgress 10s linear}:host([duration=slow]) .alert-dismiss:after{-webkit-animation:dismissProgress 14s linear;animation:dismissProgress 14s linear}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([color=blue]){border-top-color:#007ac2}:host([color=blue]) .alert-icon svg{fill:#007ac2}:host([color=red]){border-top-color:#d83020}:host([color=red]) .alert-icon svg{fill:#d83020}:host([color=yellow]){border-top-color:#edd317}:host([color=yellow]) .alert-icon svg{fill:#edd317}:host([color=green]){border-top-color:#35ac46}:host([color=green]) .alert-icon svg{fill:#35ac46}"; }, + enumerable: true, + configurable: true + }); + return CalciteAlert; +}()); +AlertInterface.injectProps(CalciteAlert, ['currentAlert', 'queueLength']); +var CalciteAlerts = /** @class */ (function () { + function CalciteAlerts(hostRef) { + registerInstance(this, hostRef); + this.id = '1'; + this.currentAlert = ''; + this.isActive = false; + this.queue = []; + this.alertsClose = createEvent(this, "alertsClose", 7); + this.alertsOpen = createEvent(this, "alertsOpen", 7); + } + CalciteAlerts.prototype.open = function (requestedAlert) { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + if (!this.queue.includes(requestedAlert)) { + this.isActive = true; + this.currentAlert = requestedAlert; + this.queue.push(requestedAlert); + this.alertsOpen.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + } + return [2 /*return*/]; + }); + }); + }; + CalciteAlerts.prototype.updateQueue = function (event) { + var _this = this; + if (this.queue.includes(event.detail)) + this.queue = this.queue.filter(function (e) { return e !== event.detail; }); + if (this.queue.length < 1) + setTimeout(function () { _this.isActive = false; }, 300); + this.alertsClose.emit({ id: this.id, currentAlert: this.currentAlert, queue: this.queue }); + }; + CalciteAlerts.prototype.componentWillUpdate = function () { + this.currentAlert = this.queue.length > 0 ? this.queue[0] : ''; + }; + CalciteAlerts.prototype.render = function () { + var alertState = { + currentAlert: this.currentAlert, + queueLength: this.queue.length >= 2 ? this.queue.length - 1 : 0 + }; + return (h(Host, { "is-active": !!this.isActive }, h(AlertInterface.Provider, { state: alertState }, h("slot", null)))); + }; + Object.defineProperty(CalciteAlerts.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteAlerts, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{position:fixed;visibility:hidden;opacity:0;left:0;right:0;bottom:1.5rem;height:0;z-index:101;pointer-events:none;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;-webkit-transition-delay:.3s;transition-delay:.3s}\@media only screen and (max-width:600px){:host{bottom:0}}:host([is-active]){height:auto;visibility:visible;opacity:1}"; }, + enumerable: true, + configurable: true + }); + return CalciteAlerts; +}()); +var CalciteLoader = /** @class */ (function () { + function CalciteLoader(hostRef) { + registerInstance(this, hostRef); + this.isActive = false; + this.text = "Loading..."; + } + CalciteLoader.prototype.render = function () { + return (h(Host, { "is-active": !!this.isActive }, h("div", { class: "loader-bars" }), h("div", { class: "loader-text" }, this.text))); + }; + Object.defineProperty(CalciteLoader.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteLoader, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host .loader-bars,:host .loader-bars:after,:host .loader-bars:before{background:#007ac2;-webkit-animation:load .8s ease-in-out infinite;animation:load .8s ease-in-out infinite;width:.85rem;height:2rem}:host .loader-bars:after,:host .loader-bars:before{position:absolute;top:0;content:\"\"}:host{position:relative;display:none;padding-bottom:4.5rem;padding-top:4.5rem}:host([is-active]){display:block}:host .loader-bars{text-indent:-9999em;margin:auto;position:absolute;right:calc(50% - .425rem);font-size:11px;-webkit-animation-delay:.16s;animation-delay:.16s}:host .loader-bars:before{left:-1.25rem}:host .loader-bars:after{left:1.25rem;-webkit-animation-delay:.32s;animation-delay:.32s}:host .loader-text{padding-top:4rem;text-align:center}\@-webkit-keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}\@keyframes load{0%,80%,to{opacity:.75;-webkit-box-shadow:0 0 #007ac2;box-shadow:0 0 #007ac2;height:2rem}40%{opacity:1;-webkit-box-shadow:0 -.5rem #007ac2;box-shadow:0 -.5rem #007ac2;height:2.5rem}}"; }, + enumerable: true, + configurable: true + }); + return CalciteLoader; +}()); +function format(first, middle, last) { + return ((first || "") + (middle ? " " + middle : "") + (last ? " " + last : "")); +} +var CalciteModal = /** @class */ (function () { + function CalciteModal(hostRef) { + registerInstance(this, hostRef); + } + CalciteModal.prototype.getText = function () { + return format(this.first, this.middle, this.last); + }; + CalciteModal.prototype.render = function () { + return h("div", { class: "example-class" }, "Hello, World! I'm ", this.getText()); + }; + Object.defineProperty(CalciteModal, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.example-class{padding:1.5rem;color:#d83020;-webkit-box-shadow:0 0 16px 0 rgba(0,0,0,.05);box-shadow:0 0 16px 0 rgba(0,0,0,.05);border:1px solid #007ac2}"; }, + enumerable: true, + configurable: true + }); + return CalciteModal; +}()); +// from https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues#Examples +function random() { + return window.crypto.getRandomValues(new Uint32Array(1))[0] / 1e10; +} +function gen(count) { + var out = ""; + for (var i = 0; i < count; i++) { + out += (((1 + random()) * 0x10000) | 0).toString(16).substring(1); + } + return out; +} +function guid() { + return [gen(2), gen(1), gen(1), gen(1), gen(3)].join("-"); +} +var CalciteTab = /** @class */ (function () { + function CalciteTab(hostRef) { + registerInstance(this, hostRef); + this.id = "calite-tab-" + guid(); + this.isActive = false; + this.calciteRegisterTab = createEvent(this, "calciteRegisterTab", 7); + } + CalciteTab.prototype.tabChangeHandler = function (event) { + var _this = this; + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(function (index) { + _this.isActive = index === event.detail.tab; + }); + } + }; + CalciteTab.prototype.componentDidLoad = function () { + var _this = this; + this.getTabIndex().then(function (index) { + _this.calciteRegisterTab.emit({ + id: _this.id, + index: index + }); + }); + }; + CalciteTab.prototype.getTabIndex = function () { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + return [2 /*return*/, Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab"), this.el))]; + }); + }); + }; + CalciteTab.prototype.registerLabeledBy = function (id) { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + this.labeledBy = id; + return [2 /*return*/]; + }); + }); + }; + CalciteTab.prototype.render = function () { + return (h(Host, { "aria-labeledby": this.labeledBy, "aria-expanded": this.isActive ? "true" : "false", role: "tabpanel" }, h("section", null, h("slot", null)))); + }; + Object.defineProperty(CalciteTab.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteTab, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host([is-active]) section{display:block}section{display:none}"; }, + enumerable: true, + configurable: true + }); + return CalciteTab; +}()); +var CalciteTabNav = /** @class */ (function () { + function CalciteTabNav(hostRef) { + registerInstance(this, hostRef); + this.id = "calite-tab-nav-" + guid(); + this.selectedTab = 0; + this.calciteTabChange = createEvent(this, "calciteTabChange", 7); + } + CalciteTabNav.prototype.selectedTabChanged = function () { + this.calciteTabChange.emit({ + tab: this.selectedTab + }); + }; + CalciteTabNav.prototype.focusPreviousTabHandler = function (e) { + var tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + var currentIndex = this.getIndexOfTabTitle(e.target); + var previousTab = tabs[currentIndex - 1] || tabs[tabs.length - 1]; + previousTab.focus(); + }; + CalciteTabNav.prototype.focusNextTabHandler = function (e) { + var tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + var currentIndex = this.getIndexOfTabTitle(e.target); + var nextTab = tabs[currentIndex + 1] || tabs[0]; + nextTab.focus(); + }; + CalciteTabNav.prototype.tabTitleRegistationHandler = function (e) { + e.target.setControledBy(this.id); + }; + CalciteTabNav.prototype.activateTabHandler = function (e) { + if (e.detail.tab) { + this.selectedTab = e.detail.tab; + } + else { + this.selectedTab = this.getIndexOfTabTitle(e.target); + } + }; + CalciteTabNav.prototype.getIndexOfTabTitle = function (el) { + var tabs = this.el.parentElement.querySelectorAll("calcite-tab-title"); + return tabs.slice().indexOf(el); + }; + CalciteTabNav.prototype.componentWillLoad = function () { + this.selectedTabChanged(); + }; + CalciteTabNav.prototype.render = function () { + return (h(Host, { role: "tablist" }, h("nav", { class: "tab-nav" }, h("slot", null)))); + }; + Object.defineProperty(CalciteTabNav.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteTabNav, "watchers", { + get: function () { + return { + "selectedTab": ["selectedTabChanged"] + }; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteTabNav, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}.tab-nav{display:-ms-flexbox;display:flex;padding:.5rem 0}::slotted(calcite-tab-title){margin-right:1.25rem}:host([dir=rtl]) ::slotted(calcite-tab-title){margin-right:0;margin-left:1.25rem}"; }, + enumerable: true, + configurable: true + }); + return CalciteTabNav; +}()); +var ENTER = 13; +var SPACE = 32; +var LEFT = 37; +var RIGHT = 39; +var CalciteTabTitle = /** @class */ (function () { + function CalciteTabTitle(hostRef) { + registerInstance(this, hostRef); + this.id = "calite-tab-title-" + guid(); + this.isActive = false; + this.calciteActivateTab = createEvent(this, "calciteActivateTab", 7); + this.calciteFocusNextTab = createEvent(this, "calciteFocusNextTab", 7); + this.calciteFocusPreviousTab = createEvent(this, "calciteFocusPreviousTab", 7); + this.calciteRegisterTabTitle = createEvent(this, "calciteRegisterTabTitle", 7); + } + CalciteTabTitle.prototype.tabChangeHand = function (event) { + var _this = this; + if (this.tab) { + this.isActive = this.tab === event.detail.tab; + } + else { + this.getTabIndex().then(function (index) { + _this.isActive = index === event.detail.tab; + }); + } + }; + CalciteTabTitle.prototype.onClick = function () { + this.calciteActivateTab.emit({ + tab: this.tab + }); + }; + CalciteTabTitle.prototype.keyDownHandler = function (e) { + switch (e.keyCode) { + case SPACE: + case ENTER: + this.onClick(); + break; + case RIGHT: + this.calciteFocusNextTab.emit(); + break; + case LEFT: + this.calciteFocusPreviousTab.emit(); + break; + } + }; + CalciteTabTitle.prototype.componentDidLoad = function () { + var _this = this; + this.getTabIndex().then(function (index) { + _this.calciteRegisterTabTitle.emit({ + id: _this.id, + index: index + }); + }); + }; + CalciteTabTitle.prototype.getTabIndex = function () { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + return [2 /*return*/, Promise.resolve(Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"), this.el))]; + }); + }); + }; + CalciteTabTitle.prototype.setControledBy = function (id) { + return __awaiter(this, void 0, void 0, function () { + return __generator(this, function (_a) { + this.controls = id; + return [2 /*return*/]; + }); + }); + }; + CalciteTabTitle.prototype.render = function () { + return (h(Host, { "aria-controls": this.controls, "aria-expanded": this.isActive ? "true" : "false", role: "tab", tabindex: "0" }, h("a", null, h("slot", null)))); + }; + Object.defineProperty(CalciteTabTitle.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + Object.defineProperty(CalciteTabTitle, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{-ms-flex:0 1 auto;flex:0 1 auto;outline:none}:host(:active) a,:host(:focus) a,:host(:hover) a{outline:none;text-decoration:none;color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-hover)}:host([is-active]) a{color:var(--calcite-tabs-color-active);border-bottom-color:var(--calcite-tabs-border-active)}a{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:.875rem;line-height:1.5;padding:.5rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:3px solid transparent;cursor:pointer;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;color:var(--calcite-tabs-color);outline:none}"; }, + enumerable: true, + configurable: true + }); + return CalciteTabTitle; +}()); +var CalciteTabs = /** @class */ (function () { + function CalciteTabs(hostRef) { + registerInstance(this, hostRef); + this.tabs = {}; + this.tabTitles = {}; + this.theme = "light"; + } + CalciteTabs.prototype.tabTitleRegistationHandler = function (e) { + var _a = e.detail, index = _a.index, id = _a.id; + this.tabTitles[index] = { + id: id, + title: e.target + }; + if (this.tabs[index]) { + this.tabs[index].tab.registerLabeledBy(id); + } + }; + CalciteTabs.prototype.tabRegistationHandler = function (e) { + var _a = e.detail, index = _a.index, id = _a.id; + this.tabs[index] = { + id: id, + tab: e.target + }; + if (this.tabTitles[index]) { + this.tabs[index].tab.registerLabeledBy(this.tabTitles[index].id); + } + }; + CalciteTabs.prototype.render = function () { + return (h("div", null, h("slot", { name: "tab-nav" }), h("section", { class: "tab-contents" }, h("slot", null)))); + }; + Object.defineProperty(CalciteTabs, "style", { + get: function () { return "body{font-family:Avenir Next W01,Avenir Next W00,Avenir Next,Avenir,Helvetica Neue,sans-serif}\@-webkit-keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}\@keyframes dismissProgress{0%{width:0;opacity:0}to{width:100%;opacity:1}}:host{--calcite-tabs-color:#2b2b2b;--calcite-tabs-border:#eaeaea;--calcite-tabs-border-hover:#dfdfdf;--calcite-tabs-color-active:#151515;--calcite-tabs-border-active:#007ac2}:host([theme=dark]){--calcite-tabs-color:#f3f3f3;--calcite-tabs-border:#404040;--calcite-tabs-border-hover:#757575;--calcite-tabs-color-active:#f8f8f8;--calcite-tabs-border-active:#fff}.tab-contents{margin-top:1px;border-top:1px solid var(--calcite-tabs-border)}"; }, + enumerable: true, + configurable: true + }); + return CalciteTabs; +}()); +export { CalciteAlert as calcite_alert, CalciteAlerts as calcite_alerts, CalciteLoader as calcite_loader, CalciteModal as calcite_modal, CalciteTab as calcite_tab, CalciteTabNav as calcite_tab_nav, CalciteTabTitle as calcite_tab_title, CalciteTabs as calcite_tabs }; diff --git a/dist/esm/legacy/calcite.mjs b/dist/esm/legacy/calcite.mjs new file mode 100644 index 00000000000..d0f404c083e --- /dev/null +++ b/dist/esm/legacy/calcite.mjs @@ -0,0 +1,4 @@ +import { a as patchBrowser, b as bootstrapLazy } from './calcite-a092ddcb.js'; +patchBrowser().then(function (resourcesUrl) { + return bootstrapLazy([["calcite-alert_8", [[1, "calcite-alert", { "currentAlert": [1, "current-alert"], "dismiss": [4], "icon": [4], "id": [1], "queueLength": [2, "queue-length"], "color": [513], "theme": [513], "duration": [513], "isActive": [32], "close": [64] }], [1, "calcite-alerts", { "id": [1], "currentAlert": [32], "isActive": [32], "queue": [32], "open": [64] }, [[0, "alertClose", "updateQueue"]]], [1, "calcite-loader", { "isActive": [4, "is-active"], "text": [1] }], [1, "calcite-modal", { "first": [1], "middle": [1], "last": [1] }], [1, "calcite-tab", { "id": [1537], "tab": [1537], "isActive": [1540, "is-active"], "labeledBy": [32], "getTabIndex": [64], "registerLabeledBy": [64] }, [[16, "calciteTabChange", "tabChangeHandler"]]], [1, "calcite-tab-nav", { "id": [1537], "selectedTab": [1032, "selected-tab"] }, [[0, "calciteFocusPreviousTab", "focusPreviousTabHandler"], [0, "calciteFocusNextTab", "focusNextTabHandler"], [0, "calciteRegisterTabTitle", "tabTitleRegistationHandler"], [0, "calciteActivateTab", "activateTabHandler"]]], [1, "calcite-tab-title", { "id": [1537], "tab": [1537], "isActive": [1540, "is-active"], "controls": [32], "getTabIndex": [64], "setControledBy": [64] }, [[16, "calciteTabChange", "tabChangeHand"], [0, "click", "onClick"], [0, "keydown", "keyDownHandler"]]], [1, "calcite-tabs", { "theme": [513], "tabs": [32], "tabTitles": [32] }, [[0, "calciteRegisterTabTitle", "tabTitleRegistationHandler"], [0, "calciteRegisterTab", "tabRegistationHandler"]]]]], ["context-consumer", [[0, "context-consumer", { "context": [16], "renderer": [16], "subscribe": [16], "unsubscribe": [32] }]]]], { resourcesUrl: resourcesUrl }); +}); diff --git a/dist/esm/legacy/context-consumer.entry.js b/dist/esm/legacy/context-consumer.entry.js new file mode 100644 index 00000000000..dfed103860d --- /dev/null +++ b/dist/esm/legacy/context-consumer.entry.js @@ -0,0 +1,28 @@ +import { e as registerInstance, h as getElement } from './calcite-a092ddcb.js'; +var ContextConsumer = /** @class */ (function () { + function ContextConsumer(hostRef) { + registerInstance(this, hostRef); + this.context = {}; + this.renderer = function () { return null; }; + } + ContextConsumer.prototype.connectedCallback = function () { + if (this.subscribe != null) { + this.unsubscribe = this.subscribe(this.el, 'context'); + } + }; + ContextConsumer.prototype.disconnectedCallback = function () { + if (this.unsubscribe != null) { + this.unsubscribe(); + } + }; + ContextConsumer.prototype.render = function () { + return this.renderer(Object.assign({}, this.context)); + }; + Object.defineProperty(ContextConsumer.prototype, "el", { + get: function () { return getElement(this); }, + enumerable: true, + configurable: true + }); + return ContextConsumer; +}()); +export { ContextConsumer as context_consumer }; diff --git a/dist/esm/legacy/css-shim-229ebf7a-229ebf7a.js b/dist/esm/legacy/css-shim-229ebf7a-229ebf7a.js new file mode 100644 index 00000000000..df52cd324c4 --- /dev/null +++ b/dist/esm/legacy/css-shim-229ebf7a-229ebf7a.js @@ -0,0 +1,630 @@ +/* +Extremely simple css parser. Intended to be not more than what we need +and definitely not necessarily correct =). +*/ +/** @unrestricted */ +var StyleNode = /** @class */ (function () { + function StyleNode() { + this.start = 0; + this.end = 0; + this.previous = null; + this.parent = null; + this.rules = null; + this.parsedCssText = ''; + this.cssText = ''; + this.atRule = false; + this.type = 0; + this.keyframesName = ''; + this.selector = ''; + this.parsedSelector = ''; + } + return StyleNode; +}()); +// given a string of css, return a simple rule tree +/** + * @param {string} text + * @return {StyleNode} + */ +function parse(text) { + text = clean(text); + return parseCss(lex(text), text); +} +// remove stuff we don't care about that may hinder parsing +/** + * @param {string} cssText + * @return {string} + */ +function clean(cssText) { + return cssText.replace(RX.comments, '').replace(RX.port, ''); +} +// super simple {...} lexer that returns a node tree +/** + * @param {string} text + * @return {StyleNode} + */ +function lex(text) { + var root = new StyleNode(); + root['start'] = 0; + root['end'] = text.length; + var n = root; + for (var i = 0, l = text.length; i < l; i++) { + if (text[i] === OPEN_BRACE) { + if (!n['rules']) { + n['rules'] = []; + } + var p = n; + var previous = p['rules'][p['rules'].length - 1] || null; + n = new StyleNode(); + n['start'] = i + 1; + n['parent'] = p; + n['previous'] = previous; + p['rules'].push(n); + } + else if (text[i] === CLOSE_BRACE) { + n['end'] = i + 1; + n = n['parent'] || root; + } + } + return root; +} +// add selectors/cssText to node tree +/** + * @param {StyleNode} node + * @param {string} text + * @return {StyleNode} + */ +function parseCss(node, text) { + var t = text.substring(node['start'], node['end'] - 1); + node['parsedCssText'] = node['cssText'] = t.trim(); + if (node.parent) { + var ss = node.previous ? node.previous['end'] : node.parent['start']; + t = text.substring(ss, node['start'] - 1); + t = _expandUnicodeEscapes(t); + t = t.replace(RX.multipleSpaces, ' '); + // TODO(sorvell): ad hoc; make selector include only after last ; + // helps with mixin syntax + t = t.substring(t.lastIndexOf(';') + 1); + var s = node['parsedSelector'] = node['selector'] = t.trim(); + node['atRule'] = (s.indexOf(AT_START) === 0); + // note, support a subset of rule types... + if (node['atRule']) { + if (s.indexOf(MEDIA_START) === 0) { + node['type'] = types.MEDIA_RULE; + } + else if (s.match(RX.keyframesRule)) { + node['type'] = types.KEYFRAMES_RULE; + node['keyframesName'] = node['selector'].split(RX.multipleSpaces).pop(); + } + } + else { + if (s.indexOf(VAR_START) === 0) { + node['type'] = types.MIXIN_RULE; + } + else { + node['type'] = types.STYLE_RULE; + } + } + } + var r$ = node['rules']; + if (r$) { + for (var i = 0, l = r$.length, r = void 0; (i < l) && (r = r$[i]); i++) { + parseCss(r, text); + } + } + return node; +} +/** + * conversion of sort unicode escapes with spaces like `\33 ` (and longer) into + * expanded form that doesn't require trailing space `\000033` + * @param {string} s + * @return {string} + */ +function _expandUnicodeEscapes(s) { + return s.replace(/\\([0-9a-f]{1,6})\s/gi, function () { + var code = arguments[1], repeat = 6 - code.length; + while (repeat--) { + code = '0' + code; + } + return '\\' + code; + }); +} +/** @enum {number} */ +var types = { + STYLE_RULE: 1, + KEYFRAMES_RULE: 7, + MEDIA_RULE: 4, + MIXIN_RULE: 1000 +}; +var OPEN_BRACE = '{'; +var CLOSE_BRACE = '}'; +// helper regexp's +var RX = { + comments: /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim, + port: /@import[^;]*;/gim, + customProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim, + mixinProp: /(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim, + mixinApply: /@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim, + varApply: /[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim, + keyframesRule: /^@[^\s]*keyframes/, + multipleSpaces: /\s+/g +}; +var VAR_START = '--'; +var MEDIA_START = '@media'; +var AT_START = '@'; +function findRegex(regex, cssText, offset) { + regex['lastIndex'] = 0; + var r = cssText.substring(offset).match(regex); + if (r) { + var start = offset + r['index']; + return { + start: start, + end: start + r[0].length + }; + } + return null; +} +var VAR_USAGE_START = /\bvar\(/; +var VAR_ASSIGN_START = /\B--[\w-]+\s*:/; +var COMMENTS = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim; +var TRAILING_LINES = /^[\t ]+\n/gm; +function resolveVar(props, prop, fallback) { + if (props[prop]) { + return props[prop]; + } + if (fallback) { + return executeTemplate(fallback, props); + } + return ''; +} +function findVarEndIndex(cssText, offset) { + var count = 0; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (c === '(') { + count++; + } + else if (c === ')') { + count--; + if (count <= 0) { + return i + 1; + } + } + } + return i; +} +function parseVar(cssText, offset) { + var varPos = findRegex(VAR_USAGE_START, cssText, offset); + if (!varPos) { + return null; + } + var endVar = findVarEndIndex(cssText, varPos.start); + var varContent = cssText.substring(varPos.end, endVar - 1); + var _a = varContent.split(','), propName = _a[0], fallback = _a.slice(1); + return { + start: varPos.start, + end: endVar, + propName: propName.trim(), + fallback: fallback.length > 0 ? fallback.join(',').trim() : undefined + }; +} +function compileVar(cssText, template, offset) { + var varMeta = parseVar(cssText, offset); + if (!varMeta) { + template.push(cssText.substring(offset, cssText.length)); + return cssText.length; + } + var propName = varMeta.propName; + var fallback = varMeta.fallback != null ? compileTemplate(varMeta.fallback) : undefined; + template.push(cssText.substring(offset, varMeta.start), function (params) { return resolveVar(params, propName, fallback); }); + return varMeta.end; +} +function executeTemplate(template, props) { + var final = ''; + for (var i = 0; i < template.length; i++) { + var s = template[i]; + final += (typeof s === 'string') + ? s + : s(props); + } + return final; +} +function findEndValue(cssText, offset) { + var onStr = false; + var double = false; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (onStr) { + if (double && c === '"') { + onStr = false; + } + if (!double && c === '\'') { + onStr = false; + } + } + else { + if (c === '"') { + onStr = true; + double = true; + } + else if (c === '\'') { + onStr = true; + double = false; + } + else if (c === ';') { + return i + 1; + } + else if (c === '}') { + return i; + } + } + } + return i; +} +function removeCustomAssigns(cssText) { + var final = ''; + var offset = 0; + while (true) { + var assignPos = findRegex(VAR_ASSIGN_START, cssText, offset); + var start = assignPos ? assignPos.start : cssText.length; + final += cssText.substring(offset, start); + if (assignPos) { + offset = findEndValue(cssText, start); + } + else { + break; + } + } + return final; +} +function compileTemplate(cssText) { + var index = 0; + cssText = cssText.replace(COMMENTS, ''); + cssText = removeCustomAssigns(cssText) + .replace(TRAILING_LINES, ''); + var segments = []; + while (index < cssText.length) { + index = compileVar(cssText, segments, index); + } + return segments; +} +function resolveValues(selectors) { + var props = {}; + selectors.forEach(function (selector) { + selector.declarations.forEach(function (dec) { + props[dec.prop] = dec.value; + }); + }); + var propsValues = {}; + var entries = Object.entries(props); + var _loop_1 = function (i) { + var dirty = false; + entries.forEach(function (_a) { + var key = _a[0], value = _a[1]; + var propValue = executeTemplate(value, propsValues); + if (propValue !== propsValues[key]) { + propsValues[key] = propValue; + dirty = true; + } + }); + if (!dirty) { + return "break"; + } + }; + for (var i = 0; i < 10; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + return propsValues; +} +function getSelectors(root, index) { + if (index === void 0) { + index = 0; + } + if (!root.rules) { + return []; + } + var selectors = []; + root.rules + .filter(function (rule) { return rule.type === types.STYLE_RULE; }) + .forEach(function (rule) { + var declarations = getDeclarations(rule.cssText); + if (declarations.length > 0) { + rule.parsedSelector.split(',').forEach(function (selector) { + selector = selector.trim(); + selectors.push({ + selector: selector, + declarations: declarations, + specificity: computeSpecificity(selector), + nu: index + }); + }); + } + index++; + }); + return selectors; +} +function computeSpecificity(_selector) { + return 1; +} +var IMPORTANT = '!important'; +var FIND_DECLARATIONS = /(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm; +function getDeclarations(cssText) { + var declarations = []; + var xArray; + while (xArray = FIND_DECLARATIONS.exec(cssText.trim())) { + var _a = normalizeValue(xArray[2]), value = _a.value, important = _a.important; + declarations.push({ + prop: xArray[1].trim(), + value: compileTemplate(value), + important: important, + }); + } + return declarations; +} +function normalizeValue(value) { + var regex = /\s+/gim; + value = value.replace(regex, ' ').trim(); + var important = value.endsWith(IMPORTANT); + if (important) { + value = value.substr(0, value.length - IMPORTANT.length).trim(); + } + return { + value: value, + important: important + }; +} +function getActiveSelectors(hostEl, hostScopeMap, globalScopes) { + // computes the css scopes that might affect this particular element + var scopes = globalScopes.concat(getScopesForElement(hostScopeMap, hostEl)); + // each scope might have an array of associated selectors + // let's flatten the complete array of selectors from all the scopes + var selectorSet = getSelectorsForScopes(scopes); + // we filter to only the selectors that matches the hostEl + var activeSelectors = selectorSet.filter(function (selector) { return matches(hostEl, selector.selector); }); + // sort selectors by specifity + return sortSelectors(activeSelectors); +} +function getScopesForElement(hostTemplateMap, node) { + var scopes = []; + while (node) { + var scope = hostTemplateMap.get(node); + if (scope) { + scopes.push(scope); + } + node = node.parentElement; + } + return scopes; +} +function getSelectorsForScopes(scopes) { + var selectors = []; + scopes.forEach(function (scope) { + selectors.push.apply(selectors, scope.selectors); + }); + return selectors; +} +function sortSelectors(selectors) { + selectors.sort(function (a, b) { + if (a.specificity === b.specificity) { + return a.nu - b.nu; + } + return a.specificity - b.specificity; + }); + return selectors; +} +function matches(el, selector) { + return el.matches(selector); +} +function parseCSS(original) { + var ast = parse(original); + var template = compileTemplate(original); + var selectors = getSelectors(ast); + return { + original: original, + template: template, + selectors: selectors, + isDynamic: template.length > 1 + }; +} +function addGlobalStyle(globalScopes, styleEl) { + var css = parseCSS(styleEl.innerHTML); + css.styleEl = styleEl; + globalScopes.push(css); +} +function updateGlobalScopes(scopes) { + var selectors = getSelectorsForScopes(scopes); + var props = resolveValues(selectors); + scopes.forEach(function (scope) { + if (scope.isDynamic) { + scope.styleEl.innerHTML = executeTemplate(scope.template, props); + } + }); +} +function reScope(scope, cssScopeId) { + var template = scope.template.map(function (segment) { + return (typeof segment === 'string') + ? replaceScope(segment, scope.cssScopeId, cssScopeId) + : segment; + }); + var selectors = scope.selectors.map(function (sel) { + return Object.assign({}, sel, { selector: replaceScope(sel.selector, scope.cssScopeId, cssScopeId) }); + }); + return Object.assign({}, scope, { template: template, + selectors: selectors, + cssScopeId: cssScopeId }); +} +function replaceScope(original, oldScopeId, newScopeId) { + original = replaceAll(original, "\\." + oldScopeId, "." + newScopeId); + return original; +} +function replaceAll(input, find, replace) { + return input.replace(new RegExp(find, 'g'), replace); +} +function loadDocument(doc, globalScopes) { + return loadDocumentLinks(doc, globalScopes).then(function () { + loadDocumentStyles(doc, globalScopes); + }); +} +function loadDocumentLinks(doc, globalScopes) { + var promises = []; + var linkElms = doc.querySelectorAll('link[rel="stylesheet"][href]'); + for (var i = 0; i < linkElms.length; i++) { + promises.push(addGlobalLink(doc, globalScopes, linkElms[i])); + } + return Promise.all(promises); +} +function loadDocumentStyles(doc, globalScopes) { + var styleElms = doc.querySelectorAll('style'); + for (var i = 0; i < styleElms.length; i++) { + addGlobalStyle(globalScopes, styleElms[i]); + } +} +function addGlobalLink(doc, globalScopes, linkElm) { + var url = linkElm.href; + return fetch(url).then(function (rsp) { return rsp.text(); }).then(function (text) { + if (hasCssVariables(text) && linkElm.parentNode) { + if (hasRelativeUrls(text)) { + text = fixRelativeUrls(text, url); + } + var styleEl = doc.createElement('style'); + styleEl.innerHTML = text; + addGlobalStyle(globalScopes, styleEl); + linkElm.parentNode.insertBefore(styleEl, linkElm); + linkElm.remove(); + } + }).catch(function (err) { + console.error(err); + }); +} +// This regexp tries to determine when a variable is declared, for example: +// +// .my-el { --highlight-color: green; } +// +// but we don't want to trigger when a classname uses "--" or a pseudo-class is +// used. We assume that the only characters that can preceed a variable +// declaration are "{", from an opening block, ";" from a preceeding rule, or a +// space. This prevents the regexp from matching a word in a selector, since +// they would need to start with a "." or "#". (We assume element names don't +// start with "--"). +var CSS_VARIABLE_REGEXP = /[\s;{]--[-a-zA-Z0-9]+\s*:/m; +function hasCssVariables(css) { + return css.indexOf('var(') > -1 || CSS_VARIABLE_REGEXP.test(css); +} +// This regexp find all url() usages with relative urls +var CSS_URL_REGEXP = /url[\s]*\([\s]*['"]?(?![http|/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim; +function hasRelativeUrls(css) { + CSS_URL_REGEXP.lastIndex = 0; + return CSS_URL_REGEXP.test(css); +} +function fixRelativeUrls(css, originalUrl) { + // get the basepath from the original import url + var basePath = originalUrl.replace(/[^/]*$/, ''); + // replace the relative url, with the new relative url + return css.replace(CSS_URL_REGEXP, function (fullMatch, url) { + // rhe new relative path is the base path + uri + // TODO: normalize relative URL + var relativeUrl = basePath + url; + return fullMatch.replace(url, relativeUrl); + }); +} +var CustomStyle = /** @class */ (function () { + function CustomStyle(win, doc) { + this.win = win; + this.doc = doc; + this.count = 0; + this.hostStyleMap = new WeakMap(); + this.hostScopeMap = new WeakMap(); + this.globalScopes = []; + this.scopesMap = new Map(); + } + CustomStyle.prototype.initShim = function () { + var _this = this; + return new Promise(function (resolve) { + _this.win.requestAnimationFrame(function () { + loadDocument(_this.doc, _this.globalScopes).then(function () { return resolve(); }); + }); + }); + }; + CustomStyle.prototype.addLink = function (linkEl) { + var _this = this; + return addGlobalLink(this.doc, this.globalScopes, linkEl).then(function () { + _this.updateGlobal(); + }); + }; + CustomStyle.prototype.addGlobalStyle = function (styleEl) { + addGlobalStyle(this.globalScopes, styleEl); + this.updateGlobal(); + }; + CustomStyle.prototype.createHostStyle = function (hostEl, cssScopeId, cssText) { + if (this.hostScopeMap.has(hostEl)) { + throw new Error('host style already created'); + } + var baseScope = this.registerHostTemplate(cssText, cssScopeId); + var isDynamicScoped = !!(baseScope.isDynamic && baseScope.cssScopeId); + var needStyleEl = isDynamicScoped || !baseScope.styleEl; + var styleEl = this.doc.createElement('style'); + if (!needStyleEl) { + styleEl.innerHTML = cssText; + } + else { + if (isDynamicScoped) { + styleEl['s-sc'] = cssScopeId = baseScope.cssScopeId + "-" + this.count; + styleEl.innerHTML = '/*needs update*/'; + this.hostStyleMap.set(hostEl, styleEl); + this.hostScopeMap.set(hostEl, reScope(baseScope, cssScopeId)); + this.count++; + } + else { + baseScope.styleEl = styleEl; + if (!baseScope.isDynamic) { + styleEl.innerHTML = executeTemplate(baseScope.template, {}); + } + this.globalScopes.push(baseScope); + this.updateGlobal(); + this.hostScopeMap.set(hostEl, baseScope); + } + } + return styleEl; + }; + CustomStyle.prototype.removeHost = function (hostEl) { + var css = this.hostStyleMap.get(hostEl); + if (css) { + css.remove(); + } + this.hostStyleMap.delete(hostEl); + this.hostScopeMap.delete(hostEl); + }; + CustomStyle.prototype.updateHost = function (hostEl) { + var scope = this.hostScopeMap.get(hostEl); + if (scope && scope.isDynamic && scope.cssScopeId) { + var styleEl = this.hostStyleMap.get(hostEl); + if (styleEl) { + var selectors = getActiveSelectors(hostEl, this.hostScopeMap, this.globalScopes); + var props = resolveValues(selectors); + styleEl.innerHTML = executeTemplate(scope.template, props); + } + } + }; + CustomStyle.prototype.updateGlobal = function () { + updateGlobalScopes(this.globalScopes); + }; + CustomStyle.prototype.registerHostTemplate = function (cssText, scopeId) { + var scope = this.scopesMap.get(scopeId); + if (!scope) { + scope = parseCSS(cssText); + scope.cssScopeId = scopeId; + this.scopesMap.set(scopeId, scope); + } + return scope; + }; + return CustomStyle; +}()); +var win = window; +function needsShim() { + return !(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)')); +} +if (!win.__stencil_cssshim && needsShim()) { + win.__stencil_cssshim = new CustomStyle(win, document); +} diff --git a/dist/esm/legacy/dom-7eb7509a-7eb7509a.js b/dist/esm/legacy/dom-7eb7509a-7eb7509a.js new file mode 100644 index 00000000000..24647cf086e --- /dev/null +++ b/dist/esm/legacy/dom-7eb7509a-7eb7509a.js @@ -0,0 +1,254 @@ +/* + Copyright (c) 2016 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +(function () { var t = new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" ")); function e(e) { var n = t.has(e); return e = /^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e), !n && e; } function n(t) { var e = t.isConnected; if (void 0 !== e) + return e; for (; t && !(t.__CE_isImportDocument || t instanceof Document);) + t = t.parentNode || (window.ShadowRoot && t instanceof ShadowRoot ? t.host : void 0); return !(!t || !(t.__CE_isImportDocument || t instanceof Document)); } function o(t, e) { for (; e && e !== t && !e.nextSibling;) + e = e.parentNode; return e && e !== t ? e.nextSibling : null; } function i(t, e, n) { n = void 0 === n ? new Set : n; for (var r = t; r;) { + if (r.nodeType === Node.ELEMENT_NODE) { + var a = r; + e(a); + var l = a.localName; + if ("link" === l && "import" === a.getAttribute("rel")) { + if ((r = a.import) instanceof Node && !n.has(r)) + for (n.add(r), r = r.firstChild; r; r = r.nextSibling) + i(r, e, n); + r = o(t, a); + continue; + } + if ("template" === l) { + r = o(t, a); + continue; + } + if (a = a.__CE_shadowRoot) + for (a = a.firstChild; a; a = a.nextSibling) + i(a, e, n); + } + r = r.firstChild ? r.firstChild : o(t, r); +} } function r(t, e, n) { t[e] = n; } function a() { this.a = new Map, this.f = new Map, this.c = [], this.b = !1; } function l(t, e) { t.b = !0, t.c.push(e); } function c(t, e) { t.b && i(e, function (e) { return s(t, e); }); } function s(t, e) { if (t.b && !e.__CE_patched) { + e.__CE_patched = !0; + for (var n = 0; n < t.c.length; n++) + t.c[n](e); +} } function h(t, e) { var n = []; for (i(e, function (t) { return n.push(t); }), e = 0; e < n.length; e++) { + var o = n[e]; + 1 === o.__CE_state ? t.connectedCallback(o) : f(t, o); +} } function u(t, e) { var n = []; for (i(e, function (t) { return n.push(t); }), e = 0; e < n.length; e++) { + var o = n[e]; + 1 === o.__CE_state && t.disconnectedCallback(o); +} } function p(t, e, n) { var o = (n = void 0 === n ? {} : n).u || new Set, r = n.h || function (e) { return f(t, e); }, a = []; if (i(e, function (e) { if ("link" === e.localName && "import" === e.getAttribute("rel")) { + var n = e.import; + n instanceof Node && (n.__CE_isImportDocument = !0, n.__CE_hasRegistry = !0), n && "complete" === n.readyState ? n.__CE_documentLoadHandled = !0 : e.addEventListener("load", function () { var n = e.import; if (!n.__CE_documentLoadHandled) { + n.__CE_documentLoadHandled = !0; + var i = new Set(o); + i.delete(n), p(t, n, { u: i, h: r }); + } }); +} +else + a.push(e); }, o), t.b) + for (e = 0; e < a.length; e++) + s(t, a[e]); for (e = 0; e < a.length; e++) + r(a[e]); } function f(t, e) { if (void 0 === e.__CE_state) { + var o = e.ownerDocument; + if ((o.defaultView || o.__CE_isImportDocument && o.__CE_hasRegistry) && (o = t.a.get(e.localName))) { + o.constructionStack.push(e); + var i = o.constructorFunction; + try { + try { + if (new i !== e) + throw Error("The custom element constructor did not produce the element being upgraded."); + } + finally { + o.constructionStack.pop(); + } + } + catch (t) { + throw e.__CE_state = 2, t; + } + if (e.__CE_state = 1, e.__CE_definition = o, o.attributeChangedCallback) + for (o = o.observedAttributes, i = 0; i < o.length; i++) { + var r = o[i], a = e.getAttribute(r); + null !== a && t.attributeChangedCallback(e, r, null, a, null); + } + n(e) && t.connectedCallback(e); + } +} } function d(t) { var e = document; this.c = t, this.a = e, this.b = void 0, p(this.c, this.a), "loading" === this.a.readyState && (this.b = new MutationObserver(this.f.bind(this)), this.b.observe(this.a, { childList: !0, subtree: !0 })); } function m(t) { t.b && t.b.disconnect(); } function w() { var t = this; this.b = this.a = void 0, this.c = new Promise(function (e) { t.b = e, t.a && e(t.a); }); } function b(t) { if (t.a) + throw Error("Already resolved."); t.a = void 0, t.b && t.b(void 0); } function y(t) { this.c = !1, this.a = t, this.j = new Map, this.f = function (t) { return t(); }, this.b = !1, this.i = [], this.o = new d(t); } a.prototype.connectedCallback = function (t) { var e = t.__CE_definition; e.connectedCallback && e.connectedCallback.call(t); }, a.prototype.disconnectedCallback = function (t) { var e = t.__CE_definition; e.disconnectedCallback && e.disconnectedCallback.call(t); }, a.prototype.attributeChangedCallback = function (t, e, n, o, i) { var r = t.__CE_definition; r.attributeChangedCallback && -1 < r.observedAttributes.indexOf(e) && r.attributeChangedCallback.call(t, e, n, o, i); }, d.prototype.f = function (t) { var e = this.a.readyState; for ("interactive" !== e && "complete" !== e || m(this), e = 0; e < t.length; e++) + for (var n = t[e].addedNodes, o = 0; o < n.length; o++) + p(this.c, n[o]); }, y.prototype.l = function (t, n) { var o = this; if (!(n instanceof Function)) + throw new TypeError("Custom element constructors must be functions."); if (!e(t)) + throw new SyntaxError("The element name '" + t + "' is not valid."); if (this.a.a.get(t)) + throw Error("A custom element with name '" + t + "' has already been defined."); if (this.c) + throw Error("A custom element is already being defined."); this.c = !0; try { + var i = function (t) { var e = r[t]; if (void 0 !== e && !(e instanceof Function)) + throw Error("The '" + t + "' callback must be a function."); return e; }, r = n.prototype; + if (!(r instanceof Object)) + throw new TypeError("The custom element constructor's prototype is not an object."); + var a = i("connectedCallback"), l = i("disconnectedCallback"), c = i("adoptedCallback"), s = i("attributeChangedCallback"), h = n.observedAttributes || []; +} +catch (t) { + return; +} +finally { + this.c = !1; +} n = { localName: t, constructorFunction: n, connectedCallback: a, disconnectedCallback: l, adoptedCallback: c, attributeChangedCallback: s, observedAttributes: h, constructionStack: [] }, function (t, e, n) { t.a.set(e, n), t.f.set(n.constructorFunction, n); }(this.a, t, n), this.i.push(n), this.b || (this.b = !0, this.f(function () { return function (t) { if (!1 !== t.b) { + t.b = !1; + for (var e = t.i, n = [], o = new Map, i = 0; i < e.length; i++) + o.set(e[i].localName, []); + for (p(t.a, document, { h: function (e) { if (void 0 === e.__CE_state) { + var i = e.localName, r = o.get(i); + r ? r.push(e) : t.a.a.get(i) && n.push(e); + } } }), i = 0; i < n.length; i++) + f(t.a, n[i]); + for (; 0 < e.length;) { + var r = e.shift(); + i = r.localName, r = o.get(r.localName); + for (var a = 0; a < r.length; a++) + f(t.a, r[a]); + (i = t.j.get(i)) && b(i); + } +} }(o); })); }, y.prototype.h = function (t) { p(this.a, t); }, y.prototype.get = function (t) { if (t = this.a.a.get(t)) + return t.constructorFunction; }, y.prototype.m = function (t) { if (!e(t)) + return Promise.reject(new SyntaxError("'" + t + "' is not a valid custom element name.")); var n = this.j.get(t); return n ? n.c : (n = new w, this.j.set(t, n), this.a.a.get(t) && !this.i.some(function (e) { return e.localName === t; }) && b(n), n.c); }, y.prototype.s = function (t) { m(this.o); var e = this.f; this.f = function (n) { return t(function () { return e(n); }); }; }, window.CustomElementRegistry = y, y.prototype.define = y.prototype.l, y.prototype.upgrade = y.prototype.h, y.prototype.get = y.prototype.get, y.prototype.whenDefined = y.prototype.m, y.prototype.polyfillWrapFlushCallback = y.prototype.s; var g = window.Document.prototype.createElement, v = window.Document.prototype.createElementNS, E = window.Document.prototype.importNode, _ = window.Document.prototype.prepend, C = window.Document.prototype.append, N = window.DocumentFragment.prototype.prepend, S = window.DocumentFragment.prototype.append, k = window.Node.prototype.cloneNode, D = window.Node.prototype.appendChild, T = window.Node.prototype.insertBefore, A = window.Node.prototype.removeChild, j = window.Node.prototype.replaceChild, L = Object.getOwnPropertyDescriptor(window.Node.prototype, "textContent"), M = window.Element.prototype.attachShadow, H = Object.getOwnPropertyDescriptor(window.Element.prototype, "innerHTML"), x = window.Element.prototype.getAttribute, O = window.Element.prototype.setAttribute, F = window.Element.prototype.removeAttribute, R = window.Element.prototype.getAttributeNS, P = window.Element.prototype.setAttributeNS, I = window.Element.prototype.removeAttributeNS, z = window.Element.prototype.insertAdjacentElement, W = window.Element.prototype.insertAdjacentHTML, B = window.Element.prototype.prepend, U = window.Element.prototype.append, V = window.Element.prototype.before, X = window.Element.prototype.after, $ = window.Element.prototype.replaceWith, q = window.Element.prototype.remove, G = window.HTMLElement, J = Object.getOwnPropertyDescriptor(window.HTMLElement.prototype, "innerHTML"), K = window.HTMLElement.prototype.insertAdjacentElement, Q = window.HTMLElement.prototype.insertAdjacentHTML, Y = new function () { }; function Z(t, e, o) { function i(e) { return function (o) { for (var i = [], r = 0; r < arguments.length; ++r) + i[r] = arguments[r]; r = []; for (var a = [], l = 0; l < i.length; l++) { + var c = i[l]; + if (c instanceof Element && n(c) && a.push(c), c instanceof DocumentFragment) + for (c = c.firstChild; c; c = c.nextSibling) + r.push(c); + else + r.push(c); +} for (e.apply(this, i), i = 0; i < a.length; i++) + u(t, a[i]); if (n(this)) + for (i = 0; i < r.length; i++) + (a = r[i]) instanceof Element && h(t, a); }; } void 0 !== o.g && (e.prepend = i(o.g)), void 0 !== o.append && (e.append = i(o.append)); } var tt, et = window.customElements; if (!et || "function" != typeof et.define || "function" != typeof et.get) { + var nt = new a; + tt = nt, window.HTMLElement = function () { function t() { var t = this.constructor, e = tt.f.get(t); if (!e) + throw Error("The custom element being constructed was not registered with `customElements`."); var n = e.constructionStack; if (0 === n.length) + return n = g.call(document, e.localName), Object.setPrototypeOf(n, t.prototype), n.__CE_state = 1, n.__CE_definition = e, s(tt, n), n; var o = n[e = n.length - 1]; if (o === Y) + throw Error("The HTMLElement constructor was either called reentrantly for this constructor or called multiple times."); return n[e] = Y, Object.setPrototypeOf(o, t.prototype), s(tt, o), o; } return t.prototype = G.prototype, Object.defineProperty(t.prototype, "constructor", { writable: !0, configurable: !0, enumerable: !1, value: t }), t; }(), function () { var t = nt; r(Document.prototype, "createElement", function (e) { if (this.__CE_hasRegistry) { + var n = t.a.get(e); + if (n) + return new n.constructorFunction; + } return e = g.call(this, e), s(t, e), e; }), r(Document.prototype, "importNode", function (e, n) { return e = E.call(this, e, !!n), this.__CE_hasRegistry ? p(t, e) : c(t, e), e; }), r(Document.prototype, "createElementNS", function (e, n) { if (this.__CE_hasRegistry && (null === e || "http://www.w3.org/1999/xhtml" === e)) { + var o = t.a.get(n); + if (o) + return new o.constructorFunction; + } return e = v.call(this, e, n), s(t, e), e; }), Z(t, Document.prototype, { g: _, append: C }); }(), Z(nt, DocumentFragment.prototype, { g: N, append: S }), function () { function t(t, o) { Object.defineProperty(t, "textContent", { enumerable: o.enumerable, configurable: !0, get: o.get, set: function (t) { if (this.nodeType === Node.TEXT_NODE) + o.set.call(this, t); + else { + var i = void 0; + if (this.firstChild) { + var r = this.childNodes, a = r.length; + if (0 < a && n(this)) { + i = Array(a); + for (var l = 0; l < a; l++) + i[l] = r[l]; + } + } + if (o.set.call(this, t), i) + for (t = 0; t < i.length; t++) + u(e, i[t]); + } } }); } var e = nt; r(Node.prototype, "insertBefore", function (t, o) { if (t instanceof DocumentFragment) { + var i = Array.prototype.slice.apply(t.childNodes); + if (t = T.call(this, t, o), n(this)) + for (o = 0; o < i.length; o++) + h(e, i[o]); + return t; + } return i = n(t), o = T.call(this, t, o), i && u(e, t), n(this) && h(e, t), o; }), r(Node.prototype, "appendChild", function (t) { if (t instanceof DocumentFragment) { + var o = Array.prototype.slice.apply(t.childNodes); + if (t = D.call(this, t), n(this)) + for (var i = 0; i < o.length; i++) + h(e, o[i]); + return t; + } return o = n(t), i = D.call(this, t), o && u(e, t), n(this) && h(e, t), i; }), r(Node.prototype, "cloneNode", function (t) { return t = k.call(this, !!t), this.ownerDocument.__CE_hasRegistry ? p(e, t) : c(e, t), t; }), r(Node.prototype, "removeChild", function (t) { var o = n(t), i = A.call(this, t); return o && u(e, t), i; }), r(Node.prototype, "replaceChild", function (t, o) { if (t instanceof DocumentFragment) { + var i = Array.prototype.slice.apply(t.childNodes); + if (t = j.call(this, t, o), n(this)) + for (u(e, o), o = 0; o < i.length; o++) + h(e, i[o]); + return t; + } i = n(t); var r = j.call(this, t, o), a = n(this); return a && u(e, o), i && u(e, t), a && h(e, t), r; }), L && L.get ? t(Node.prototype, L) : l(e, function (e) { t(e, { enumerable: !0, configurable: !0, get: function () { for (var t = [], e = 0; e < this.childNodes.length; e++) + t.push(this.childNodes[e].textContent); return t.join(""); }, set: function (t) { for (; this.firstChild;) + A.call(this, this.firstChild); D.call(this, document.createTextNode(t)); } }); }); }(), function () { function t(t, e) { Object.defineProperty(t, "innerHTML", { enumerable: e.enumerable, configurable: !0, get: e.get, set: function (t) { var o = this, r = void 0; if (n(this) && (r = [], i(this, function (t) { t !== o && r.push(t); })), e.set.call(this, t), r) + for (var l = 0; l < r.length; l++) { + var s = r[l]; + 1 === s.__CE_state && a.disconnectedCallback(s); + } return this.ownerDocument.__CE_hasRegistry ? p(a, this) : c(a, this), t; } }); } function e(t, e) { r(t, "insertAdjacentElement", function (t, o) { var i = n(o); return t = e.call(this, t, o), i && u(a, o), n(t) && h(a, o), t; }); } function o(t, e) { function n(t, e) { for (var n = []; t !== e; t = t.nextSibling) + n.push(t); for (e = 0; e < n.length; e++) + p(a, n[e]); } r(t, "insertAdjacentHTML", function (t, o) { if ("beforebegin" === (t = t.toLowerCase())) { + var i = this.previousSibling; + e.call(this, t, o), n(i || this.parentNode.firstChild, this); + } + else if ("afterbegin" === t) + i = this.firstChild, e.call(this, t, o), n(this.firstChild, i); + else if ("beforeend" === t) + i = this.lastChild, e.call(this, t, o), n(i || this.firstChild, null); + else { + if ("afterend" !== t) + throw new SyntaxError("The value provided (" + String(t) + ") is not one of 'beforebegin', 'afterbegin', 'beforeend', or 'afterend'."); + i = this.nextSibling, e.call(this, t, o), n(this.nextSibling, i); + } }); } var a = nt; M && r(Element.prototype, "attachShadow", function (t) { return this.__CE_shadowRoot = M.call(this, t); }), H && H.get ? t(Element.prototype, H) : J && J.get ? t(HTMLElement.prototype, J) : l(a, function (e) { t(e, { enumerable: !0, configurable: !0, get: function () { return k.call(this, !0).innerHTML; }, set: function (t) { var e = "template" === this.localName, n = e ? this.content : this, o = v.call(document, this.namespaceURI, this.localName); for (o.innerHTML = t; 0 < n.childNodes.length;) + A.call(n, n.childNodes[0]); for (t = e ? o.content : o; 0 < t.childNodes.length;) + D.call(n, t.childNodes[0]); } }); }), r(Element.prototype, "setAttribute", function (t, e) { if (1 !== this.__CE_state) + return O.call(this, t, e); var n = x.call(this, t); O.call(this, t, e), e = x.call(this, t), a.attributeChangedCallback(this, t, n, e, null); }), r(Element.prototype, "setAttributeNS", function (t, e, n) { if (1 !== this.__CE_state) + return P.call(this, t, e, n); var o = R.call(this, t, e); P.call(this, t, e, n), n = R.call(this, t, e), a.attributeChangedCallback(this, e, o, n, t); }), r(Element.prototype, "removeAttribute", function (t) { if (1 !== this.__CE_state) + return F.call(this, t); var e = x.call(this, t); F.call(this, t), null !== e && a.attributeChangedCallback(this, t, e, null, null); }), r(Element.prototype, "removeAttributeNS", function (t, e) { if (1 !== this.__CE_state) + return I.call(this, t, e); var n = R.call(this, t, e); I.call(this, t, e); var o = R.call(this, t, e); n !== o && a.attributeChangedCallback(this, e, n, o, t); }), K ? e(HTMLElement.prototype, K) : z ? e(Element.prototype, z) : console.warn("Custom Elements: `Element#insertAdjacentElement` was not patched."), Q ? o(HTMLElement.prototype, Q) : W ? o(Element.prototype, W) : console.warn("Custom Elements: `Element#insertAdjacentHTML` was not patched."), Z(a, Element.prototype, { g: B, append: U }), function (t) { function e(e) { return function (o) { for (var i = [], r = 0; r < arguments.length; ++r) + i[r] = arguments[r]; r = []; for (var a = [], l = 0; l < i.length; l++) { + var c = i[l]; + if (c instanceof Element && n(c) && a.push(c), c instanceof DocumentFragment) + for (c = c.firstChild; c; c = c.nextSibling) + r.push(c); + else + r.push(c); + } for (e.apply(this, i), i = 0; i < a.length; i++) + u(t, a[i]); if (n(this)) + for (i = 0; i < r.length; i++) + (a = r[i]) instanceof Element && h(t, a); }; } var o = Element.prototype; void 0 !== V && (o.before = e(V)), void 0 !== V && (o.after = e(X)), void 0 !== $ && r(o, "replaceWith", function (e) { for (var o = [], i = 0; i < arguments.length; ++i) + o[i] = arguments[i]; i = []; for (var r = [], a = 0; a < o.length; a++) { + var l = o[a]; + if (l instanceof Element && n(l) && r.push(l), l instanceof DocumentFragment) + for (l = l.firstChild; l; l = l.nextSibling) + i.push(l); + else + i.push(l); + } for (a = n(this), $.apply(this, o), o = 0; o < r.length; o++) + u(t, r[o]); if (a) + for (u(t, this), o = 0; o < i.length; o++) + (r = i[o]) instanceof Element && h(t, r); }), void 0 !== q && r(o, "remove", function () { var e = n(this); q.call(this), e && u(t, this); }); }(a); }(), document.__CE_hasRegistry = !0; + var ot = new y(nt); + Object.defineProperty(window, "customElements", { configurable: !0, enumerable: !0, value: ot }); +} }).call(self); +// Polyfill CustomEvent +if (typeof window.CustomEvent !== 'function') { + function CustomEvent(event, params) { + params = params || { bubbles: false, cancelable: false, detail: undefined }; + var evt = document.createEvent('CustomEvent'); + evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); + return evt; + } + CustomEvent.prototype = window.Event.prototype; + window.CustomEvent = CustomEvent; +} +/*! +Element.closest and Element.matches +https://github.com/jonathantneal/closest +Creative Commons Zero v1.0 Universal +*/ +(function (a) { "function" !== typeof a.matches && (a.matches = a.msMatchesSelector || a.mozMatchesSelector || a.webkitMatchesSelector || function (a) { a = (this.document || this.ownerDocument).querySelectorAll(a); for (var b = 0; a[b] && a[b] !== this;) + ++b; return !!a[b]; }); "function" !== typeof a.closest && (a.closest = function (a) { for (var b = this; b && 1 === b.nodeType;) { + if (b.matches(a)) + return b; + b = b.parentNode; +} return null; }); })(window.Element.prototype); +/*! +Element.getRootNode() +*/ +(function (c) { function d(a) { a = b(a); return 11 === a.nodeType ? d(a.host) : a; } function b(a) { return a.parentNode ? b(a.parentNode) : a; } "function" !== typeof c.getRootNode && (c.getRootNode = function (a) { return a && a.composed ? d(this) : b(this); }); })(Element.prototype); +/*! +Element.remove() +*/ +(function (b) { b.forEach(function (a) { a.hasOwnProperty("remove") || Object.defineProperty(a, "remove", { configurable: !0, enumerable: !0, writable: !0, value: function () { null !== this.parentNode && this.parentNode.removeChild(this); } }); }); })([Element.prototype, CharacterData.prototype, DocumentType.prototype]); diff --git a/dist/esm/legacy/index.mjs b/dist/esm/legacy/index.mjs new file mode 100644 index 00000000000..458ca4f2576 --- /dev/null +++ b/dist/esm/legacy/index.mjs @@ -0,0 +1 @@ +//! Autogenerated index diff --git a/dist/esm/legacy/loader.mjs b/dist/esm/legacy/loader.mjs new file mode 100644 index 00000000000..bd1c1897d6c --- /dev/null +++ b/dist/esm/legacy/loader.mjs @@ -0,0 +1,7 @@ +import { c as patchEsm, b as bootstrapLazy } from './calcite-a092ddcb.js'; +var defineCustomElements = function (win, options) { + return patchEsm().then(function () { + bootstrapLazy([["calcite-alert_8", [[1, "calcite-alert", { "currentAlert": [1, "current-alert"], "dismiss": [4], "icon": [4], "id": [1], "queueLength": [2, "queue-length"], "color": [513], "theme": [513], "duration": [513], "isActive": [32], "close": [64] }], [1, "calcite-alerts", { "id": [1], "currentAlert": [32], "isActive": [32], "queue": [32], "open": [64] }, [[0, "alertClose", "updateQueue"]]], [1, "calcite-loader", { "isActive": [4, "is-active"], "text": [1] }], [1, "calcite-modal", { "first": [1], "middle": [1], "last": [1] }], [1, "calcite-tab", { "id": [1537], "tab": [1537], "isActive": [1540, "is-active"], "labeledBy": [32], "getTabIndex": [64], "registerLabeledBy": [64] }, [[16, "calciteTabChange", "tabChangeHandler"]]], [1, "calcite-tab-nav", { "id": [1537], "selectedTab": [1032, "selected-tab"] }, [[0, "calciteFocusPreviousTab", "focusPreviousTabHandler"], [0, "calciteFocusNextTab", "focusNextTabHandler"], [0, "calciteRegisterTabTitle", "tabTitleRegistationHandler"], [0, "calciteActivateTab", "activateTabHandler"]]], [1, "calcite-tab-title", { "id": [1537], "tab": [1537], "isActive": [1540, "is-active"], "controls": [32], "getTabIndex": [64], "setControledBy": [64] }, [[16, "calciteTabChange", "tabChangeHand"], [0, "click", "onClick"], [0, "keydown", "keyDownHandler"]]], [1, "calcite-tabs", { "theme": [513], "tabs": [32], "tabTitles": [32] }, [[0, "calciteRegisterTabTitle", "tabTitleRegistationHandler"], [0, "calciteRegisterTab", "tabRegistationHandler"]]]]], ["context-consumer", [[0, "context-consumer", { "context": [16], "renderer": [16], "subscribe": [16], "unsubscribe": [32] }]]]], options); + }); +}; +export { defineCustomElements }; diff --git a/dist/esm/legacy/shadow-css-984bac74-549b16dd.js b/dist/esm/legacy/shadow-css-984bac74-549b16dd.js new file mode 100644 index 00000000000..67e00a0c116 --- /dev/null +++ b/dist/esm/legacy/shadow-css-984bac74-549b16dd.js @@ -0,0 +1,431 @@ +/** + * @license + * Copyright Google Inc. All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + * + * This file is a port of shadowCSS from webcomponents.js to TypeScript. + * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js + * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts + */ +function scopeCss(cssText, scopeId, commentOriginalSelector) { + var sc = new ShadowCss(); + return sc.shimCssText(cssText, scopeId, scopeId + '-h', scopeId + '-s', commentOriginalSelector); +} +var ShadowCss = /** @class */ (function () { + function ShadowCss() { + this.strictStyling = true; + } + ShadowCss.prototype.shimCssText = function (cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) { + if (hostScopeId === void 0) { hostScopeId = ''; } + if (slotScopeId === void 0) { slotScopeId = ''; } + if (commentOriginalSelector === void 0) { commentOriginalSelector = false; } + var commentsWithHash = extractCommentsWithHash(cssText); + cssText = stripComments(cssText); + var orgSelectors = []; + if (commentOriginalSelector) { + var processCommentedSelector_1 = function (rule) { + var placeholder = "/*!@___" + orgSelectors.length + "___*/"; + var comment = "/*!@" + rule.selector + "*/"; + orgSelectors.push({ placeholder: placeholder, comment: comment }); + rule.selector = placeholder + rule.selector; + return rule; + }; + cssText = processRules(cssText, function (rule) { + if (rule.selector[0] !== '@') { + return processCommentedSelector_1(rule); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + rule.content = processRules(rule.content, processCommentedSelector_1); + return rule; + } + return rule; + }); + } + var scopedCssText = this._scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + cssText = [scopedCssText].concat(commentsWithHash).join('\n'); + if (commentOriginalSelector) { + orgSelectors.forEach(function (_a) { + var placeholder = _a.placeholder, comment = _a.comment; + cssText = cssText.replace(placeholder, comment); + }); + } + return cssText; + }; + ShadowCss.prototype._scopeCssText = function (cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) { + // replace :host and :host-context -shadowcsshost and -shadowcsshost respectively + cssText = this._insertPolyfillHostInCssText(cssText); + cssText = this._convertColonHost(cssText); + cssText = this._convertColonHostContext(cssText); + cssText = this._convertColonSlotted(cssText, slotScopeId); + cssText = this._convertShadowDOMSelectors(cssText); + if (scopeId) { + cssText = this._scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + } + cssText = cssText.replace(/-shadowcsshost-no-combinator/g, "." + hostScopeId); + cssText = cssText.replace(/>\s*\*\s+([^{, ]+)/gm, ' $1 '); + return cssText.trim(); + }; + /* + * convert a rule like :host(.foo) > .bar { } + * + * to + * + * .foo > .bar + */ + ShadowCss.prototype._convertColonHost = function (cssText) { + return this._convertColonRule(cssText, _cssColonHostRe, this._colonHostPartReplacer); + }; + /* + * convert a rule like ::slotted(.foo) { } + */ + ShadowCss.prototype._convertColonSlotted = function (cssText, slotAttr) { + var regExp = _cssColonSlottedRe; + return cssText.replace(regExp, function () { + var m = []; + for (var _i = 0; _i < arguments.length; _i++) { + m[_i] = arguments[_i]; + } + if (m[2]) { + var compound = m[2].trim(); + var suffix = m[3]; + var sel = '.' + slotAttr + ' > ' + compound + suffix; + return sel; + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + }; + /* + * convert a rule like :host-context(.foo) > .bar { } + * + * to + * + * .foo > .bar, .foo scopeName > .bar { } + * + * and + * + * :host-context(.foo:host) .bar { ... } + * + * to + * + * .foo .bar { ... } + */ + ShadowCss.prototype._convertColonHostContext = function (cssText) { + return this._convertColonRule(cssText, _cssColonHostContextRe, this._colonHostContextPartReplacer); + }; + ShadowCss.prototype._convertColonRule = function (cssText, regExp, partReplacer) { + // m[1] = :host(-context), m[2] = contents of (), m[3] rest of rule + return cssText.replace(regExp, function () { + var m = []; + for (var _i = 0; _i < arguments.length; _i++) { + m[_i] = arguments[_i]; + } + if (m[2]) { + var parts = m[2].split(','); + var r = []; + for (var i = 0; i < parts.length; i++) { + var p = parts[i].trim(); + if (!p) + break; + r.push(partReplacer(_polyfillHostNoCombinator, p, m[3])); + } + return r.join(','); + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + }; + ShadowCss.prototype._colonHostContextPartReplacer = function (host, part, suffix) { + if (part.indexOf(_polyfillHost) > -1) { + return this._colonHostPartReplacer(host, part, suffix); + } + else { + return host + part + suffix + ', ' + part + ' ' + host + suffix; + } + }; + ShadowCss.prototype._colonHostPartReplacer = function (host, part, suffix) { + return host + part.replace(_polyfillHost, '') + suffix; + }; + /* + * Convert combinators like ::shadow and pseudo-elements like ::content + * by replacing with space. + */ + ShadowCss.prototype._convertShadowDOMSelectors = function (cssText) { + return _shadowDOMSelectorsRe.reduce(function (result, pattern) { return result.replace(pattern, ' '); }, cssText); + }; + // change a selector like 'div' to 'name div' + ShadowCss.prototype._scopeSelectors = function (cssText, scopeSelector, hostSelector, slotSelector, commentOriginalSelector) { + var _this = this; + return processRules(cssText, function (rule) { + var selector = rule.selector; + var content = rule.content; + if (rule.selector[0] !== '@') { + selector = + _this._scopeSelector(rule.selector, scopeSelector, hostSelector, slotSelector, _this.strictStyling); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + content = _this._scopeSelectors(rule.content, scopeSelector, hostSelector, slotSelector, commentOriginalSelector); + } + selector = selector.replace(/\s{2,}/g, ' ').trim(); + return new CssRule(selector, content); + }); + }; + ShadowCss.prototype._scopeSelector = function (selector, scopeSelector, hostSelector, slotSelector, strict) { + var _this = this; + return selector.split(',') + .map(function (shallowPart) { + if (slotSelector && shallowPart.indexOf('.' + slotSelector) > -1) { + return shallowPart.trim(); + } + if (_this._selectorNeedsScoping(shallowPart, scopeSelector)) { + return strict ? + _this._applyStrictSelectorScope(shallowPart, scopeSelector, hostSelector).trim() : + _this._applySelectorScope(shallowPart, scopeSelector, hostSelector).trim(); + } + else { + return shallowPart.trim(); + } + }) + .join(', '); + }; + ShadowCss.prototype._selectorNeedsScoping = function (selector, scopeSelector) { + var re = this._makeScopeMatcher(scopeSelector); + return !re.test(selector); + }; + ShadowCss.prototype._makeScopeMatcher = function (scopeSelector) { + var lre = /\[/g; + var rre = /\]/g; + scopeSelector = scopeSelector.replace(lre, '\\[').replace(rre, '\\]'); + return new RegExp('^(' + scopeSelector + ')' + _selectorReSuffix, 'm'); + }; + ShadowCss.prototype._applySelectorScope = function (selector, scopeSelector, hostSelector) { + // Difference from webcomponents.js: scopeSelector could not be an array + return this._applySimpleSelectorScope(selector, scopeSelector, hostSelector); + }; + // scope via name and [is=name] + ShadowCss.prototype._applySimpleSelectorScope = function (selector, scopeSelector, hostSelector) { + // In Android browser, the lastIndex is not reset when the regex is used in String.replace() + _polyfillHostRe.lastIndex = 0; + if (_polyfillHostRe.test(selector)) { + var replaceBy_1 = this.strictStyling ? "." + hostSelector : scopeSelector; + return selector + .replace(_polyfillHostNoCombinatorRe, function (_, selector) { + return selector.replace(/([^:]*)(:*)(.*)/, function (_, before, colon, after) { + return before + replaceBy_1 + colon + after; + }); + }) + .replace(_polyfillHostRe, replaceBy_1 + ' '); + } + return scopeSelector + ' ' + selector; + }; + ShadowCss.prototype._applyStrictSelectorScope = function (selector, scopeSelector, hostSelector) { + var _this = this; + var isRe = /\[is=([^\]]*)\]/g; + scopeSelector = scopeSelector.replace(isRe, function (_) { + var parts = []; + for (var _i = 1; _i < arguments.length; _i++) { + parts[_i - 1] = arguments[_i]; + } + return parts[0]; + }); + var className = '.' + scopeSelector; + var _scopeSelectorPart = function (p) { + var scopedP = p.trim(); + if (!scopedP) { + return ''; + } + if (p.indexOf(_polyfillHostNoCombinator) > -1) { + scopedP = _this._applySimpleSelectorScope(p, scopeSelector, hostSelector); + } + else { + // remove :host since it should be unnecessary + var t = p.replace(_polyfillHostRe, ''); + if (t.length > 0) { + var matches = t.match(/([^:]*)(:*)(.*)/); + if (matches) { + scopedP = matches[1] + className + matches[2] + matches[3]; + } + } + } + return scopedP; + }; + var safeContent = new SafeSelector(selector); + selector = safeContent.content(); + var scopedSelector = ''; + var startIndex = 0; + var res; + var sep = /( |>|\+|~(?!=))\s*/g; + // If a selector appears before :host it should not be shimmed as it + // matches on ancestor elements and not on elements in the host's shadow + // `:host-context(div)` is transformed to + // `-shadowcsshost-no-combinatordiv, div -shadowcsshost-no-combinator` + // the `div` is not part of the component in the 2nd selectors and should not be scoped. + // Historically `component-tag:host` was matching the component so we also want to preserve + // this behavior to avoid breaking legacy apps (it should not match). + // The behavior should be: + // - `tag:host` -> `tag[h]` (this is to avoid breaking legacy apps, should not match anything) + // - `tag :host` -> `tag [h]` (`tag` is not scoped because it's considered part of a + // `:host-context(tag)`) + var hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1; + // Only scope parts after the first `-shadowcsshost-no-combinator` when it is present + var shouldScope = !hasHost; + while ((res = sep.exec(selector)) !== null) { + var separator = res[1]; + var part_1 = selector.slice(startIndex, res.index).trim(); + shouldScope = shouldScope || part_1.indexOf(_polyfillHostNoCombinator) > -1; + var scopedPart = shouldScope ? _scopeSelectorPart(part_1) : part_1; + scopedSelector += scopedPart + " " + separator + " "; + startIndex = sep.lastIndex; + } + var part = selector.substring(startIndex); + shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1; + scopedSelector += shouldScope ? _scopeSelectorPart(part) : part; + // replace the placeholders with their original values + return safeContent.restore(scopedSelector); + }; + ShadowCss.prototype._insertPolyfillHostInCssText = function (selector) { + selector = selector + .replace(_colonHostContextRe, _polyfillHostContext) + .replace(_colonHostRe, _polyfillHost) + .replace(_colonSlottedRe, _polyfillSlotted); + return selector; + }; + return ShadowCss; +}()); +var SafeSelector = /** @class */ (function () { + function SafeSelector(selector) { + var _this = this; + this.placeholders = []; + this.index = 0; + // Replaces attribute selectors with placeholders. + // The WS in [attr="va lue"] would otherwise be interpreted as a selector separator. + selector = selector.replace(/(\[[^\]]*\])/g, function (_, keep) { + var replaceBy = "__ph-" + _this.index + "__"; + _this.placeholders.push(keep); + _this.index++; + return replaceBy; + }); + // Replaces the expression in `:nth-child(2n + 1)` with a placeholder. + // WS and "+" would otherwise be interpreted as selector separators. + this._content = selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, function (_, pseudo, exp) { + var replaceBy = "__ph-" + _this.index + "__"; + _this.placeholders.push(exp); + _this.index++; + return pseudo + replaceBy; + }); + } + SafeSelector.prototype.restore = function (content) { + var _this = this; + return content.replace(/__ph-(\d+)__/g, function (_, index) { return _this.placeholders[+index]; }); + }; + SafeSelector.prototype.content = function () { return this._content; }; + return SafeSelector; +}()); +var _polyfillHost = '-shadowcsshost'; +var _polyfillSlotted = '-shadowcssslotted'; +// note: :host-context pre-processed to -shadowcsshostcontext. +var _polyfillHostContext = '-shadowcsscontext'; +var _parenSuffix = ')(?:\\((' + + '(?:\\([^)(]*\\)|[^)(]*)+?' + + ')\\))?([^,{]*)'; +var _cssColonHostRe = new RegExp('(' + _polyfillHost + _parenSuffix, 'gim'); +var _cssColonHostContextRe = new RegExp('(' + _polyfillHostContext + _parenSuffix, 'gim'); +var _cssColonSlottedRe = new RegExp('(' + _polyfillSlotted + _parenSuffix, 'gim'); +var _polyfillHostNoCombinator = _polyfillHost + '-no-combinator'; +var _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/; +var _shadowDOMSelectorsRe = [ + /::shadow/g, + /::content/g +]; +var _selectorReSuffix = '([>\\s~+\[.,{:][\\s\\S]*)?$'; +var _polyfillHostRe = /-shadowcsshost/gim; +var _colonHostRe = /:host/gim; +var _colonSlottedRe = /::slotted/gim; +var _colonHostContextRe = /:host-context/gim; +var _commentRe = /\/\*\s*[\s\S]*?\*\//g; +function stripComments(input) { + return input.replace(_commentRe, ''); +} +var _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g; +function extractCommentsWithHash(input) { + return input.match(_commentWithHashRe) || []; +} +var _ruleRe = /(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g; +var _curlyRe = /([{}])/g; +var OPEN_CURLY = '{'; +var CLOSE_CURLY = '}'; +var BLOCK_PLACEHOLDER = '%BLOCK%'; +var CssRule = /** @class */ (function () { + function CssRule(selector, content) { + this.selector = selector; + this.content = content; + } + return CssRule; +}()); +function processRules(input, ruleCallback) { + var inputWithEscapedBlocks = escapeBlocks(input); + var nextBlockIndex = 0; + return inputWithEscapedBlocks.escapedString.replace(_ruleRe, function () { + var m = []; + for (var _i = 0; _i < arguments.length; _i++) { + m[_i] = arguments[_i]; + } + var selector = m[2]; + var content = ''; + var suffix = m[4]; + var contentPrefix = ''; + if (suffix && suffix.startsWith('{' + BLOCK_PLACEHOLDER)) { + content = inputWithEscapedBlocks.blocks[nextBlockIndex++]; + suffix = suffix.substring(BLOCK_PLACEHOLDER.length + 1); + contentPrefix = '{'; + } + var rule = ruleCallback(new CssRule(selector, content)); + return "" + m[1] + rule.selector + m[3] + contentPrefix + rule.content + suffix; + }); +} +var StringWithEscapedBlocks = /** @class */ (function () { + function StringWithEscapedBlocks(escapedString, blocks) { + this.escapedString = escapedString; + this.blocks = blocks; + } + return StringWithEscapedBlocks; +}()); +function escapeBlocks(input) { + var inputParts = input.split(_curlyRe); + var resultParts = []; + var escapedBlocks = []; + var bracketCount = 0; + var currentBlockParts = []; + for (var partIndex = 0; partIndex < inputParts.length; partIndex++) { + var part = inputParts[partIndex]; + if (part === CLOSE_CURLY) { + bracketCount--; + } + if (bracketCount > 0) { + currentBlockParts.push(part); + } + else { + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + currentBlockParts = []; + } + resultParts.push(part); + } + if (part === OPEN_CURLY) { + bracketCount++; + } + } + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + } + return new StringWithEscapedBlocks(resultParts.join(''), escapedBlocks); +} +export { ShadowCss, scopeCss }; diff --git a/dist/esm/loader.mjs b/dist/esm/loader.mjs new file mode 100644 index 00000000000..4d9e56f73b8 --- /dev/null +++ b/dist/esm/loader.mjs @@ -0,0 +1,9 @@ +import { c as patchEsm, b as bootstrapLazy } from './calcite-a092ddcb.js'; + +const defineCustomElements = (win, options) => { + return patchEsm().then(() => { + bootstrapLazy([["calcite-alert_8",[[1,"calcite-alert",{"currentAlert":[1,"current-alert"],"dismiss":[4],"icon":[4],"id":[1],"queueLength":[2,"queue-length"],"color":[513],"theme":[513],"duration":[513],"isActive":[32],"close":[64]}],[1,"calcite-alerts",{"id":[1],"currentAlert":[32],"isActive":[32],"queue":[32],"open":[64]},[[0,"alertClose","updateQueue"]]],[1,"calcite-loader",{"isActive":[4,"is-active"],"text":[1]}],[1,"calcite-modal",{"first":[1],"middle":[1],"last":[1]}],[1,"calcite-tab",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"labeledBy":[32],"getTabIndex":[64],"registerLabeledBy":[64]},[[16,"calciteTabChange","tabChangeHandler"]]],[1,"calcite-tab-nav",{"id":[1537],"selectedTab":[1032,"selected-tab"]},[[0,"calciteFocusPreviousTab","focusPreviousTabHandler"],[0,"calciteFocusNextTab","focusNextTabHandler"],[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteActivateTab","activateTabHandler"]]],[1,"calcite-tab-title",{"id":[1537],"tab":[1537],"isActive":[1540,"is-active"],"controls":[32],"getTabIndex":[64],"setControledBy":[64]},[[16,"calciteTabChange","tabChangeHand"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]],[1,"calcite-tabs",{"theme":[513],"tabs":[32],"tabTitles":[32]},[[0,"calciteRegisterTabTitle","tabTitleRegistationHandler"],[0,"calciteRegisterTab","tabRegistationHandler"]]]]],["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]]], options); + }); +}; + +export { defineCustomElements }; diff --git a/dist/esm/polyfills/array.js b/dist/esm/polyfills/array.js new file mode 100644 index 00000000000..9b126d2f0c5 --- /dev/null +++ b/dist/esm/polyfills/array.js @@ -0,0 +1,22 @@ +/*! +Array.prototype.fill +*/ +Array.prototype.fill||Object.defineProperty(Array.prototype,"fill",{value:function(t){var r,e,i,n,o,a,l;if(null==this)throw new TypeError("this is null or not defined");for(e=(r=Object(this)).length>>>0,n=(i=arguments[1]>>0)<0?Math.max(e+i,0):Math.min(i,e),l=(a=void 0===(o=arguments[2])?e:o>>0)<0?Math.max(e+a,0):Math.min(a,e);n>>0;if("function"!==typeof c)throw new TypeError("predicate must be a function");for(var a=0;a>>0;if("function"!==typeof c)throw new TypeError("predicate must be a function");for(var a=0;a>>0;if(0===n)return!1;var i,o,a=0|e,u=Math.max(0<=a?a:n-Math.abs(a),0);for(;u 0 ? fallback.join(',').trim() : undefined + }; +} +function compileVar(cssText, template, offset) { + var varMeta = parseVar(cssText, offset); + if (!varMeta) { + template.push(cssText.substring(offset, cssText.length)); + return cssText.length; + } + var propName = varMeta.propName; + var fallback = varMeta.fallback != null ? compileTemplate(varMeta.fallback) : undefined; + template.push(cssText.substring(offset, varMeta.start), function (params) { return resolveVar(params, propName, fallback); }); + return varMeta.end; +} +function executeTemplate(template, props) { + var final = ''; + for (var i = 0; i < template.length; i++) { + var s = template[i]; + final += (typeof s === 'string') + ? s + : s(props); + } + return final; +} +function findEndValue(cssText, offset) { + var onStr = false; + var double = false; + var i = offset; + for (; i < cssText.length; i++) { + var c = cssText[i]; + if (onStr) { + if (double && c === '"') { + onStr = false; + } + if (!double && c === '\'') { + onStr = false; + } + } + else { + if (c === '"') { + onStr = true; + double = true; + } + else if (c === '\'') { + onStr = true; + double = false; + } + else if (c === ';') { + return i + 1; + } + else if (c === '}') { + return i; + } + } + } + return i; +} +function removeCustomAssigns(cssText) { + var final = ''; + var offset = 0; + while (true) { + var assignPos = findRegex(VAR_ASSIGN_START, cssText, offset); + var start = assignPos ? assignPos.start : cssText.length; + final += cssText.substring(offset, start); + if (assignPos) { + offset = findEndValue(cssText, start); + } + else { + break; + } + } + return final; +} +function compileTemplate(cssText) { + var index = 0; + cssText = cssText.replace(COMMENTS, ''); + cssText = removeCustomAssigns(cssText) + .replace(TRAILING_LINES, ''); + var segments = []; + while (index < cssText.length) { + index = compileVar(cssText, segments, index); + } + return segments; +} +function resolveValues(selectors) { + var props = {}; + selectors.forEach(function (selector) { + selector.declarations.forEach(function (dec) { + props[dec.prop] = dec.value; + }); + }); + var propsValues = {}; + var entries = Object.entries(props); + var _loop_1 = function (i) { + var dirty = false; + entries.forEach(function (_a) { + var key = _a[0], value = _a[1]; + var propValue = executeTemplate(value, propsValues); + if (propValue !== propsValues[key]) { + propsValues[key] = propValue; + dirty = true; + } + }); + if (!dirty) { + return "break"; + } + }; + for (var i = 0; i < 10; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + return propsValues; +} +function getSelectors(root, index) { + if (index === void 0) { index = 0; } + if (!root.rules) { + return []; + } + var selectors = []; + root.rules + .filter(function (rule) { return rule.type === types.STYLE_RULE; }) + .forEach(function (rule) { + var declarations = getDeclarations(rule.cssText); + if (declarations.length > 0) { + rule.parsedSelector.split(',').forEach(function (selector) { + selector = selector.trim(); + selectors.push({ + selector: selector, + declarations: declarations, + specificity: computeSpecificity(selector), + nu: index + }); + }); + } + index++; + }); + return selectors; +} +function computeSpecificity(_selector) { + return 1; +} +var IMPORTANT = '!important'; +var FIND_DECLARATIONS = /(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm; +function getDeclarations(cssText) { + var declarations = []; + var xArray; + while (xArray = FIND_DECLARATIONS.exec(cssText.trim())) { + var _a = normalizeValue(xArray[2]), value = _a.value, important = _a.important; + declarations.push({ + prop: xArray[1].trim(), + value: compileTemplate(value), + important: important, + }); + } + return declarations; +} +function normalizeValue(value) { + var regex = /\s+/gim; + value = value.replace(regex, ' ').trim(); + var important = value.endsWith(IMPORTANT); + if (important) { + value = value.substr(0, value.length - IMPORTANT.length).trim(); + } + return { + value: value, + important: important + }; +} +function getActiveSelectors(hostEl, hostScopeMap, globalScopes) { + // computes the css scopes that might affect this particular element + var scopes = globalScopes.concat(getScopesForElement(hostScopeMap, hostEl)); + // each scope might have an array of associated selectors + // let's flatten the complete array of selectors from all the scopes + var selectorSet = getSelectorsForScopes(scopes); + // we filter to only the selectors that matches the hostEl + var activeSelectors = selectorSet.filter(function (selector) { return matches(hostEl, selector.selector); }); + // sort selectors by specifity + return sortSelectors(activeSelectors); +} +function getScopesForElement(hostTemplateMap, node) { + var scopes = []; + while (node) { + var scope = hostTemplateMap.get(node); + if (scope) { + scopes.push(scope); + } + node = node.parentElement; + } + return scopes; +} +function getSelectorsForScopes(scopes) { + var selectors = []; + scopes.forEach(function (scope) { + selectors.push.apply(selectors, scope.selectors); + }); + return selectors; +} +function sortSelectors(selectors) { + selectors.sort(function (a, b) { + if (a.specificity === b.specificity) { + return a.nu - b.nu; + } + return a.specificity - b.specificity; + }); + return selectors; +} +function matches(el, selector) { + return el.matches(selector); +} +function parseCSS(original) { + var ast = parse(original); + var template = compileTemplate(original); + var selectors = getSelectors(ast); + return { + original: original, + template: template, + selectors: selectors, + isDynamic: template.length > 1 + }; +} +function addGlobalStyle(globalScopes, styleEl) { + var css = parseCSS(styleEl.innerHTML); + css.styleEl = styleEl; + globalScopes.push(css); +} +function updateGlobalScopes(scopes) { + var selectors = getSelectorsForScopes(scopes); + var props = resolveValues(selectors); + scopes.forEach(function (scope) { + if (scope.isDynamic) { + scope.styleEl.innerHTML = executeTemplate(scope.template, props); + } + }); +} +function reScope(scope, cssScopeId) { + var template = scope.template.map(function (segment) { + return (typeof segment === 'string') + ? replaceScope(segment, scope.cssScopeId, cssScopeId) + : segment; + }); + var selectors = scope.selectors.map(function (sel) { + return Object.assign({}, sel, { selector: replaceScope(sel.selector, scope.cssScopeId, cssScopeId) }); + }); + return Object.assign({}, scope, { template: template, + selectors: selectors, + cssScopeId: cssScopeId }); +} +function replaceScope(original, oldScopeId, newScopeId) { + original = replaceAll(original, "\\." + oldScopeId, "." + newScopeId); + return original; +} +function replaceAll(input, find, replace) { + return input.replace(new RegExp(find, 'g'), replace); +} +function loadDocument(doc, globalScopes) { + return loadDocumentLinks(doc, globalScopes).then(function () { + loadDocumentStyles(doc, globalScopes); + }); +} +function loadDocumentLinks(doc, globalScopes) { + var promises = []; + var linkElms = doc.querySelectorAll('link[rel="stylesheet"][href]'); + for (var i = 0; i < linkElms.length; i++) { + promises.push(addGlobalLink(doc, globalScopes, linkElms[i])); + } + return Promise.all(promises); +} +function loadDocumentStyles(doc, globalScopes) { + var styleElms = doc.querySelectorAll('style'); + for (var i = 0; i < styleElms.length; i++) { + addGlobalStyle(globalScopes, styleElms[i]); + } +} +function addGlobalLink(doc, globalScopes, linkElm) { + var url = linkElm.href; + return fetch(url).then(function (rsp) { return rsp.text(); }).then(function (text) { + if (hasCssVariables(text) && linkElm.parentNode) { + if (hasRelativeUrls(text)) { + text = fixRelativeUrls(text, url); + } + var styleEl = doc.createElement('style'); + styleEl.innerHTML = text; + addGlobalStyle(globalScopes, styleEl); + linkElm.parentNode.insertBefore(styleEl, linkElm); + linkElm.remove(); + } + }).catch(function (err) { + console.error(err); + }); +} +// This regexp tries to determine when a variable is declared, for example: +// +// .my-el { --highlight-color: green; } +// +// but we don't want to trigger when a classname uses "--" or a pseudo-class is +// used. We assume that the only characters that can preceed a variable +// declaration are "{", from an opening block, ";" from a preceeding rule, or a +// space. This prevents the regexp from matching a word in a selector, since +// they would need to start with a "." or "#". (We assume element names don't +// start with "--"). +var CSS_VARIABLE_REGEXP = /[\s;{]--[-a-zA-Z0-9]+\s*:/m; +function hasCssVariables(css) { + return css.indexOf('var(') > -1 || CSS_VARIABLE_REGEXP.test(css); +} +// This regexp find all url() usages with relative urls +var CSS_URL_REGEXP = /url[\s]*\([\s]*['"]?(?![http|/])([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim; +function hasRelativeUrls(css) { + CSS_URL_REGEXP.lastIndex = 0; + return CSS_URL_REGEXP.test(css); +} +function fixRelativeUrls(css, originalUrl) { + // get the basepath from the original import url + var basePath = originalUrl.replace(/[^/]*$/, ''); + // replace the relative url, with the new relative url + return css.replace(CSS_URL_REGEXP, function (fullMatch, url) { + // rhe new relative path is the base path + uri + // TODO: normalize relative URL + var relativeUrl = basePath + url; + return fullMatch.replace(url, relativeUrl); + }); +} +var CustomStyle = /** @class */ (function () { + function CustomStyle(win, doc) { + this.win = win; + this.doc = doc; + this.count = 0; + this.hostStyleMap = new WeakMap(); + this.hostScopeMap = new WeakMap(); + this.globalScopes = []; + this.scopesMap = new Map(); + } + CustomStyle.prototype.initShim = function () { + var _this = this; + return new Promise(function (resolve) { + _this.win.requestAnimationFrame(function () { + loadDocument(_this.doc, _this.globalScopes).then(function () { return resolve(); }); + }); + }); + }; + CustomStyle.prototype.addLink = function (linkEl) { + var _this = this; + return addGlobalLink(this.doc, this.globalScopes, linkEl).then(function () { + _this.updateGlobal(); + }); + }; + CustomStyle.prototype.addGlobalStyle = function (styleEl) { + addGlobalStyle(this.globalScopes, styleEl); + this.updateGlobal(); + }; + CustomStyle.prototype.createHostStyle = function (hostEl, cssScopeId, cssText) { + if (this.hostScopeMap.has(hostEl)) { + throw new Error('host style already created'); + } + var baseScope = this.registerHostTemplate(cssText, cssScopeId); + var isDynamicScoped = !!(baseScope.isDynamic && baseScope.cssScopeId); + var needStyleEl = isDynamicScoped || !baseScope.styleEl; + var styleEl = this.doc.createElement('style'); + if (!needStyleEl) { + styleEl.innerHTML = cssText; + } + else { + if (isDynamicScoped) { + styleEl['s-sc'] = cssScopeId = baseScope.cssScopeId + "-" + this.count; + styleEl.innerHTML = '/*needs update*/'; + this.hostStyleMap.set(hostEl, styleEl); + this.hostScopeMap.set(hostEl, reScope(baseScope, cssScopeId)); + this.count++; + } + else { + baseScope.styleEl = styleEl; + if (!baseScope.isDynamic) { + styleEl.innerHTML = executeTemplate(baseScope.template, {}); + } + this.globalScopes.push(baseScope); + this.updateGlobal(); + this.hostScopeMap.set(hostEl, baseScope); + } + } + return styleEl; + }; + CustomStyle.prototype.removeHost = function (hostEl) { + var css = this.hostStyleMap.get(hostEl); + if (css) { + css.remove(); + } + this.hostStyleMap.delete(hostEl); + this.hostScopeMap.delete(hostEl); + }; + CustomStyle.prototype.updateHost = function (hostEl) { + var scope = this.hostScopeMap.get(hostEl); + if (scope && scope.isDynamic && scope.cssScopeId) { + var styleEl = this.hostStyleMap.get(hostEl); + if (styleEl) { + var selectors = getActiveSelectors(hostEl, this.hostScopeMap, this.globalScopes); + var props = resolveValues(selectors); + styleEl.innerHTML = executeTemplate(scope.template, props); + } + } + }; + CustomStyle.prototype.updateGlobal = function () { + updateGlobalScopes(this.globalScopes); + }; + CustomStyle.prototype.registerHostTemplate = function (cssText, scopeId) { + var scope = this.scopesMap.get(scopeId); + if (!scope) { + scope = parseCSS(cssText); + scope.cssScopeId = scopeId; + this.scopesMap.set(scopeId, scope); + } + return scope; + }; + return CustomStyle; +}()); +var win = window; +function needsShim() { + return !(win.CSS && win.CSS.supports && win.CSS.supports('color', 'var(--c)')); +} +if (!win.__stencil_cssshim && needsShim()) { + win.__stencil_cssshim = new CustomStyle(win, document); +} diff --git a/dist/esm/polyfills/dom.js b/dist/esm/polyfills/dom.js new file mode 100644 index 00000000000..717a89fd368 --- /dev/null +++ b/dist/esm/polyfills/dom.js @@ -0,0 +1,38 @@ +/* + Copyright (c) 2016 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +*/ +(function(){"use strict";var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);return e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e),!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return!(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var l=a.localName;if("link"===l&&"import"===a.getAttribute("rel")){if((r=a.import)instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}if("template"===l){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n)}r=r.firstChild?r.firstChild:o(t,r)}}function r(t,e,n){t[e]=n}function a(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1}function l(t,e){t.b=!0,t.c.push(e)}function c(t,e){t.b&&i(e,function(e){return s(t,e)})}function s(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;nthis.status;this.statusText="statusText"in b?b.statusText:"OK";this.headers=new d(b.headers);this.url=b.url||"";this._initBody(a)}if(!e.fetch){var D="Symbol"in e&&"iterator"in Symbol,m;if(m="FileReader"in e&&"Blob"in e)try{new Blob,m=!0}catch(a){m=!1}var g={searchParams:"URLSearchParams"in e,iterable:D, +blob:m,formData:"FormData"in e,arrayBuffer:"ArrayBuffer"in e};if(g.arrayBuffer){var E="[object Int8Array];[object Uint8Array];[object Uint8ClampedArray];[object Int16Array];[object Uint16Array];[object Int32Array];[object Uint32Array];[object Float32Array];[object Float64Array]".split(";");var y=function(a){return a&&DataView.prototype.isPrototypeOf(a)};var z=ArrayBuffer.isView||function(a){return a&&-1this.length)a=this.length;return this.substring(a-b.length,a)===b}}); +/*! +String.prototype.includes +*/ +String.prototype.includes||(String.prototype.includes=function(b,a){"number"!==typeof a&&(a=0);return a+b.length>this.length?!1:-1!==this.indexOf(b,a)}); +/*! +String.prototype.startsWith +*/ +String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{writable:!0,configurable:!0,value:function(b,a){return this.substr(!a||0>a?0:+a,b.length)===b}}); \ No newline at end of file diff --git a/dist/esm/polyfills/system.js b/dist/esm/polyfills/system.js new file mode 100644 index 00000000000..3650a048f38 --- /dev/null +++ b/dist/esm/polyfills/system.js @@ -0,0 +1,4 @@ +/* +* SystemJS 3.1.3 +*/ +!function(){const e="undefined"!=typeof self,n=e?self:global;let t;if("undefined"!=typeof location){const e=(t=location.href.split("#")[0].split("?")[0]).lastIndexOf("/");-1!==e&&(t=t.slice(0,e+1))}const r=/\\/g,i="undefined"!=typeof Symbol,o=i&&Symbol.toStringTag,c=i?Symbol():"@";function l(){this[c]={}}const s=l.prototype;let u;s.import=function(e,n){const t=this;return Promise.resolve(t.resolve(e,n)).then(function(e){const n=function e(n,t,r){let i=n[c][t];if(i)return i;const l=[],s=Object.create(null);o&&Object.defineProperty(s,o,{value:"Module"});let u=Promise.resolve().then(function(){return n.instantiate(t,r)}).then(function(e){if(!e)throw new Error("Module "+t+" did not instantiate");const r=e[1](function(e,n){i.h=!0;let t=!1;if("object"!=typeof e)e in s&&s[e]===n||(s[e]=n,t=!0);else for(let n in e){let r=e[n];n in s&&s[n]===r||(s[n]=r,t=!0)}if(t)for(let e=0;et[0]){return+1}else{return 0}});if(r._entries){r._entries={}}for(var e=0;e1?o(i[1]):"")}}})}})(typeof global!=="undefined"?global:typeof window!=="undefined"?window:typeof self!=="undefined"?self:this);(function(h){var e=function(){try{var e=new h.URL("b","http://a");e.pathname="c%20d";return e.href==="http://a/c%20d"&&e.searchParams}catch(e){return false}};var t=function(){var t=h.URL;var e=function(e,t){if(typeof e!=="string")e=String(e);var r=document,n;if(t&&(h.location===void 0||t!==h.location.href)){r=document.implementation.createHTMLDocument("");n=r.createElement("base");n.href=t;r.head.appendChild(n);try{if(n.href.indexOf(t)!==0)throw new Error(n.href)}catch(e){throw new Error("URL unable to set base "+t+" due to "+e)}}var i=r.createElement("a");i.href=e;if(n){r.body.appendChild(i);i.href=i.href}if(i.protocol===":"||!/:/.test(i.href)){throw new TypeError("Invalid URL")}Object.defineProperty(this,"_anchorElement",{value:i});var o=new h.URLSearchParams(this.search);var a=true;var s=true;var c=this;["append","delete","set"].forEach(function(e){var t=o[e];o[e]=function(){t.apply(o,arguments);if(a){s=false;c.search=o.toString();s=true}}});Object.defineProperty(this,"searchParams",{value:o,enumerable:true});var f=void 0;Object.defineProperty(this,"_updateSearchParams",{enumerable:false,configurable:false,writable:false,value:function(){if(this.search!==f){f=this.search;if(s){a=false;this.searchParams._fromString(this.search);a=true}}}})};var r=e.prototype;var n=function(t){Object.defineProperty(r,t,{get:function(){return this._anchorElement[t]},set:function(e){this._anchorElement[t]=e},enumerable:true})};["hash","host","hostname","port","protocol"].forEach(function(e){n(e)});Object.defineProperty(r,"search",{get:function(){return this._anchorElement["search"]},set:function(e){this._anchorElement["search"]=e;this._updateSearchParams()},enumerable:true});Object.defineProperties(r,{toString:{get:function(){var e=this;return function(){return e.href}}},href:{get:function(){return this._anchorElement.href.replace(/\?$/,"")},set:function(e){this._anchorElement.href=e;this._updateSearchParams()},enumerable:true},pathname:{get:function(){return this._anchorElement.pathname.replace(/(^\/?)/,"/")},set:function(e){this._anchorElement.pathname=e},enumerable:true},origin:{get:function(){var e={"http:":80,"https:":443,"ftp:":21}[this._anchorElement.protocol];var t=this._anchorElement.port!=e&&this._anchorElement.port!=="";return this._anchorElement.protocol+"//"+this._anchorElement.hostname+(t?":"+this._anchorElement.port:"")},enumerable:true},password:{get:function(){return""},set:function(e){},enumerable:true},username:{get:function(){return""},set:function(e){},enumerable:true}});e.createObjectURL=function(e){return t.createObjectURL.apply(t,arguments)};e.revokeObjectURL=function(e){return t.revokeObjectURL.apply(t,arguments)};h.URL=e};if(!e()){t()}if(h.location!==void 0&&!("origin"in h.location)){var r=function(){return h.location.protocol+"//"+h.location.hostname+(h.location.port?":"+h.location.port:"")};try{Object.defineProperty(h.location,"origin",{get:r,enumerable:true})}catch(e){setInterval(function(){h.location.origin=r()},100)}}})(typeof global!=="undefined"?global:typeof window!=="undefined"?window:typeof self!=="undefined"?self:this); diff --git a/dist/esm/shadow-css-984bac74-549b16dd.js b/dist/esm/shadow-css-984bac74-549b16dd.js new file mode 100644 index 00000000000..e99600c3b3b --- /dev/null +++ b/dist/esm/shadow-css-984bac74-549b16dd.js @@ -0,0 +1,401 @@ +/** + * @license + * Copyright Google Inc. All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + * + * This file is a port of shadowCSS from webcomponents.js to TypeScript. + * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js + * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts + */ +function scopeCss(cssText, scopeId, commentOriginalSelector) { + const sc = new ShadowCss(); + return sc.shimCssText(cssText, scopeId, scopeId + '-h', scopeId + '-s', commentOriginalSelector); +} +class ShadowCss { + constructor() { + this.strictStyling = true; + } + shimCssText(cssText, scopeId, hostScopeId = '', slotScopeId = '', commentOriginalSelector = false) { + const commentsWithHash = extractCommentsWithHash(cssText); + cssText = stripComments(cssText); + const orgSelectors = []; + if (commentOriginalSelector) { + const processCommentedSelector = (rule) => { + const placeholder = `/*!@___${orgSelectors.length}___*/`; + const comment = `/*!@${rule.selector}*/`; + orgSelectors.push({ placeholder, comment }); + rule.selector = placeholder + rule.selector; + return rule; + }; + cssText = processRules(cssText, rule => { + if (rule.selector[0] !== '@') { + return processCommentedSelector(rule); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + rule.content = processRules(rule.content, processCommentedSelector); + return rule; + } + return rule; + }); + } + const scopedCssText = this._scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + cssText = [scopedCssText, ...commentsWithHash].join('\n'); + if (commentOriginalSelector) { + orgSelectors.forEach(({ placeholder, comment }) => { + cssText = cssText.replace(placeholder, comment); + }); + } + return cssText; + } + _scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) { + // replace :host and :host-context -shadowcsshost and -shadowcsshost respectively + cssText = this._insertPolyfillHostInCssText(cssText); + cssText = this._convertColonHost(cssText); + cssText = this._convertColonHostContext(cssText); + cssText = this._convertColonSlotted(cssText, slotScopeId); + cssText = this._convertShadowDOMSelectors(cssText); + if (scopeId) { + cssText = this._scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector); + } + cssText = cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`); + cssText = cssText.replace(/>\s*\*\s+([^{, ]+)/gm, ' $1 '); + return cssText.trim(); + } + /* + * convert a rule like :host(.foo) > .bar { } + * + * to + * + * .foo > .bar + */ + _convertColonHost(cssText) { + return this._convertColonRule(cssText, _cssColonHostRe, this._colonHostPartReplacer); + } + /* + * convert a rule like ::slotted(.foo) { } + */ + _convertColonSlotted(cssText, slotAttr) { + const regExp = _cssColonSlottedRe; + return cssText.replace(regExp, function (...m) { + if (m[2]) { + const compound = m[2].trim(); + const suffix = m[3]; + const sel = '.' + slotAttr + ' > ' + compound + suffix; + return sel; + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + } + /* + * convert a rule like :host-context(.foo) > .bar { } + * + * to + * + * .foo > .bar, .foo scopeName > .bar { } + * + * and + * + * :host-context(.foo:host) .bar { ... } + * + * to + * + * .foo .bar { ... } + */ + _convertColonHostContext(cssText) { + return this._convertColonRule(cssText, _cssColonHostContextRe, this._colonHostContextPartReplacer); + } + _convertColonRule(cssText, regExp, partReplacer) { + // m[1] = :host(-context), m[2] = contents of (), m[3] rest of rule + return cssText.replace(regExp, function (...m) { + if (m[2]) { + const parts = m[2].split(','); + const r = []; + for (let i = 0; i < parts.length; i++) { + const p = parts[i].trim(); + if (!p) + break; + r.push(partReplacer(_polyfillHostNoCombinator, p, m[3])); + } + return r.join(','); + } + else { + return _polyfillHostNoCombinator + m[3]; + } + }); + } + _colonHostContextPartReplacer(host, part, suffix) { + if (part.indexOf(_polyfillHost) > -1) { + return this._colonHostPartReplacer(host, part, suffix); + } + else { + return host + part + suffix + ', ' + part + ' ' + host + suffix; + } + } + _colonHostPartReplacer(host, part, suffix) { + return host + part.replace(_polyfillHost, '') + suffix; + } + /* + * Convert combinators like ::shadow and pseudo-elements like ::content + * by replacing with space. + */ + _convertShadowDOMSelectors(cssText) { + return _shadowDOMSelectorsRe.reduce((result, pattern) => result.replace(pattern, ' '), cssText); + } + // change a selector like 'div' to 'name div' + _scopeSelectors(cssText, scopeSelector, hostSelector, slotSelector, commentOriginalSelector) { + return processRules(cssText, (rule) => { + let selector = rule.selector; + let content = rule.content; + if (rule.selector[0] !== '@') { + selector = + this._scopeSelector(rule.selector, scopeSelector, hostSelector, slotSelector, this.strictStyling); + } + else if (rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') || + rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) { + content = this._scopeSelectors(rule.content, scopeSelector, hostSelector, slotSelector, commentOriginalSelector); + } + selector = selector.replace(/\s{2,}/g, ' ').trim(); + return new CssRule(selector, content); + }); + } + _scopeSelector(selector, scopeSelector, hostSelector, slotSelector, strict) { + return selector.split(',') + .map(shallowPart => { + if (slotSelector && shallowPart.indexOf('.' + slotSelector) > -1) { + return shallowPart.trim(); + } + if (this._selectorNeedsScoping(shallowPart, scopeSelector)) { + return strict ? + this._applyStrictSelectorScope(shallowPart, scopeSelector, hostSelector).trim() : + this._applySelectorScope(shallowPart, scopeSelector, hostSelector).trim(); + } + else { + return shallowPart.trim(); + } + }) + .join(', '); + } + _selectorNeedsScoping(selector, scopeSelector) { + const re = this._makeScopeMatcher(scopeSelector); + return !re.test(selector); + } + _makeScopeMatcher(scopeSelector) { + const lre = /\[/g; + const rre = /\]/g; + scopeSelector = scopeSelector.replace(lre, '\\[').replace(rre, '\\]'); + return new RegExp('^(' + scopeSelector + ')' + _selectorReSuffix, 'm'); + } + _applySelectorScope(selector, scopeSelector, hostSelector) { + // Difference from webcomponents.js: scopeSelector could not be an array + return this._applySimpleSelectorScope(selector, scopeSelector, hostSelector); + } + // scope via name and [is=name] + _applySimpleSelectorScope(selector, scopeSelector, hostSelector) { + // In Android browser, the lastIndex is not reset when the regex is used in String.replace() + _polyfillHostRe.lastIndex = 0; + if (_polyfillHostRe.test(selector)) { + const replaceBy = this.strictStyling ? `.${hostSelector}` : scopeSelector; + return selector + .replace(_polyfillHostNoCombinatorRe, (_, selector) => { + return selector.replace(/([^:]*)(:*)(.*)/, (_, before, colon, after) => { + return before + replaceBy + colon + after; + }); + }) + .replace(_polyfillHostRe, replaceBy + ' '); + } + return scopeSelector + ' ' + selector; + } + _applyStrictSelectorScope(selector, scopeSelector, hostSelector) { + const isRe = /\[is=([^\]]*)\]/g; + scopeSelector = scopeSelector.replace(isRe, (_, ...parts) => parts[0]); + const className = '.' + scopeSelector; + const _scopeSelectorPart = (p) => { + let scopedP = p.trim(); + if (!scopedP) { + return ''; + } + if (p.indexOf(_polyfillHostNoCombinator) > -1) { + scopedP = this._applySimpleSelectorScope(p, scopeSelector, hostSelector); + } + else { + // remove :host since it should be unnecessary + const t = p.replace(_polyfillHostRe, ''); + if (t.length > 0) { + const matches = t.match(/([^:]*)(:*)(.*)/); + if (matches) { + scopedP = matches[1] + className + matches[2] + matches[3]; + } + } + } + return scopedP; + }; + const safeContent = new SafeSelector(selector); + selector = safeContent.content(); + let scopedSelector = ''; + let startIndex = 0; + let res; + const sep = /( |>|\+|~(?!=))\s*/g; + // If a selector appears before :host it should not be shimmed as it + // matches on ancestor elements and not on elements in the host's shadow + // `:host-context(div)` is transformed to + // `-shadowcsshost-no-combinatordiv, div -shadowcsshost-no-combinator` + // the `div` is not part of the component in the 2nd selectors and should not be scoped. + // Historically `component-tag:host` was matching the component so we also want to preserve + // this behavior to avoid breaking legacy apps (it should not match). + // The behavior should be: + // - `tag:host` -> `tag[h]` (this is to avoid breaking legacy apps, should not match anything) + // - `tag :host` -> `tag [h]` (`tag` is not scoped because it's considered part of a + // `:host-context(tag)`) + const hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1; + // Only scope parts after the first `-shadowcsshost-no-combinator` when it is present + let shouldScope = !hasHost; + while ((res = sep.exec(selector)) !== null) { + const separator = res[1]; + const part = selector.slice(startIndex, res.index).trim(); + shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1; + const scopedPart = shouldScope ? _scopeSelectorPart(part) : part; + scopedSelector += `${scopedPart} ${separator} `; + startIndex = sep.lastIndex; + } + const part = selector.substring(startIndex); + shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1; + scopedSelector += shouldScope ? _scopeSelectorPart(part) : part; + // replace the placeholders with their original values + return safeContent.restore(scopedSelector); + } + _insertPolyfillHostInCssText(selector) { + selector = selector + .replace(_colonHostContextRe, _polyfillHostContext) + .replace(_colonHostRe, _polyfillHost) + .replace(_colonSlottedRe, _polyfillSlotted); + return selector; + } +} +class SafeSelector { + constructor(selector) { + this.placeholders = []; + this.index = 0; + // Replaces attribute selectors with placeholders. + // The WS in [attr="va lue"] would otherwise be interpreted as a selector separator. + selector = selector.replace(/(\[[^\]]*\])/g, (_, keep) => { + const replaceBy = `__ph-${this.index}__`; + this.placeholders.push(keep); + this.index++; + return replaceBy; + }); + // Replaces the expression in `:nth-child(2n + 1)` with a placeholder. + // WS and "+" would otherwise be interpreted as selector separators. + this._content = selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, (_, pseudo, exp) => { + const replaceBy = `__ph-${this.index}__`; + this.placeholders.push(exp); + this.index++; + return pseudo + replaceBy; + }); + } + restore(content) { + return content.replace(/__ph-(\d+)__/g, (_, index) => this.placeholders[+index]); + } + content() { return this._content; } +} +const _polyfillHost = '-shadowcsshost'; +const _polyfillSlotted = '-shadowcssslotted'; +// note: :host-context pre-processed to -shadowcsshostcontext. +const _polyfillHostContext = '-shadowcsscontext'; +const _parenSuffix = ')(?:\\((' + + '(?:\\([^)(]*\\)|[^)(]*)+?' + + ')\\))?([^,{]*)'; +const _cssColonHostRe = new RegExp('(' + _polyfillHost + _parenSuffix, 'gim'); +const _cssColonHostContextRe = new RegExp('(' + _polyfillHostContext + _parenSuffix, 'gim'); +const _cssColonSlottedRe = new RegExp('(' + _polyfillSlotted + _parenSuffix, 'gim'); +const _polyfillHostNoCombinator = _polyfillHost + '-no-combinator'; +const _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/; +const _shadowDOMSelectorsRe = [ + /::shadow/g, + /::content/g +]; +const _selectorReSuffix = '([>\\s~+\[.,{:][\\s\\S]*)?$'; +const _polyfillHostRe = /-shadowcsshost/gim; +const _colonHostRe = /:host/gim; +const _colonSlottedRe = /::slotted/gim; +const _colonHostContextRe = /:host-context/gim; +const _commentRe = /\/\*\s*[\s\S]*?\*\//g; +function stripComments(input) { + return input.replace(_commentRe, ''); +} +const _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g; +function extractCommentsWithHash(input) { + return input.match(_commentWithHashRe) || []; +} +const _ruleRe = /(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g; +const _curlyRe = /([{}])/g; +const OPEN_CURLY = '{'; +const CLOSE_CURLY = '}'; +const BLOCK_PLACEHOLDER = '%BLOCK%'; +class CssRule { + constructor(selector, content) { + this.selector = selector; + this.content = content; + } +} +function processRules(input, ruleCallback) { + const inputWithEscapedBlocks = escapeBlocks(input); + let nextBlockIndex = 0; + return inputWithEscapedBlocks.escapedString.replace(_ruleRe, function (...m) { + const selector = m[2]; + let content = ''; + let suffix = m[4]; + let contentPrefix = ''; + if (suffix && suffix.startsWith('{' + BLOCK_PLACEHOLDER)) { + content = inputWithEscapedBlocks.blocks[nextBlockIndex++]; + suffix = suffix.substring(BLOCK_PLACEHOLDER.length + 1); + contentPrefix = '{'; + } + const rule = ruleCallback(new CssRule(selector, content)); + return `${m[1]}${rule.selector}${m[3]}${contentPrefix}${rule.content}${suffix}`; + }); +} +class StringWithEscapedBlocks { + constructor(escapedString, blocks) { + this.escapedString = escapedString; + this.blocks = blocks; + } +} +function escapeBlocks(input) { + const inputParts = input.split(_curlyRe); + const resultParts = []; + const escapedBlocks = []; + let bracketCount = 0; + let currentBlockParts = []; + for (let partIndex = 0; partIndex < inputParts.length; partIndex++) { + const part = inputParts[partIndex]; + if (part === CLOSE_CURLY) { + bracketCount--; + } + if (bracketCount > 0) { + currentBlockParts.push(part); + } + else { + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + currentBlockParts = []; + } + resultParts.push(part); + } + if (part === OPEN_CURLY) { + bracketCount++; + } + } + if (currentBlockParts.length > 0) { + escapedBlocks.push(currentBlockParts.join('')); + resultParts.push(BLOCK_PLACEHOLDER); + } + return new StringWithEscapedBlocks(resultParts.join(''), escapedBlocks); +} + +export { ShadowCss, scopeCss }; diff --git a/dist/index.js b/dist/index.js new file mode 100644 index 00000000000..b8ff46e2066 --- /dev/null +++ b/dist/index.js @@ -0,0 +1 @@ +module.exports = require('./cjs/index.cjs.js'); \ No newline at end of file diff --git a/dist/index.mjs b/dist/index.mjs new file mode 100644 index 00000000000..18e70a30855 --- /dev/null +++ b/dist/index.mjs @@ -0,0 +1 @@ +export * from './esm/legacy/index.mjs'; \ No newline at end of file diff --git a/dist/loader/index.cjs.js b/dist/loader/index.cjs.js new file mode 100644 index 00000000000..7a8571ed1ee --- /dev/null +++ b/dist/loader/index.cjs.js @@ -0,0 +1,4 @@ + + module.exports = require('../cjs/loader.cjs.js'); + module.exports.applyPolyfills = function() { return Promise.resolve() }; + \ No newline at end of file diff --git a/dist/loader/index.d.ts b/dist/loader/index.d.ts new file mode 100644 index 00000000000..0e7d17c51dc --- /dev/null +++ b/dist/loader/index.d.ts @@ -0,0 +1,12 @@ + +export * from '../types/components'; +export interface CustomElementsDefineOptions { + exclude?: string[]; + resourcesUrl?: string; + syncQueue?: boolean; + raf?: (c: FrameRequestCallback) => number; + ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void; + rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void; +} +export declare function defineCustomElements(win: Window, opts?: CustomElementsDefineOptions): Promise; +export declare function applyPolyfills(): Promise; diff --git a/dist/loader/index.es2017.mjs b/dist/loader/index.es2017.mjs new file mode 100644 index 00000000000..70d1024ebfe --- /dev/null +++ b/dist/loader/index.es2017.mjs @@ -0,0 +1,2 @@ +export * from '../esm/polyfills/index.js'; +export * from '../esm/loader.mjs'; \ No newline at end of file diff --git a/dist/loader/index.mjs b/dist/loader/index.mjs new file mode 100644 index 00000000000..38a273c3298 --- /dev/null +++ b/dist/loader/index.mjs @@ -0,0 +1,21 @@ +(function() { + if ( + // No Reflect, no classes, no need for shim because native custom elements + // require ES2015 classes or Reflect. + window.Reflect === undefined || + window.customElements === undefined + ) { + return; + } + const BuiltInHTMLElement = HTMLElement; + window.HTMLElement = /** @this {!Object} */ function HTMLElement() { + return Reflect.construct( + BuiltInHTMLElement, [], /** @type {!Function} */ (this.constructor)); + }; + HTMLElement.prototype = BuiltInHTMLElement.prototype; + HTMLElement.prototype.constructor = HTMLElement; + Object.setPrototypeOf(HTMLElement, BuiltInHTMLElement); +})(); + +export * from '../esm/polyfills/index.js'; +export * from '../esm/legacy/loader.mjs'; \ No newline at end of file diff --git a/dist/loader/package.json b/dist/loader/package.json new file mode 100644 index 00000000000..e850a573d1e --- /dev/null +++ b/dist/loader/package.json @@ -0,0 +1,9 @@ +{ + "name": "calcite-loader", + "typings": "./index.d.ts", + "module": "./index.mjs", + "main": "./index.cjs.js", + "jsnext:main": "./index.es2017.mjs", + "es2015": "./index.es2017.mjs", + "es2017": "./index.es2017.mjs" +} \ No newline at end of file diff --git a/dist/types/components.d.ts b/dist/types/components.d.ts new file mode 100644 index 00000000000..9f53d0e6b0a --- /dev/null +++ b/dist/types/components.d.ts @@ -0,0 +1,221 @@ +/* tslint:disable */ +/** + * This is an autogenerated file created by the Stencil compiler. + * It contains typing information for all components that exist in this project. + */ + + +import { HTMLStencilElement, JSXBase } from './stencil.core'; +import { + TabRegisterEventDetail, +} from './interfaces/TabRegister'; +import { + TabChangeEventDetail, +} from './interfaces/TabChange'; + + +export namespace Components { + interface CalciteAlert { + 'close': () => Promise; + 'color': string; + 'currentAlert': string; + 'dismiss': boolean; + 'duration': string; + 'icon': boolean; + 'id': string; + 'queueLength': number; + 'theme': string; + } + interface CalciteAlerts { + 'id': string; + 'open': (requestedAlert: any) => Promise; + } + interface CalciteLoader { + 'isActive': boolean; + 'text': string; + } + interface CalciteModal { + /** + * The first name + */ + 'first': string; + /** + * The last name + */ + 'last': string; + /** + * The middle name + */ + 'middle': string; + } + interface CalciteTab { + 'getTabIndex': () => Promise; + 'id': string; + 'isActive': boolean; + 'registerLabeledBy': (id: any) => Promise; + 'tab': string; + } + interface CalciteTabNav { + 'id': string; + 'selectedTab': number | string; + } + interface CalciteTabTitle { + 'getTabIndex': () => Promise; + 'id': string; + 'isActive': boolean; + 'setControledBy': (id: string) => Promise; + 'tab': string; + } + interface CalciteTabs { + 'theme': "light" | "dark"; + } +} + +declare namespace LocalJSX { + interface CalciteAlert extends JSXBase.HTMLAttributes { + 'color'?: string; + 'currentAlert'?: string; + 'dismiss'?: boolean; + 'duration'?: string; + 'icon'?: boolean; + 'id'?: string; + 'onAlertClose'?: (event: CustomEvent) => void; + 'onAlertOpen'?: (event: CustomEvent) => void; + 'queueLength'?: number; + 'theme'?: string; + } + interface CalciteAlerts extends JSXBase.HTMLAttributes { + 'id'?: string; + 'onAlertsClose'?: (event: CustomEvent) => void; + 'onAlertsOpen'?: (event: CustomEvent) => void; + } + interface CalciteLoader extends JSXBase.HTMLAttributes { + 'isActive'?: boolean; + 'text'?: string; + } + interface CalciteModal extends JSXBase.HTMLAttributes { + /** + * The first name + */ + 'first'?: string; + /** + * The last name + */ + 'last'?: string; + /** + * The middle name + */ + 'middle'?: string; + } + interface CalciteTab extends JSXBase.HTMLAttributes { + 'id'?: string; + 'isActive'?: boolean; + 'onCalciteRegisterTab'?: (event: CustomEvent) => void; + 'tab'?: string; + } + interface CalciteTabNav extends JSXBase.HTMLAttributes { + 'id'?: string; + 'onCalciteTabChange'?: (event: CustomEvent) => void; + 'selectedTab'?: number | string; + } + interface CalciteTabTitle extends JSXBase.HTMLAttributes { + 'id'?: string; + 'isActive'?: boolean; + 'onCalciteActivateTab'?: (event: CustomEvent) => void; + 'onCalciteFocusNextTab'?: (event: CustomEvent) => void; + 'onCalciteFocusPreviousTab'?: (event: CustomEvent) => void; + 'onCalciteRegisterTabTitle'?: (event: CustomEvent) => void; + 'tab'?: string; + } + interface CalciteTabs extends JSXBase.HTMLAttributes { + 'theme'?: "light" | "dark"; + } + + interface IntrinsicElements { + 'calcite-alert': CalciteAlert; + 'calcite-alerts': CalciteAlerts; + 'calcite-loader': CalciteLoader; + 'calcite-modal': CalciteModal; + 'calcite-tab': CalciteTab; + 'calcite-tab-nav': CalciteTabNav; + 'calcite-tab-title': CalciteTabTitle; + 'calcite-tabs': CalciteTabs; + } +} + +export { LocalJSX as JSX }; + + +declare module "@stencil/core" { + export namespace JSX { + interface IntrinsicElements extends LocalJSX.IntrinsicElements {} + } +} + + +declare global { + + + + interface HTMLCalciteAlertElement extends Components.CalciteAlert, HTMLStencilElement {} + var HTMLCalciteAlertElement: { + prototype: HTMLCalciteAlertElement; + new (): HTMLCalciteAlertElement; + }; + + interface HTMLCalciteAlertsElement extends Components.CalciteAlerts, HTMLStencilElement {} + var HTMLCalciteAlertsElement: { + prototype: HTMLCalciteAlertsElement; + new (): HTMLCalciteAlertsElement; + }; + + interface HTMLCalciteLoaderElement extends Components.CalciteLoader, HTMLStencilElement {} + var HTMLCalciteLoaderElement: { + prototype: HTMLCalciteLoaderElement; + new (): HTMLCalciteLoaderElement; + }; + + interface HTMLCalciteModalElement extends Components.CalciteModal, HTMLStencilElement {} + var HTMLCalciteModalElement: { + prototype: HTMLCalciteModalElement; + new (): HTMLCalciteModalElement; + }; + + interface HTMLCalciteTabElement extends Components.CalciteTab, HTMLStencilElement {} + var HTMLCalciteTabElement: { + prototype: HTMLCalciteTabElement; + new (): HTMLCalciteTabElement; + }; + + interface HTMLCalciteTabNavElement extends Components.CalciteTabNav, HTMLStencilElement {} + var HTMLCalciteTabNavElement: { + prototype: HTMLCalciteTabNavElement; + new (): HTMLCalciteTabNavElement; + }; + + interface HTMLCalciteTabTitleElement extends Components.CalciteTabTitle, HTMLStencilElement {} + var HTMLCalciteTabTitleElement: { + prototype: HTMLCalciteTabTitleElement; + new (): HTMLCalciteTabTitleElement; + }; + + interface HTMLCalciteTabsElement extends Components.CalciteTabs, HTMLStencilElement {} + var HTMLCalciteTabsElement: { + prototype: HTMLCalciteTabsElement; + new (): HTMLCalciteTabsElement; + }; + + interface HTMLElementTagNameMap { + 'calcite-alert': HTMLCalciteAlertElement; + 'calcite-alerts': HTMLCalciteAlertsElement; + 'calcite-loader': HTMLCalciteLoaderElement; + 'calcite-modal': HTMLCalciteModalElement; + 'calcite-tab': HTMLCalciteTabElement; + 'calcite-tab-nav': HTMLCalciteTabNavElement; + 'calcite-tab-title': HTMLCalciteTabTitleElement; + 'calcite-tabs': HTMLCalciteTabsElement; + } + + interface ElementTagNameMap extends HTMLElementTagNameMap {} +} + diff --git a/dist/types/components/calcite-alert/calcite-alert.d.ts b/dist/types/components/calcite-alert/calcite-alert.d.ts new file mode 100644 index 00000000000..b92c7c20156 --- /dev/null +++ b/dist/types/components/calcite-alert/calcite-alert.d.ts @@ -0,0 +1,19 @@ +import { EventEmitter } from '../../stencil.core'; +export declare class CalciteAlert { + el: HTMLElement; + currentAlert: string; + dismiss: boolean; + icon: boolean; + id: string; + queueLength: number; + color: string; + theme: string; + duration: string; + isActive: boolean; + alertClose: EventEmitter; + alertOpen: EventEmitter; + close(): Promise; + componentWillUpdate(): void; + setIcon(): any; + render(): any; +} diff --git a/dist/types/components/calcite-alerts/calcite-alerts.d.ts b/dist/types/components/calcite-alerts/calcite-alerts.d.ts new file mode 100644 index 00000000000..b808586d3c6 --- /dev/null +++ b/dist/types/components/calcite-alerts/calcite-alerts.d.ts @@ -0,0 +1,14 @@ +import { EventEmitter } from '../../stencil.core'; +export declare class CalciteAlerts { + el: HTMLElement; + id: string; + currentAlert: string; + isActive: boolean; + queue: string[]; + alertsClose: EventEmitter; + alertsOpen: EventEmitter; + open(requestedAlert: any): Promise; + updateQueue(event: CustomEvent): void; + componentWillUpdate(): void; + render(): any; +} diff --git a/dist/types/components/calcite-loader/calcite-loader.d.ts b/dist/types/components/calcite-loader/calcite-loader.d.ts new file mode 100644 index 00000000000..9171896e031 --- /dev/null +++ b/dist/types/components/calcite-loader/calcite-loader.d.ts @@ -0,0 +1,6 @@ +export declare class CalciteLoader { + el: HTMLElement; + isActive: boolean; + text: string; + render(): any; +} diff --git a/dist/types/components/calcite-modal/calcite-modal.d.ts b/dist/types/components/calcite-modal/calcite-modal.d.ts new file mode 100644 index 00000000000..f11f7e2bfaf --- /dev/null +++ b/dist/types/components/calcite-modal/calcite-modal.d.ts @@ -0,0 +1,16 @@ +export declare class CalciteModal { + /** + * The first name + */ + first: string; + /** + * The middle name + */ + middle: string; + /** + * The last name + */ + last: string; + private getText; + render(): any; +} diff --git a/dist/types/components/calcite-tab-nav/calcite-tab-nav.d.ts b/dist/types/components/calcite-tab-nav/calcite-tab-nav.d.ts new file mode 100644 index 00000000000..26d27047b52 --- /dev/null +++ b/dist/types/components/calcite-tab-nav/calcite-tab-nav.d.ts @@ -0,0 +1,17 @@ +import { EventEmitter } from "../../stencil.core"; +import { TabChangeEventDetail } from "../../interfaces/TabChange"; +import { TabRegisterEventDetail } from "../../interfaces/TabRegister"; +export declare class CalciteTabNav { + el: any; + id: string; + calciteTabChange: EventEmitter; + selectedTab: number | string; + selectedTabChanged(): void; + focusPreviousTabHandler(e: CustomEvent): void; + focusNextTabHandler(e: CustomEvent): void; + tabTitleRegistationHandler(e: CustomEvent): void; + activateTabHandler(e: CustomEvent): void; + getIndexOfTabTitle(el: HTMLCalciteTabTitleElement): number; + componentWillLoad(): void; + render(): any; +} diff --git a/dist/types/components/calcite-tab-title/calcite-tab-title.d.ts b/dist/types/components/calcite-tab-title/calcite-tab-title.d.ts new file mode 100644 index 00000000000..e1008d79159 --- /dev/null +++ b/dist/types/components/calcite-tab-title/calcite-tab-title.d.ts @@ -0,0 +1,20 @@ +import { EventEmitter } from "../../stencil.core"; +import { TabChangeEventDetail } from "../../interfaces/TabChange"; +export declare class CalciteTabTitle { + id: string; + private controls; + el: HTMLElement; + tab: string; + isActive: boolean; + calciteActivateTab: EventEmitter; + calciteFocusNextTab: EventEmitter; + calciteFocusPreviousTab: EventEmitter; + private calciteRegisterTabTitle; + tabChangeHand(event: CustomEvent): void; + onClick(): void; + keyDownHandler(e: KeyboardEvent): void; + componentDidLoad(): void; + getTabIndex(): Promise; + setControledBy(id: string): Promise; + render(): any; +} diff --git a/dist/types/components/calcite-tab/calcite-tab.d.ts b/dist/types/components/calcite-tab/calcite-tab.d.ts new file mode 100644 index 00000000000..9f6dd92304b --- /dev/null +++ b/dist/types/components/calcite-tab/calcite-tab.d.ts @@ -0,0 +1,16 @@ +import { EventEmitter } from "../../stencil.core"; +import { TabChangeEventDetail } from "../../interfaces/TabChange"; +import { TabRegisterEventDetail } from "../../interfaces/TabRegister"; +export declare class CalciteTab { + id: string; + private labeledBy; + el: HTMLElement; + tab: string; + isActive: boolean; + tabChangeHandler(event: CustomEvent): void; + calciteRegisterTab: EventEmitter; + componentDidLoad(): void; + getTabIndex(): Promise; + registerLabeledBy(id: any): Promise; + render(): any; +} diff --git a/dist/types/components/calcite-tabs/calcite-tabs.d.ts b/dist/types/components/calcite-tabs/calcite-tabs.d.ts new file mode 100644 index 00000000000..fac499c2a31 --- /dev/null +++ b/dist/types/components/calcite-tabs/calcite-tabs.d.ts @@ -0,0 +1,22 @@ +import { TabRegisterEventDetail } from "../../interfaces/TabRegister"; +interface TabRegister { + [key: string]: { + id: string; + tab: HTMLCalciteTabElement; + }; +} +interface TabTitleRegister { + [key: string]: { + id: string; + title: HTMLCalciteTabTitleElement; + }; +} +export declare class CalciteTabs { + tabs: TabRegister; + tabTitles: TabTitleRegister; + theme: "light" | "dark"; + tabTitleRegistationHandler(e: CustomEvent): void; + tabRegistationHandler(e: CustomEvent): void; + render(): any; +} +export {}; diff --git a/dist/types/interfaces/AlertInterface.d.ts b/dist/types/interfaces/AlertInterface.d.ts new file mode 100644 index 00000000000..196f434f806 --- /dev/null +++ b/dist/types/interfaces/AlertInterface.d.ts @@ -0,0 +1,12 @@ +export interface AlertInterface { + currentAlert: string; + queueLength: number; +} +declare const _default: { + Provider: import("@stencil/state-tunnel/dist/types/stencil.core").FunctionalComponent<{ + state: AlertInterface; + }>; + Consumer: import("@stencil/state-tunnel/dist/types/stencil.core").FunctionalComponent<{}>; + injectProps: (Cstr: any, fieldList: import("@stencil/state-tunnel/dist/types/declarations").PropList) => void; +}; +export default _default; diff --git a/dist/types/interfaces/TabChange.d.ts b/dist/types/interfaces/TabChange.d.ts new file mode 100644 index 00000000000..e1faa5ea3a2 --- /dev/null +++ b/dist/types/interfaces/TabChange.d.ts @@ -0,0 +1,3 @@ +export interface TabChangeEventDetail { + tab: number | string; +} diff --git a/dist/types/interfaces/TabRegister.d.ts b/dist/types/interfaces/TabRegister.d.ts new file mode 100644 index 00000000000..1a628a4c308 --- /dev/null +++ b/dist/types/interfaces/TabRegister.d.ts @@ -0,0 +1,4 @@ +export interface TabRegisterEventDetail { + id: string; + index: number; +} diff --git a/dist/types/stencil.core.d.ts b/dist/types/stencil.core.d.ts new file mode 100644 index 00000000000..55774b3e8d1 --- /dev/null +++ b/dist/types/stencil.core.d.ts @@ -0,0 +1,1342 @@ +/** + * This file gets copied to all distributions of stencil component collections. + * - no imports + */ + +export interface ComponentWillLoad { + /** + * The component is about to load and it has not + * rendered yet. + * + * This is the best place to make any data updates + * before the first render. + * + * componentWillLoad will only be called once. + */ + componentWillLoad: () => Promise | void; +} + +export interface ComponentDidLoad { + /** + * The component has loaded and has already rendered. + * + * Updating data in this method will cause the + * component to re-render. + * + * componentDidLoad will only be called once. + */ + componentDidLoad: () => void; +} + +export interface ComponentWillUpdate { + /** + * The component is about to update and re-render. + * + * Called multiple times throughout the life of + * the component as it updates. + * + * componentWillUpdate is not called on the first render. + */ + componentWillUpdate: () => Promise | void; +} + +export interface ComponentDidUpdate { + /** + * The component has just re-rendered. + * + * Called multiple times throughout the life of + * the component as it updates. + * + * componentWillUpdate is not called on the + * first render. + */ + componentDidUpdate: () => void; +} + +export interface ComponentDidUnload { + /** + * The component did unload and the element + * will be destroyed. + */ + componentDidUnload: () => void; +} + +export interface ComponentInstance { + connectedCallback?: () => void; + disconnectedCallback?: () => void; + + /** + * The component is about to load and it has not + * rendered yet. + * + * This is the best place to make any data updates + * before the first render. + * + * componentWillLoad will only be called once. + */ + componentWillLoad?: () => Promise | void; + + /** + * The component has loaded and has already rendered. + * + * Updating data in this method will cause the + * component to re-render. + * + * componentDidLoad will only be called once. + */ + componentDidLoad?: () => void; + + /** + * The component is about to update and re-render. + * + * Called multiple times throughout the life of + * the component as it updates. + * + * componentWillUpdate is not called on the first render. + */ + componentWillUpdate?: () => Promise | void; + + /** + * The component has just re-rendered. + * + * Called multiple times throughout the life of + * the component as it updates. + * + * componentWillUpdate is not called on the + * first render. + */ + componentDidUpdate?: () => void; + + /** + * The component did unload and the element + * will be destroyed. + */ + componentDidUnload?: () => void; + + render?: () => any; + + /** + * Used to dynamically set host element attributes. + * Should be placed directly above render() + */ + hostData?: () => { + class?: {[className: string]: boolean}; + style?: any; + [attrName: string]: any; + }; + + [memberName: string]: any; +} + + +/** + * General types important to applications using stencil built components + */ +export interface EventEmitter { + emit: (data?: T) => CustomEvent; +} + +export interface QueueApi { + tick: (cb: RafCallback) => void; + read: (cb: RafCallback) => void; + write: (cb: RafCallback) => void; + clear?: () => void; + flush?: (cb?: () => void) => void; +} + +export interface RafCallback { + (timeStamp: number): void; +} + +export interface HTMLStencilElement extends HTMLElement { + componentOnReady(): Promise; + forceUpdate(): void; +} + + +declare namespace LocalJSX { + export interface Element {} + export interface IntrinsicElements {} +} +export { LocalJSX as JSX }; + +export namespace JSXBase { + export interface IntrinsicElements { + // Stencil elements + slot: JSXBase.SlotAttributes; + + // HTML + a: JSXBase.AnchorHTMLAttributes; + abbr: JSXBase.HTMLAttributes; + address: JSXBase.HTMLAttributes; + area: JSXBase.AreaHTMLAttributes; + article: JSXBase.HTMLAttributes; + aside: JSXBase.HTMLAttributes; + audio: JSXBase.AudioHTMLAttributes; + b: JSXBase.HTMLAttributes; + base: JSXBase.BaseHTMLAttributes; + bdi: JSXBase.HTMLAttributes; + bdo: JSXBase.HTMLAttributes; + big: JSXBase.HTMLAttributes; + blockquote: JSXBase.BlockquoteHTMLAttributes; + body: JSXBase.HTMLAttributes; + br: JSXBase.HTMLAttributes; + button: JSXBase.ButtonHTMLAttributes; + canvas: JSXBase.CanvasHTMLAttributes; + caption: JSXBase.HTMLAttributes; + cite: JSXBase.HTMLAttributes; + code: JSXBase.HTMLAttributes; + col: JSXBase.ColHTMLAttributes; + colgroup: JSXBase.ColgroupHTMLAttributes; + data: JSXBase.HTMLAttributes; + datalist: JSXBase.HTMLAttributes; + dd: JSXBase.HTMLAttributes; + del: JSXBase.DelHTMLAttributes; + details: JSXBase.DetailsHTMLAttributes; + dfn: JSXBase.HTMLAttributes; + dialog: JSXBase.DialogHTMLAttributes; + div: JSXBase.HTMLAttributes; + dl: JSXBase.HTMLAttributes; + dt: JSXBase.HTMLAttributes; + em: JSXBase.HTMLAttributes; + embed: JSXBase.EmbedHTMLAttributes; + fieldset: JSXBase.FieldsetHTMLAttributes; + figcaption: JSXBase.HTMLAttributes; + figure: JSXBase.HTMLAttributes; + footer: JSXBase.HTMLAttributes; + form: JSXBase.FormHTMLAttributes; + h1: JSXBase.HTMLAttributes; + h2: JSXBase.HTMLAttributes; + h3: JSXBase.HTMLAttributes; + h4: JSXBase.HTMLAttributes; + h5: JSXBase.HTMLAttributes; + h6: JSXBase.HTMLAttributes; + head: JSXBase.HTMLAttributes; + header: JSXBase.HTMLAttributes; + hgroup: JSXBase.HTMLAttributes; + hr: JSXBase.HTMLAttributes; + html: JSXBase.HTMLAttributes; + i: JSXBase.HTMLAttributes; + iframe: JSXBase.IframeHTMLAttributes; + img: JSXBase.ImgHTMLAttributes; + input: JSXBase.InputHTMLAttributes; + ins: JSXBase.InsHTMLAttributes; + kbd: JSXBase.HTMLAttributes; + keygen: JSXBase.KeygenHTMLAttributes; + label: JSXBase.LabelHTMLAttributes; + legend: JSXBase.HTMLAttributes; + li: JSXBase.LiHTMLAttributes; + link: JSXBase.LinkHTMLAttributes; + main: JSXBase.HTMLAttributes; + map: JSXBase.MapHTMLAttributes; + mark: JSXBase.HTMLAttributes; + menu: JSXBase.MenuHTMLAttributes; + menuitem: JSXBase.HTMLAttributes; + meta: JSXBase.MetaHTMLAttributes; + meter: JSXBase.MeterHTMLAttributes; + nav: JSXBase.HTMLAttributes; + noscript: JSXBase.HTMLAttributes; + object: JSXBase.ObjectHTMLAttributes; + ol: JSXBase.OlHTMLAttributes; + optgroup: JSXBase.OptgroupHTMLAttributes; + option: JSXBase.OptionHTMLAttributes; + output: JSXBase.OutputHTMLAttributes; + p: JSXBase.HTMLAttributes; + param: JSXBase.ParamHTMLAttributes; + picture: JSXBase.HTMLAttributes; + pre: JSXBase.HTMLAttributes; + progress: JSXBase.ProgressHTMLAttributes; + q: JSXBase.QuoteHTMLAttributes; + rp: JSXBase.HTMLAttributes; + rt: JSXBase.HTMLAttributes; + ruby: JSXBase.HTMLAttributes; + s: JSXBase.HTMLAttributes; + samp: JSXBase.HTMLAttributes; + script: JSXBase.ScriptHTMLAttributes; + section: JSXBase.HTMLAttributes; + select: JSXBase.SelectHTMLAttributes; + small: JSXBase.HTMLAttributes; + source: JSXBase.SourceHTMLAttributes; + span: JSXBase.HTMLAttributes; + strong: JSXBase.HTMLAttributes; + style: JSXBase.StyleHTMLAttributes; + sub: JSXBase.HTMLAttributes; + summary: JSXBase.HTMLAttributes; + sup: JSXBase.HTMLAttributes; + table: JSXBase.TableHTMLAttributes; + tbody: JSXBase.HTMLAttributes; + td: JSXBase.TdHTMLAttributes; + textarea: JSXBase.TextareaHTMLAttributes; + tfoot: JSXBase.HTMLAttributes; + th: JSXBase.ThHTMLAttributes; + thead: JSXBase.HTMLAttributes; + time: JSXBase.TimeHTMLAttributes; + title: JSXBase.HTMLAttributes; + tr: JSXBase.HTMLAttributes; + track: JSXBase.TrackHTMLAttributes; + u: JSXBase.HTMLAttributes; + ul: JSXBase.HTMLAttributes; + 'var': JSXBase.HTMLAttributes; + video: JSXBase.VideoHTMLAttributes; + wbr: JSXBase.HTMLAttributes; + + + // SVG + animate: JSXBase.SVGAttributes; + circle: JSXBase.SVGAttributes; + clipPath: JSXBase.SVGAttributes; + defs: JSXBase.SVGAttributes; + desc: JSXBase.SVGAttributes; + ellipse: JSXBase.SVGAttributes; + feBlend: JSXBase.SVGAttributes; + feColorMatrix: JSXBase.SVGAttributes; + feComponentTransfer: JSXBase.SVGAttributes; + feComposite: JSXBase.SVGAttributes; + feConvolveMatrix: JSXBase.SVGAttributes; + feDiffuseLighting: JSXBase.SVGAttributes; + feDisplacementMap: JSXBase.SVGAttributes; + feDistantLight: JSXBase.SVGAttributes; + feDropShadow: JSXBase.SVGAttributes; + feFlood: JSXBase.SVGAttributes; + feFuncA: JSXBase.SVGAttributes; + feFuncB: JSXBase.SVGAttributes; + feFuncG: JSXBase.SVGAttributes; + feFuncR: JSXBase.SVGAttributes; + feGaussianBlur: JSXBase.SVGAttributes; + feImage: JSXBase.SVGAttributes; + feMerge: JSXBase.SVGAttributes; + feMergeNode: JSXBase.SVGAttributes; + feMorphology: JSXBase.SVGAttributes; + feOffset: JSXBase.SVGAttributes; + fePointLight: JSXBase.SVGAttributes; + feSpecularLighting: JSXBase.SVGAttributes; + feSpotLight: JSXBase.SVGAttributes; + feTile: JSXBase.SVGAttributes; + feTurbulence: JSXBase.SVGAttributes; + filter: JSXBase.SVGAttributes; + foreignObject: JSXBase.SVGAttributes; + g: JSXBase.SVGAttributes; + image: JSXBase.SVGAttributes; + line: JSXBase.SVGAttributes; + linearGradient: JSXBase.SVGAttributes; + marker: JSXBase.SVGAttributes; + mask: JSXBase.SVGAttributes; + metadata: JSXBase.SVGAttributes; + path: JSXBase.SVGAttributes; + pattern: JSXBase.SVGAttributes; + polygon: JSXBase.SVGAttributes; + polyline: JSXBase.SVGAttributes; + radialGradient: JSXBase.SVGAttributes; + rect: JSXBase.SVGAttributes; + stop: JSXBase.SVGAttributes; + svg: JSXBase.SVGAttributes; + switch: JSXBase.SVGAttributes; + symbol: JSXBase.SVGAttributes; + text: JSXBase.SVGAttributes; + textPath: JSXBase.SVGAttributes; + tspan: JSXBase.SVGAttributes; + use: JSXBase.SVGAttributes; + view: JSXBase.SVGAttributes; + } + + export interface SlotAttributes { + name?: string; + slot?: string; + } + + export interface AnchorHTMLAttributes extends HTMLAttributes { + download?: any; + href?: string; + hrefLang?: string; + hreflang?: string; + media?: string; + rel?: string; + target?: string; + } + + export interface AudioHTMLAttributes extends MediaHTMLAttributes {} + + export interface AreaHTMLAttributes extends HTMLAttributes { + alt?: string; + coords?: string; + download?: any; + href?: string; + hrefLang?: string; + hreflang?: string; + media?: string; + rel?: string; + shape?: string; + target?: string; + } + + export interface BaseHTMLAttributes extends HTMLAttributes { + href?: string; + target?: string; + } + + export interface BlockquoteHTMLAttributes extends HTMLAttributes { + cite?: string; + } + + export interface ButtonHTMLAttributes extends HTMLAttributes { + autoFocus?: boolean; + disabled?: boolean; + form?: string; + formAction?: string; + formaction?: string; + formEncType?: string; + formenctype?: string; + formMethod?: string; + formmethod?: string; + formNoValidate?: boolean; + formnovalidate?: boolean; + formTarget?: string; + formtarget?: string; + name?: string; + type?: string; + value?: string | string[] | number; + } + + export interface CanvasHTMLAttributes extends HTMLAttributes { + height?: number | string; + width?: number | string; + } + + export interface ColHTMLAttributes extends HTMLAttributes { + span?: number; + } + + export interface ColgroupHTMLAttributes extends HTMLAttributes { + span?: number; + } + + export interface DetailsHTMLAttributes extends HTMLAttributes { + open?: boolean; + } + + export interface DelHTMLAttributes extends HTMLAttributes { + cite?: string; + dateTime?: string; + datetime?: string; + } + + export interface DialogHTMLAttributes extends HTMLAttributes { + onClose?: (event: Event) => void; + open?: boolean; + returnValue?: string; + } + + export interface EmbedHTMLAttributes extends HTMLAttributes { + height?: number | string; + src?: string; + type?: string; + width?: number | string; + } + + export interface FieldsetHTMLAttributes extends HTMLAttributes { + disabled?: boolean; + form?: string; + name?: string; + } + + export interface FormHTMLAttributes extends HTMLAttributes { + acceptCharset?: string; + acceptcharset?: string; + action?: string; + autoComplete?: string; + autocomplete?: string; + encType?: string; + enctype?: string; + method?: string; + name?: string; + noValidate?: boolean; + novalidate?: boolean | string; + target?: string; + } + + export interface HtmlHTMLAttributes extends HTMLAttributes { + manifest?: string; + } + + export interface IframeHTMLAttributes extends HTMLAttributes { + allowFullScreen?: boolean; + allowfullScreen?: string | boolean; + allowTransparency?: boolean; + allowtransparency?: string | boolean; + frameBorder?: number | string; + frameborder?: number | string; + importance?: 'low' | 'auto' | 'high'; + height?: number | string; + loading?: 'lazy' | 'auto' | 'eager'; + marginHeight?: number; + marginheight?: string | number; + marginWidth?: number; + marginwidth?: string | number; + name?: string; + sandbox?: string; + scrolling?: string; + seamless?: boolean; + src?: string; + srcDoc?: string; + srcdoc?: string; + width?: number | string; + } + + export interface ImgHTMLAttributes extends HTMLAttributes { + alt?: string; + decoding?: 'async' | 'auto' | 'sync'; + importance?: 'low' | 'auto' | 'high'; + height?: number | string; + loading?: 'lazy' | 'auto' | 'eager'; + sizes?: string; + src?: string; + srcSet?: string; + srcset?: string; + useMap?: string; + usemap?: string; + width?: number | string; + } + + export interface InsHTMLAttributes extends HTMLAttributes { + cite?: string; + dateTime?: string; + datetime?: string; + } + + export interface InputHTMLAttributes extends HTMLAttributes { + accept?: string; + alt?: string; + autoComplete?: string; + autocomplete?: string; + autoFocus?: boolean; + autofocus?: boolean | string; + capture?: string; // https://www.w3.org/TR/html-media-capture/#the-capture-attribute + checked?: boolean; + crossOrigin?: string; + crossorigin?: string; + disabled?: boolean; + form?: string; + formAction?: string; + formaction?: string; + formEncType?: string; + formenctype?: string; + formMethod?: string; + formmethod?: string; + formNoValidate?: boolean; + formnovalidate?: boolean; + formTarget?: string; + formtarget?: string; + height?: number | string; + list?: string; + max?: number | string; + maxLength?: number; + maxlength?: number | string; + min?: number | string; + minLength?: number; + minlength?: number | string; + multiple?: boolean; + name?: string; + pattern?: string; + placeholder?: string; + readOnly?: boolean; + readonly?: boolean | string; + required?: boolean; + size?: number; + src?: string; + step?: number | string; + type?: string; + value?: string | string[] | number; + width?: number | string; + } + + export interface KeygenHTMLAttributes extends HTMLAttributes { + autoFocus?: boolean; + autofocus?: boolean | string; + challenge?: string; + disabled?: boolean; + form?: string; + keyType?: string; + keytype?: string; + keyParams?: string; + keyparams?: string; + name?: string; + } + + export interface LabelHTMLAttributes extends HTMLAttributes { + form?: string; + htmlFor?: string; + htmlfor?: string; + } + + export interface LiHTMLAttributes extends HTMLAttributes { + value?: string | string[] | number; + } + + export interface LinkHTMLAttributes extends HTMLAttributes { + href?: string; + hrefLang?: string; + hreflang?: string; + importance?: 'low' | 'auto' | 'high'; + integrity?: string; + media?: string; + rel?: string; + sizes?: string; + type?: string; + } + + export interface MapHTMLAttributes extends HTMLAttributes { + name?: string; + } + + export interface MenuHTMLAttributes extends HTMLAttributes { + type?: string; + } + + export interface MediaHTMLAttributes extends HTMLAttributes { + autoPlay?: boolean; + autoplay?: boolean | string; + controls?: boolean; + crossOrigin?: string; + crossorigin?: string; + loop?: boolean; + mediaGroup?: string; + mediagroup?: string; + muted?: boolean; + preload?: string; + src?: string; + + // https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events + onAbort?: (event: Event) => void; + onCanPlay?: (event: Event) => void; + onCanPlayThrough?: (event: Event) => void; + onDurationChange?: (event: Event) => void; + onEmptied?: (event: Event) => void; + onEnded?: (event: Event) => void; + onError?: (event: Event) => void; + onInterruptBegin?: (event: Event) => void; + onInterruptEnd?: (event: Event) => void; + onLoadedData?: (event: Event) => void; + onLoadedMetaData?: (event: Event) => void; + onLoadStart?: (event: Event) => void; + onMozAudioAvailable?: (event: Event) => void; + onPause?: (event: Event) => void; + onPlay?: (event: Event) => void; + onPlaying?: (event: Event) => void; + onProgress?: (event: Event) => void; + onRateChange?: (event: Event) => void; + onSeeked?: (event: Event) => void; + onSeeking?: (event: Event) => void; + onStalled?: (event: Event) => void; + onSuspend?: (event: Event) => void; + onTimeUpdate?: (event: Event) => void; + onVolumeChange?: (event: Event) => void; + onWaiting?: (event: Event) => void; + } + + export interface MetaHTMLAttributes extends HTMLAttributes { + charSet?: string; + charset?: string; + content?: string; + httpEquiv?: string; + httpequiv?: string; + name?: string; + } + + export interface MeterHTMLAttributes extends HTMLAttributes { + form?: string; + high?: number; + low?: number; + max?: number | string; + min?: number | string; + optimum?: number; + value?: string | string[] | number; + } + + export interface QuoteHTMLAttributes extends HTMLAttributes { + cite?: string; + } + + export interface ObjectHTMLAttributes extends HTMLAttributes { + classID?: string; + classid?: string; + data?: string; + form?: string; + height?: number | string; + name?: string; + type?: string; + useMap?: string; + usemap?: string; + width?: number | string; + wmode?: string; + } + + export interface OlHTMLAttributes extends HTMLAttributes { + reversed?: boolean; + start?: number; + } + + export interface OptgroupHTMLAttributes extends HTMLAttributes { + disabled?: boolean; + label?: string; + } + + export interface OptionHTMLAttributes extends HTMLAttributes { + disabled?: boolean; + label?: string; + selected?: boolean; + value?: string | string[] | number; + } + + export interface OutputHTMLAttributes extends HTMLAttributes { + form?: string; + htmlFor?: string; + htmlfor?: string; + name?: string; + } + + export interface ParamHTMLAttributes extends HTMLAttributes { + name?: string; + value?: string | string[] | number; + } + + export interface ProgressHTMLAttributes extends HTMLAttributes { + max?: number | string; + value?: string | string[] | number; + } + + export interface ScriptHTMLAttributes extends HTMLAttributes { + async?: boolean; + charSet?: string; + charset?: string; + crossOrigin?: string; + crossorigin?: string; + defer?: boolean; + importance?: 'low' | 'auto' | 'high'; + integrity?: string; + nonce?: string; + src?: string; + type?: string; + } + + export interface SelectHTMLAttributes extends HTMLAttributes { + autoFocus?: boolean; + disabled?: boolean; + form?: string; + multiple?: boolean; + name?: string; + required?: boolean; + size?: number; + } + + export interface SourceHTMLAttributes extends HTMLAttributes { + media?: string; + sizes?: string; + src?: string; + srcSet?: string; + type?: string; + } + + export interface StyleHTMLAttributes extends HTMLAttributes { + media?: string; + nonce?: string; + scoped?: boolean; + type?: string; + } + + export interface TableHTMLAttributes extends HTMLAttributes { + cellPadding?: number | string; + cellpadding?: number | string; + cellSpacing?: number | string; + cellspacing?: number | string; + summary?: string; + } + + export interface TextareaHTMLAttributes extends HTMLAttributes { + autoFocus?: boolean; + autofocus?: boolean | string; + cols?: number; + disabled?: boolean; + form?: string; + maxLength?: number; + maxlength?: number | string; + minLength?: number; + minlength?: number | string; + name?: string; + placeholder?: string; + readOnly?: boolean; + readonly?: boolean | string; + required?: boolean; + rows?: number; + value?: string | string[] | number; + wrap?: string; + } + + export interface TdHTMLAttributes extends HTMLAttributes { + colSpan?: number; + headers?: string; + rowSpan?: number; + } + + export interface ThHTMLAttributes extends HTMLAttributes { + colSpan?: number; + headers?: string; + rowSpan?: number; + rowspan?: number | string; + scope?: string; + } + + export interface TimeHTMLAttributes extends HTMLAttributes { + dateTime?: string; + } + + export interface TrackHTMLAttributes extends HTMLAttributes { + default?: boolean; + kind?: string; + label?: string; + src?: string; + srcLang?: string; + srclang?: string; + } + + export interface VideoHTMLAttributes extends MediaHTMLAttributes { + height?: number | string; + playsInline?: boolean; + playsinline?: boolean | string; + poster?: string; + width?: number | string; + } + + export interface HTMLAttributes extends DOMAttributes { + // vdom specific + innerHTML?: string; + ref?: (elm?: T) => void; + key?: string | number; + + // Standard HTML Attributes + accessKey?: string; + class?: string | { [className: string]: boolean }; + contentEditable?: boolean | string; + contenteditable?: boolean | string; + contextMenu?: string; + contextmenu?: string; + dir?: string; + draggable?: boolean; + hidden?: boolean; + id?: string; + lang?: string; + slot?: string; + spellCheck?: boolean; + spellcheck?: boolean | string; + style?: { [key: string]: string | undefined }; + tabIndex?: number; + tabindex?: number | string; + title?: string; + + // Unknown + inputMode?: string; + inputmode?: string; + is?: string; + radioGroup?: string; // , + radiogroup?: string; + part?: string; + + // WAI-ARIA + role?: string; + + // RDFa Attributes + about?: string; + datatype?: string; + inlist?: any; + prefix?: string; + property?: string; + resource?: string; + typeof?: string; + vocab?: string; + + // Non-standard Attributes + autoCapitalize?: string; + autocapitalize?: string; + autoCorrect?: string; + autocorrect?: string; + autoSave?: string; + autosave?: string; + color?: string; + itemProp?: string; + itemprop?: string; + itemScope?: boolean; + itemscope?: boolean; + itemType?: string; + itemtype?: string; + itemID?: string; + itemid?: string; + itemRef?: string; + itemref?: string; + results?: number; + security?: string; + unselectable?: boolean; + } + + export interface SVGAttributes extends DOMAttributes { + // Attributes which also defined in HTMLAttributes + // See comment in SVGDOMPropertyConfig.js + class?: string | { [className: string]: boolean }; + color?: string; + height?: number | string; + id?: string; + lang?: string; + max?: number | string; + media?: string; + method?: string; + min?: number | string; + name?: string; + style?: { [key: string]: string | undefined }; + target?: string; + type?: string; + width?: number | string; + + // Other HTML properties supported by SVG elements in browsers + role?: string; + tabIndex?: number; + + // SVG Specific attributes + accentHeight?: number | string; + accumulate?: 'none' | 'sum'; + additive?: 'replace' | 'sum'; + alignmentBaseline?: 'auto' | 'baseline' | 'before-edge' | 'text-before-edge' | 'middle' | 'central' | 'after-edge' | + 'text-after-edge' | 'ideographic' | 'alphabetic' | 'hanging' | 'mathematical' | 'inherit'; + allowReorder?: 'no' | 'yes'; + alphabetic?: number | string; + amplitude?: number | string; + arabicForm?: 'initial' | 'medial' | 'terminal' | 'isolated'; + ascent?: number | string; + attributeName?: string; + attributeType?: string; + autoReverse?: number | string; + azimuth?: number | string; + baseFrequency?: number | string; + baselineShift?: number | string; + baseProfile?: number | string; + bbox?: number | string; + begin?: number | string; + bias?: number | string; + by?: number | string; + calcMode?: number | string; + capHeight?: number | string; + clip?: number | string; + clipPath?: string; + clipPathUnits?: number | string; + clipRule?: number | string; + colorInterpolation?: number | string; + colorInterpolationFilters?: 'auto' | 'sRGB' | 'linearRGB' | 'inherit'; + colorProfile?: number | string; + colorRendering?: number | string; + contentScriptType?: number | string; + contentStyleType?: number | string; + cursor?: number | string; + cx?: number | string; + cy?: number | string; + d?: string; + decelerate?: number | string; + descent?: number | string; + diffuseConstant?: number | string; + direction?: number | string; + display?: number | string; + divisor?: number | string; + dominantBaseline?: number | string; + dur?: number | string; + dx?: number | string; + dy?: number | string; + edgeMode?: number | string; + elevation?: number | string; + enableBackground?: number | string; + end?: number | string; + exponent?: number | string; + externalResourcesRequired?: number | string; + fill?: string; + fillOpacity?: number | string; + fillRule?: 'nonzero' | 'evenodd' | 'inherit'; + filter?: string; + filterRes?: number | string; + filterUnits?: number | string; + floodColor?: number | string; + floodOpacity?: number | string; + focusable?: number | string; + fontFamily?: string; + fontSize?: number | string; + fontSizeAdjust?: number | string; + fontStretch?: number | string; + fontStyle?: number | string; + fontVariant?: number | string; + fontWeight?: number | string; + format?: number | string; + from?: number | string; + fx?: number | string; + fy?: number | string; + g1?: number | string; + g2?: number | string; + glyphName?: number | string; + glyphOrientationHorizontal?: number | string; + glyphOrientationVertical?: number | string; + glyphRef?: number | string; + gradientTransform?: string; + gradientUnits?: string; + hanging?: number | string; + horizAdvX?: number | string; + horizOriginX?: number | string; + ideographic?: number | string; + imageRendering?: number | string; + in2?: number | string; + in?: string; + intercept?: number | string; + k1?: number | string; + k2?: number | string; + k3?: number | string; + k4?: number | string; + k?: number | string; + kernelMatrix?: number | string; + kernelUnitLength?: number | string; + kerning?: number | string; + keyPoints?: number | string; + keySplines?: number | string; + keyTimes?: number | string; + lengthAdjust?: number | string; + letterSpacing?: number | string; + lightingColor?: number | string; + limitingConeAngle?: number | string; + local?: number | string; + markerEnd?: string; + markerHeight?: number | string; + markerMid?: string; + markerStart?: string; + markerUnits?: number | string; + markerWidth?: number | string; + mask?: string; + maskContentUnits?: number | string; + maskUnits?: number | string; + mathematical?: number | string; + mode?: number | string; + numOctaves?: number | string; + offset?: number | string; + opacity?: number | string; + operator?: number | string; + order?: number | string; + orient?: number | string; + orientation?: number | string; + origin?: number | string; + overflow?: number | string; + overlinePosition?: number | string; + overlineThickness?: number | string; + paintOrder?: number | string; + panose1?: number | string; + pathLength?: number | string; + patternContentUnits?: string; + patternTransform?: number | string; + patternUnits?: string; + pointerEvents?: number | string; + points?: string; + pointsAtX?: number | string; + pointsAtY?: number | string; + pointsAtZ?: number | string; + preserveAlpha?: number | string; + preserveAspectRatio?: string; + primitiveUnits?: number | string; + r?: number | string; + radius?: number | string; + refX?: number | string; + refY?: number | string; + renderingIntent?: number | string; + repeatCount?: number | string; + repeatDur?: number | string; + requiredExtensions?: number | string; + requiredFeatures?: number | string; + restart?: number | string; + result?: string; + rotate?: number | string; + rx?: number | string; + ry?: number | string; + scale?: number | string; + seed?: number | string; + shapeRendering?: number | string; + slope?: number | string; + spacing?: number | string; + specularConstant?: number | string; + specularExponent?: number | string; + speed?: number | string; + spreadMethod?: string; + startOffset?: number | string; + stdDeviation?: number | string; + stemh?: number | string; + stemv?: number | string; + stitchTiles?: number | string; + stopColor?: string; + stopOpacity?: number | string; + strikethroughPosition?: number | string; + strikethroughThickness?: number | string; + string?: number | string; + stroke?: string; + strokeDasharray?: string | number; + strokeDashoffset?: string | number; + strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit'; + strokeLinejoin?: 'miter' | 'round' | 'bevel' | 'inherit'; + strokeMiterlimit?: string; + strokeOpacity?: number | string; + strokeWidth?: number | string; + surfaceScale?: number | string; + systemLanguage?: number | string; + tableValues?: number | string; + targetX?: number | string; + targetY?: number | string; + textAnchor?: string; + textDecoration?: number | string; + textLength?: number | string; + textRendering?: number | string; + to?: number | string; + transform?: string; + u1?: number | string; + u2?: number | string; + underlinePosition?: number | string; + underlineThickness?: number | string; + unicode?: number | string; + unicodeBidi?: number | string; + unicodeRange?: number | string; + unitsPerEm?: number | string; + vAlphabetic?: number | string; + values?: string; + vectorEffect?: number | string; + version?: string; + vertAdvY?: number | string; + vertOriginX?: number | string; + vertOriginY?: number | string; + vHanging?: number | string; + vIdeographic?: number | string; + viewBox?: string; + viewTarget?: number | string; + visibility?: number | string; + vMathematical?: number | string; + widths?: number | string; + wordSpacing?: number | string; + writingMode?: number | string; + x1?: number | string; + x2?: number | string; + x?: number | string; + xChannelSelector?: string; + xHeight?: number | string; + xlinkActuate?: string; + xlinkArcrole?: string; + xlinkHref?: string; + xlinkRole?: string; + xlinkShow?: string; + xlinkTitle?: string; + xlinkType?: string; + xmlBase?: string; + xmlLang?: string; + xmlns?: string; + xmlnsXlink?: string; + xmlSpace?: string; + y1?: number | string; + y2?: number | string; + y?: number | string; + yChannelSelector?: string; + z?: number | string; + zoomAndPan?: string; + } + + export interface DOMAttributes { + // Clipboard Events + onCopy?: (event: ClipboardEvent) => void; + onCopyCapture?: (event: ClipboardEvent) => void; + onCut?: (event: ClipboardEvent) => void; + onCutCapture?: (event: ClipboardEvent) => void; + onPaste?: (event: ClipboardEvent) => void; + onPasteCapture?: (event: ClipboardEvent) => void; + + // Composition Events + onCompositionEnd?: (event: CompositionEvent) => void; + onCompositionEndCapture?: (event: CompositionEvent) => void; + onCompositionStart?: (event: CompositionEvent) => void; + onCompositionStartCapture?: (event: CompositionEvent) => void; + onCompositionUpdate?: (event: CompositionEvent) => void; + onCompositionUpdateCapture?: (event: CompositionEvent) => void; + + // Focus Events + onFocus?: (event: FocusEvent) => void; + onFocusCapture?: (event: FocusEvent) => void; + onBlur?: (event: FocusEvent) => void; + onBlurCapture?: (event: FocusEvent) => void; + + // Form Events + onChange?: (event: Event) => void; + onChangeCapture?: (event: Event) => void; + onInput?: (event: Event) => void; + onInputCapture?: (event: Event) => void; + onReset?: (event: Event) => void; + onResetCapture?: (event: Event) => void; + onSubmit?: (event: Event) => void; + onSubmitCapture?: (event: Event) => void; + onInvalid?: (event: Event) => void; + onInvalidCapture?: (event: Event) => void; + + // Image Events + onLoad?: (event: Event) => void; + onLoadCapture?: (event: Event) => void; + onError?: (event: Event) => void; // also a Media Event + onErrorCapture?: (event: Event) => void; // also a Media Event + + // Keyboard Events + onKeyDown?: (event: KeyboardEvent) => void; + onKeyDownCapture?: (event: KeyboardEvent) => void; + onKeyPress?: (event: KeyboardEvent) => void; + onKeyPressCapture?: (event: KeyboardEvent) => void; + onKeyUp?: (event: KeyboardEvent) => void; + onKeyUpCapture?: (event: KeyboardEvent) => void; + + // MouseEvents + onAuxClick?: (event: MouseEvent) => void; + onClick?: (event: MouseEvent) => void; + onClickCapture?: (event: MouseEvent) => void; + onContextMenu?: (event: MouseEvent) => void; + onContextMenuCapture?: (event: MouseEvent) => void; + onDblClick?: (event: MouseEvent) => void; + onDblClickCapture?: (event: MouseEvent) => void; + onDrag?: (event: DragEvent) => void; + onDragCapture?: (event: DragEvent) => void; + onDragEnd?: (event: DragEvent) => void; + onDragEndCapture?: (event: DragEvent) => void; + onDragEnter?: (event: DragEvent) => void; + onDragEnterCapture?: (event: DragEvent) => void; + onDragExit?: (event: DragEvent) => void; + onDragExitCapture?: (event: DragEvent) => void; + onDragLeave?: (event: DragEvent) => void; + onDragLeaveCapture?: (event: DragEvent) => void; + onDragOver?: (event: DragEvent) => void; + onDragOverCapture?: (event: DragEvent) => void; + onDragStart?: (event: DragEvent) => void; + onDragStartCapture?: (event: DragEvent) => void; + onDrop?: (event: DragEvent) => void; + onDropCapture?: (event: DragEvent) => void; + onMouseDown?: (event: MouseEvent) => void; + onMouseDownCapture?: (event: MouseEvent) => void; + onMouseEnter?: (event: MouseEvent) => void; + onMouseLeave?: (event: MouseEvent) => void; + onMouseMove?: (event: MouseEvent) => void; + onMouseMoveCapture?: (event: MouseEvent) => void; + onMouseOut?: (event: MouseEvent) => void; + onMouseOutCapture?: (event: MouseEvent) => void; + onMouseOver?: (event: MouseEvent) => void; + onMouseOverCapture?: (event: MouseEvent) => void; + onMouseUp?: (event: MouseEvent) => void; + onMouseUpCapture?: (event: MouseEvent) => void; + + // Touch Events + onTouchCancel?: (event: TouchEvent) => void; + onTouchCancelCapture?: (event: TouchEvent) => void; + onTouchEnd?: (event: TouchEvent) => void; + onTouchEndCapture?: (event: TouchEvent) => void; + onTouchMove?: (event: TouchEvent) => void; + onTouchMoveCapture?: (event: TouchEvent) => void; + onTouchStart?: (event: TouchEvent) => void; + onTouchStartCapture?: (event: TouchEvent) => void; + + // Pointer Events + onPointerDown?: (event: PointerEvent) => void; + onPointerDownCapture?: (event: PointerEvent) => void; + onPointerMove?: (event: PointerEvent) => void; + onPointerMoveCapture?: (event: PointerEvent) => void; + onPointerUp?: (event: PointerEvent) => void; + onPointerUpCapture?: (event: PointerEvent) => void; + onPointerCancel?: (event: PointerEvent) => void; + onPointerCancelCapture?: (event: PointerEvent) => void; + onPointerEnter?: (event: PointerEvent) => void; + onPointerEnterCapture?: (event: PointerEvent) => void; + onPointerLeave?: (event: PointerEvent) => void; + onPointerLeaveCapture?: (event: PointerEvent) => void; + onPointerOver?: (event: PointerEvent) => void; + onPointerOverCapture?: (event: PointerEvent) => void; + onPointerOut?: (event: PointerEvent) => void; + onPointerOutCapture?: (event: PointerEvent) => void; + onGotPointerCapture?: (event: PointerEvent) => void; + onGotPointerCaptureCapture?: (event: PointerEvent) => void; + onLostPointerCapture?: (event: PointerEvent) => void; + onLostPointerCaptureCapture?: (event: PointerEvent) => void; + + // UI Events + onScroll?: (event: UIEvent) => void; + onScrollCapture?: (event: UIEvent) => void; + + // Wheel Events + onWheel?: (event: WheelEvent) => void; + onWheelCapture?: (event: WheelEvent) => void; + + // Animation Events + onAnimationStart?: (event: AnimationEvent) => void; + onAnimationStartCapture?: (event: AnimationEvent) => void; + onAnimationEnd?: (event: AnimationEvent) => void; + onAnimationEndCapture?: (event: AnimationEvent) => void; + onAnimationIteration?: (event: AnimationEvent) => void; + onAnimationIterationCapture?: (event: AnimationEvent) => void; + + // Transition Events + onTransitionEnd?: (event: TransitionEvent) => void; + onTransitionEndCapture?: (event: TransitionEvent) => void; + } +} + + +export interface Hyperscript { + (sel: any): VNode; + (sel: Node, data: VNodeData): VNode; + (sel: any, data: VNodeData): VNode; + (sel: any, text: string): VNode; + (sel: any, children: Array): VNode; + (sel: any, data: VNodeData, text: string): VNode; + (sel: any, data: VNodeData, children: Array): VNode; + (sel: any, data: VNodeData, children: VNode): VNode; +} + + +export interface VNodeData { + class?: {[className: string]: boolean}; + style?: any; + [attrName: string]: any; +} + + +export type ChildType = VNode | number | string; +export type PropsType = VNodeProdData | number | string | null; + +export interface VNodeProdData { + key?: string | number; + class?: {[className: string]: boolean} | string; + className?: {[className: string]: boolean} | string; + style?: any; + [key: string]: any; +} + +export interface FunctionalUtilities { + forEach: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => void) => void; + map: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => ChildNode) => VNode[]; +} + +export interface FunctionalComponent { + (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[]; +} + +export interface VNode { + $tag$?: string | number | Function; + $key$?: string | number; + $text$?: string; + $children$?: VNode[]; + $attrs$?: any; + $name$?: string; + $flags$: number; + $elm$?: any; +} + +export interface ChildNode { + vtag?: string | number | Function; + vkey?: string | number; + vtext?: string; + vchildren?: VNode[]; + vattrs?: any; + vname?: string; +} diff --git a/dist/types/utils/guid.d.ts b/dist/types/utils/guid.d.ts new file mode 100644 index 00000000000..607543b88ec --- /dev/null +++ b/dist/types/utils/guid.d.ts @@ -0,0 +1 @@ +export declare function guid(): string; diff --git a/dist/types/utils/keys.d.ts b/dist/types/utils/keys.d.ts new file mode 100644 index 00000000000..a255ca4d49a --- /dev/null +++ b/dist/types/utils/keys.d.ts @@ -0,0 +1,8 @@ +export declare const ESCAPE: number; +export declare const ENTER: number; +export declare const SPACE: number; +export declare const TAB: number; +export declare const UP: number; +export declare const DOWN: number; +export declare const LEFT: number; +export declare const RIGHT: number; diff --git a/dist/types/utils/utils.d.ts b/dist/types/utils/utils.d.ts new file mode 100644 index 00000000000..d29658c5e56 --- /dev/null +++ b/dist/types/utils/utils.d.ts @@ -0,0 +1 @@ +export declare function format(first: string, middle: string, last: string): string;